1<script lang="ts">
 2	import * as Dialog from '$lib/components/ui/dialog';
 3	import { ChatAttachmentsViewAll } from '$lib/components/app';
 4
 5	interface Props {
 6		open?: boolean;
 7		uploadedFiles?: ChatUploadedFile[];
 8		attachments?: DatabaseMessageExtra[];
 9		readonly?: boolean;
10		onFileRemove?: (fileId: string) => void;
11		imageHeight?: string;
12		imageWidth?: string;
13		imageClass?: string;
14		activeModelId?: string;
15	}
16
17	let {
18		open = $bindable(false),
19		uploadedFiles = [],
20		attachments = [],
21		readonly = false,
22		onFileRemove,
23		imageHeight = 'h-24',
24		imageWidth = 'w-auto',
25		imageClass = '',
26		activeModelId
27	}: Props = $props();
28
29	let totalCount = $derived(uploadedFiles.length + attachments.length);
30</script>
31
32<Dialog.Root bind:open>
33	<Dialog.Portal>
34		<Dialog.Overlay />
35
36		<Dialog.Content class="flex !max-h-[90vh] !max-w-6xl flex-col">
37			<Dialog.Header>
38				<Dialog.Title>All Attachments ({totalCount})</Dialog.Title>
39				<Dialog.Description>View and manage all attached files</Dialog.Description>
40			</Dialog.Header>
41
42			<ChatAttachmentsViewAll
43				{uploadedFiles}
44				{attachments}
45				{readonly}
46				{onFileRemove}
47				{imageHeight}
48				{imageWidth}
49				{imageClass}
50				{activeModelId}
51			/>
52		</Dialog.Content>
53	</Dialog.Portal>
54</Dialog.Root>