fix: fix ui

undb-io · Sep 11, 2024 · 545dc80 · 545dc80
1 parent 940eb3c
commit 545dc80
Show file tree

Hide file tree

Showing 8 changed files with 36 additions and 21 deletions.
diff --git a/apps/frontend/src/lib/components/blocks/gallery-view/gallery-view-cards.svelte b/apps/frontend/src/lib/components/blocks/gallery-view/gallery-view-cards.svelte
@@ -14,7 +14,7 @@
   let records = recordsStore.records
 </script>
 
-<div class="grid h-full w-full gap-4 overflow-y-auto md:grid-cols-5">
+<div class="grid w-full gap-4 overflow-y-auto md:grid-cols-5">
   {#each $records as record (record.id.value)}
     <GalleryViewCard {record} {fieldId} {fields} />
   {/each}

diff --git a/apps/frontend/src/lib/components/blocks/kanban-view/kanban-view.svelte b/apps/frontend/src/lib/components/blocks/kanban-view/kanban-view.svelte
@@ -8,6 +8,7 @@
   import { FieldIdVo } from "@undb/table"
   import SelectKanbanRequiresSingle from "./select-kanban-requires-single.svelte"
   import KanbanOptionButton from "./kanban-option-button.svelte"
+  import { createRecordsStore, setRecordsStore } from "$lib/store/records.store"
 
   const table = getTable()
   export let viewId: Readable<string>
@@ -16,10 +17,15 @@
   $: view = $table.views.getViewById($viewId) as KanbanView
   $: fieldId = view.type === "kanban" ? view.field.into(undefined) : undefined
   $: field = fieldId ? $table.schema.getFieldById(new FieldIdVo(fieldId)).into(undefined) : undefined
+
+  const recordsStore = createRecordsStore()
+  setRecordsStore(recordsStore)
 </script>
 
 <TableTools>
-  <KanbanOptionButton {view} />
+  {#if !shareId}
+    <KanbanOptionButton {view} />
+  {/if}
 </TableTools>
 {#if view.type === "kanban"}
   {#if field?.type === "select"}

diff --git a/apps/frontend/src/lib/components/blocks/kanban-view/select-kanban-lane.svelte b/apps/frontend/src/lib/components/blocks/kanban-view/select-kanban-lane.svelte
@@ -43,6 +43,7 @@
   import { cn } from "$lib/utils"
   import { kanbanStore } from "$lib/store/kanban.store"
   import SelectKanbanCollapsedLane from "./select-kanban-collapsed-lane.svelte"
+  import { queryParam } from "sveltekit-search-params"
 
   const table = getTable()
   const recordsStore = getRecordsStore()
@@ -58,10 +59,13 @@
 
   $: color = view.color.into(undefined)
 
+  const q = queryParam("q")
+
   const getRecords = ({ pageParam = 1 }) => {
     if (shareId) {
       return trpc.shareData.records.query({
         shareId,
+        q: $q,
         filters: {
           conjunction: "and",
           children: [{ field: fieldId, op: "eq", value: option ? option.id : null }],
@@ -76,6 +80,7 @@
     return trpc.record.list.query({
       tableId,
       viewId: $viewId,
+      q: $q ?? undefined,
       filters: {
         conjunction: "and",
         children: [{ field: fieldId, op: "eq", value: option ? option.id : null }],
@@ -91,10 +96,10 @@
   $: isLaneCollapsed = $getIsLaneCollapsed($viewId, option?.id ?? "") ?? false
 
   const query = createInfiniteQuery(
-    derived([table, viewId], ([$table, $viewId]) => {
+    derived([table, viewId, q], ([$table, $viewId, $q]) => {
       const view = $table.views.getViewById($viewId)
       return {
-        queryKey: [$table.id.value, $viewId, fieldId, "getRecords", option?.id],
+        queryKey: [$table.id.value, $viewId, fieldId, "getRecords", option?.id, $q],
         queryFn: getRecords,
         initialPageParam: 1,
         getNextPageParam: (lastPage, pages) => {
@@ -356,10 +361,12 @@
       </div>
     </div>
     <div class="mt-2 flex w-full items-center justify-between px-2 py-0.5">
-      <Button variant="outline" size="xs" on:click={onCreateRecord}>
-        <PlusIcon class="text-muted-foreground mr-2 h-3 w-3 font-semibold" />
-        New Record
-      </Button>
+      {#if !shareId}
+        <Button variant="outline" size="xs" on:click={onCreateRecord}>
+          <PlusIcon class="text-muted-foreground mr-2 h-3 w-3 font-semibold" />
+          New Record
+        </Button>
+      {/if}
 
       {#if $query.isFetchedAfterMount}
         <p class="text-muted-foreground text-xs">

diff --git a/apps/frontend/src/lib/components/blocks/kanban-view/select-kanban-view.svelte b/apps/frontend/src/lib/components/blocks/kanban-view/select-kanban-view.svelte
@@ -22,7 +22,6 @@
   import * as Popover from "$lib/components/ui/popover"
   import OptionEditor from "../option/option-editor.svelte"
   import { invalidate } from "$app/navigation"
-  import { createRecordsStore, setRecordsStore } from "$lib/store/records.store"
 
   const table = getTable()
 
@@ -96,17 +95,13 @@
       },
     })
   }
-
-  const recordsStore = createRecordsStore()
-  setRecordsStore(recordsStore)
 </script>
 
 <div class="flex-1 overflow-x-auto overflow-y-hidden p-4">
   <div bind:this={lanesContainer} class="flex h-full space-x-2 overflow-y-hidden pr-2">
     <SelectKanbanLane {field} {readonly} tableId={$table.id.value} {viewId} {fieldId} option={null} {shareId} {view} />
     {#each options as option (option.id)}
       <SelectKanbanLane {field} {readonly} tableId={$table.id.value} {viewId} {fieldId} {option} {shareId} {view} />
-
     {/each}
     {#if !shareId}
       <div class="flex w-[350px] shrink-0 flex-col space-y-2 rounded-sm px-2 pt-2 transition-all">

diff --git a/apps/frontend/src/lib/components/blocks/share/share-gallery-view.svelte b/apps/frontend/src/lib/components/blocks/share/share-gallery-view.svelte
@@ -0,0 +1,9 @@
+<script lang="ts">
+  import type { Readable } from "svelte/store"
+  import GalleryView from "../gallery-view/gallery-view.svelte"
+
+  export let viewId: Readable<string>
+  export let shareId: string
+</script>
+
+<GalleryView {shareId} {viewId} />
diff --git a/apps/frontend/src/lib/components/blocks/share/share-view-page.svelte b/apps/frontend/src/lib/components/blocks/share/share-view-page.svelte
@@ -3,6 +3,7 @@
   import ShareGridView from "./share-grid-view.svelte"
   import { getTable } from "$lib/store/table.store"
   import ShareKanbanView from "./share-kanban-view.svelte"
+  import ShareGalleryView from "./share-gallery-view.svelte"
 
   const table = getTable()
   export let viewId: Readable<string>
@@ -15,4 +16,6 @@
   <ShareGridView {viewId} />
 {:else if view.type === "kanban"}
   <ShareKanbanView {viewId} {shareId} />
+{:else if view.type === "gallery"}
+  <ShareGalleryView {viewId} {shareId} />
 {/if}
diff --git a/apps/frontend/src/routes/(share)/s/v/[shareId]/+layout.gql b/apps/frontend/src/routes/(share)/s/v/[shareId]/+layout.gql
@@ -41,6 +41,9 @@ query GetViewShareData($shareId: ID!) {
       kanban {
         field
       }
+      gallery {
+        field
+      }
     }
     schema {
       constraint

diff --git a/packages/i18n/src/i18n/i18n-types.ts b/packages/i18n/src/i18n/i18n-types.ts
@@ -387,10 +387,6 @@ type RootTranslation = {
 			 * Kanban
 			 */
 			kanban: string
-			/**
-			 * Gallery
-			 */
-			gallery: string
 		}
 	}
 }
@@ -770,10 +766,6 @@ export type TranslationFunctions = {
 			 * Kanban
 			 */
 			kanban: () => LocalizedString
-			/**
-			 * Gallery
-			 */
-			gallery: () => LocalizedString
 		}
 	}
 }