fix(ui): учитывать весь каталог Community в оптимизаторе

components/data-grids/route-optimizer-comm-recs-data-grid.tsx

@@ -2,7 +2,9 @@
 
 import { dataGridFeatures, type DataGridFeatures } from "@/components/reui/data-grid"
 
-import { useMemo } from "react"
+import { useEffect, useMemo, useState } from "react"
+import { Input } from "@/components/ui/input"
+import { DataGridContainer, DataGridScrollArea, DataGridTable } from "@/components/reui/data-grid"
 import {
   type ColumnDef,
   useTable,
@@ -68,15 +70,22 @@ function RouteOptimizerCommRecsDataGrid({
   onApply,
   simulation = false,
 }: RouteOptimizerCommRecsDataGridProps) {
+  const [query, setQuery] = useState("")
   const rows = useMemo(
     () => recs.map((r, idx) => ({ ...r, _rowKey: `${homeId}::${r.community}::${idx}` })),
     [homeId, recs],
   )
 
+  const filtered = useMemo(() => rows.filter(row =>
+    [row.community, row.communityName, row.current?.wan, row.current?.jh, row.current?.exit, row.current?.gateway,
+      row.recommended?.wan, row.recommended?.jh, row.recommended?.exit, row.recommended?.gateway]
+      .join(" ").toLocaleLowerCase().includes(query.trim().toLocaleLowerCase())), [rows, query])
+
   const columns = useMemo<ColumnDef<DataGridFeatures, (typeof rows)[number]>[]>(
     () => [
       {
         id: "community",
+        size: 180,
         accessorKey: "community",
         header: ({ column }) => (
           <DataGridSortHeader column={column} title="Community" className="ml-1" />
@@ -95,6 +104,7 @@ function RouteOptimizerCommRecsDataGrid({
       },
       {
         id: "current",
+        size: 260,
         header: () => (
           <span className="text-[11px] font-medium text-muted-foreground">
             Базовый расчёт (WAN → JH → Exit)
@@ -123,6 +133,7 @@ function RouteOptimizerCommRecsDataGrid({
       },
       {
         id: "recommended",
+        size: 260,
         header: () => <span className="text-[11px] font-medium text-muted-foreground">Рекомендуемый</span>,
         enableSorting: false,
         cell: ({ row }) => {
@@ -154,6 +165,7 @@ function RouteOptimizerCommRecsDataGrid({
       },
       {
         id: "probability",
+        size: 160,
         header: () => (
           <span className="text-[11px] font-medium text-muted-foreground block text-center">
             Индекс (баз / рек)
@@ -178,6 +190,7 @@ function RouteOptimizerCommRecsDataGrid({
       },
       {
         id: "actions",
+        size: 240,
         header: () => (
           <span className="text-[11px] font-medium text-muted-foreground block text-right">
             Действие
@@ -236,16 +249,32 @@ function RouteOptimizerCommRecsDataGrid({
 
   const table = useTable({
     features: dataGridFeatures,
-    manualPagination: true,
-    data: rows,
+    manualPagination: false,
+    autoResetPageIndex: false,
+    initialState: { pagination: { pageIndex: 0, pageSize: 50 }, columnPinning: { start: ["community"], end: [] } },
+    data: filtered,
     columns,
     getRowId: (row) => row._rowKey,
   })
 
+  const { pageIndex, pageSize } = table.state.pagination
+  useEffect(() => {
+    const lastPage = Math.max(0, Math.ceil(filtered.length / pageSize) - 1)
+    if (pageIndex > lastPage) table.setPageIndex(lastPage)
+  }, [filtered.length, pageIndex, pageSize, table])
+
   return (
+    <section aria-label="Рекомендации BGP Community" className="min-w-0">
+      <div className="px-5 py-3 space-y-2">
+        <label className="block text-xs">Поиск Community
+          <Input className="mt-1" value={query} onChange={event => { setQuery(event.target.value); table.setPageIndex(0) }} placeholder="Community, название или шлюз" />
+        </label>
+        <p className="text-xs text-muted-foreground">Community: {filtered.length} из {rows.length}. Индексы и пути — расчётная модель.</p>
+      </div>
     <DataGridShell
       table={table}
-      recordCount={rows.length}
+      recordCount={filtered.length}
+      pagination={filtered.length > 50 || pageSize !== 50}
       tableClassNames={{
         headerRow: "border-b bg-muted/20",
         bodyRow: cn(
@@ -254,8 +283,13 @@ function RouteOptimizerCommRecsDataGrid({
           "[&:has([data-comm-applied=true])]:bg-success/5",
         ),
       }}
-      tableLayout={{ dense: true }}
-    />
+      tableLayout={{ dense: true, width: "fixed", columnsPinnable: true }}
+    >
+      <DataGridContainer border={false}>
+        <DataGridScrollArea orientation="horizontal"><DataGridTable /></DataGridScrollArea>
+      </DataGridContainer>
+    </DataGridShell>
+    </section>
   )
 }