feat(monorepo): restructure web components and update configurations
CI / changes (push) Successful in 10s
CI / commitlint (push) Has been skipped
CI / openapi (push) Successful in 27s
CI / web (push) Successful in 38s
CI / go (push) Successful in 2m36s
CI / bird2 (push) Successful in 15s
CI / release (push) Failing after 3m7s
CI / changes (push) Successful in 10s
CI / commitlint (push) Has been skipped
CI / openapi (push) Successful in 27s
CI / web (push) Successful in 38s
CI / go (push) Successful in 2m36s
CI / bird2 (push) Successful in 15s
CI / release (push) Failing after 3m7s
Refactored the project structure to support a monorepo setup, moving the web application to `apps/web/` and updating related configurations. Adjusted pre-commit hooks to use `pnpm` for linting and formatting. Updated CI workflows to reflect the new directory structure and dependencies. Removed legacy files and configurations from the previous `web/` directory, streamlining the project for better maintainability and clarity.
This commit is contained in:
Denozordec
@@ -0,0 +1,237 @@
|
||||
<script lang="ts">
|
||||
import { apiMutate } from '$lib/api/client.js';
|
||||
import type { BgpCommunity, CdnSource } from '$lib/api/types.js';
|
||||
import { formatDateTime } from '$lib/modules/display.js';
|
||||
import {
|
||||
communityLabel,
|
||||
normalizeCdnSourceKind
|
||||
} from '$lib/components/modules/module-helpers.js';
|
||||
import { Badge } from '@evobgp/ui/components/badge/index.js';
|
||||
import { Button } from '@evobgp/ui/components/button/index.js';
|
||||
import { Checkbox } from '@evobgp/ui/components/checkbox/index.js';
|
||||
import {
|
||||
Card,
|
||||
CardContent,
|
||||
CardHeader,
|
||||
CardTitle,
|
||||
CardDescription
|
||||
} from '@evobgp/ui/components/card/index.js';
|
||||
import AppDataTable from '$lib/components/patterns/data-table/app-data-table.svelte';
|
||||
import { confirm } from '$lib/components/patterns/confirm/confirm-state.svelte.js';
|
||||
import { notify, notifyApiError } from '$lib/ui/app/toast.js';
|
||||
import ModuleCdnSourceDialog from '$lib/components/modules/ModuleCdnSourceDialog.svelte';
|
||||
import Plus from '@lucide/svelte/icons/plus';
|
||||
import Pencil from '@lucide/svelte/icons/pencil';
|
||||
import Trash2 from '@lucide/svelte/icons/trash-2';
|
||||
|
||||
type Props = {
|
||||
moduleId: string;
|
||||
sources: CdnSource[];
|
||||
communities: BgpCommunity[];
|
||||
loading?: boolean;
|
||||
onChanged: () => void | Promise<void>;
|
||||
};
|
||||
|
||||
let { moduleId, sources, communities, loading = false, onChanged }: Props = $props();
|
||||
|
||||
let dialogOpen = $state(false);
|
||||
let editTarget = $state<CdnSource | null>(null);
|
||||
let selectedIds = $state(new Set<string>());
|
||||
let deletingBulk = $state(false);
|
||||
|
||||
const activeSelected = $derived.by(() => {
|
||||
const allowed = new Set(sources.map((s) => s.id));
|
||||
return [...selectedIds].filter((id) => allowed.has(id));
|
||||
});
|
||||
const selectedCount = $derived(activeSelected.length);
|
||||
const allSelected = $derived(sources.length > 0 && sources.every((s) => selectedIds.has(s.id)));
|
||||
|
||||
const columns = [
|
||||
{ id: 'select', label: '', class: 'w-10' },
|
||||
{ id: 'url', label: 'URL', sortable: true, sortValue: (s: CdnSource) => s.url },
|
||||
{ id: 'kind', label: 'Тип', sortable: true, sortValue: (s: CdnSource) => s.source_kind },
|
||||
{ id: 'community', label: 'Community' },
|
||||
{
|
||||
id: 'interval',
|
||||
label: 'Интервал',
|
||||
sortable: true,
|
||||
sortValue: (s: CdnSource) => s.refresh_interval_sec ?? 0
|
||||
},
|
||||
{
|
||||
id: 'refreshed',
|
||||
label: 'Последнее обновление',
|
||||
sortable: true,
|
||||
sortValue: (s: CdnSource) => s.last_refreshed_at ?? ''
|
||||
},
|
||||
{ id: 'actions', label: '', class: 'w-20' }
|
||||
] as const;
|
||||
|
||||
function toggleSelection(id: string) {
|
||||
const next = new Set(selectedIds);
|
||||
if (next.has(id)) next.delete(id);
|
||||
else next.add(id);
|
||||
selectedIds = next;
|
||||
}
|
||||
|
||||
function toggleAll(checked: boolean) {
|
||||
selectedIds = checked ? new Set(sources.map((s) => s.id)) : new Set<string>();
|
||||
}
|
||||
|
||||
function openCreate() {
|
||||
editTarget = null;
|
||||
dialogOpen = true;
|
||||
}
|
||||
|
||||
function openEdit(src: CdnSource) {
|
||||
editTarget = src;
|
||||
dialogOpen = true;
|
||||
}
|
||||
|
||||
function requestDelete(src: CdnSource) {
|
||||
void confirm({
|
||||
title: 'Удалить CDN-источник?',
|
||||
description: src.url,
|
||||
confirmLabel: 'Удалить',
|
||||
destructive: true,
|
||||
onConfirm: async () => {
|
||||
await apiMutate(`/v1/modules/${moduleId}/cdn-sources/${src.id}`, 'DELETE', undefined, {
|
||||
idempotent: false
|
||||
});
|
||||
notify.success('Удалено');
|
||||
await onChanged();
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function requestBulkDelete() {
|
||||
if (selectedCount === 0) return;
|
||||
void confirm({
|
||||
title: 'Удалить выбранные CDN-источники?',
|
||||
description: `Будет удалено: ${selectedCount}`,
|
||||
confirmLabel: 'Удалить',
|
||||
destructive: true,
|
||||
onConfirm: bulkDelete
|
||||
});
|
||||
}
|
||||
|
||||
async function bulkDelete() {
|
||||
if (selectedCount === 0) return;
|
||||
deletingBulk = true;
|
||||
let deleted = 0;
|
||||
try {
|
||||
for (const id of activeSelected) {
|
||||
try {
|
||||
await apiMutate(`/v1/modules/${moduleId}/cdn-sources/${id}`, 'DELETE', undefined, {
|
||||
idempotent: false
|
||||
});
|
||||
deleted += 1;
|
||||
} catch (e) {
|
||||
notifyApiError(e);
|
||||
}
|
||||
}
|
||||
if (deleted > 0) notify.success(`Удалено CDN-источников: ${deleted}`);
|
||||
await onChanged();
|
||||
} finally {
|
||||
deletingBulk = false;
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<Card>
|
||||
<CardHeader class="flex flex-col gap-3 pb-2 sm:flex-row sm:items-center sm:justify-between">
|
||||
<div class="min-w-0 flex-1">
|
||||
<CardTitle class="text-base">CDN-источники</CardTitle>
|
||||
<CardDescription>URL источников для скачивания списков CIDR.</CardDescription>
|
||||
</div>
|
||||
<div class="flex shrink-0 flex-wrap items-center justify-end gap-2 self-start sm:self-auto">
|
||||
<Button size="sm" onclick={openCreate}><Plus />Добавить</Button>
|
||||
{#if selectedCount > 0}
|
||||
<Button variant="destructive" size="sm" onclick={requestBulkDelete} disabled={deletingBulk}>
|
||||
<Trash2 />
|
||||
Удалить ({selectedCount})
|
||||
</Button>
|
||||
{/if}
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardContent class="p-4 pt-0">
|
||||
<AppDataTable
|
||||
columns={[...columns]}
|
||||
rows={sources}
|
||||
rowKey={(s) => s.id}
|
||||
{loading}
|
||||
emptyTitle="Нет CDN-источников"
|
||||
emptyDescription="Добавьте URL для загрузки списков CIDR."
|
||||
>
|
||||
{#snippet toolbar()}
|
||||
{#if sources.length > 0}
|
||||
<div class="flex items-center gap-2">
|
||||
<Checkbox
|
||||
checked={allSelected}
|
||||
onCheckedChange={(v) => toggleAll(v === true)}
|
||||
aria-label="Выбрать все CDN-источники"
|
||||
/>
|
||||
<span class="text-sm text-muted-foreground">Выбрать все</span>
|
||||
</div>
|
||||
{/if}
|
||||
{/snippet}
|
||||
{#snippet cell({ row: src, column })}
|
||||
{#if column.id === 'select'}
|
||||
<Checkbox
|
||||
checked={selectedIds.has(src.id)}
|
||||
aria-label="Выбрать CDN-источник"
|
||||
onCheckedChange={() => toggleSelection(src.id)}
|
||||
/>
|
||||
{:else if column.id === 'url'}
|
||||
<span class="max-w-xs truncate font-mono text-xs" title={src.url}>{src.url}</span>
|
||||
{:else if column.id === 'kind'}
|
||||
<div class="flex flex-col gap-0.5">
|
||||
<Badge variant="outline">{normalizeCdnSourceKind(src.source_kind)}</Badge>
|
||||
{#if src.prefix_path?.trim()}
|
||||
<span
|
||||
class="font-mono text-xs break-all text-muted-foreground"
|
||||
title={src.prefix_path}>{src.prefix_path}</span
|
||||
>
|
||||
{/if}
|
||||
</div>
|
||||
{:else if column.id === 'community'}
|
||||
<span class="text-sm text-muted-foreground">
|
||||
{communityLabel(src.community_id, communities)}
|
||||
</span>
|
||||
{:else if column.id === 'interval'}
|
||||
<span class="text-sm text-muted-foreground">
|
||||
{src.refresh_interval_sec != null ? `${src.refresh_interval_sec}с` : '—'}
|
||||
</span>
|
||||
{:else if column.id === 'refreshed'}
|
||||
<span class="text-sm whitespace-nowrap text-muted-foreground">
|
||||
{formatDateTime(src.last_refreshed_at)}
|
||||
</span>
|
||||
{:else if column.id === 'actions'}
|
||||
<div class="flex gap-1">
|
||||
<Button variant="ghost" size="icon-sm" onclick={() => openEdit(src)}>
|
||||
<Pencil class="size-3.5" />
|
||||
</Button>
|
||||
<Button
|
||||
variant="ghost"
|
||||
size="icon-sm"
|
||||
class="text-destructive"
|
||||
onclick={() => requestDelete(src)}
|
||||
>
|
||||
<Trash2 class="size-3.5" />
|
||||
</Button>
|
||||
</div>
|
||||
{/if}
|
||||
{/snippet}
|
||||
</AppDataTable>
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<ModuleCdnSourceDialog
|
||||
bind:open={dialogOpen}
|
||||
{moduleId}
|
||||
edit={editTarget}
|
||||
{communities}
|
||||
onSaved={onChanged}
|
||||
onClose={() => {
|
||||
editTarget = null;
|
||||
}}
|
||||
/>
|
||||
Reference in New Issue
Block a user