@burdenoff/microfe-adaptercloud 2026.825.4 → 2026.829.1

package/dist/adaptercloud/pages/adapters/AdaptersListPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"AdaptersListPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/adapters/AdaptersListPage.tsx"],"sourcesContent":["/**\n * Adapters List Page\n * @module adaptercloud/pages/adapters\n *\n * The adapter catalog — every reusable connector definition in the workspace.\n * Lists from `adaListAdapters` with kind/status filters and offset pagination\n * (driven by `AdaPageInfo.hasMore`).\n */\n\nimport { useState, useCallback } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport {\n  Boxes,\n  Cloud,\n  Cpu,\n  Database,\n  HardDrive,\n  Network,\n  Plus,\n  Puzzle,\n  Radio,\n  ServerCog,\n  ChevronLeft,\n  ChevronRight,\n  type LucideIcon,\n} from 'lucide-react';\nimport { GlassCard } from '@burdenoff/fe-libs/ui';\nimport { PageLayout } from '../../components/PageLayout';\nimport { StatusBadge } from '../../components/StatusBadge';\nimport { DataState } from '../../components/DataState';\nimport { useAdapterCloud } from '../../context/AdapterCloudContext';\nimport { useAdapters } from '../../hooks/useAdapterCloudApi';\nimport { adapterKindLabels, adapterStatusLabels } from '../../utils/domain';\nimport { formatRelativeTime } from '../../utils/formatters';\nimport type { AdaAdapterKind, AdaAdapterStatus } from '../../types';\n\nconst PAGE_SIZE = 20;\n\n/** Per-kind glyph — mirrors the mock's vendor logo tile on each catalog card. */\nconst kindIcons: Record<AdaAdapterKind, LucideIcon> = {\n  PUBLIC_CLOUD: Cloud,\n  SAAS: Cloud,\n  PRIVATE_CLOUD: ServerCog,\n  ON_PREM: HardDrive,\n  EDGE: Radio,\n  IOT: Cpu,\n  KUBERNETES: Boxes,\n  NETWORK: Network,\n  DATA_SYSTEM: Database,\n  CUSTOM: Puzzle,\n};\n\nexport function AdaptersListPage() {\n  const { navigateTo } = useAdapterCloud();\n  const { t: translate } = useI18n();\n  const t = useCallback(\n    (key: string, fallback: string): string => {\n      const value = translate(key);\n      return value === key ? fallback : value;\n    },\n    [translate]\n  );\n\n  const [kind, setKind] = useState<AdaAdapterKind | ''>('');\n  const [status, setStatus] = useState<AdaAdapterStatus | ''>('');\n  const [offset, setOffset] = useState(0);\n\n  const query = useAdapters({\n    kind: kind || undefined,\n    status: status || undefined,\n    pagination: { limit: PAGE_SIZE, offset },\n  });\n\n  const items = query.data?.items ?? [];\n  const hasMore = query.data?.pageInfo.hasMore ?? false;\n\n  const resetTo = useCallback(<T,>(setter: (v: T) => void) => {\n    return (v: T) => {\n      setter(v);\n      setOffset(0);\n    };\n  }, []);\n\n  return (\n    <PageLayout\n      title={t('adaptercloud.adapters.title', 'Adapters')}\n      description={t(\n        'adaptercloud.adapters.subtitle',\n        'The catalog of connectors that bridge each class of system into the fabric.'\n      )}\n      actions={\n        <button\n          type=\"button\"\n          onClick={() => navigateTo('/adapters/new')}\n          className=\"inline-flex items-center gap-2 rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:opacity-90\"\n        >\n          <Plus className=\"h-4 w-4\" />\n          {t('adaptercloud.adapters.new', 'New adapter')}\n        </button>\n      }\n    >\n      {/* Filters */}\n      <div className=\"mb-6 flex flex-wrap gap-3\">\n        <select\n          value={kind}\n          onChange={(e) => resetTo(setKind)(e.target.value as AdaAdapterKind | '')}\n          aria-label={t('adaptercloud.adapters.filterByKind', 'Filter by kind')}\n          className=\"rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n        >\n          <option value=\"\">{t('adaptercloud.adapters.allKinds', 'All kinds')}</option>\n          {(Object.keys(adapterKindLabels) as AdaAdapterKind[]).map((k) => (\n            <option key={k} value={k}>\n              {adapterKindLabels[k]}\n            </option>\n          ))}\n        </select>\n        <select\n          value={status}\n          onChange={(e) => resetTo(setStatus)(e.target.value as AdaAdapterStatus | '')}\n          aria-label={t('adaptercloud.adapters.filterByStatus', 'Filter by status')}\n          className=\"rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n        >\n          <option value=\"\">{t('adaptercloud.adapters.allStatuses', 'All statuses')}</option>\n          {(Object.keys(adapterStatusLabels) as AdaAdapterStatus[]).map((s) => (\n            <option key={s} value={s}>\n              {adapterStatusLabels[s]}\n            </option>\n          ))}\n        </select>\n      </div>\n\n      <DataState\n        isLoading={query.isLoading}\n        isError={query.isError}\n        isEmpty={items.length === 0}\n        error={query.error}\n        onRetry={() => void query.refetch()}\n        emptyTitle={t('adaptercloud.adapters.emptyTitle', 'No adapters yet')}\n        emptyDescription={t(\n          'adaptercloud.adapters.emptyDescription',\n          'Define your first adapter to start bridging a class of system into the fabric.'\n        )}\n        emptyIcon={<Boxes className=\"h-10 w-10\" />}\n        emptyAction={\n          <button\n            type=\"button\"\n            onClick={() => navigateTo('/adapters/new')}\n            className=\"rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:opacity-90\"\n          >\n            {t('adaptercloud.adapters.new', 'New adapter')}\n          </button>\n        }\n      >\n        <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n          {items.map((adapter) => (\n            <GlassCard\n              key={adapter.id}\n              role=\"button\"\n              tabIndex={0}\n              onClick={() => navigateTo(`/adapters/${adapter.id}`)}\n              onKeyDown={(e) => {\n                if (e.key === 'Enter' || e.key === ' ') {\n                  e.preventDefault();\n                  navigateTo(`/adapters/${adapter.id}`);\n                }\n              }}\n              className=\"cursor-pointer p-5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-focus-ring)]\"\n            >\n              <div className=\"flex items-start justify-between gap-2\">\n                <div className=\"flex min-w-0 items-center gap-3\">\n                  <span className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-accent-blue-subtle text-accent-blue\">\n                    {(() => {\n                      const Icon = kindIcons[adapter.kind];\n                      return <Icon className=\"h-5 w-5\" />;\n                    })()}\n                  </span>\n                  <div className=\"min-w-0\">\n                    <h3 className=\"truncate text-base font-semibold text-text-primary\">\n                      {adapter.name}\n                    </h3>\n                    <p className=\"mt-0.5 truncate text-xs text-text-secondary\">{adapter.slug}</p>\n                  </div>\n                </div>\n                <StatusBadge status={adapter.status} />\n              </div>\n\n              <div className=\"mt-3 flex flex-wrap items-center gap-2 text-xs text-text-secondary\">\n                <span className=\"inline-flex items-center rounded-full bg-bg-sunken px-2 py-0.5\">\n                  {adapterKindLabels[adapter.kind]}\n                </span>\n                <span>v{adapter.version}</span>\n                {adapter.vendor && <span>· {adapter.vendor}</span>}\n              </div>\n\n              {adapter.description && (\n                <p className=\"mt-3 line-clamp-2 text-sm text-text-secondary\">\n                  {adapter.description}\n                </p>\n              )}\n\n              {adapter.capabilities.length > 0 && (\n                <div className=\"mt-3 flex flex-wrap gap-1.5\">\n                  {adapter.capabilities.slice(0, 4).map((cap) => (\n                    <span\n                      key={cap}\n                      className=\"inline-flex items-center rounded-full bg-accent-blue-subtle px-2 py-0.5 text-xs text-accent-blue\"\n                    >\n                      {cap}\n                    </span>\n                  ))}\n                  {adapter.capabilities.length > 4 && (\n                    <span className=\"text-xs text-text-secondary\">\n                      +{adapter.capabilities.length - 4}\n                    </span>\n                  )}\n                </div>\n              )}\n\n              <p className=\"mt-4 text-xs text-text-secondary\">\n                {t('adaptercloud.common.updated', 'Updated')}{' '}\n                {formatRelativeTime(adapter.updatedAt)}\n              </p>\n            </GlassCard>\n          ))}\n        </div>\n\n        {/* Pagination */}\n        {(offset > 0 || hasMore) && (\n          <div className=\"mt-6 flex items-center justify-between\">\n            <button\n              type=\"button\"\n              disabled={offset === 0}\n              onClick={() => setOffset((o) => Math.max(0, o - PAGE_SIZE))}\n              className=\"inline-flex items-center gap-1 rounded-lg border border-border-subtle px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-accent disabled:cursor-not-allowed disabled:opacity-50\"\n            >\n              <ChevronLeft className=\"h-4 w-4\" />\n              {t('adaptercloud.common.prev', 'Previous')}\n            </button>\n            <span className=\"text-sm text-text-secondary\">\n              {t('adaptercloud.common.showing', 'Showing')} {offset + 1}–{offset + items.length}\n            </span>\n            <button\n              type=\"button\"\n              disabled={!hasMore}\n              onClick={() => setOffset((o) => o + PAGE_SIZE)}\n              className=\"inline-flex items-center gap-1 rounded-lg border border-border-subtle px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-accent disabled:cursor-not-allowed disabled:opacity-50\"\n            >\n              {t('adaptercloud.common.next', 'Next')}\n              <ChevronRight className=\"h-4 w-4\" />\n            </button>\n          </div>\n        )}\n      </DataState>\n    </PageLayout>\n  );\n}\n"],"mappings":";;;;;;;;;;;;;AAoCA,IAAM,IAAY,IAGZ,IAAgD;CACpD,cAAc;CACd,MAAM;CACN,eAAe;CACf,SAAS;CACT,MAAM;CACN,KAAK;CACL,YAAY;CACZ,SAAS;CACT,aAAa;CACb,QAAQ;AACV;AAEA,SAAgB,IAAmB;CACjC,IAAM,EAAE,kBAAe,EAAgB,GACjC,EAAE,GAAG,MAAc,EAAQ,GAC3B,IAAI,GACP,GAAa,MAA6B;EACzC,IAAM,IAAQ,EAAU,CAAG;EAC3B,OAAO,MAAU,IAAM,IAAW;CACpC,GACA,CAAC,CAAS,CACZ,GAEM,CAAC,GAAM,KAAW,EAA8B,EAAE,GAClD,CAAC,GAAQ,KAAa,EAAgC,EAAE,GACxD,CAAC,GAAQ,KAAa,EAAS,CAAC,GAEhC,IAAQ,EAAY;EACxB,MAAM,KAAQ,KAAA;EACd,QAAQ,KAAU,KAAA;EAClB,YAAY;GAAE,OAAO;GAAW;EAAO;CACzC,CAAC,GAEK,IAAQ,EAAM,MAAM,SAAS,CAAC,GAC9B,IAAU,EAAM,MAAM,SAAS,WAAW,IAE1C,IAAU,GAAiB,OACvB,MAAS;EAEf,AADA,EAAO,CAAC,GACR,EAAU,CAAC;CACb,GACC,CAAC,CAAC;CAEL,OACE,kBAAC,GAAD;EACE,OAAO,EAAE,+BAA+B,UAAU;EAClD,aAAa,EACX,kCACA,6EACF;EACA,SACE,kBAAC,UAAD;GACE,MAAK;GACL,eAAe,EAAW,eAAe;GACzC,WAAU;aAHZ,CAKE,kBAAC,GAAD,EAAM,WAAU,UAAW,CAAA,GAC1B,EAAE,6BAA6B,aAAa,CACvC;;YAdZ,CAkBE,kBAAC,OAAD;GAAK,WAAU;aAAf,CACE,kBAAC,UAAD;IACE,OAAO;IACP,WAAW,MAAM,EAAQ,CAAO,EAAE,EAAE,OAAO,KAA4B;IACvE,cAAY,EAAE,sCAAsC,gBAAgB;IACpE,WAAU;cAJZ,CAME,kBAAC,UAAD;KAAQ,OAAM;eAAI,EAAE,kCAAkC,WAAW;IAAU,CAAA,GACzE,OAAO,KAAK,CAAiB,EAAuB,KAAK,MACzD,kBAAC,UAAD;KAAgB,OAAO;eACpB,EAAkB;IACb,GAFK,CAEL,CACT,CACK;OACR,kBAAC,UAAD;IACE,OAAO;IACP,WAAW,MAAM,EAAQ,CAAS,EAAE,EAAE,OAAO,KAA8B;IAC3E,cAAY,EAAE,wCAAwC,kBAAkB;IACxE,WAAU;cAJZ,CAME,kBAAC,UAAD;KAAQ,OAAM;eAAI,EAAE,qCAAqC,cAAc;IAAU,CAAA,GAC/E,OAAO,KAAK,CAAmB,EAAyB,KAAK,MAC7D,kBAAC,UAAD;KAAgB,OAAO;eACpB,EAAoB;IACf,GAFK,CAEL,CACT,CACK;KACL;MAEL,kBAAC,GAAD;GACE,WAAW,EAAM;GACjB,SAAS,EAAM;GACf,SAAS,EAAM,WAAW;GAC1B,OAAO,EAAM;GACb,eAAe,KAAK,EAAM,QAAQ;GAClC,YAAY,EAAE,oCAAoC,iBAAiB;GACnE,kBAAkB,EAChB,0CACA,gFACF;GACA,WAAW,kBAAC,GAAD,EAAO,WAAU,YAAa,CAAA;GACzC,aACE,kBAAC,UAAD;IACE,MAAK;IACL,eAAe,EAAW,eAAe;IACzC,WAAU;cAET,EAAE,6BAA6B,aAAa;GACvC,CAAA;aAnBZ,CAsBE,kBAAC,OAAD;IAAK,WAAU;cACZ,EAAM,KAAK,MACV,kBAAC,GAAD;KAEE,MAAK;KACL,UAAU;KACV,eAAe,EAAW,aAAa,EAAQ,IAAI;KACnD,YAAY,MAAM;MAChB,CAAI,EAAE,QAAQ,WAAW,EAAE,QAAQ,SACjC,EAAE,eAAe,GACjB,EAAW,aAAa,EAAQ,IAAI;KAExC;KACA,WAAU;eAXZ;MAaE,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACE,kBAAC,OAAD;QAAK,WAAU;kBAAf,CACE,kBAAC,QAAD;SAAM,WAAU;0BACN;UACN,IAAM,IAAO,EAAU,EAAQ;UAC/B,OAAO,kBAAC,GAAD,EAAM,WAAU,UAAW,CAAA;SACpC,GAAG;QACC,CAAA,GACN,kBAAC,OAAD;SAAK,WAAU;mBAAf,CACE,kBAAC,MAAD;UAAI,WAAU;oBACX,EAAQ;SACP,CAAA,GACJ,kBAAC,KAAD;UAAG,WAAU;oBAA+C,EAAQ;SAAQ,CAAA,CACzE;UACF;WACL,kBAAC,GAAD,EAAa,QAAQ,EAAQ,OAAS,CAAA,CACnC;;MAEL,kBAAC,OAAD;OAAK,WAAU;iBAAf;QACE,kBAAC,QAAD;SAAM,WAAU;mBACb,EAAkB,EAAQ;QACvB,CAAA;QACN,kBAAC,QAAD,EAAA,UAAA,CAAM,KAAE,EAAQ,OAAc,EAAA,CAAA;QAC7B,EAAQ,UAAU,kBAAC,QAAD,EAAA,UAAA,CAAM,MAAG,EAAQ,MAAa,EAAA,CAAA;OAC9C;;MAEJ,EAAQ,eACP,kBAAC,KAAD;OAAG,WAAU;iBACV,EAAQ;MACR,CAAA;MAGJ,EAAQ,aAAa,SAAS,KAC7B,kBAAC,OAAD;OAAK,WAAU;iBAAf,CACG,EAAQ,aAAa,MAAM,GAAG,CAAC,EAAE,KAAK,MACrC,kBAAC,QAAD;QAEE,WAAU;kBAET;OACG,GAJC,CAID,CACP,GACA,EAAQ,aAAa,SAAS,KAC7B,kBAAC,QAAD;QAAM,WAAU;kBAAhB,CAA8C,KAC1C,EAAQ,aAAa,SAAS,CAC5B;SAEL;;MAGP,kBAAC,KAAD;OAAG,WAAU;iBAAb;QACG,EAAE,+BAA+B,SAAS;QAAG;QAC7C,EAAmB,EAAQ,SAAS;OACpC;;KACM;OAlEJ,EAAQ,EAkEJ,CACZ;GACE,CAAA,IAGH,IAAS,KAAK,MACd,kBAAC,OAAD;IAAK,WAAU;cAAf;KACE,kBAAC,UAAD;MACE,MAAK;MACL,UAAU,MAAW;MACrB,eAAe,GAAW,MAAM,KAAK,IAAI,GAAG,IAAI,CAAS,CAAC;MAC1D,WAAU;gBAJZ,CAME,kBAAC,GAAD,EAAa,WAAU,UAAW,CAAA,GACjC,EAAE,4BAA4B,UAAU,CACnC;;KACR,kBAAC,QAAD;MAAM,WAAU;gBAAhB;OACG,EAAE,+BAA+B,SAAS;OAAE;OAAE,IAAS;OAAE;OAAE,IAAS,EAAM;MACvE;;KACN,kBAAC,UAAD;MACE,MAAK;MACL,UAAU,CAAC;MACX,eAAe,GAAW,MAAM,IAAI,CAAS;MAC7C,WAAU;gBAJZ,CAMG,EAAE,4BAA4B,MAAM,GACrC,kBAAC,GAAD,EAAc,WAAU,UAAW,CAAA,CAC7B;;IACL;KAEE;IACD;;AAEhB"}
+{"version":3,"file":"AdaptersListPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/adapters/AdaptersListPage.tsx"],"sourcesContent":["/**\n * Adapters List Page\n * @module adaptercloud/pages/adapters\n *\n * The adapter catalog — every reusable connector definition in the workspace.\n * Lists from `adaListAdapters` with kind/status filters and offset pagination\n * (driven by `AdaPageInfo.hasMore`).\n */\n\nimport { useState, useCallback } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport {\n  Boxes,\n  Cloud,\n  Cpu,\n  Database,\n  HardDrive,\n  Network,\n  Plus,\n  Puzzle,\n  Radio,\n  ServerCog,\n  ChevronLeft,\n  ChevronRight,\n  type LucideIcon,\n} from 'lucide-react';\nimport { GlassCard } from '@burdenoff/fe-libs/ui';\nimport { PageLayout } from '../../components/PageLayout';\nimport { StatusBadge } from '../../components/StatusBadge';\nimport { DataState } from '../../components/DataState';\nimport { useAdapterCloud } from '../../context/AdapterCloudContext';\nimport { useAdapters } from '../../hooks/useAdapterCloudApi';\nimport { adapterKindLabels, adapterStatusLabels } from '../../utils/domain';\nimport { formatRelativeTime } from '../../utils/formatters';\nimport type { AdaAdapterKind, AdaAdapterStatus } from '../../types';\n\nconst PAGE_SIZE = 20;\n\n/** Per-kind glyph — mirrors the mock's vendor logo tile on each catalog card. */\nconst kindIcons: Record<AdaAdapterKind, LucideIcon> = {\n  PUBLIC_CLOUD: Cloud,\n  SAAS: Cloud,\n  PRIVATE_CLOUD: ServerCog,\n  ON_PREM: HardDrive,\n  EDGE: Radio,\n  IOT: Cpu,\n  KUBERNETES: Boxes,\n  NETWORK: Network,\n  DATA_SYSTEM: Database,\n  CUSTOM: Puzzle,\n};\n\nexport function AdaptersListPage() {\n  const { navigateTo } = useAdapterCloud();\n  const { t: translate } = useI18n();\n  const t = useCallback(\n    (key: string, fallback: string): string => {\n      const value = translate(key);\n      return value === key ? fallback : value;\n    },\n    [translate]\n  );\n\n  const [kind, setKind] = useState<AdaAdapterKind | ''>('');\n  const [status, setStatus] = useState<AdaAdapterStatus | ''>('');\n  const [offset, setOffset] = useState(0);\n\n  const query = useAdapters({\n    kind: kind || undefined,\n    status: status || undefined,\n    pagination: { limit: PAGE_SIZE, offset },\n  });\n\n  const items = query.data?.items ?? [];\n  const hasMore = query.data?.pageInfo.hasMore ?? false;\n  // Estate-wide total for the current filter. Nullable on older deployed\n  // schemas — the footer then falls back to the bare offset range.\n  const totalCount = query.data?.pageInfo.totalCount;\n\n  const resetTo = useCallback(<T,>(setter: (v: T) => void) => {\n    return (v: T) => {\n      setter(v);\n      setOffset(0);\n    };\n  }, []);\n\n  return (\n    <PageLayout\n      title={t('adaptercloud.adapters.title', 'Adapters')}\n      description={t(\n        'adaptercloud.adapters.subtitle',\n        'The catalog of connectors that bridge each class of system into the fabric.'\n      )}\n      actions={\n        <button\n          type=\"button\"\n          onClick={() => navigateTo('/adapters/new')}\n          className=\"inline-flex items-center gap-2 rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:opacity-90\"\n        >\n          <Plus className=\"h-4 w-4\" />\n          {t('adaptercloud.adapters.new', 'New adapter')}\n        </button>\n      }\n    >\n      {/* Filters */}\n      <div className=\"mb-6 flex flex-wrap gap-3\">\n        <select\n          value={kind}\n          onChange={(e) => resetTo(setKind)(e.target.value as AdaAdapterKind | '')}\n          aria-label={t('adaptercloud.adapters.filterByKind', 'Filter by kind')}\n          className=\"rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n        >\n          <option value=\"\">{t('adaptercloud.adapters.allKinds', 'All kinds')}</option>\n          {(Object.keys(adapterKindLabels) as AdaAdapterKind[]).map((k) => (\n            <option key={k} value={k}>\n              {adapterKindLabels[k]}\n            </option>\n          ))}\n        </select>\n        <select\n          value={status}\n          onChange={(e) => resetTo(setStatus)(e.target.value as AdaAdapterStatus | '')}\n          aria-label={t('adaptercloud.adapters.filterByStatus', 'Filter by status')}\n          className=\"rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n        >\n          <option value=\"\">{t('adaptercloud.adapters.allStatuses', 'All statuses')}</option>\n          {(Object.keys(adapterStatusLabels) as AdaAdapterStatus[]).map((s) => (\n            <option key={s} value={s}>\n              {adapterStatusLabels[s]}\n            </option>\n          ))}\n        </select>\n      </div>\n\n      <DataState\n        isLoading={query.isLoading}\n        isError={query.isError}\n        isEmpty={items.length === 0}\n        error={query.error}\n        onRetry={() => void query.refetch()}\n        emptyTitle={t('adaptercloud.adapters.emptyTitle', 'No adapters yet')}\n        emptyDescription={t(\n          'adaptercloud.adapters.emptyDescription',\n          'Define your first adapter to start bridging a class of system into the fabric.'\n        )}\n        emptyIcon={<Boxes className=\"h-10 w-10\" />}\n        emptyAction={\n          <button\n            type=\"button\"\n            onClick={() => navigateTo('/adapters/new')}\n            className=\"rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:opacity-90\"\n          >\n            {t('adaptercloud.adapters.new', 'New adapter')}\n          </button>\n        }\n      >\n        <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n          {items.map((adapter) => (\n            <GlassCard\n              key={adapter.id}\n              role=\"button\"\n              tabIndex={0}\n              onClick={() => navigateTo(`/adapters/${adapter.id}`)}\n              onKeyDown={(e) => {\n                if (e.key === 'Enter' || e.key === ' ') {\n                  e.preventDefault();\n                  navigateTo(`/adapters/${adapter.id}`);\n                }\n              }}\n              className=\"cursor-pointer p-5 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-[var(--color-focus-ring)]\"\n            >\n              <div className=\"flex items-start justify-between gap-2\">\n                <div className=\"flex min-w-0 items-center gap-3\">\n                  <span className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-accent-blue-subtle text-accent-blue\">\n                    {(() => {\n                      const Icon = kindIcons[adapter.kind];\n                      return <Icon className=\"h-5 w-5\" />;\n                    })()}\n                  </span>\n                  <div className=\"min-w-0\">\n                    <h3 className=\"truncate text-base font-semibold text-text-primary\">\n                      {adapter.name}\n                    </h3>\n                    <p className=\"mt-0.5 truncate text-xs text-text-secondary\">{adapter.slug}</p>\n                  </div>\n                </div>\n                <StatusBadge status={adapter.status} />\n              </div>\n\n              <div className=\"mt-3 flex flex-wrap items-center gap-2 text-xs text-text-secondary\">\n                <span className=\"inline-flex items-center rounded-full bg-bg-sunken px-2 py-0.5\">\n                  {adapterKindLabels[adapter.kind]}\n                </span>\n                <span>v{adapter.version}</span>\n                {adapter.vendor && <span>· {adapter.vendor}</span>}\n              </div>\n\n              {adapter.description && (\n                <p className=\"mt-3 line-clamp-2 text-sm text-text-secondary\">\n                  {adapter.description}\n                </p>\n              )}\n\n              {adapter.capabilities.length > 0 && (\n                <div className=\"mt-3 flex flex-wrap gap-1.5\">\n                  {adapter.capabilities.slice(0, 4).map((cap) => (\n                    <span\n                      key={cap}\n                      className=\"inline-flex items-center rounded-full bg-accent-blue-subtle px-2 py-0.5 text-xs text-accent-blue\"\n                    >\n                      {cap}\n                    </span>\n                  ))}\n                  {adapter.capabilities.length > 4 && (\n                    <span className=\"text-xs text-text-secondary\">\n                      +{adapter.capabilities.length - 4}\n                    </span>\n                  )}\n                </div>\n              )}\n\n              <p className=\"mt-4 text-xs text-text-secondary\">\n                {t('adaptercloud.common.updated', 'Updated')}{' '}\n                {formatRelativeTime(adapter.updatedAt)}\n              </p>\n            </GlassCard>\n          ))}\n        </div>\n\n        {/* Pagination */}\n        {(offset > 0 || hasMore) && (\n          <div className=\"mt-6 flex items-center justify-between\">\n            <button\n              type=\"button\"\n              disabled={offset === 0}\n              onClick={() => setOffset((o) => Math.max(0, o - PAGE_SIZE))}\n              className=\"inline-flex items-center gap-1 rounded-lg border border-border-subtle px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-accent disabled:cursor-not-allowed disabled:opacity-50\"\n            >\n              <ChevronLeft className=\"h-4 w-4\" />\n              {t('adaptercloud.common.prev', 'Previous')}\n            </button>\n            <span className=\"text-sm tabular-nums text-text-secondary\">\n              {t('adaptercloud.common.showing', 'Showing')} {offset + 1}–{offset + items.length}\n              {totalCount != null && ` ${t('adaptercloud.common.of', 'of')} ${totalCount}`}\n            </span>\n            <button\n              type=\"button\"\n              disabled={!hasMore}\n              onClick={() => setOffset((o) => o + PAGE_SIZE)}\n              className=\"inline-flex items-center gap-1 rounded-lg border border-border-subtle px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-accent disabled:cursor-not-allowed disabled:opacity-50\"\n            >\n              {t('adaptercloud.common.next', 'Next')}\n              <ChevronRight className=\"h-4 w-4\" />\n            </button>\n          </div>\n        )}\n      </DataState>\n    </PageLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/adaptercloud/pages/connections/ConnectionDetailPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConnectionDetailPage.d.ts","sourceRoot":"","sources":["../../../../src/adaptercloud/pages/connections/ConnectionDetailPage.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAqCH,wBAAgB,oBAAoB,gCA2VnC"}
+{"version":3,"file":"ConnectionDetailPage.d.ts","sourceRoot":"","sources":["../../../../src/adaptercloud/pages/connections/ConnectionDetailPage.tsx"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AA+CH,wBAAgB,oBAAoB,gCAkenC"}

package/dist/adaptercloud/pages/connections/ConnectionDetailPage.js

@@ -1,14 +1,14 @@
 import { useAdapterCloud as e } from "../../context/AdapterCloudContext.js";
 import { PageLayout as t } from "../../components/PageLayout.js";
-import { authMethodLabels as n, connectionStatusLabels as r, formatMoney as i, resourceStateLabels as a, syncKindLabels as o } from "../../utils/domain.js";
-import { StatusBadge as s } from "../../components/StatusBadge.js";
-import { DataState as c } from "../../components/DataState.js";
-import { useConnection as l, useDisableConnection as u, useSetConnectionStatus as d, useStartSyncRun as f } from "../../hooks/useAdapterCloudApi.js";
-import { formatDate as p } from "../../utils/formatters.js";
-import { ConfirmDialog as m } from "../../components/ConfirmDialog.js";
-import { canStartConnectionSync as h, canStartConnectionSyncKind as g, isConnectionSyncKindExecutable as _ } from "./connectionSync.js";
-import { useCallback as v, useState as y } from "react";
-import { useI18n as b } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { authMethodLabels as n, connectionStatusLabels as r, formatMoney as i, resourceStateLabels as a, syncKindLabels as o, syncStatusLabels as s } from "../../utils/domain.js";
+import { StatusBadge as c } from "../../components/StatusBadge.js";
+import { DataState as l } from "../../components/DataState.js";
+import { useConnection as u, useDisableConnection as ee, useSetConnectionStatus as d, useStartSyncRun as f, useSyncRuns as te } from "../../hooks/useAdapterCloudApi.js";
+import { formatDate as p, formatRelativeTime as m } from "../../utils/formatters.js";
+import { ConfirmDialog as h } from "../../components/ConfirmDialog.js";
+import { canStartConnectionSync as g, canStartConnectionSyncKind as _, isConnectionSyncKindExecutable as v } from "./connectionSync.js";
+import { useCallback as y, useState as b } from "react";
+import { useI18n as ne } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
 import { ArrowLeft as x, Ban as S, Loader2 as C, Pencil as w, Play as T, RefreshCw as E, Server as D } from "lucide-react";
 import { useParams as O } from "react-router";
 import { jsx as k, jsxs as A } from "react/jsx-runtime";
@@ -24,89 +24,98 @@ var M = [
 	"RECONCILE",
 	"COST_INGEST",
 	"FULL"
-];
-function P() {
-	let { id: P } = O(), { navigateTo: F } = e(), { t: I } = b(), L = v((e, t) => {
-		let n = I(e);
+], P = 5;
+function F(e) {
+	return e === "QUEUED" || e === "RUNNING";
+}
+function I() {
+	let { id: I } = O(), { navigateTo: L } = e(), { t: R } = ne(), z = y((e, t) => {
+		let n = R(e);
 		return n === e ? t : n;
-	}, [I]), R = l(P), z = d(), B = u(), V = f(), H = R.data, U = H ? h(H.status) : !1, [W, G] = y(null), [K, q] = y(null), [J, Y] = y(!1), X = v((e) => q(e instanceof Error ? e.message : "Action failed. Please try again."), []), Z = v((e) => {
-		P && (q(null), z.mutate({
-			id: P,
+	}, [R]), B = u(I), V = d(), H = ee(), U = f(), W = B.data, G = W ? g(W.status) : !1, K = te({
+		connectionId: I,
+		pagination: {
+			limit: P,
+			offset: 0
+		}
+	}, { enabled: !!I }), q = K.data?.items ?? [], [J, Y] = b(null), [X, Z] = b(null), [re, Q] = b(!1), $ = y((e) => Z(e instanceof Error ? e.message : "Action failed. Please try again."), []), ie = y((e) => {
+		I && (Z(null), V.mutate({
+			id: I,
 			status: e
-		}, { onError: X }));
+		}, { onError: $ }));
 	}, [
-		P,
-		z,
-		X
-	]), Q = v(() => {
-		P && (q(null), B.mutate(P, {
-			onSuccess: () => Y(!1),
-			onError: X
+		I,
+		V,
+		$
+	]), ae = y(() => {
+		I && (Z(null), H.mutate(I, {
+			onSuccess: () => Q(!1),
+			onError: $
 		}));
 	}, [
-		P,
-		B,
-		X
-	]), $ = v((e) => {
-		!P || !H || !g(H.status, e) || (q(null), G(e), V.mutate({
-			connectionId: P,
+		I,
+		H,
+		$
+	]), oe = y((e) => {
+		!I || !W || !_(W.status, e) || (Z(null), Y(e), U.mutate({
+			connectionId: I,
 			kind: e
 		}, {
 			onSuccess: () => {
-				G(null), F("/sync-runs");
+				Y(null), L("/sync-runs");
 			},
 			onError: (e) => {
-				G(null), X(e);
+				Y(null), $(e);
 			}
 		}));
 	}, [
-		P,
-		H,
-		V,
-		F,
-		X
+		I,
+		W,
+		U,
+		L,
+		$
 	]);
 	return /* @__PURE__ */ A(t, {
-		title: H?.name ?? L("adaptercloud.connections.detailTitle", "Connection"),
-		description: H?.adapter?.name,
+		title: W?.name ?? z("adaptercloud.connections.detailTitle", "Connection"),
+		description: W?.adapter?.name,
 		actions: /* @__PURE__ */ A("div", {
 			className: "flex items-center gap-2",
 			children: [/* @__PURE__ */ A("button", {
 				type: "button",
-				onClick: () => F("/connections"),
+				onClick: () => L("/connections"),
 				className: "inline-flex items-center gap-2 rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-accent",
-				children: [/* @__PURE__ */ k(x, { className: "h-4 w-4" }), L("adaptercloud.common.back", "Back")]
-			}), H && /* @__PURE__ */ A("button", {
+				children: [/* @__PURE__ */ k(x, { className: "h-4 w-4" }), z("adaptercloud.common.back", "Back")]
+			}), W && /* @__PURE__ */ A("button", {
 				type: "button",
-				onClick: () => F(`/connections/${H.id}/edit`),
+				onClick: () => L(`/connections/${W.id}/edit`),
 				className: "inline-flex items-center gap-2 rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-accent",
-				children: [/* @__PURE__ */ k(w, { className: "h-4 w-4" }), L("adaptercloud.common.edit", "Edit")]
+				children: [/* @__PURE__ */ k(w, { className: "h-4 w-4" }), z("adaptercloud.common.edit", "Edit")]
 			})]
 		}),
-		children: [/* @__PURE__ */ k(c, {
-			isLoading: R.isLoading,
-			isError: R.isError,
-			isEmpty: !R.isLoading && !H,
-			error: R.error,
-			onRetry: () => void R.refetch(),
-			emptyTitle: L("adaptercloud.connections.notFound", "Connection not found"),
-			children: H && /* @__PURE__ */ A("div", {
+		children: [/* @__PURE__ */ k(l, {
+			isLoading: B.isLoading,
+			isError: B.isError,
+			isEmpty: !B.isLoading && !W,
+			error: B.error,
+			onRetry: () => void B.refetch(),
+			emptyTitle: z("adaptercloud.connections.notFound", "Connection not found"),
+			children: W && /* @__PURE__ */ A("div", {
 				className: "space-y-6",
 				children: [
-					K && /* @__PURE__ */ k("p", {
+					X && /* @__PURE__ */ k("p", {
 						role: "alert",
 						"aria-live": "polite",
 						className: "rounded-lg bg-status-error-bg-subtle px-3 py-2 text-sm text-status-error-text",
-						children: K
+						children: X
 					}),
 					/* @__PURE__ */ A(j, {
 						className: "p-6",
 						children: [
 							/* @__PURE__ */ A("div", {
 								className: "mb-4 flex flex-wrap items-center gap-3",
-								children: [/* @__PURE__ */ k(s, { status: H.status }), /* @__PURE__ */ k("span", {
+								children: [/* @__PURE__ */ k(c, { status: W.status }), /* @__PURE__ */ k("span", {
 									className: "inline-flex items-center rounded-full bg-bg-sunken px-2.5 py-0.5 text-xs font-medium text-text-secondary",
-									children: n[H.authMethod]
+									children: n[W.authMethod]
 								})]
 							}),
 							/* @__PURE__ */ A("dl", {
@@ -114,57 +123,98 @@ function P() {
 								children: [
 									/* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("dt", {
 										className: "text-text-secondary",
-										children: L("adaptercloud.connections.region", "Region")
+										children: z("adaptercloud.connections.adapter", "Adapter")
 									}), /* @__PURE__ */ k("dd", {
 										className: "mt-0.5 font-medium text-text-primary",
-										children: H.region ?? "—"
+										children: W.adapter ? /* @__PURE__ */ A("button", {
+											type: "button",
+											onClick: () => L(`/adapters/${W.adapterId}`),
+											className: "max-w-full truncate text-left text-accent-blue hover:underline",
+											children: [W.adapter.name, W.adapter.version ? ` v${W.adapter.version}` : ""]
+										}) : "—"
 									})] }),
 									/* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("dt", {
 										className: "text-text-secondary",
-										children: L("adaptercloud.connections.environment", "Environment")
+										children: z("adaptercloud.connections.region", "Region")
 									}), /* @__PURE__ */ k("dd", {
 										className: "mt-0.5 font-medium text-text-primary",
-										children: H.environment ?? "—"
+										children: W.region ?? "—"
 									})] }),
 									/* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("dt", {
 										className: "text-text-secondary",
-										children: L("adaptercloud.connections.resourceCount", "Resources")
+										children: z("adaptercloud.connections.environment", "Environment")
+									}), /* @__PURE__ */ k("dd", {
+										className: "mt-0.5 font-medium text-text-primary",
+										children: W.environment ?? "—"
+									})] }),
+									/* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("dt", {
+										className: "text-text-secondary",
+										children: z("adaptercloud.connections.resourceCount", "Resources")
 									}), /* @__PURE__ */ k("dd", {
 										className: "mt-0.5 font-medium tabular-nums text-text-primary",
-										children: H.resourceCount
+										children: W.resourceCount
 									})] }),
 									/* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("dt", {
 										className: "text-text-secondary",
-										children: L("adaptercloud.connections.lastSynced", "Last synced")
+										children: z("adaptercloud.connections.lastSynced", "Last synced")
 									}), /* @__PURE__ */ k("dd", {
 										className: "mt-0.5 font-medium text-text-primary",
-										children: H.lastSyncedAt ? p(H.lastSyncedAt) : "—"
+										children: W.lastSyncedAt ? p(W.lastSyncedAt) : "—"
 									})] })
 								]
 							}),
-							H.lastError && /* @__PURE__ */ k("p", {
+							(W.targetRef || W.secretRef) && /* @__PURE__ */ A("dl", {
+								className: "mt-4 space-y-3 border-t border-border-subtle pt-4 text-sm",
+								children: [W.targetRef && /* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("dt", {
+									className: "text-text-secondary",
+									children: z("adaptercloud.connections.targetRef", "Target ref")
+								}), /* @__PURE__ */ k("dd", {
+									className: "mt-1 break-all rounded-lg bg-bg-sunken px-3 py-1.5 font-mono text-xs text-text-primary",
+									children: W.targetRef
+								})] }), W.secretRef && /* @__PURE__ */ A("div", { children: [/* @__PURE__ */ k("dt", {
+									className: "text-text-secondary",
+									children: z("adaptercloud.connections.secretRef", "Secret ref")
+								}), /* @__PURE__ */ k("dd", {
+									className: "mt-1 break-all rounded-lg bg-bg-sunken px-3 py-1.5 font-mono text-xs text-text-primary",
+									children: W.secretRef
+								})] })]
+							}),
+							W.tags.length > 0 && /* @__PURE__ */ A("div", {
+								className: "mt-4",
+								children: [/* @__PURE__ */ k("h3", {
+									className: "mb-2 text-sm font-semibold text-text-primary",
+									children: z("adaptercloud.common.tags", "Tags")
+								}), /* @__PURE__ */ k("div", {
+									className: "flex flex-wrap gap-1.5",
+									children: W.tags.map((e) => /* @__PURE__ */ k("span", {
+										className: "inline-flex items-center rounded-full bg-bg-sunken px-2.5 py-0.5 text-xs text-text-secondary",
+										children: e
+									}, e))
+								})]
+							}),
+							W.lastError && /* @__PURE__ */ k("p", {
 								className: "mt-4 rounded-lg bg-status-error-bg-subtle px-3 py-2 text-sm text-status-error-text",
-								children: H.lastError
+								children: W.lastError
 							}),
 							/* @__PURE__ */ A("div", {
 								className: "mt-5 border-t border-border-subtle pt-5",
 								children: [/* @__PURE__ */ k("h3", {
 									className: "mb-3 text-sm font-semibold text-text-primary",
-									children: L("adaptercloud.connections.setHealth", "Set health")
+									children: z("adaptercloud.connections.setHealth", "Set health")
 								}), /* @__PURE__ */ A("div", {
 									className: "flex flex-wrap gap-2",
 									children: [M.map((e) => /* @__PURE__ */ k("button", {
 										type: "button",
-										disabled: z.isPending || H.status === e,
-										onClick: () => Z(e),
+										disabled: V.isPending || W.status === e,
+										onClick: () => ie(e),
 										className: "rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium text-text-primary transition-colors hover:bg-accent disabled:cursor-not-allowed disabled:opacity-40",
 										children: r[e]
-									}, e)), H.status !== "DISABLED" && /* @__PURE__ */ A("button", {
+									}, e)), W.status !== "DISABLED" && /* @__PURE__ */ A("button", {
 										type: "button",
-										disabled: B.isPending,
-										onClick: () => Y(!0),
+										disabled: H.isPending,
+										onClick: () => Q(!0),
 										className: "inline-flex items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium text-status-error-text transition-colors hover:bg-status-error-bg-subtle disabled:opacity-40",
-										children: [/* @__PURE__ */ k(S, { className: "h-3.5 w-3.5" }), L("adaptercloud.connections.disable", "Disable")]
+										children: [/* @__PURE__ */ k(S, { className: "h-3.5 w-3.5" }), z("adaptercloud.connections.disable", "Disable")]
 									})]
 								})]
 							}),
@@ -173,35 +223,35 @@ function P() {
 								children: [
 									/* @__PURE__ */ A("h3", {
 										className: "mb-3 flex items-center gap-2 text-sm font-semibold text-text-primary",
-										children: [/* @__PURE__ */ k(E, { className: "h-4 w-4" }), L("adaptercloud.connections.startSync", "Start a sync run")]
+										children: [/* @__PURE__ */ k(E, { className: "h-4 w-4" }), z("adaptercloud.connections.startSync", "Start a sync run")]
 									}),
-									!U && /* @__PURE__ */ k("p", {
+									!G && /* @__PURE__ */ k("p", {
 										id: "disabled-connection-sync-help",
 										className: "mb-3 text-sm text-text-secondary",
-										children: L("adaptercloud.connections.disabledSyncHelp", "Sync runs are unavailable while this connection is disabled. Set its health to re-enable sync.")
+										children: z("adaptercloud.connections.disabledSyncHelp", "Sync runs are unavailable while this connection is disabled. Set its health to re-enable sync.")
 									}),
 									/* @__PURE__ */ k("p", {
 										id: "unsupported-sync-kind-help",
 										className: "mb-3 text-sm text-text-secondary",
-										children: L("adaptercloud.connections.syncModeAvailabilityHelp", "Discovery is executable today. Reconcile, Cost Ingest, and Full need distinct backend workers and are not available yet.")
+										children: z("adaptercloud.connections.syncModeAvailabilityHelp", "Discovery is executable today. Reconcile, Cost Ingest, and Full need distinct backend workers and are not available yet.")
 									}),
 									/* @__PURE__ */ k("div", {
 										className: "flex flex-wrap gap-2",
 										children: N.map((e) => {
-											let t = V.isPending && W === e, n = _(e);
+											let t = U.isPending && J === e, n = v(e);
 											return /* @__PURE__ */ A("button", {
 												type: "button",
-												disabled: V.isPending || !U || !n,
-												"aria-describedby": n ? U ? void 0 : "disabled-connection-sync-help" : "unsupported-sync-kind-help",
-												title: n ? U ? void 0 : L("adaptercloud.connections.disabledSyncTooltip", "Re-enable this connection before starting a sync run.") : L("adaptercloud.connections.unsupportedSyncModeTooltip", "This sync mode is not available yet because it needs a distinct backend worker."),
-												onClick: () => $(e),
+												disabled: U.isPending || !G || !n,
+												"aria-describedby": n ? G ? void 0 : "disabled-connection-sync-help" : "unsupported-sync-kind-help",
+												title: n ? G ? void 0 : z("adaptercloud.connections.disabledSyncTooltip", "Re-enable this connection before starting a sync run.") : z("adaptercloud.connections.unsupportedSyncModeTooltip", "This sync mode is not available yet because it needs a distinct backend worker."),
+												onClick: () => oe(e),
 												className: "inline-flex items-center gap-2 rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-sm font-medium text-text-primary transition-colors hover:bg-accent disabled:cursor-not-allowed disabled:opacity-50",
 												children: [
 													t ? /* @__PURE__ */ k(C, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ k(T, { className: "h-4 w-4" }),
 													o[e],
 													!n && /* @__PURE__ */ k("span", {
 														className: "rounded bg-bg-sunken px-1.5 py-0.5 text-[10px] font-normal text-text-secondary",
-														children: L("adaptercloud.connections.notAvailable", "Not available")
+														children: z("adaptercloud.connections.notAvailable", "Not available")
 													})
 												]
 											}, e);
@@ -211,32 +261,95 @@ function P() {
 							})
 						]
 					}),
-					H.config != null && /* @__PURE__ */ A(j, {
+					/* @__PURE__ */ A("section", { children: [/* @__PURE__ */ A("div", {
+						className: "mb-3 flex items-center justify-between",
+						children: [/* @__PURE__ */ k("h3", {
+							className: "text-base font-semibold text-text-primary",
+							children: z("adaptercloud.connections.recentRuns", "Recent Sync Runs")
+						}), /* @__PURE__ */ k("button", {
+							type: "button",
+							onClick: () => L(`/sync-runs?connectionId=${W.id}`),
+							className: "text-sm font-medium text-accent-blue hover:underline",
+							children: z("adaptercloud.common.viewAll", "View all")
+						})]
+					}), /* @__PURE__ */ k(l, {
+						isLoading: K.isLoading,
+						isError: K.isError,
+						isEmpty: q.length === 0,
+						error: K.error,
+						onRetry: () => void K.refetch(),
+						emptyTitle: z("adaptercloud.connections.noRuns", "No sync runs yet"),
+						emptyDescription: z("adaptercloud.connections.noRunsDescription", "Start a sync run above to keep this connection’s inventory current."),
+						emptyIcon: /* @__PURE__ */ k(E, { className: "h-10 w-10" }),
+						children: /* @__PURE__ */ k("div", {
+							className: "divide-y divide-border rounded-xl border border-border-subtle bg-bg-surface",
+							children: q.map((e) => /* @__PURE__ */ A("div", {
+								className: "flex flex-wrap items-center gap-x-4 gap-y-2 px-4 py-3",
+								children: [
+									/* @__PURE__ */ k("span", {
+										className: "min-w-24 text-sm font-medium text-text-primary",
+										children: o[e.kind]
+									}),
+									/* @__PURE__ */ k(c, {
+										status: e.status,
+										label: s[e.status]
+									}),
+									/* @__PURE__ */ A("span", {
+										className: "text-xs text-text-secondary",
+										children: [
+											z("adaptercloud.syncRuns.discovered", "Discovered"),
+											" ",
+											/* @__PURE__ */ k("span", {
+												className: "tabular-nums text-text-primary",
+												children: F(e.status) ? "—" : e.discoveredCount
+											})
+										]
+									}),
+									/* @__PURE__ */ A("span", {
+										className: "text-xs text-text-secondary",
+										children: [
+											z("adaptercloud.syncRuns.drift", "Drift"),
+											" ",
+											/* @__PURE__ */ k("span", {
+												className: "tabular-nums text-text-primary",
+												children: F(e.status) ? "—" : e.driftCount
+											})
+										]
+									}),
+									/* @__PURE__ */ k("span", {
+										className: "ml-auto text-xs text-text-secondary",
+										children: e.finishedAt ? m(e.finishedAt) : z("adaptercloud.syncRuns.notFinished", "Not finished")
+									})
+								]
+							}, e.id))
+						})
+					})] }),
+					W.config != null && /* @__PURE__ */ A(j, {
 						className: "p-6",
 						children: [/* @__PURE__ */ k("h3", {
 							className: "mb-3 text-sm font-semibold text-text-primary",
-							children: L("adaptercloud.connections.config", "Configuration")
+							children: z("adaptercloud.connections.config", "Configuration")
 						}), /* @__PURE__ */ k("pre", {
 							className: "overflow-auto rounded-lg bg-bg-sunken p-4 text-xs text-text-secondary",
-							children: JSON.stringify(H.config, null, 2)
+							children: JSON.stringify(W.config, null, 2)
 						})]
 					}),
 					/* @__PURE__ */ A("section", { children: [/* @__PURE__ */ A("div", {
 						className: "mb-3 flex items-center justify-between",
 						children: [/* @__PURE__ */ k("h3", {
 							className: "text-base font-semibold text-text-primary",
-							children: L("adaptercloud.connections.discoveredResources", "Discovered Resources")
+							children: z("adaptercloud.connections.discoveredResources", "Discovered Resources")
 						}), /* @__PURE__ */ k("button", {
 							type: "button",
-							onClick: () => F(`/resources?connectionId=${H.id}`),
+							onClick: () => L(`/resources?connectionId=${W.id}`),
 							className: "text-sm font-medium text-accent-blue hover:underline",
-							children: L("adaptercloud.common.viewAll", "View all")
+							children: z("adaptercloud.common.viewAll", "View all")
 						})]
-					}), H.resources && H.resources.length > 0 ? /* @__PURE__ */ k("div", {
+					}), W.resources && W.resources.length > 0 ? /* @__PURE__ */ k("div", {
 						className: "divide-y divide-border rounded-xl border border-border-subtle bg-bg-surface",
-						children: H.resources.slice(0, 10).map((e) => /* @__PURE__ */ A("button", {
+						children: W.resources.slice(0, 10).map((e) => /* @__PURE__ */ A("button", {
 							type: "button",
-							onClick: () => F(`/resources/${e.id}`),
+							onClick: () => L(`/resources/${e.id}`),
 							className: "flex w-full items-center gap-3 px-4 py-3 text-left transition-colors hover:bg-accent/50",
 							children: [
 								/* @__PURE__ */ k(D, { className: "h-4 w-4 shrink-0 text-text-secondary" }),
@@ -254,7 +367,7 @@ function P() {
 									className: "hidden text-xs text-text-secondary sm:inline",
 									children: i(e.monthlyCost)
 								}),
-								/* @__PURE__ */ k(s, {
+								/* @__PURE__ */ k(c, {
 									status: e.state,
 									label: a[e.state]
 								})
@@ -262,24 +375,24 @@ function P() {
 						}, e.id))
 					}) : /* @__PURE__ */ k("p", {
 						className: "rounded-xl border border-border-subtle bg-bg-surface px-4 py-6 text-center text-sm text-text-secondary",
-						children: L("adaptercloud.connections.noResources", "No resources discovered yet. Start a discovery sync run.")
+						children: z("adaptercloud.connections.noResources", "No resources discovered yet. Start a discovery sync run.")
 					})] })
 				]
 			})
-		}), /* @__PURE__ */ k(m, {
-			open: J,
-			onOpenChange: Y,
-			title: L("adaptercloud.connections.disableTitle", "Disable this connection?"),
-			description: L("adaptercloud.connections.disablePrompt", "Disabling stops discovery and sync runs against this target. You can re-enable it later by setting its health."),
-			confirmLabel: L("adaptercloud.connections.disable", "Disable"),
-			cancelLabel: L("adaptercloud.common.cancel", "Cancel"),
-			onConfirm: Q,
-			isPending: B.isPending,
+		}), /* @__PURE__ */ k(h, {
+			open: re,
+			onOpenChange: Q,
+			title: z("adaptercloud.connections.disableTitle", "Disable this connection?"),
+			description: z("adaptercloud.connections.disablePrompt", "Disabling stops discovery and sync runs against this target. You can re-enable it later by setting its health."),
+			confirmLabel: z("adaptercloud.connections.disable", "Disable"),
+			cancelLabel: z("adaptercloud.common.cancel", "Cancel"),
+			onConfirm: ae,
+			isPending: H.isPending,
 			tone: "danger"
 		})]
 	});
 }
 //#endregion
-export { P as ConnectionDetailPage };
+export { I as ConnectionDetailPage };
 
 //# sourceMappingURL=ConnectionDetailPage.js.map