appwrite · ItzNotABug · Nov 3, 2025 · Nov 3, 2025 · Nov 3, 2025
diff --git a/package.json b/package.json
@@ -24,9 +24,9 @@
         "@ai-sdk/svelte": "^1.1.24",
         "@appwrite.io/console": "https://pkg.pr.new/appwrite-labs/cloud/@appwrite.io/console@fe3277e",
         "@appwrite.io/pink-icons": "0.25.0",
-        "@appwrite.io/pink-icons-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@46f65c7",
+        "@appwrite.io/pink-icons-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@d94920e",
         "@appwrite.io/pink-legacy": "^1.0.3",
-        "@appwrite.io/pink-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@46f65c7",
+        "@appwrite.io/pink-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@d94920e",
         "@faker-js/faker": "^9.9.0",
         "@popperjs/core": "^2.11.8",
         "@sentry/sveltekit": "^8.38.0",
@@ -95,5 +95,5 @@
             "svelte-preprocess"
         ]
     },
-    "packageManager": "pnpm@10.15.1"
+    "packageManager": "pnpm@10.20.0"
 }
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/...le)/project-[region]-[project]/databases/database-[database]/table-[table]/+layout.svelte b/...le)/project-[region]-[project]/databases/database-[database]/table-[table]/+layout.svelte
@@ -46,14 +46,21 @@
     import { page } from '$app/state';
     import { base } from '$app/paths';
     import { canWriteTables } from '$lib/stores/roles';
-    import { IconEye, IconLockClosed, IconPlus, IconPuzzle } from '@appwrite.io/pink-icons-svelte';
+    import {
+        IconChevronDown,
+        IconChevronUp,
+        IconEye,
+        IconLockClosed,
+        IconPlus,
+        IconPuzzle
+    } from '@appwrite.io/pink-icons-svelte';
     import SideSheet from './layout/sidesheet.svelte';
     import EditRow from './rows/edit.svelte';
     import EditRelatedRow from './rows/editRelated.svelte';
     import EditColumn from './columns/edit.svelte';
     import RowActivity from './rows/activity.svelte';
     import EditRowPermissions from './rows/editPermissions.svelte';
-    import { Dialog, Layout, Typography, Selector } from '@appwrite.io/pink-svelte';
+    import { Dialog, Layout, Typography, Selector, Icon } from '@appwrite.io/pink-svelte';
     import { Button, Seekbar } from '$lib/elements/forms';
     import { generateFakeRecords, generateColumns } from '$lib/helpers/faker';
     import { addNotification } from '$lib/stores/notifications';
@@ -66,6 +73,7 @@
 
     import IndexesSuggestions from '../(suggestions)/indexes.svelte';
     import { showIndexesSuggestions, tableColumnSuggestions } from '../(suggestions)';
+    import { isTabletViewport } from '$lib/stores/viewport';
 
     let editRow: EditRow;
     let editRelatedRow: EditRelatedRow;
@@ -468,6 +476,49 @@
         show: !!currentRowId,
         value: buildRowUrl(currentRowId)
     }}>
+    {#snippet topEndActions()}
+        {@const rows = $databaseRowSheetOptions.rows ?? []}
+        {@const currentIndex = $databaseRowSheetOptions.rowIndex ?? -1}
+        {@const isFirstRow = currentIndex <= 0}
+        {@const isLastRow = currentIndex >= rows.length - 1}
+
+        {#if !$isTabletViewport}
+            <Button
+                icon
+                text
+                size="xs"
+                on:click={() => {
+                    if (currentIndex > 0) {
+                        databaseRowSheetOptions.update((opts) => ({
+                            ...opts,
+                            row: rows[currentIndex - 1],
+                            rowIndex: currentIndex - 1
+                        }));
+                    }
+                }}
+                disabled={isFirstRow}>
+                <Icon icon={IconChevronUp} />
+            </Button>
+
+            <Button
+                icon
+                text
+                size="xs"
+                on:click={() => {
+                    if (currentIndex < rows.length - 1) {
+                        databaseRowSheetOptions.update((opts) => ({
+                            ...opts,
+                            row: rows[currentIndex + 1],
+                            rowIndex: currentIndex + 1
+                        }));
+                    }
+                }}
+                disabled={isLastRow}>
+                <Icon icon={IconChevronDown} />
+            </Button>
+        {/if}
+    {/snippet}
+
     {#key currentRowId}
         <EditRow
             bind:this={editRow}

diff --git a/...ct-[region]-[project]/databases/database-[database]/table-[table]/layout/sidesheet.svelte b/...ct-[region]-[project]/databases/database-[database]/table-[table]/layout/sidesheet.svelte
@@ -18,6 +18,7 @@
         footer = null,
         titleBadge = null,
         topAction = null,
+        topEndActions = null,
         ...restProps
     }: {
         show: boolean;
@@ -48,7 +49,8 @@
               }
             | undefined;
         children?: Snippet;
-        footer?: Snippet | null;
+        footer?: Snippet;
+        topEndActions?: Snippet;
     } & HTMLAttributes<HTMLDivElement> = $props();
 
     let form: Form;
@@ -88,6 +90,12 @@
                         {/if}
                     {/if}
                 </Layout.Stack>
+
+                {#if topEndActions}
+                    <Layout.Stack direction="row" gap="m" alignItems="center" inline>
+                        {@render topEndActions()}
+                    </Layout.Stack>
+                {/if}
             </Layout.Stack>
         </div>
 

diff --git a/...)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/edit.svelte b/...)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/edit.svelte
@@ -10,9 +10,15 @@
     import { invalidate } from '$app/navigation';
     import { table, type Columns, PROHIBITED_ROW_KEYS } from '../store';
     import ColumnItem from './columns/columnItem.svelte';
-    import { buildWildcardColumnsQuery, isRelationship, isRelationshipToMany } from './store';
+    import {
+        buildWildcardColumnsQuery,
+        isRelationship,
+        isRelationshipToMany,
+        isSpatialType
+    } from './store';
     import { Layout, Skeleton } from '@appwrite.io/pink-svelte';
     import { deepClone } from '$lib/helpers/object';
+    import deepEqual from 'deep-equal';
 
     const tableId = page.params.table;
     const databaseId = page.params.database;
@@ -90,6 +96,10 @@
         const workColumn = $work?.[column.key];
         const currentColumn = $doc?.[column.key];
 
+        if (isSpatialType(column)) {
+            return deepEqual(workColumn, currentColumn);
+        }
+
         if (column.array) {
             return !symmetricDifference(Array.from(workColumn), Array.from(currentColumn)).length;
         }

diff --git a/...project-[region]-[project]/databases/database-[database]/table-[table]/spreadsheet.svelte b/...project-[region]-[project]/databases/database-[database]/table-[table]/spreadsheet.svelte
@@ -109,6 +109,9 @@
         paginatedRows.setPage(1, $rows.rows);
     }
 
+    // create index map for O(1) row lookups, reactive!
+    $: rowIndexMap = new Map($paginatedRows.items.map((row, index) => [row.$id, index]));
+
     const tableId = page.params.table;
     const databaseId = page.params.database;
     const organizationId = data.organization.$id ?? data.project.teamId;
@@ -543,11 +546,14 @@
         } else if (type === 'row') {
             if (action === 'update') {
                 databaseRowSheetOptions.update((opts) => {
+                    const rowIndex = rowIndexMap.get(row.$id) ?? -1;
                     return {
                         ...opts,
                         row,
+                        rowIndex,
                         show: true,
-                        title: 'Update row'
+                        title: 'Update row',
+                        rows: $paginatedRows.items
                     };
                 });
             }
@@ -797,7 +803,7 @@
             expandKbdShortcut="Cmd+Enter"
             on:expandKbdShortcut={({ detail }) => {
                 const focusedRowId = detail.rowId;
-                const focusedRow = $rows.rows.find((row) => row.$id === focusedRowId);
+                const focusedRow = $paginatedRows.items.find((row) => row.$id === focusedRowId);
 
                 previouslyFocusedElement = document.activeElement;
                 onSelectSheetOption('update', null, 'row', focusedRow);

diff --git a/...(console)/project-[region]-[project]/databases/database-[database]/table-[table]/store.ts b/...(console)/project-[region]-[project]/databases/database-[database]/table-[table]/store.ts
@@ -64,12 +64,16 @@ export const databaseRowSheetOptions = writable<
     DatabaseSheetOptions & {
         row: Models.Row;
         rowId?: string;
+        rows: Models.Row[];
+        rowIndex?: number;
     }
 >({
     title: null,
     show: false,
     row: null,
-    rowId: null // for loading from a given id
+    rowId: null, // for loading from a given id
+    rows: [],
+    rowIndex: -1
 });
 
 export const databaseRelatedRowSheetOptions = writable<