Skip to content

Commit a0880c1

Browse files
committed
Remove import bloat
1 parent 84f09d0 commit a0880c1

6 files changed

Lines changed: 93 additions & 134 deletions

File tree

src/lib/components/Table/DataTableTemplate.svelte

Lines changed: 18 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,6 @@
11
<script lang="ts" generics="TData, TValue">
22
import { createSvelteTable, FlexRender } from '$lib/components/ui/data-table';
3-
import {
4-
Table as TableRoot,
5-
TableHeader,
6-
TableRow,
7-
TableHead,
8-
TableBody,
9-
TableCell,
10-
} from '$lib/components/ui/table';
3+
import * as Table from '$lib/components/ui/table';
114
import {
125
getCoreRowModel,
136
getFilteredRowModel,
@@ -83,37 +76,37 @@
8376
</script>
8477

8578
<div class="max-h-[60vh] overflow-y-auto rounded-md border">
86-
<TableRoot>
87-
<TableHeader>
79+
<Table.Root>
80+
<Table.Header>
8881
{#each table.getHeaderGroups() as headerGroup (headerGroup.id)}
89-
<TableRow>
82+
<Table.Row>
9083
{#each headerGroup.headers as header (header.id)}
91-
<TableHead>
84+
<Table.Head>
9285
{#if !header.isPlaceholder}
9386
<FlexRender
9487
content={header.column.columnDef.header}
9588
context={header.getContext()}
9689
/>
9790
{/if}
98-
</TableHead>
91+
</Table.Head>
9992
{/each}
100-
</TableRow>
93+
</Table.Row>
10194
{/each}
102-
</TableHeader>
103-
<TableBody>
95+
</Table.Header>
96+
<Table.Body>
10497
{#each table.getRowModel().rows as row (row.id)}
105-
<TableRow data-state={row.getIsSelected() && 'selected'}>
98+
<Table.Row data-state={row.getIsSelected() && 'selected'}>
10699
{#each row.getVisibleCells() as cell (cell.id)}
107-
<TableCell>
100+
<Table.Cell>
108101
<FlexRender content={cell.column.columnDef.cell} context={cell.getContext()} />
109-
</TableCell>
102+
</Table.Cell>
110103
{/each}
111-
</TableRow>
104+
</Table.Row>
112105
{:else}
113-
<TableRow>
114-
<TableCell colspan={columns.length} class="h-24 text-center">No results.</TableCell>
115-
</TableRow>
106+
<Table.Row>
107+
<Table.Cell colspan={columns.length} class="h-24 text-center">No results.</Table.Cell>
108+
</Table.Row>
116109
{/each}
117-
</TableBody>
118-
</TableRoot>
110+
</Table.Body>
111+
</Table.Root>
119112
</div>

src/lib/components/layout/Header.svelte

Lines changed: 12 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,7 @@
11
<script lang="ts">
22
import { PUBLIC_DISCORD_INVITE_URL, PUBLIC_GITHUB_PROJECT_URL } from '$env/static/public';
33
import LightSwitch from '$lib/components/LightSwitch.svelte';
4-
import {
5-
Breadcrumb,
6-
BreadcrumbList,
7-
BreadcrumbItem,
8-
BreadcrumbSeparator,
9-
BreadcrumbLink,
10-
BreadcrumbPage,
11-
} from '$lib/components/ui/breadcrumb';
4+
import * as Breadcrumb from '$lib/components/ui/breadcrumb';
125
import { Button } from '$lib/components/ui/button';
136
import * as DropdownMenu from '$lib/components/ui/dropdown-menu';
147
import { useSidebar } from '$lib/components/ui/sidebar';
@@ -37,24 +30,24 @@
3730
<PanelLeft size={24} class="m-0 text-gray-600 dark:text-gray-300" />
3831
</Button>
3932
{#if $BreadCrumbStore.length > 0}
40-
<Breadcrumb>
41-
<BreadcrumbList>
33+
<Breadcrumb.Root>
34+
<Breadcrumb.List>
4235
{#each $BreadCrumbStore as crumb, index}
43-
<BreadcrumbItem>
36+
<Breadcrumb.Item>
4437
{#if index < $BreadCrumbStore.length - 1}
45-
<BreadcrumbLink href={crumb.href} class="text-gray-600 dark:text-gray-300">
38+
<Breadcrumb.Link href={crumb.href} class="text-gray-600 dark:text-gray-300">
4639
{crumb.text}
47-
</BreadcrumbLink>
48-
<BreadcrumbSeparator class="text-gray-600 dark:text-gray-300" />
40+
</Breadcrumb.Link>
41+
<Breadcrumb.Separator class="text-gray-600 dark:text-gray-300" />
4942
{:else}
50-
<BreadcrumbPage class="text-gray-900 dark:text-gray-100">
43+
<Breadcrumb.Page class="text-gray-900 dark:text-gray-100">
5144
{crumb.text}
52-
</BreadcrumbPage>
45+
</Breadcrumb.Page>
5346
{/if}
54-
</BreadcrumbItem>
47+
</Breadcrumb.Item>
5548
{/each}
56-
</BreadcrumbList>
57-
</Breadcrumb>
49+
</Breadcrumb.List>
50+
</Breadcrumb.Root>
5851
{/if}
5952
<div
6053
class={`flex flex-1 flex-row items-center justify-between space-x-2 py-2 ${$UserStore.self ? 'pr-2' : 'px-2'}`}

src/routes/(authenticated)/admin/users/+page.svelte

Lines changed: 18 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -5,15 +5,7 @@
55
import { handleApiError } from '$lib/errorhandling/apiErrorHandling';
66
import { Button } from '$lib/components/ui/button';
77
import { CardHeader, CardTitle, CardContent } from '$lib/components/ui/card';
8-
import {
9-
Pagination,
10-
PaginationContent,
11-
PaginationEllipsis,
12-
PaginationItem,
13-
PaginationLink,
14-
PaginationNextButton,
15-
PaginationPrevButton,
16-
} from '$lib/components/ui/pagination';
8+
import * as Pagination from '$lib/components/ui/pagination';
179
import { onDestroy, onMount } from 'svelte';
1810
import { columns } from './columns';
1911
import DataTable from '$lib/components/Table/DataTableTemplate.svelte';
@@ -96,29 +88,29 @@
9688
<CardContent>
9789
<DataTable {data} {columns} {sorting} {filters} {pagination} />
9890
</CardContent>
99-
<Pagination count={total} perPage={PerPage} bind:page>
91+
<Pagination.Root count={total} perPage={PerPage} bind:page>
10092
{#snippet children({ pages, currentPage })}
101-
<PaginationContent>
102-
<PaginationItem>
103-
<PaginationPrevButton />
104-
</PaginationItem>
93+
<Pagination.Content>
94+
<Pagination.Item>
95+
<Pagination.PrevButton />
96+
</Pagination.Item>
10597
{#each pages as page (page.key)}
10698
{#if page.type === 'ellipsis'}
107-
<PaginationItem>
108-
<PaginationEllipsis />
109-
</PaginationItem>
99+
<Pagination.Item>
100+
<Pagination.Ellipsis />
101+
</Pagination.Item>
110102
{:else}
111-
<PaginationItem>
112-
<PaginationLink {page} isActive={currentPage === page.value}>
103+
<Pagination.Item>
104+
<Pagination.Link {page} isActive={currentPage === page.value}>
113105
{page.value}
114-
</PaginationLink>
115-
</PaginationItem>
106+
</Pagination.Link>
107+
</Pagination.Item>
116108
{/if}
117109
{/each}
118-
<PaginationItem>
119-
<PaginationNextButton />
120-
</PaginationItem>
121-
</PaginationContent>
110+
<Pagination.Item>
111+
<Pagination.NextButton />
112+
</Pagination.Item>
113+
</Pagination.Content>
122114
{/snippet}
123-
</Pagination>
115+
</Pagination.Root>
124116
</div>

src/routes/(authenticated)/hubs/[hubId=guid]/update/+page.svelte

Lines changed: 21 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -7,14 +7,7 @@
77
import { handleApiError } from '$lib/errorhandling/apiErrorHandling';
88
import { OnlineHubsStore, type HubOnlineState } from '$lib/stores/HubsStore';
99
import { DownloadCloud, RotateCcw } from '@lucide/svelte';
10-
import {
11-
Table,
12-
TableHeader,
13-
TableRow,
14-
TableHead,
15-
TableBody,
16-
TableCell,
17-
} from '$lib/components/ui/table';
10+
import * as Table from '$lib/components/ui/table';
1811
import FirmwareChannelSelector from '$lib/components/FirmwareChannelSelector.svelte';
1912
import { SignalR_Connection } from '$lib/signalr';
2013
import { Progress } from '$lib/components/ui/progress';
@@ -97,27 +90,27 @@
9790
<span> Refresh Logs </span>
9891
</Button>
9992
</div>
100-
<Table class="border-2">
101-
<TableHeader>
102-
<TableRow>
103-
<TableHead>ID</TableHead>
104-
<TableHead>Started At</TableHead>
105-
<TableHead>Status</TableHead>
106-
<TableHead>Version</TableHead>
107-
</TableRow>
108-
</TableHeader>
109-
<TableBody>
93+
<Table.Root class="border-2">
94+
<Table.Header>
95+
<Table.Row>
96+
<Table.Head>ID</Table.Head>
97+
<Table.Head>Started At</Table.Head>
98+
<Table.Head>Status</Table.Head>
99+
<Table.Head>Version</Table.Head>
100+
</Table.Row>
101+
</Table.Header>
102+
<Table.Body>
110103
{#each otaLogs as otaLog (otaLog.id)}
111-
<TableRow>
112-
<TableCell class="font-mono text-blue-200">{decimalToHexString(otaLog.id)}</TableCell>
113-
<TableCell class="font-medium">{otaLog.startedAt.toDateString()}</TableCell>
114-
<TableCell class={`font-medium${otaLog.status == 'Finished' ? '' : ' text-red-500'}`}
115-
>{otaLog.status}</TableCell
116-
>
117-
<TableCell class="font-medium">{otaLog.version}</TableCell>
118-
</TableRow>
104+
<Table.Row>
105+
<Table.Cell class="font-mono text-blue-200">{decimalToHexString(otaLog.id)}</Table.Cell>
106+
<Table.Cell class="font-medium">{otaLog.startedAt.toDateString()}</Table.Cell>
107+
<Table.Cell class={`font-medium${otaLog.status == 'Finished' ? '' : ' text-red-500'}`}>
108+
{otaLog.status}
109+
</Table.Cell>
110+
<Table.Cell class="font-medium">{otaLog.version}</Table.Cell>
111+
</Table.Row>
119112
{/each}
120-
</TableBody>
121-
</Table>
113+
</Table.Body>
114+
</Table.Root>
122115
</Card.Content>
123116
</div>

src/routes/(authenticated)/settings/api-tokens/dialog-token-generate.svelte

Lines changed: 15 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,7 @@
88
import { GetValResColor, type ValidationResult } from '$lib/types/ValidationResult';
99
import { toast } from 'svelte-sonner';
1010
import TokenCreatedDialog from './dialog-token-created.svelte';
11-
import {
12-
Select,
13-
SelectContent,
14-
SelectGroup,
15-
SelectItem,
16-
SelectTrigger,
17-
} from '$lib/components/ui/select';
11+
import * as Select from '$lib/components/ui/select';
1812
1913
type Props = {
2014
open: boolean;
@@ -135,21 +129,21 @@
135129

136130
<label>
137131
<span>Expiration</span>
138-
<Select type="single" name="expiration" bind:value={expire}>
139-
<SelectTrigger class="w-[180px]">
132+
<Select.Root type="single" name="expiration" bind:value={expire}>
133+
<Select.Trigger class="w-[180px]">
140134
{expire}
141-
</SelectTrigger>
142-
<SelectContent>
143-
<SelectGroup>
144-
<SelectItem value="never" label="Never">Never</SelectItem>
145-
<SelectItem value="7days" label="7 days">7 days</SelectItem>
146-
<SelectItem value="30days" label="30 days">30 days</SelectItem>
147-
<SelectItem value="60days" label="60 days">60 days</SelectItem>
148-
<SelectItem value="90days" label="90 days">90 days</SelectItem>
149-
<SelectItem value="custom" label="Custom...">Custom...</SelectItem>
150-
</SelectGroup>
151-
</SelectContent>
152-
</Select>
135+
</Select.Trigger>
136+
<Select.Content>
137+
<Select.Group>
138+
<Select.Item value="never" label="Never">Never</Select.Item>
139+
<Select.Item value="7days" label="7 days">7 days</Select.Item>
140+
<Select.Item value="30days" label="30 days">30 days</Select.Item>
141+
<Select.Item value="60days" label="60 days">60 days</Select.Item>
142+
<Select.Item value="90days" label="90 days">90 days</Select.Item>
143+
<Select.Item value="custom" label="Custom...">Custom...</Select.Item>
144+
</Select.Group>
145+
</Select.Content>
146+
</Select.Root>
153147

154148
<div class="flex items-center gap-3">
155149
{#if expire === 'custom'}

src/routes/flashtool/FirmwareBoardSelector.svelte

Lines changed: 9 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -2,13 +2,7 @@
22
import { FetchVersionBoards } from '$lib/api/firmwareCDN';
33
import { Popover, PopoverTrigger, PopoverContent } from '$lib/components/ui/popover';
44
import { Button } from '$lib/components/ui/button';
5-
import {
6-
Command,
7-
CommandInput,
8-
CommandEmpty,
9-
CommandGroup,
10-
CommandItem,
11-
} from '$lib/components/ui/command';
5+
import * as Command from '$lib/components/ui/command';
126
import { cn } from '$lib/utils';
137
148
import { Check, ChevronsUpDown } from '@lucide/svelte';
@@ -50,18 +44,18 @@
5044
</Button>
5145
</PopoverTrigger>
5246
<PopoverContent class="w-[240px] p-0">
53-
<Command>
54-
<CommandInput placeholder="Search boards..." />
55-
<CommandEmpty>No board found.</CommandEmpty>
56-
<CommandGroup>
47+
<Command.Root>
48+
<Command.Input placeholder="Search boards..." />
49+
<Command.Empty>No board found.</Command.Empty>
50+
<Command.Group>
5751
{#each boards as board}
58-
<CommandItem value={board} onSelect={() => (selectedBoard = board)}>
52+
<Command.Item value={board} onSelect={() => (selectedBoard = board)}>
5953
<Check class={cn('mr-2 size-4', selectedBoard !== board && 'text-transparent')} />
6054
{board}
61-
</CommandItem>
55+
</Command.Item>
6256
{/each}
63-
</CommandGroup>
64-
</Command>
57+
</Command.Group>
58+
</Command.Root>
6559
</PopoverContent>
6660
</Popover>
6761
</div>

0 commit comments

Comments
 (0)