From aa475848fd23215e9d682bd1db4de7d1940ad32e Mon Sep 17 00:00:00 2001
From: Denozordec <shatskiy.blog@gmail.com>
Date: Fri, 23 Oct 2026 20:26:07 +0700
Subject: [PATCH] =?UTF-8?q?feat(web):=20=D0=B4=D0=B5=D1=82=D0=B0=D0=BB?=
 =?UTF-8?q?=D1=8C=20=D1=81=D0=BF=D0=B8=D1=81=D0=BA=D0=B0=20=D0=B8=20=D0=BD?=
 =?UTF-8?q?=D0=B0=D0=B1=D0=BE=D1=80=D0=B0=20=D0=BF=D1=80=D0=B0=D0=B2=D0=B8?=
 =?UTF-8?q?=D0=BB=20=D0=BF=D0=BE=20=D0=B4=D0=BE=D1=81=D0=BA=D0=B0=D0=BC=20?=
 =?UTF-8?q?=D0=BC=D0=B0=D0=BA=D0=B5=D1=82=D0=B0?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Заголовок деталей — как на досках (20px, действия справа), полоса показателей списка дополнена «Обновлён».

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
---
 .../src/components/reui-kit/detail-panel.tsx  | 35 ++++++-------------
 apps/web/src/routes/_auth/lists/$id.tsx       | 10 ++++++
 2 files changed, 20 insertions(+), 25 deletions(-)

diff --git a/apps/web/src/components/reui-kit/detail-panel.tsx b/apps/web/src/components/reui-kit/detail-panel.tsx
index fb23a6d..f772904 100644
--- a/apps/web/src/components/reui-kit/detail-panel.tsx
+++ b/apps/web/src/components/reui-kit/detail-panel.tsx
@@ -1,11 +1,4 @@
 import type { ReactNode } from 'react'
-import {
-  Frame,
-  FrameDescription,
-  FrameHeader,
-  FramePanel,
-  FrameTitle,
-} from '@/components/reui/frame'
 import {
   KpiStatGrid,
   type KpiStatCard,
@@ -33,7 +26,7 @@ interface DetailPanelProps {
 
 function DetailPanelRoot({ children, className }: DetailPanelProps) {
   return (
-    <div className={cn('flex flex-col gap-4 md:gap-6', className)}>
+    <div className={cn('flex flex-col gap-5', className)}>
       {children}
     </div>
   )
@@ -53,24 +46,16 @@ function DetailPanelHeader({
   children,
 }: DetailPanelHeaderProps) {
   return (
-    <Frame dense spacing="sm" className="w-full">
-      <FrameHeader className="flex-row items-start justify-between gap-3">
-        <div className="flex min-w-0 flex-1 flex-col gap-px">
-          <FrameTitle>{title}</FrameTitle>
-          {description ? (
-            <FrameDescription>{description}</FrameDescription>
-          ) : null}
+    <>
+      <header className="flex min-w-0 flex-wrap items-end justify-between gap-3">
+        <div className="flex min-w-0 flex-col gap-0.5">
+          <h1 className="text-xl font-semibold tracking-[-0.01em]">{title}</h1>
+          {description ? <p className="text-muted-foreground text-sm text-pretty">{description}</p> : null}
         </div>
-        {actions ? (
-          <div className="flex shrink-0 flex-wrap items-center justify-end gap-2">
-            {actions}
-          </div>
-        ) : null}
-      </FrameHeader>
-      {children ? (
-        <FramePanel className="flex flex-col gap-4">{children}</FramePanel>
-      ) : null}
-    </Frame>
+        {actions ? <div className="flex shrink-0 flex-wrap items-center justify-end gap-2">{actions}</div> : null}
+      </header>
+      {children}
+    </>
   )
 }
 
diff --git a/apps/web/src/routes/_auth/lists/$id.tsx b/apps/web/src/routes/_auth/lists/$id.tsx
index c16c99c..7227631 100644
--- a/apps/web/src/routes/_auth/lists/$id.tsx
+++ b/apps/web/src/routes/_auth/lists/$id.tsx
@@ -4,11 +4,13 @@ import { toast } from 'sonner'
 import {
   ArrowLeftIcon,
   CircleAlertIcon,
+  ClockIcon,
   HashIcon,
   RefreshCwIcon,
   TagIcon,
   Trash2,
 } from 'lucide-react'
+import { formatDateTime, formatRelativeTime } from '@/lib/format'
 import { useCallback, useMemo, useState } from 'react'
 import type { ColumnDef } from '@tanstack/react-table'
 import type { Filter, FilterFieldConfig } from '@/components/reui/filters'
@@ -471,6 +473,14 @@ function ListDetailPage() {
               ),
               hint: 'materialized',
             },
+            {
+              id: 'updated',
+              icon: <ClockIcon aria-hidden />,
+              iconClassName: 'text-muted-foreground',
+              label: 'Обновлён',
+              description: formatRelativeTime(detail.refreshed_at ?? detail.updated_at),
+              hint: formatDateTime(detail.refreshed_at ?? detail.updated_at),
+            },
           ]}
         />