From dc0650b61eefc0eed3e539c63364e7daf01f8b21 Mon Sep 17 00:00:00 2001
From: Denozordec <shatskiy.blog@gmail.com>
Date: Sun, 28 Jun 2026 01:34:51 +0700
Subject: [PATCH] =?UTF-8?q?fix(web):=20=D0=B2=D0=BA=D0=BB=D0=B0=D0=B4?=
 =?UTF-8?q?=D0=BA=D0=B8=20=D0=B4=D0=B0=D1=88=D0=B1=D0=BE=D1=80=D0=B4=D0=B0?=
 =?UTF-8?q?=20=D0=BF=D0=BE=20=D0=BF=D0=B0=D1=82=D1=82=D0=B5=D1=80=D0=BD?=
 =?UTF-8?q?=D1=83=20REUI=20Tabs?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Line tabs с нижней границей, REUI Badge для счётчиков; исправлен URL registry @reui в components.json.

Co-authored-by: Cursor <cursoragent@cursor.com>
---
 apps/web/components.json                |  2 +-
 apps/web/src/routes/_auth/dashboard.tsx | 31 ++++++++++++++++---------
 packages/ui/components.json             |  2 +-
 3 files changed, 22 insertions(+), 13 deletions(-)

diff --git a/apps/web/components.json b/apps/web/components.json
index 5afe9ff..0b8c3d4 100644
--- a/apps/web/components.json
+++ b/apps/web/components.json
@@ -11,7 +11,7 @@
   },
   "iconLibrary": "lucide",
   "registries": {
-    "@reui": "https://reui.io/r/{style}/{name}.json"
+    "@reui": "https://reui.io/r/styles/{style}/{name}.json"
   },
   "aliases": {
     "components": "@/components",
diff --git a/apps/web/src/routes/_auth/dashboard.tsx b/apps/web/src/routes/_auth/dashboard.tsx
index d371018..6724834 100644
--- a/apps/web/src/routes/_auth/dashboard.tsx
+++ b/apps/web/src/routes/_auth/dashboard.tsx
@@ -27,10 +27,11 @@ import type { DataTableColumn } from '@/components/data-grid-types'
 import { dataGridCellStack } from '@/components/data-grid-cells'
 import { SectionCardsSkeleton, TableSkeleton } from '@/components/skeletons'
 import { Button } from '@cfdm/ui/components/button'
-import { Badge } from '@cfdm/ui/components/badge'
+import { Badge } from '@/components/reui/badge'
 import { Alert, AlertDescription, AlertTitle } from '@cfdm/ui/components/alert'
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@cfdm/ui/components/tabs'
 import { StatusBadge } from '@/components/status-badge'
+import { cn } from '@cfdm/ui/lib/utils'
 
 import { computeInventoryHealth, getStaleSyncAccountIds } from '@/lib/inventory-health'
 import { formatInBaseCurrency, normalizeRatesPayload, vpsStatusLabel } from '@/lib/format'
@@ -39,6 +40,9 @@ import { MonthlyTrendChart, MonthlyExpenseChart } from '@/components/domain/char
 
 import type { Vps, ProviderAccount, Provider, SyncLogRow } from '@/types/entities'
 
+const DASHBOARD_TAB_TRIGGER_CLASS =
+  'flex-none rounded-none border-0 border-b-2 border-transparent px-3 pb-2.5 pt-2 shadow-none after:hidden data-active:border-foreground data-active:bg-transparent data-active:shadow-none dark:data-active:border-foreground dark:data-active:bg-transparent'
+
 export const Route = createFileRoute('/_auth/dashboard')({
   loader: ({ context: { queryClient } }) =>
     Promise.all([
@@ -307,21 +311,26 @@ function DashboardPage() {
                 />
               </div>
 
-              <Tabs defaultValue="issues" className="gap-4">
-                <TabsList
-                  variant="line"
-                  className="**:data-[slot=badge]:size-5 **:data-[slot=badge]:rounded-full **:data-[slot=badge]:bg-muted-foreground/30 **:data-[slot=badge]:px-1"
-                >
-                  <TabsTrigger value="issues" className="flex-none gap-2 px-3 py-1.5 font-normal">
+              <Tabs defaultValue="issues" className="flex w-full flex-col gap-4">
+                <TabsList variant="line" className="mb-0 h-auto w-fit gap-1 border-b border-border p-0">
+                  <TabsTrigger value="issues" className={cn(DASHBOARD_TAB_TRIGGER_CLASS, 'gap-2')}>
                     Проблемы
-                    {issues.length > 0 ? <Badge variant="secondary">{issues.length}</Badge> : null}
+                    {issues.length > 0 ? (
+                      <Badge variant="primary-light" size="sm">
+                        {issues.length}
+                      </Badge>
+                    ) : null}
                   </TabsTrigger>
-                  <TabsTrigger value="recent" className="flex-none px-3 py-1.5 font-normal">
+                  <TabsTrigger value="recent" className={DASHBOARD_TAB_TRIGGER_CLASS}>
                     Последние VPS
                   </TabsTrigger>
-                  <TabsTrigger value="risk" className="flex-none gap-2 px-3 py-1.5 font-normal">
+                  <TabsTrigger value="risk" className={cn(DASHBOARD_TAB_TRIGGER_CLASS, 'gap-2')}>
                     Аккаунты
-                    {atRisk.length > 0 ? <Badge variant="secondary">{atRisk.length}</Badge> : null}
+                    {atRisk.length > 0 ? (
+                      <Badge variant="info-light" size="sm">
+                        {atRisk.length}
+                      </Badge>
+                    ) : null}
                   </TabsTrigger>
                 </TabsList>
                 <TabsContent value="issues" className="mt-0">
diff --git a/packages/ui/components.json b/packages/ui/components.json
index f633e7c..73a0cf3 100644
--- a/packages/ui/components.json
+++ b/packages/ui/components.json
@@ -11,7 +11,7 @@
   },
   "iconLibrary": "lucide",
   "registries": {
-    "@reui": "https://reui.io/r/{style}/{name}.json"
+    "@reui": "https://reui.io/r/styles/{style}/{name}.json"
   },
   "aliases": {
     "components": "@cfdm/ui/components",