refactor: update Dashboard components for improved layout and integration
CI / changes (push) Successful in 9s
CI / commitlint (push) Has been skipped
CI / openapi (push) Has been skipped
CI / web (push) Successful in 52s
CI / go (push) Successful in 59s
CI / bird2 (push) Successful in 15s
CI / release (push) Successful in 4m20s

Refactored the DashboardQuickLinkCard to enhance its structure and presentation by integrating FramePanel. Updated the DashboardQuickLinks component to utilize Frame for better organization, including a header and description. Removed the previous DashboardFramePanel integration in the DashboardComponent to streamline the layout, ensuring a more cohesive user experience.
This commit is contained in:
Denozordec
2026-07-09 21:15:04 +07:00
parent 46e7b2aa6b
commit 1a142e68a9
4 changed files with 55 additions and 51 deletions
+2
View File
@@ -12,3 +12,5 @@
{"sessionId":"c10bcb","runId":"post-fix","hypothesisId":"H1","location":"badge-tabs.tsx:useEffect","message":"BadgeTabs layout metrics","data":{"flexDirection":"column","orientation":"horizontal","listLeft":280,"panelLeft":280,"stacked":true},"timestamp":1783605819320}
{"sessionId":"c10bcb","runId":"post-fix","hypothesisId":"H1","location":"badge-tabs.tsx:useEffect","message":"BadgeTabs layout metrics","data":{"flexDirection":"column","orientation":"horizontal","listLeft":280,"panelLeft":280,"stacked":true},"timestamp":1783605827145}
{"sessionId":"c10bcb","runId":"post-fix","hypothesisId":"H1","location":"badge-tabs.tsx:useEffect","message":"BadgeTabs layout metrics","data":{"flexDirection":"column","orientation":"horizontal","listLeft":280,"panelLeft":280,"stacked":true},"timestamp":1783605864391}
{"sessionId":"c10bcb","runId":"post-fix","hypothesisId":"H1","location":"badge-tabs.tsx:useEffect","message":"BadgeTabs layout metrics","data":{"flexDirection":"column","orientation":"horizontal","listLeft":280,"panelLeft":280,"stacked":true},"timestamp":1783606471768}
{"sessionId":"c10bcb","runId":"post-fix","hypothesisId":"H1","location":"badge-tabs.tsx:useEffect","message":"BadgeTabs layout metrics","data":{"flexDirection":"column","orientation":"horizontal","listLeft":280,"panelLeft":280,"stacked":true},"timestamp":1783606472923}
@@ -2,8 +2,8 @@ import { Link } from '@tanstack/react-router'
import { ChevronRight } from 'lucide-react'
import type { ReactNode } from 'react'
import { Frame, FramePanel } from '@/components/reui/frame'
import { CardDotField } from '@/components/dashboard/card-dot-field'
import { FramePanel } from '@/components/reui/frame'
import { cn } from '@evobgp/ui/lib/utils'
import { Item, ItemMedia } from '@evobgp/ui/components/item'
@@ -25,7 +25,6 @@ export function DashboardQuickLinkCard({
iconClass,
}: QuickLinkCardProps) {
return (
<Frame className="h-full">
<Link
to={to}
search={search}
@@ -65,6 +64,5 @@ export function DashboardQuickLinkCard({
</div>
</FramePanel>
</Link>
</Frame>
)
}
@@ -2,6 +2,12 @@ import { Gauge, Network, Play, Plus, Share2, Tags } from 'lucide-react'
import type { ReactNode } from 'react'
import { DashboardQuickLinkCard } from '@/components/dashboard/dashboard-quick-link-card'
import {
Frame,
FrameDescription,
FrameHeader,
FrameTitle,
} from '@/components/reui/frame'
type QuickLink = {
icon: ReactNode
@@ -63,12 +69,16 @@ const LINKS: QuickLink[] = [
export function DashboardQuickLinks() {
return (
<div className="@container w-full">
<div className="grid gap-3 sm:grid-cols-2 @2xl:grid-cols-3">
<Frame className="@container w-full">
<FrameHeader>
<FrameTitle>Быстрые действия</FrameTitle>
<FrameDescription>Частые переходы к настройке и деплою</FrameDescription>
</FrameHeader>
<div className="grid gap-1 sm:grid-cols-2 xl:grid-cols-3">
{LINKS.map((link) => (
<DashboardQuickLinkCard key={link.label} {...link} />
))}
</div>
</div>
</Frame>
)
}
+2 -8
View File
@@ -85,6 +85,8 @@ function DashboardComponent() {
}
/>
<DashboardQuickLinks />
{initialLoading ? (
<AnalyticsDashboardSkeleton />
) : (
@@ -142,14 +144,6 @@ function DashboardComponent() {
)}
</DashboardFramePanel>
</div>
<DashboardFramePanel
title="Быстрые действия"
description="Частые переходы к настройке и деплою"
contentClassName="p-4"
>
<DashboardQuickLinks />
</DashboardFramePanel>
</div>
)
}