Merge pull request #1982 from appwrite/fix-documents-table-performance

Optimize table rendering with truncation and keying fixes
This commit is contained in:
Torsten Dittmann authored and GitHub committed 2025-06-03 14:32:56 +02:00
commit 9c38e89f97
3 files changed
+15 -10

No files matched your search

+1 -1
View File
@@ -26,7 +26,7 @@
"@appwrite.io/pink-icons": "0.25.0",
"@appwrite.io/pink-icons-svelte": "^2.0.0-RC.1",
"@appwrite.io/pink-legacy": "^1.0.3",
"@appwrite.io/pink-svelte": "https://pkg.vc/-/@appwrite/%40appwrite.io%2Fpink-svelte@d7e3b86",
"@appwrite.io/pink-svelte": "https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@4e03f34",
"@popperjs/core": "^2.11.8",
"@sentry/sveltekit": "^8.38.0",
"@stripe/stripe-js": "^3.5.0",
+5 -5
View File
@@ -24,8 +24,8 @@ importers:
specifier: ^1.0.3
version: 1.0.3
'@appwrite.io/pink-svelte':
specifier: https://pkg.vc/-/@appwrite/%40appwrite.io%2Fpink-svelte@d7e3b86
version: https://pkg.vc/-/@appwrite/%40appwrite.io%2Fpink-svelte@d7e3b86(svelte@5.25.3)
specifier: https://pkg.vc/-/@appwrite/@appwrite.io/pink-svelte@4e03f34
version: https://pkg.vc/-/@appwrite/%40appwrite.io%2Fpink-svelte@4e03f34(svelte@5.25.3)
'@popperjs/core':
specifier: ^2.11.8
version: 2.11.8
@@ -281,8 +281,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/%40appwrite.io%2Fpink-svelte@d7e3b86':
resolution: {tarball: https://pkg.vc/-/@appwrite/%40appwrite.io%2Fpink-svelte@d7e3b86}
'@appwrite.io/pink-svelte@https://pkg.vc/-/@appwrite/%40appwrite.io%2Fpink-svelte@4e03f34':
resolution: {tarball: https://pkg.vc/-/@appwrite/%40appwrite.io%2Fpink-svelte@4e03f34}
version: 2.0.0-RC.2
peerDependencies:
svelte: ^4.0.0
@@ -3654,7 +3654,7 @@ snapshots:
'@appwrite.io/pink-icons': 1.0.0
the-new-css-reset: 1.11.3
'@appwrite.io/pink-svelte@https://pkg.vc/-/@appwrite/%40appwrite.io%2Fpink-svelte@d7e3b86(svelte@5.25.3)':
'@appwrite.io/pink-svelte@https://pkg.vc/-/@appwrite/%40appwrite.io%2Fpink-svelte@4e03f34(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
@@ -90,7 +90,7 @@
? `${formattedColumn.slice(0, 20)}...`
: formattedColumn,
truncated: formattedColumn.length > 20,
whole: formattedColumn
whole: `${formattedColumn.slice(0, 100)}...`
};
}
@@ -196,7 +196,7 @@
{/key}
</Table.Cell>
{#each $columns as { id }}
{#each $columns as { id } (id)}
{@const attr = $attributes.find((n) => n.key === id)}
<Table.Cell column={id} {root}>
{#if isRelationship(attr)}
@@ -251,16 +251,21 @@
<span slot="title">Timestamp</span>
{toLocaleDateTime(formatted.whole, true, 'UTC')}
</DualTimeView>
{:else}
{:else if formatted.truncated}
<Tooltip placement="bottom" disabled={!formatted.truncated}>
<Typography.Text truncate>{formatted.value}</Typography.Text>
<span
let:showing
slot="tooltip"
style:white-space="pre-wrap"
style:word-break="break-all">
{formatted.whole}
{#if showing}
{formatted.whole}
{/if}
</span>
</Tooltip>
{:else}
<Typography.Text truncate>{formatted.value}</Typography.Text>
{/if}
{/if}
</Table.Cell>