63 lines
2.1 KiB
Svelte
63 lines
2.1 KiB
Svelte
<script lang="ts">
|
|
import * as m from '$lib/paraglide/messages.js';
|
|
import { getLocale } from '$lib/paraglide/runtime.js';
|
|
import { formatMCDate } from '$lib/utils/date.js';
|
|
import type { components } from '$lib/generated/api';
|
|
import ContributorStack from './ContributorStack.svelte';
|
|
|
|
type TranscriptionQueueItemDTO = components['schemas']['TranscriptionQueueItemDTO'];
|
|
|
|
interface Props {
|
|
docs: TranscriptionQueueItemDTO[];
|
|
weeklyCount: number;
|
|
}
|
|
|
|
let { docs, weeklyCount }: Props = $props();
|
|
</script>
|
|
|
|
{#if docs.length > 0}
|
|
<div class="flex flex-col gap-3 rounded-sm border border-line bg-surface p-4">
|
|
<div>
|
|
<h3 class="mb-1 font-sans text-xs font-bold tracking-widest text-ink uppercase">
|
|
{m.mission_control_segmentation_heading()}
|
|
</h3>
|
|
<span
|
|
class="inline-flex items-center gap-1 rounded-full border border-line bg-accent-bg px-2 py-0.5 text-xs font-semibold text-ink"
|
|
>
|
|
{m.mission_control_seg_skill_pill()}
|
|
</span>
|
|
{#if weeklyCount > 0}
|
|
<p class="mt-1 text-xs font-semibold text-ink-2">
|
|
{m.mission_control_weekly_pulse({ count: weeklyCount })}
|
|
</p>
|
|
{/if}
|
|
</div>
|
|
<ul class="space-y-1">
|
|
{#each docs as doc (doc.id)}
|
|
<li>
|
|
<a
|
|
href="/documents/{doc.id}?task=transcribe"
|
|
class="flex min-h-[44px] flex-col justify-center rounded px-1 py-2 hover:bg-canvas focus-visible:ring-2 focus-visible:ring-focus-ring focus-visible:ring-offset-2 focus-visible:outline-none"
|
|
>
|
|
<span class="font-serif text-sm text-ink">{doc.title}</span>
|
|
{#if doc.documentDate}
|
|
<span class="mt-0.5 text-xs text-ink-3"
|
|
>{formatMCDate(doc.documentDate, getLocale())}</span
|
|
>
|
|
{/if}
|
|
<div class="mt-1">
|
|
<ContributorStack contributors={doc.contributors} hasMore={doc.hasMoreContributors} />
|
|
</div>
|
|
</a>
|
|
</li>
|
|
{/each}
|
|
</ul>
|
|
</div>
|
|
{:else}
|
|
<div
|
|
class="flex min-h-[120px] flex-col items-center justify-center rounded-sm border border-dashed border-line bg-surface/50 p-6 text-center"
|
|
>
|
|
<p class="text-xs text-ink-3">{m.mission_control_segmentation_empty()}</p>
|
|
</div>
|
|
{/if}
|