feat: add client workspace management

2026-06-05 23:25:36 +01:00
parent 930e83344c
commit 631a5112f4
72 changed files with 6423 additions and 0 deletions
@@ -0,0 +1,86 @@
+<script lang="ts">
+	/* eslint-disable @typescript-eslint/no-explicit-any */
+	import EllipsisVerticalIcon from '@lucide/svelte/icons/ellipsis-vertical';
+	import ExternalLinkIcon from '@lucide/svelte/icons/external-link';
+	import { goto } from '$app/navigation';
+	import { resolve } from '$app/paths';
+	import { Badge } from '$lib/components/ui/badge/index.js';
+	import { Button } from '$lib/components/ui/button/index.js';
+	import * as DropdownMenu from '$lib/components/ui/dropdown-menu/index.js';
+	import * as Table from '$lib/components/ui/table/index.js';
+	let {
+		data,
+		openEdit,
+		openArchive,
+		formatValue,
+		recordName
+	}: {
+		data: any;
+		openEdit: any;
+		openArchive: any;
+		formatValue: any;
+		recordName: any;
+	} = $props();
+</script>
+
+{#if data.records.length > 0}
+	<div class="overflow-hidden rounded-lg border border-border">
+		<Table.Root>
+			<Table.Header>
+				<Table.Row>
+					<Table.Head>Name</Table.Head>
+					<Table.Head>Type</Table.Head>
+					<Table.Head>Status</Table.Head>
+					<Table.Head class="w-12"><span class="sr-only">Actions</span></Table.Head>
+				</Table.Row>
+			</Table.Header>
+			<Table.Body>
+				{#each data.records as record (record.id)}
+					<Table.Row>
+						<Table.Cell class="font-medium"
+							><a
+								class="inline-flex items-center gap-2 underline-offset-4 hover:text-primary hover:underline"
+								href={resolve('/dashboard/clients/[id]', { id: record.id })}
+								>{formatValue(record.name)}<ExternalLinkIcon class="size-3.5" /></a
+							></Table.Cell
+						>
+						<Table.Cell class=""
+							><Badge variant="secondary" class="capitalize">{formatValue(record.type)}</Badge
+							></Table.Cell
+						>
+						<Table.Cell class=""
+							><Badge variant="secondary" class="capitalize">{formatValue(record.status)}</Badge
+							></Table.Cell
+						>
+						<Table.Cell>
+							<DropdownMenu.Root>
+								<DropdownMenu.Trigger
+									>{#snippet child({ props })}<Button
+											variant="ghost"
+											size="icon-sm"
+											aria-label={`Open actions for ${recordName(record)}`}
+											{...props}><EllipsisVerticalIcon /></Button
+										>{/snippet}</DropdownMenu.Trigger
+								>
+								<DropdownMenu.Content align="end" class="w-36">
+									<DropdownMenu.Item
+										onclick={() => goto(resolve('/dashboard/clients/[id]', { id: record.id }))}
+										>View</DropdownMenu.Item
+									>
+									<DropdownMenu.Item onclick={() => openEdit(record)}>Edit</DropdownMenu.Item>
+									<DropdownMenu.Item variant="destructive" onclick={() => openArchive(record)}
+										>Archive</DropdownMenu.Item
+									>
+								</DropdownMenu.Content>
+							</DropdownMenu.Root>
+						</Table.Cell>
+					</Table.Row>
+				{/each}
+			</Table.Body>
+		</Table.Root>
+	</div>
+{:else}
+	<div class="rounded-lg border p-8 text-center text-sm text-muted-foreground">
+		No clients have been created yet.
+	</div>
+{/if}