use: timestamps for datetime attribute.

This commit is contained in:
Darshan
2025-06-01 14:39:13 +05:30
parent 3919d53d97
commit 83ac1a8e5a
2 changed files with 23 additions and 12 deletions
+5 -1
View File
@@ -97,7 +97,11 @@
<Layout.Stack gap="s" alignContent="flex-start">
<!-- `Raw time` as per design -->
<Typography.Caption color="--fgcolor-neutral-tertiary" variant="400">
{timeToString}
{#if $$slots.title}
<slot name="title" />
{:else}
{timeToString}
{/if}
</Typography.Caption>
<!-- `Absolute time` as per design -->
@@ -25,6 +25,7 @@
FloatingActionBar,
Typography
} from '@appwrite.io/pink-svelte';
import { toLocaleDateTime } from '$lib/helpers/date';
import DualTimeView from '$lib/components/dualTimeView.svelte';
export let data: PageData;
@@ -244,17 +245,23 @@
{/if}
{:else}
{@const formatted = formatColumn(document[id])}
<Tooltip disabled={!formatted.truncated} placement="bottom">
<Typography.Text truncate>
{formatted.value}
</Typography.Text>
<span
style:white-space="pre-wrap"
style:word-break="break-all"
slot="tooltip">
{formatted.whole}
</span>
</Tooltip>
{@const isDatetimeAttribute = attr.type === 'datetime'}
{#if isDatetimeAttribute}
<DualTimeView time={formatted.whole}>
<span slot="title">Timestamp</span>
{toLocaleDateTime(formatted.whole, true, 'UTC')}
</DualTimeView>
{:else}
<Tooltip placement="bottom" disabled={!formatted.truncated}>
<Typography.Text truncate>{formatted.value}</Typography.Text>
<span
slot="tooltip"
style:white-space="pre-wrap"
style:word-break="break-all">
{formatted.whole}
</span>
</Tooltip>
{/if}
{/if}
</Table.Cell>
{/each}