feat(ui): добавить KPI card-35 на domains, groups и services

ReUI PRO card-35 через KpiStatGrid; клик по KPI синхронизирует tabs.

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

apps/web/src/routes/_auth/domains/index.tsx

@@ -1,6 +1,6 @@
 import { createFileRoute } from '@tanstack/react-router'
 import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query'
-import { useMemo, useState } from 'react'
+import { useCallback, useMemo, useState } from 'react'
 import { useForm } from 'react-hook-form'
 import { zodResolver } from '@hookform/resolvers/zod'
 import { toast } from 'sonner'
@@ -15,6 +15,7 @@ import {
   serviceBindingKeys,
 } from '@/queries'
 import { PageShell } from '@/components/page-shell'
+import { DomainKpiCards } from '@/components/domain-kpi-cards'
 import { ResourcePage } from '@/components/reui-kit'
 import {
   DOMAIN_TABS,
@@ -55,7 +56,9 @@ function DomainsPage() {
   const [importGroupId, setImportGroupId] = useState('')
   const [deleteTarget, setDeleteTarget] = useState<DomainListItem | null>(null)
   const [filters, setFilters] = useState<Filter[]>(createDefaultDomainFilters)
+  const [activeTab, setActiveTab] = useState('all')
   const queryClient = useQueryClient()
+  const handleSelectTab = useCallback((tabId: string) => setActiveTab(tabId), [])
 
   const {
     data: domains,
@@ -146,10 +149,18 @@ function DomainsPage() {
 
   return (
     <PageShell>
+      <DomainKpiCards
+        domains={domains}
+        activeTab={activeTab}
+        isLoading={isLoading && !domains}
+        onSelectTab={handleSelectTab}
+      />
       <ResourcePage
         title="Домены"
         description="Импортированные зоны Cloudflare"
         tabs={DOMAIN_TABS.map((tab) => ({ ...tab }))}
+        activeTab={activeTab}
+        onTabChange={setActiveTab}
         tabFilter={domainTabFilter}
         filterFields={filterFields}
         filters={filters}