fix(gui): hide prev icon for first row and next icon for last row

Signed-off-by: Pranav C <pranavxc@gmail.com>

packages/nc-gui/components/smartsheet/Grid.vue

@@ -118,6 +118,7 @@ const {
   selectedAllRecords,
   removeRowIfNew,
   navigateToSiblingRow,
+  getExpandedRowIndex
 } = useViewData(meta, view, xWhere)
 
 const { getMeta } = useMetas()
@@ -982,6 +983,8 @@ const closeAddColumnDropdown = () => {
         show-next-prev-icons
         @next="navigateToSiblingRow(NavigateDir.NEXT)"
         @prev="navigateToSiblingRow(NavigateDir.PREV)"
+        :first-row="getExpandedRowIndex() === 0"
+        :last-row="getExpandedRowIndex() === paginationData.totalRows - 1"
       />
     </Suspense>
   </div>

packages/nc-gui/components/smartsheet/expanded-form/index.vue

@@ -35,6 +35,8 @@ interface Props {
   rowId?: string
   view?: ViewType
   showNextPrevIcons?: boolean
+  firstRow?: boolean
+  lastRow?: boolean
 }
 
 const props = defineProps<Props>()
@@ -280,7 +282,7 @@ export default {
       <div class="flex h-full nc-form-wrapper items-stretch min-h-[max(70vh,100%)]">
         <div class="flex-1 overflow-auto scrollbar-thin-dull nc-form-fields-container relative">
           <template v-if="props.showNextPrevIcons">
-            <a-tooltip placement="bottom">
+            <a-tooltip placement="bottom" v-if="!props.firstRow">
               <template #title>
                 {{ $t('labels.prevRow') }}
 
@@ -289,7 +291,7 @@ export default {
               <MdiChevronRight class="cursor-pointer nc-next-arrow" @click="$emit('next')" />
             </a-tooltip>
 
-            <a-tooltip placement="bottom">
+            <a-tooltip placement="bottom" v-if="!props.lastRow">
               <template #title>
                 {{ $t('labels.nextRow') }}
                 <GeneralShortcutLabel class="justify-center" :keys="['Alt', '→']" />

packages/nc-gui/composables/useViewData.ts

@@ -477,11 +477,16 @@ export function useViewData(
     }
   }
 
-  const navigateToSiblingRow = async (dir: NavigateDir) => {
+
   // get current expanded row index
-    const expandedRowIndex = formattedData.value.findIndex(
+  function getExpandedRowIndex() {
+    return formattedData.value.findIndex(
       (row: Row) => routeQuery.rowId === extractPkFromRow(row.row, meta.value?.columns as ColumnType[]),
     )
+  }
+
+  const navigateToSiblingRow = async (dir: NavigateDir) => {
+    const expandedRowIndex = getExpandedRowIndex()
 
     // calculate next row index based on direction
     let siblingRowIndex = expandedRowIndex + (dir === NavigateDir.NEXT ? 1 : -1)
@@ -547,5 +552,6 @@ export function useViewData(
     removeRowIfNew,
     navigateToSiblingRow,
     deleteRowById,
+    getExpandedRowIndex
   }
 }