CI / changes (push) Successful in 10s
CI / commitlint (push) Has been skipped
CI / openapi (push) Has been skipped
CI / web (push) Successful in 54s
CI / go (push) Successful in 1m3s
CI / bird2 (push) Successful in 20s
CI / release (push) Successful in 4m29s
Updated the Settings and Auth components to include better navigation handling by adding search parameters for tab selection. Enhanced the Access component to utilize badges for status indicators, improving visual clarity. Refactored the Schedule component to streamline job status display with badges, ensuring a more cohesive user experience. Additionally, integrated client directives in UI components for better performance.
91 lines
3.2 KiB
TypeScript
91 lines
3.2 KiB
TypeScript
import { Link } from '@tanstack/react-router'
|
|
import {
|
|
ActivityIcon,
|
|
KeyRoundIcon,
|
|
SlidersHorizontalIcon,
|
|
} from 'lucide-react'
|
|
import { Fragment } from 'react'
|
|
|
|
import { SettingsCard } from '@/components/blocks/settings-7/components/settings-card'
|
|
import { Badge } from '@/components/reui/badge'
|
|
import { Button } from '@evobgp/ui/components/button'
|
|
import {
|
|
Item,
|
|
ItemActions,
|
|
ItemContent,
|
|
ItemDescription,
|
|
ItemGroup,
|
|
ItemMedia,
|
|
ItemSeparator,
|
|
ItemTitle,
|
|
} from '@evobgp/ui/components/item'
|
|
|
|
const ADMIN_SECTIONS = [
|
|
{
|
|
id: 'tenant-settings',
|
|
to: '/tenant-settings' as const,
|
|
title: 'Параметры арендатора',
|
|
description: 'BIRD, ревизии, файловые логи и дополнительные ключи /v1/settings.',
|
|
icon: <SlidersHorizontalIcon aria-hidden="true" />,
|
|
badge: { label: 'operator', variant: 'warning-light' as const },
|
|
},
|
|
{
|
|
id: 'access',
|
|
to: '/access' as const,
|
|
title: 'Права доступа',
|
|
description: 'API-ключи tenant, роли и управление доступом.',
|
|
icon: <KeyRoundIcon aria-hidden="true" />,
|
|
badge: { label: 'operator', variant: 'warning-light' as const },
|
|
},
|
|
{
|
|
id: 'monitoring',
|
|
to: '/monitoring' as const,
|
|
title: 'Мониторинг',
|
|
description: 'Метрики, состояние jobs и observability control plane.',
|
|
icon: <ActivityIcon aria-hidden="true" />,
|
|
badge: { label: 'viewer+', variant: 'info-light' as const },
|
|
},
|
|
] as const
|
|
|
|
export function SectionsSettingsTab() {
|
|
return (
|
|
<div className="space-y-6">
|
|
<SettingsCard
|
|
title="Разделы control plane"
|
|
description="Параметры tenant и операции — отдельно от настроек браузера"
|
|
>
|
|
<ItemGroup className="gap-0">
|
|
{ADMIN_SECTIONS.map((section, index) => (
|
|
<Fragment key={section.id}>
|
|
{index > 0 ? <ItemSeparator className="my-0" /> : null}
|
|
<Item className="min-h-0 items-center gap-4 px-5 py-3.5">
|
|
<ItemMedia className="self-center!">
|
|
<Item className="bg-muted/60 border-background flex size-8 shrink-0 items-center justify-center border-2 p-0 shadow-[0_1px_3px_0_rgba(0,0,0,0.14)] [&_svg]:size-4 [&_svg]:opacity-60">
|
|
{section.icon}
|
|
</Item>
|
|
</ItemMedia>
|
|
|
|
<ItemContent className="min-w-0 justify-center gap-0.5 self-center">
|
|
<ItemTitle className="gap-2 leading-5">
|
|
{section.title}
|
|
<Badge variant={section.badge.variant} size="xs">
|
|
{section.badge.label}
|
|
</Badge>
|
|
</ItemTitle>
|
|
<ItemDescription className="leading-5">{section.description}</ItemDescription>
|
|
</ItemContent>
|
|
|
|
<ItemActions className="shrink-0 justify-end self-center">
|
|
<Button variant="outline" size="sm" render={<Link to={section.to} />}>
|
|
Открыть
|
|
</Button>
|
|
</ItemActions>
|
|
</Item>
|
|
</Fragment>
|
|
))}
|
|
</ItemGroup>
|
|
</SettingsCard>
|
|
</div>
|
|
)
|
|
}
|