Init 2

app/(main)/ip-ranges/page.tsx

@@ -1,12 +1,28 @@
 "use client"
 
+import { useMemo } from "react"
 import { PageHeader } from "@/components/page-header"
 import { DataTable } from "@/components/data-table"
-import { ipRanges } from "@/lib/data"
+import { ipRanges as mockIpRanges } from "@/lib/data"
 import { Button } from "@/components/ui/button"
-import { UploadIcon, DownloadIcon, PlusIcon, FilterIcon } from "lucide-react"
+import { UploadIcon, DownloadIcon, PlusIcon, FilterIcon, LoaderCircleIcon } from "lucide-react"
+import { useDataSource } from "@/lib/data-source"
+import { useEvoBGP } from "@/lib/evobgp-context"
+import { cn } from "@/lib/utils"
 
 export default function IpRangesPage() {
+  const { mode } = useDataSource()
+  const { enabled, snapshot, loading, error } = useEvoBGP()
+
+  /** При включённом EvoBGP в live локальные моки не показываем — только каталог API (или пусто при загрузке/ошибке). */
+  const useEvoCatalog = mode === "live" && enabled
+
+  const rows = useMemo(() => {
+    if (!useEvoCatalog) return mockIpRanges
+    if (loading && !snapshot) return []
+    return snapshot?.ipRanges ?? []
+  }, [useEvoCatalog, loading, snapshot])
+
   return (
     <div className="flex flex-col h-full">
       <PageHeader
@@ -26,9 +42,22 @@ export default function IpRangesPage() {
             <p className="text-sm text-muted-foreground mt-1">
               CIDR-блоки, отправляемые в address-list MikroTik по всем настроенным фильтрам
             </p>
+            {useEvoCatalog && (
+              <p className={cn(
+                "text-xs mt-2 flex items-center gap-1.5",
+                error ? "text-destructive" : "text-muted-foreground",
+              )}>
+                {loading && <LoaderCircleIcon className="size-3.5 animate-spin shrink-0" />}
+                {error
+                  ? `EvoBGP: ${error}`
+                  : snapshot?.fetchedAt
+                    ? `Источник: EvoBGP, обновлено ${new Date(snapshot.fetchedAt).toLocaleString("ru-RU")}`
+                    : loading ? "Загрузка EvoBGP…" : "EvoBGP"}
+              </p>
+            )}
           </div>
           <DataTable
-            data={ipRanges}
+            data={rows}
             searchPlaceholder="Поиск по CIDR, ASN…"
             searchKeys={["cidr", "asn", "country", "filter"]}
             columns={[