feat(bulk-upload): add UploadSaveBar component + fix bulk_save_cta message
Save bar with sticky positioning, a determinate progress bar while uploading chunks, plural save CTA, and a destructive discard link. Replaces broken ICU plural in bulk_save_cta with two-key approach (bulk_save_cta_one / bulk_save_cta) since Paraglide 2.5 does not support ICU plural syntax. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
39
frontend/src/lib/components/document/UploadSaveBar.svelte
Normal file
39
frontend/src/lib/components/document/UploadSaveBar.svelte
Normal file
@@ -0,0 +1,39 @@
|
||||
<script lang="ts">
|
||||
import * as m from '$lib/paraglide/messages';
|
||||
|
||||
let {
|
||||
fileCount,
|
||||
chunkProgress,
|
||||
onSave,
|
||||
onDiscard
|
||||
}: {
|
||||
fileCount: number;
|
||||
chunkProgress?: { done: number; total: number };
|
||||
onSave: () => void;
|
||||
onDiscard: () => void;
|
||||
} = $props();
|
||||
</script>
|
||||
|
||||
<div
|
||||
class="border-brand-sand sticky bottom-0 z-10 -mx-4 border-t bg-white px-6 py-4 shadow-[0_-2px_8px_rgba(0,0,0,0.06)]"
|
||||
>
|
||||
{#if chunkProgress}
|
||||
<progress
|
||||
value={chunkProgress.done}
|
||||
max={chunkProgress.total}
|
||||
class="[&::-webkit-progress-bar]:bg-brand-sand mb-3 h-1 w-full rounded-full [&::-webkit-progress-bar]:rounded-full [&::-webkit-progress-value]:rounded-full [&::-webkit-progress-value]:bg-brand-mint"
|
||||
></progress>
|
||||
{/if}
|
||||
<div class="flex items-center justify-between">
|
||||
<button type="button" onclick={onDiscard} class="text-sm text-red-600/70 hover:text-red-700">
|
||||
{m.bulk_discard_all()}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onclick={onSave}
|
||||
class="min-h-[44px] rounded-sm bg-brand-navy px-6 text-sm font-bold tracking-widest text-white uppercase hover:bg-brand-navy/90"
|
||||
>
|
||||
{fileCount === 1 ? 'Speichern →' : `${fileCount} speichern →`}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
Reference in New Issue
Block a user