Compare commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
cc80858952 |
@@ -1,62 +0,0 @@
|
||||
import { Globe, Layers, ListChecks, Radar } from 'lucide-react'
|
||||
|
||||
import { KpiStatGrid, type KpiStatItem } from '@/components/reui-kit'
|
||||
import type { LookupResponse } from '@/types/api'
|
||||
|
||||
/**
|
||||
* Lookup summary KPI — stats-12 via KpiStatGrid.
|
||||
* @see https://reui.io/preview/base/stats-12
|
||||
*/
|
||||
export function LookupSummaryKpi({ data }: { data: LookupResponse }) {
|
||||
const entryCount = data.matches.filter((m) => m.layer === 'entry').length
|
||||
const snapshotCount = data.matches.filter((m) => m.layer === 'snapshot').length
|
||||
const resolvedCount = data.resolved_ips?.length ?? 0
|
||||
|
||||
const items: KpiStatItem[] = [
|
||||
{
|
||||
id: 'matched',
|
||||
label: 'Результат',
|
||||
value: data.matched ? 'Найдено' : 'Не найдено',
|
||||
hint: data.normalized,
|
||||
icon: <Radar aria-hidden />,
|
||||
iconClassName: data.matched
|
||||
? 'bg-success text-success-foreground [&_svg]:text-success-foreground'
|
||||
: 'bg-muted text-muted-foreground [&_svg]:text-muted-foreground',
|
||||
variant: data.matched ? 'default' : 'warning',
|
||||
},
|
||||
{
|
||||
id: 'entry',
|
||||
label: 'Слой entry',
|
||||
value: entryCount,
|
||||
hint: 'сырые списки',
|
||||
icon: <ListChecks aria-hidden />,
|
||||
iconClassName: 'bg-info text-info-foreground [&_svg]:text-info-foreground',
|
||||
},
|
||||
{
|
||||
id: 'snapshot',
|
||||
label: 'Слой snapshot',
|
||||
value: snapshotCount,
|
||||
hint: 'материализация',
|
||||
icon: <Layers aria-hidden />,
|
||||
iconClassName: 'bg-focus text-focus-foreground [&_svg]:text-focus-foreground',
|
||||
},
|
||||
]
|
||||
|
||||
if (data.query_kind === 'domain') {
|
||||
items.push({
|
||||
id: 'resolved',
|
||||
label: 'DNS IP',
|
||||
value: resolvedCount,
|
||||
hint: resolvedCount > 0 ? data.resolved_ips?.slice(0, 3).join(', ') : 'нет A/AAAA',
|
||||
icon: <Globe aria-hidden />,
|
||||
iconClassName: 'bg-primary text-primary-foreground [&_svg]:text-primary-foreground',
|
||||
})
|
||||
}
|
||||
|
||||
return (
|
||||
<KpiStatGrid
|
||||
items={items}
|
||||
aria-label={`Запрос: ${data.query_kind} · ${data.query}`}
|
||||
/>
|
||||
)
|
||||
}
|
||||
@@ -7,12 +7,10 @@ import { Button } from '@evobgp/ui/components/button'
|
||||
import { LookupAddStep } from '@/components/lookup/lookup-add-step'
|
||||
import { LookupMatchesGrid } from '@/components/lookup/lookup-matches-grid'
|
||||
import { LookupSearchForm } from '@/components/lookup/lookup-search-form'
|
||||
import { LookupSummaryKpi } from '@/components/lookup/lookup-summary-kpi'
|
||||
import { EmptyState } from '@/components/empty-state'
|
||||
import { QueryState } from '@/components/query-state'
|
||||
import {
|
||||
Alert,
|
||||
AlertAction,
|
||||
AlertDescription,
|
||||
AlertTitle,
|
||||
} from '@/components/reui/alert'
|
||||
@@ -31,11 +29,12 @@ import {
|
||||
import {
|
||||
Frame,
|
||||
FrameDescription,
|
||||
FrameFooter,
|
||||
FrameHeader,
|
||||
FramePanel,
|
||||
FrameTitle,
|
||||
} from '@/components/reui/frame'
|
||||
import { SectionCardsSkeleton, TableSkeleton } from '@/components/skeletons'
|
||||
import { TableSkeleton } from '@/components/skeletons'
|
||||
import { sessionCanWriteModules } from '@/lib/auth'
|
||||
import { authSessionQueryOptions } from '@/queries/auth'
|
||||
import { directoriesCommunitiesQueryOptions } from '@/queries/directories'
|
||||
@@ -44,10 +43,10 @@ import { modulesListQueryOptions } from '@/queries/modules'
|
||||
|
||||
/**
|
||||
* Lookup membership wizard — check → result → optional add.
|
||||
* DNA: wizard-2 · surface frame · stepper.
|
||||
* DNA: wizard-2 · surface frame · stepper · FrameFooter CTAs.
|
||||
* @see https://reui.io/preview/base/wizard-2
|
||||
* @see https://reui.io/docs/components/base/stepper
|
||||
* @see https://reui.io/preview/base/stats-12
|
||||
* @see https://reui.io/docs/components/base/frame
|
||||
* @see https://reui.io/preview/base/data-grid-filtering-2
|
||||
*/
|
||||
|
||||
@@ -216,12 +215,7 @@ export function LookupWizard({
|
||||
isError={lookupQ.isError}
|
||||
error={lookupQ.error}
|
||||
onRetry={() => void lookupQ.refetch()}
|
||||
skeleton={
|
||||
<div className="flex flex-col gap-4 md:gap-6">
|
||||
<SectionCardsSkeleton />
|
||||
<TableSkeleton rows={5} />
|
||||
</div>
|
||||
}
|
||||
skeleton={<TableSkeleton rows={5} />}
|
||||
>
|
||||
{(result) => (
|
||||
<div className="flex flex-col gap-4 md:gap-6">
|
||||
@@ -231,7 +225,6 @@ export function LookupWizard({
|
||||
isPending={lookupQ.isFetching}
|
||||
onSubmit={onSubmitQuery}
|
||||
/>
|
||||
<LookupSummaryKpi data={result} />
|
||||
|
||||
{result.matched ? (
|
||||
<>
|
||||
@@ -242,66 +235,69 @@ export function LookupWizard({
|
||||
«{result.normalized}» найден в entries и/или snapshots
|
||||
({result.match_count} совпад.).
|
||||
</AlertDescription>
|
||||
<AlertAction>
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
size="xs"
|
||||
onClick={resetToQuery}
|
||||
>
|
||||
Новая проверка
|
||||
</Button>
|
||||
</AlertAction>
|
||||
</Alert>
|
||||
<LookupMatchesGrid
|
||||
items={result.matches}
|
||||
isLoading={lookupQ.isFetching}
|
||||
/>
|
||||
<Frame spacing="sm" className="w-full">
|
||||
<FrameFooter className="flex flex-wrap items-center justify-end gap-2">
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
onClick={resetToQuery}
|
||||
>
|
||||
Новая проверка
|
||||
</Button>
|
||||
</FrameFooter>
|
||||
</Frame>
|
||||
</>
|
||||
) : canWrite ? (
|
||||
<Alert variant="info">
|
||||
<Plus className="size-4" />
|
||||
<AlertTitle>Не найдено в списках</AlertTitle>
|
||||
<AlertDescription>
|
||||
«{result.normalized}» отсутствует. Добавить запись?
|
||||
</AlertDescription>
|
||||
<AlertAction>
|
||||
<Button
|
||||
type="button"
|
||||
size="xs"
|
||||
onClick={() => void goToAdd()}
|
||||
>
|
||||
Добавить
|
||||
</Button>
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
size="xs"
|
||||
onClick={resetToQuery}
|
||||
>
|
||||
Новая проверка
|
||||
</Button>
|
||||
</AlertAction>
|
||||
</Alert>
|
||||
<>
|
||||
<Alert variant="info">
|
||||
<Plus className="size-4" />
|
||||
<AlertTitle>Не найдено в списках</AlertTitle>
|
||||
<AlertDescription>
|
||||
«{result.normalized}» отсутствует. Добавить запись?
|
||||
</AlertDescription>
|
||||
</Alert>
|
||||
<Frame spacing="sm" className="w-full">
|
||||
<FrameFooter className="flex flex-wrap items-center justify-end gap-2">
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
onClick={resetToQuery}
|
||||
>
|
||||
Новая проверка
|
||||
</Button>
|
||||
<Button type="button" onClick={() => goToAdd()}>
|
||||
Добавить
|
||||
</Button>
|
||||
</FrameFooter>
|
||||
</Frame>
|
||||
</>
|
||||
) : (
|
||||
<Alert variant="warning">
|
||||
<ShieldAlert className="size-4" />
|
||||
<AlertTitle>Не найдено</AlertTitle>
|
||||
<AlertDescription>
|
||||
«{result.normalized}» отсутствует в списках. У вас нет
|
||||
права добавлять записи (нужно bgp:modules:write).
|
||||
</AlertDescription>
|
||||
<AlertAction>
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
size="xs"
|
||||
onClick={resetToQuery}
|
||||
>
|
||||
Новая проверка
|
||||
</Button>
|
||||
</AlertAction>
|
||||
</Alert>
|
||||
<>
|
||||
<Alert variant="warning">
|
||||
<ShieldAlert className="size-4" />
|
||||
<AlertTitle>Не найдено</AlertTitle>
|
||||
<AlertDescription>
|
||||
«{result.normalized}» отсутствует в списках. У вас нет
|
||||
права добавлять записи (нужно bgp:modules:write).
|
||||
</AlertDescription>
|
||||
</Alert>
|
||||
<Frame spacing="sm" className="w-full">
|
||||
<FrameFooter className="flex flex-wrap items-center justify-end gap-2">
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
onClick={resetToQuery}
|
||||
>
|
||||
Новая проверка
|
||||
</Button>
|
||||
</FrameFooter>
|
||||
</Frame>
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
@@ -340,35 +336,27 @@ export function LookupWizard({
|
||||
Повторная проверка обновлена. Можно посмотреть совпадения или
|
||||
начать новый запрос.
|
||||
</AlertDescription>
|
||||
<AlertAction>
|
||||
<Button
|
||||
type="button"
|
||||
size="xs"
|
||||
onClick={() => setStep(STEP_RESULT)}
|
||||
>
|
||||
К результату
|
||||
</Button>
|
||||
</Alert>
|
||||
{lookupQ.data?.matched ? (
|
||||
<LookupMatchesGrid
|
||||
items={lookupQ.data.matches}
|
||||
isLoading={lookupQ.isFetching}
|
||||
/>
|
||||
) : null}
|
||||
<Frame spacing="sm" className="w-full">
|
||||
<FrameFooter className="flex flex-wrap items-center justify-end gap-2">
|
||||
<Button
|
||||
type="button"
|
||||
variant="outline"
|
||||
size="xs"
|
||||
onClick={resetToQuery}
|
||||
>
|
||||
Новая проверка
|
||||
</Button>
|
||||
</AlertAction>
|
||||
</Alert>
|
||||
{lookupQ.data ? (
|
||||
<>
|
||||
<LookupSummaryKpi data={lookupQ.data} />
|
||||
{lookupQ.data.matched ? (
|
||||
<LookupMatchesGrid
|
||||
items={lookupQ.data.matches}
|
||||
isLoading={lookupQ.isFetching}
|
||||
/>
|
||||
) : null}
|
||||
</>
|
||||
) : null}
|
||||
<Button type="button" onClick={() => setStep(STEP_RESULT)}>
|
||||
К результату
|
||||
</Button>
|
||||
</FrameFooter>
|
||||
</Frame>
|
||||
</div>
|
||||
</StepperContent>
|
||||
</StepperPanel>
|
||||
|
||||
@@ -162,7 +162,7 @@ export type BgpCommunityPatch = Partial<BgpCommunityCreate>
|
||||
export type CommunitiesResponse = Page<BgpCommunity>
|
||||
|
||||
// ---- Lookup (GET /v1/lookup) ----
|
||||
/** @see https://reui.io/preview/base/stats-12 — KPI summary on /lookup */
|
||||
/** @see https://reui.io/preview/base/wizard-2 — lookup membership wizard */
|
||||
export type LookupQueryKind = 'ip' | 'domain' | 'cidr'
|
||||
export type LookupLayer = 'entry' | 'snapshot'
|
||||
export type LookupMatchKind = 'ip_range' | 'domain' | 'prefix'
|
||||
|
||||
File diff suppressed because one or more lines are too long
Reference in New Issue
Block a user