37 lines
1.0 KiB
Svelte
37 lines
1.0 KiB
Svelte
<script lang="ts">
|
|
import { resolve } from '$app/paths';
|
|
import type { SentPieceUsage } from '#lib/server/shows.js';
|
|
|
|
let { history }: { history: SentPieceUsage[] } = $props();
|
|
|
|
function berlinDate(value: string) {
|
|
return new Intl.DateTimeFormat('de-DE', {
|
|
timeZone: 'Europe/Berlin',
|
|
dateStyle: 'medium'
|
|
}).format(new Date(value));
|
|
}
|
|
</script>
|
|
|
|
{#if history.length}
|
|
<div class="piece-usage-history">
|
|
<p>
|
|
<strong>Gesendet am {berlinDate(history[0].usedAtUtc)}</strong>
|
|
in <a href={resolve('/sendungen/[id]', { id: history[0].showId })}>{history[0].showTitle}</a>
|
|
{#if history.length > 1}<span>+ {history.length - 1} weitere</span>{/if}
|
|
</p>
|
|
{#if history.length > 1}
|
|
<details>
|
|
<summary>Vollständige Verwendungshistorie</summary>
|
|
<ul>
|
|
{#each history as usage (usage.usageId)}
|
|
<li>
|
|
<time datetime={usage.usedAtUtc}>{berlinDate(usage.usedAtUtc)}</time>
|
|
<a href={resolve('/sendungen/[id]', { id: usage.showId })}>{usage.showTitle}</a>
|
|
</li>
|
|
{/each}
|
|
</ul>
|
|
</details>
|
|
{/if}
|
|
</div>
|
|
{/if}
|