fix: fix get share table

Author: nichenqin

apps/frontend/src/lib/components/blocks/share/share-grid-view.svelte

@@ -1,34 +1,38 @@
 <script lang="ts">
   import { page } from "$app/stores"
   import GridViewDataTable from "$lib/components/blocks/grid-view/grid-view-data-table.svelte"
+  import { preferences } from "$lib/store/persisted.store"
   import { createRecordsStore, setRecordsStore, type RecordsStore } from "$lib/store/records.store"
   import { getTable } from "$lib/store/table.store"
   import { trpc } from "$lib/trpc/client"
   import { createQuery } from "@tanstack/svelte-query"
   import { Records, type IRecordsDTO } from "@undb/table"
-  import ShareTableTools from "$lib/components/blocks/table-tools/share-table-tools.svelte"
   import { derived, writable, type Readable } from "svelte/store"
+  import { queryParam, ssp } from "sveltekit-search-params"
 
   export let viewId: Readable<string>
 
   const t = getTable()
-  const perPage = writable(50)
-  const currentPage = writable(1)
+  const perPage = derived(preferences, ($preferences) => $preferences.gridViewPerPage ?? 50)
+  const currentPage = queryParam("page", ssp.number())
+  const q = queryParam("q")
 
   const getRecords = createQuery(
-    derived([t, perPage, currentPage, page], ([$table, $perPage, $currentPage, $page]) => {
+    derived([t, perPage, currentPage, page, q], ([$table, $perPage, $currentPage, $page, $q]) => {
       return {
-        queryKey: ["records", $table?.id.value, $currentPage, $perPage],
+        queryKey: ["records", $table?.id.value, $currentPage, $perPage, $q],
         queryFn: () =>
           trpc.shareData.records.query({
             shareId: $page.params.shareId,
             tableId: $table.id.value,
             viewId: $viewId,
+            q: $q,
             pagination: {
-              page: $currentPage,
+              page: $currentPage ?? 1,
               limit: $perPage,
             },
           }),
+        enabled: !!$perPage,
       }
     }),
   )
@@ -44,7 +48,6 @@
 </script>
 
 {#if store}
-  <!-- <ShareTableTools /> -->
   <GridViewDataTable
     {viewId}
     readonly

apps/frontend/src/routes/(share)/s/b/[shareId]/t/[tableId]/[[viewId]]/+page.svelte

@@ -1,17 +1,11 @@
 <script lang="ts">
   import { page } from "$app/stores"
-  import GridViewDataTable from "$lib/components/blocks/grid-view/grid-view-data-table.svelte"
   import { getTable } from "$lib/store/table.store"
-  import { trpc } from "$lib/trpc/client"
-  import { createQuery } from "@tanstack/svelte-query"
-  import { Records, type IRecordsDTO } from "@undb/table"
   import { onMount, type ComponentType } from "svelte"
-  import { derived, writable } from "svelte/store"
-  import { queryParam } from "sveltekit-search-params"
+  import { derived } from "svelte/store"
   import { isDataTab, isFormTab } from "$lib/store/tab.store"
   import ShareTableHeader from "$lib/components/blocks/table-header/share-table-header.svelte"
   import FormsReadonly from "$lib/components/blocks/forms/forms-readonly.svelte"
-  import { createRecordsStore, setRecordsStore } from "$lib/store/records.store"
   import ShareGridView from "$lib/components/blocks/share/share-grid-view.svelte"
   import ShareGalleryView from "$lib/components/blocks/share/share-gallery-view.svelte"
   import ShareKanbanView from "$lib/components/blocks/share/share-kanban-view.svelte"
@@ -27,33 +21,6 @@
   const t = getTable()
 
   $: view = $t.views.getViewById($viewId)
-
-  const perPage = writable(50)
-  const currentPage = writable(1)
-  const q = queryParam("q")
-
-  const getRecords = createQuery(
-    derived([t, perPage, currentPage, viewId, page, q], ([$table, $perPage, $currentPage, $viewId, $page, $q]) => {
-      return {
-        queryKey: ["records", $table?.id.value, $viewId, $currentPage, $perPage, $q],
-        queryFn: () =>
-          trpc.shareData.records.query({
-            shareId: $page.params.shareId,
-            tableId: $table.id.value,
-            viewId: $viewId,
-            q: $q,
-          }),
-      }
-    }),
-  )
-
-  $: records = (($getRecords.data as any)?.records as IRecordsDTO) ?? []
-
-  const store = createRecordsStore()
-  setRecordsStore(store)
-  $: if ($getRecords.isSuccess) {
-    store.setRecords(Records.fromJSON($t, records), $getRecords.dataUpdatedAt)
-  }
 </script>
 
 <ShareTableHeader />