feat(web): upgrade lists to ReUI Table v9 and EventCalendar

Единый kitDataGridTableLayout и ResourcePage/FrameDataGrid на всех списках.
Календарь задач переведён на EventCalendar, lookup — на cascader, у операций появился вид доски.
Удалены settings-7 и самописные DataGridSection/toolbar.

Co-authored-by: Cursor <[email protected]>

apps/web/src/components/lookup/lookup-matches-grid.tsx

@@ -1,21 +1,35 @@
-import { ColumnDef } from '@tanstack/react-table'
-import { useMemo } from 'react'
+import { useMemo, useState } from 'react'
 import { useNavigate } from '@tanstack/react-router'
+import { Boxes, SearchIcon } from 'lucide-react'
 
 import { CategoryBadge } from '@/components/category-badge'
-import { DataGridPrimaryCell } from '@/components/data-grid-cell'
-import { DataGridSection } from '@/components/data-grid-shell'
+import { DataGridMonoCell, DataGridMutedCell, DataGridNameCell } from '@/components/data-grid-cell'
 import { Badge } from '@/components/reui/badge'
 import { DataGridColumnHeader } from '@/components/reui/data-grid/data-grid-column-header'
-import { useClientDataGrid } from '@/hooks/use-client-data-grid'
+import type { FilterField, FilterQuery } from '@/components/reui/filters/filters-types'
+import {
+  ResourcePage,
+  createTextFilterQuery,
+  type DataGridColumnDef,
+} from '@/components/reui-kit'
 import type { LookupMatch } from '@/types/api'
 
 /**
- * Lookup matches grid — bare section for wizard-2 single Frame.
+ * Lookup matches grid — ResourcePage hideHeader inside wizard-2 Frame.
  * @see https://reui.io/preview/base/wizard-2
  * @see https://reui.io/preview/base/data-grid-filtering-2
  * @see https://reui.io/docs/components/base/badge
  */
+const filterFields: FilterField[] = [
+  {
+    id: 'search',
+    label: 'Поиск',
+    icon: <SearchIcon className="size-3.5" aria-hidden />,
+    type: 'text',
+    placeholder: 'Фильтр совпадений…',
+  },
+]
+
 export function LookupMatchesGrid({
   items,
   isLoading = false,
@@ -24,8 +38,11 @@ export function LookupMatchesGrid({
   isLoading?: boolean
 }) {
   const navigate = useNavigate()
+  const [filterQuery, setFilterQuery] = useState<FilterQuery>(() =>
+    createTextFilterQuery('search'),
+  )
 
-  const columns = useMemo<ColumnDef<LookupMatch>[]>(
+  const columns = useMemo<DataGridColumnDef<LookupMatch>[]>(
     () => [
       {
         accessorKey: 'layer',
@@ -44,10 +61,10 @@ export function LookupMatchesGrid({
         accessorKey: 'module_name',
         header: ({ column }) => <DataGridColumnHeader column={column} title="Модуль" />,
         cell: ({ row }) => (
-          <DataGridPrimaryCell
+          <DataGridNameCell
+            icon={Boxes}
             title={row.original.module_name}
             subtitle={row.original.module_type}
-            accent="primary"
           />
         ),
         meta: { headerTitle: 'Модуль' },
@@ -56,15 +73,14 @@ export function LookupMatchesGrid({
         accessorKey: 'matched_value',
         header: ({ column }) => <DataGridColumnHeader column={column} title="Совпадение" />,
         cell: ({ row }) => (
-          <DataGridPrimaryCell
-            title={row.original.matched_value}
-            subtitle={
-              row.original.resolved_ip
+          <div className="flex min-w-0 flex-col gap-0.5">
+            <DataGridMonoCell>{row.original.matched_value}</DataGridMonoCell>
+            <DataGridMutedCell>
+              {row.original.resolved_ip
                 ? `${row.original.match_kind} · via ${row.original.resolved_ip}`
-                : row.original.match_kind
-            }
-            accent="mono"
-          />
+                : row.original.match_kind}
+            </DataGridMutedCell>
+          </div>
         ),
         meta: { headerTitle: 'Совпадение' },
       },
@@ -76,13 +92,15 @@ export function LookupMatchesGrid({
           const title = row.original.community_title?.trim()
           const value = row.original.community?.trim()
           if (!title && !value) {
-            return <span className="text-muted-foreground text-sm">—</span>
+            return <DataGridMutedCell>—</DataGridMutedCell>
           }
           return (
-            <DataGridPrimaryCell
-              title={title || value || '—'}
-              subtitle={title && value && title !== value ? value : undefined}
-            />
+            <div className="flex min-w-0 flex-col gap-0.5">
+              <DataGridMonoCell>{title || value || '—'}</DataGridMonoCell>
+              {title && value && title !== value ? (
+                <DataGridMutedCell>{value}</DataGridMutedCell>
+              ) : null}
+            </div>
           )
         },
         meta: { headerTitle: 'Community' },
@@ -95,7 +113,7 @@ export function LookupMatchesGrid({
           row.original.source ? (
             <CategoryBadge>{row.original.source}</CategoryBadge>
           ) : (
-            <span className="text-muted-foreground text-sm">—</span>
+            <DataGridMutedCell>—</DataGridMutedCell>
           ),
         meta: { headerTitle: 'Источник' },
       },
@@ -103,35 +121,29 @@ export function LookupMatchesGrid({
     [],
   )
 
-  const { table, globalFilter, setGlobalFilter, filteredCount } = useClientDataGrid({
-    data: items,
-    columns,
-    getSearchText: (row) =>
-      `${row.layer} ${row.module_name} ${row.module_type} ${row.matched_value} ${row.community ?? ''} ${row.community_title ?? ''} ${row.source ?? ''}`,
-    getRowId: (row) =>
-      `${row.layer}|${row.module_id}|${row.match_kind}|${row.matched_value}|${row.entry_id ?? ''}|${row.source ?? ''}|${row.community_id ?? ''}`,
-  })
-
   return (
-    <div className="flex flex-col gap-3">
-      <div className="flex flex-col gap-px">
-        <h3 className="text-sm font-semibold">Совпадения</h3>
-        <p className="text-muted-foreground text-sm">
-          Entries и snapshots · клик по строке открывает модуль
-        </p>
-      </div>
-      <DataGridSection
-        table={table}
-        recordCount={filteredCount}
-        isLoading={isLoading}
-        emptyMessage="Нет совпадений"
-        searchValue={globalFilter}
-        onSearchChange={setGlobalFilter}
-        searchPlaceholder="Фильтр совпадений…"
-        onRowClick={(row) =>
-          void navigate({ to: '/modules/$moduleId', params: { moduleId: row.module_id } })
-        }
-      />
-    </div>
+    <ResourcePage
+      title="Совпадения"
+      description="Entries и snapshots · клик по строке открывает модуль"
+      hideHeader
+      filterFields={filterFields}
+      filterQuery={filterQuery}
+      onFilterQueryChange={setFilterQuery}
+      onClearFilters={() => setFilterQuery(createTextFilterQuery('search'))}
+      getFilterFieldValue={(item, field) => {
+        if (field !== 'search') return undefined
+        return `${item.layer} ${item.module_name} ${item.module_type} ${item.matched_value} ${item.community ?? ''} ${item.community_title ?? ''} ${item.source ?? ''}`
+      }}
+      columns={columns}
+      data={items}
+      getRowId={(row) =>
+        `${row.layer}|${row.module_id}|${row.match_kind}|${row.matched_value}|${row.entry_id ?? ''}|${row.source ?? ''}|${row.community_id ?? ''}`
+      }
+      isLoading={isLoading}
+      onRowClick={(row) =>
+        void navigate({ to: '/modules/$moduleId', params: { moduleId: row.module_id } })
+      }
+      emptyState={{ title: 'Нет совпадений' }}
+    />
   )
 }