From 1af38f8600f38cbe2473197a4fcc27effa22c1d5 Mon Sep 17 00:00:00 2001 From: Darshan Date: Wed, 10 Sep 2025 19:39:27 +0530 Subject: [PATCH 1/7] fix: edits when no items exists. --- .../table-[table]/rows/editRelated.svelte | 10 ++++++++-- .../table-[table]/spreadsheet.svelte | 20 +++++++++++++------ 2 files changed, 22 insertions(+), 8 deletions(-) diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/editRelated.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/editRelated.svelte index 336d77471..6802a381a 100644 --- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/editRelated.svelte +++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/editRelated.svelte @@ -192,6 +192,7 @@ const relatedIds = currentColumn.map((doc: string | Record) => typeof doc === 'string' ? doc : doc.$id ); + return !symmetricDifference(workIds, relatedIds).length; } else { const workId = typeof workColumn === 'string' ? workColumn : workColumn?.$id; @@ -326,12 +327,17 @@ {:else if relatedTable?.columns?.length && fetchedRows.length} + {@const twoWayColumnKey = relatedTable.columns.find( + (col: Models.ColumnRelationship) => col.twoWay + )?.key} + {@const columnsToRender = relatedTable.columns.filter((col) => col.key !== twoWayColumnKey)} +
{#if fetchedRows.length === 1} {@const workStore = getStore(fetchedRows[0].$id)} {#if workStore} - {#each relatedTable.columns as column} + {#each columnsToRender as column} {@const label = column.key} + {@const isRelatedToMany = isRelationshipToMany(rowColumn)} + {@const hasItems = isRelatedToMany + ? row[columnId]?.length + : false} + paginatedRows.update(index, row)} onRevert={(row) => paginatedRows.update(index, row)} openSideSheet={() => { @@ -962,8 +970,8 @@ if (isRelationshipToMany(rowColumn)) { openSideSheetForRelationsToMany( - columnId, - row[columnId] + row[columnId], + rowColumn ); } else { onSelectSheetOption('update', null, 'row', row); From fdef48b190903ae386572d8a14dbdfa8a1a3d074 Mon Sep 17 00:00:00 2001 From: Darshan Date: Wed, 10 Sep 2025 20:00:39 +0530 Subject: [PATCH 2/7] update: preliminary support for accordions. --- .../table-[table]/rows/editRelated.svelte | 54 +++++++++++++------ 1 file changed, 39 insertions(+), 15 deletions(-) diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/editRelated.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/editRelated.svelte index 6802a381a..b4f5b8a2a 100644 --- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/editRelated.svelte +++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/editRelated.svelte @@ -11,8 +11,9 @@ import { type Columns, PROHIBITED_ROW_KEYS } from '../store'; import ColumnItem from './columns/columnItem.svelte'; import { buildWildcardColumnsQuery, isRelationship, isRelationshipToMany } from './store'; - import { Divider, Layout, Skeleton, Typography } from '@appwrite.io/pink-svelte'; + import { Accordion, Divider, Layout, Skeleton } from '@appwrite.io/pink-svelte'; import { deepClone } from '$lib/helpers/object'; + import { preferences } from '$lib/stores/preferences'; const databaseId = page.params.database; @@ -313,6 +314,20 @@ }; } + function getAccordionTitle(row: Models.Row): string { + const names = preferences.getDisplayNames(row.$tableId).filter((name) => name !== '$id'); + + const values = names + .map((name) => row?.[name]) + .filter((value) => value != null && typeof value === 'string' && value !== ''); + + if (!values.length) { + return row.$id; + } + + return `${values.join(' | ')} (...${row.$id.slice(-5)})`; + } + $effect(() => { if (rows && tableId) { loadRelatedRow().then(() => { @@ -323,7 +338,7 @@ {#if loading} -
+
{:else if relatedTable?.columns?.length && fetchedRows.length} @@ -350,21 +365,24 @@ {/if} {:else} - {relatedTable.name} - + {#each fetchedRows as row, index (row.$id)} {@const workStore = getStore(row.$id)} - {#if workStore} - {#each columnsToRender as column} - {@const label = column.key} - - {/each} - {/if} + + {#if workStore} + + {#each columnsToRender as column} + {@const label = column.key} + + {/each} + + {/if} + {#if index < fetchedRows.length - 1} @@ -375,3 +393,9 @@ {/if}
{/if} + + From 3f7b315806ae5cfe1bdb5178f6eb209dc5516c21 Mon Sep 17 00:00:00 2001 From: Darshan Date: Thu, 11 Sep 2025 15:01:11 +0530 Subject: [PATCH 3/7] add: left icon support from pink to console. update: add accordion for relationship items on side sheet. --- package.json | 4 +-- pnpm-lock.yaml | 20 +++++++------- src/lib/elements/forms/inputDate.svelte | 3 +++ src/lib/elements/forms/inputDateTime.svelte | 4 ++- src/lib/elements/forms/inputDomain.svelte | 3 +++ src/lib/elements/forms/inputEmail.svelte | 3 +++ src/lib/elements/forms/inputId.svelte | 3 +++ src/lib/elements/forms/inputNumber.svelte | 3 +++ src/lib/elements/forms/inputOTP.svelte | 4 ++- src/lib/elements/forms/inputPassword.svelte | 3 +++ src/lib/elements/forms/inputPhone.svelte | 3 +++ src/lib/elements/forms/inputProjectId.svelte | 3 +++ src/lib/elements/forms/inputSearch.svelte | 4 ++- src/lib/elements/forms/inputSecret.svelte | 4 ++- src/lib/elements/forms/inputSelect.svelte | 2 ++ src/lib/elements/forms/inputTags.svelte | 3 +++ src/lib/elements/forms/inputText.svelte | 3 +++ src/lib/elements/forms/inputTextarea.svelte | 3 +++ src/lib/elements/forms/inputTime.svelte | 3 +++ src/lib/elements/forms/inputURL.svelte | 3 +++ .../rows/columns/types/boolean.svelte | 5 +++- .../rows/columns/types/datetime.svelte | 13 ++++++++-- .../rows/columns/types/email.svelte | 6 +++-- .../rows/columns/types/enum.svelte | 4 ++- .../rows/columns/types/integer.svelte | 4 ++- .../rows/columns/types/relationship.svelte | 26 ++++++++++++++----- .../rows/columns/types/string.svelte | 7 +++-- .../rows/columns/types/url.svelte | 6 +++-- .../table-[table]/rows/editRelated.svelte | 10 +++---- 29 files changed, 123 insertions(+), 39 deletions(-) diff --git a/package.json b/package.json index 216b1e0bf..bf15dfbe5 100644 --- 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@6031134", "@appwrite.io/pink-icons": "0.25.0", - "@appwrite.io/pink-icons-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@2cf27e0", + "@appwrite.io/pink-icons-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@d8326d0", "@appwrite.io/pink-legacy": "^1.0.3", - "@appwrite.io/pink-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@fb8b1ed", + "@appwrite.io/pink-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@d8326d0", "@faker-js/faker": "^9.9.0", "@popperjs/core": "^2.11.8", "@sentry/sveltekit": "^8.38.0", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 9922899f4..088515c16 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -18,14 +18,14 @@ importers: specifier: 0.25.0 version: 0.25.0 '@appwrite.io/pink-icons-svelte': - specifier: https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@2cf27e0 - version: https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@2cf27e0(svelte@5.25.3) + specifier: https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@d8326d0 + version: https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@d8326d0(svelte@5.25.3) '@appwrite.io/pink-legacy': specifier: ^1.0.3 version: 1.0.3 '@appwrite.io/pink-svelte': - specifier: https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@fb8b1ed - version: https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@fb8b1ed(svelte@5.25.3) + specifier: https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@d8326d0 + version: https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@d8326d0(svelte@5.25.3) '@faker-js/faker': specifier: ^9.9.0 version: 9.9.0 @@ -269,8 +269,8 @@ packages: peerDependencies: svelte: ^4.0.0 - '@appwrite.io/pink-icons-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@2cf27e0': - resolution: {tarball: https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@2cf27e0} + '@appwrite.io/pink-icons-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@d8326d0': + resolution: {tarball: https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@d8326d0} version: 2.0.0-RC.1 peerDependencies: svelte: ^4.0.0 @@ -284,8 +284,8 @@ packages: '@appwrite.io/pink-legacy@1.0.3': resolution: {integrity: sha512-GGde5fmPhs+s6/3aFeMPc/kKADG/gTFkYQSy6oBN8pK0y0XNCLrZZgBv+EBbdhwdtqVEWXa0X85Mv9w7jcIlwQ==} - '@appwrite.io/pink-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@fb8b1ed': - resolution: {tarball: https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@fb8b1ed} + '@appwrite.io/pink-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@d8326d0': + resolution: {tarball: https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@d8326d0} version: 2.0.0-RC.2 peerDependencies: svelte: ^4.0.0 @@ -3706,7 +3706,7 @@ snapshots: dependencies: svelte: 5.25.3 - '@appwrite.io/pink-icons-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@2cf27e0(svelte@5.25.3)': + '@appwrite.io/pink-icons-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-icons-svelte@d8326d0(svelte@5.25.3)': dependencies: svelte: 5.25.3 @@ -3719,7 +3719,7 @@ snapshots: '@appwrite.io/pink-icons': 1.0.0 the-new-css-reset: 1.11.3 - '@appwrite.io/pink-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@fb8b1ed(svelte@5.25.3)': + '@appwrite.io/pink-svelte@https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@d8326d0(svelte@5.25.3)': dependencies: '@appwrite.io/pink-icons-svelte': 2.0.0-RC.1(svelte@5.25.3) '@floating-ui/dom': 1.6.13 diff --git a/src/lib/elements/forms/inputDate.svelte b/src/lib/elements/forms/inputDate.svelte index 84c31a45b..8f5343492 100644 --- a/src/lib/elements/forms/inputDate.svelte +++ b/src/lib/elements/forms/inputDate.svelte @@ -1,5 +1,6 @@ - + diff --git a/src/lib/elements/forms/inputSelect.svelte b/src/lib/elements/forms/inputSelect.svelte index 7e36cee97..5f56249ff 100644 --- a/src/lib/elements/forms/inputSelect.svelte +++ b/src/lib/elements/forms/inputSelect.svelte @@ -19,6 +19,7 @@ leadingHtml?: string; badge?: string; }[]; + export let leadingIcon: ComponentType | undefined = undefined; let element: HTMLSelectElement; let error: string; @@ -56,6 +57,7 @@ {placeholder} {disabled} {autofocus} + {leadingIcon} helper={error ?? helper} {required} state={error ? 'error' : 'default'} diff --git a/src/lib/elements/forms/inputTags.svelte b/src/lib/elements/forms/inputTags.svelte index b17254d21..210b9a0f6 100644 --- a/src/lib/elements/forms/inputTags.svelte +++ b/src/lib/elements/forms/inputTags.svelte @@ -1,5 +1,6 @@ - + diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/email.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/email.svelte index d64bde289..b810348c0 100644 --- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/email.svelte +++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/email.svelte @@ -1,6 +1,7 @@