npm - @burdenoff/microfe-adaptercloud - Versions diffs - 2026.825.4 → 2026.827.1 - Mend

@burdenoff/microfe-adaptercloud 2026.825.4 → 2026.827.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (48) hide show

package/dist/adaptercloud/pages/connections/ConnectionsListPage.js CHANGED Viewed

@@ -37,7 +37,7 @@ function N() {
 	}), L = o({
 		status: "PUBLISHED",
 		pagination: { limit: 100 }
-	}).data?.items ?? [], R = u(() => I.data?.items ?? [], [I.data?.items]), z = I.data?.pageInfo.hasMore ?? !1, B = u(() => {
+	}).data?.items ?? [], R = u(() => I.data?.items ?? [], [I.data?.items]), z = I.data?.pageInfo.hasMore ?? !1, B = I.data?.pageInfo.totalCount, V = u(() => {
 		let e = T.trim().toLowerCase();
 		return e ? R.filter((t) => t.name.toLowerCase().includes(e) || (t.region?.toLowerCase().includes(e) ?? !1) || (t.environment?.toLowerCase().includes(e) ?? !1)) : R;
 	}, [R, T]);
@@ -113,12 +113,12 @@ function 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",
 				children: v("adaptercloud.connections.new", "New connection")
 			}),
-			children: [B.length === 0 ? /* @__PURE__ */ O("p", {
+			children: [V.length === 0 ? /* @__PURE__ */ O("p", {
 				className: "rounded-xl border border-border-subtle bg-bg-surface px-4 py-10 text-center text-sm text-text-secondary",
 				children: v("adaptercloud.connections.noSearchMatch", "No connections match your search.")
 			}) : /* @__PURE__ */ O("div", {
 				className: "grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3",
-				children: B.map((e) => /* @__PURE__ */ k(A, {
+				children: V.map((e) => /* @__PURE__ */ k(A, {
 					role: "button",
 					tabIndex: 0,
 					onClick: () => p(`/connections/${e.id}`),
@@ -205,13 +205,14 @@ function N() {
 						children: [/* @__PURE__ */ O(h, { className: "h-4 w-4" }), v("adaptercloud.common.prev", "Previous")]
 					}),
 					/* @__PURE__ */ k("span", {
-						className: "text-sm text-text-secondary",
+						className: "text-sm tabular-nums text-text-secondary",
 						children: [
 							v("adaptercloud.common.showing", "Showing"),
 							" ",
 							P + 1,
 							"–",
-							P + R.length
+							P + R.length,
+							B != null && ` ${v("adaptercloud.common.of", "of")} ${B}`
 						]
 					}),
 					/* @__PURE__ */ k("button", {

package/dist/adaptercloud/pages/connections/ConnectionsListPage.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ConnectionsListPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/connections/ConnectionsListPage.tsx"],"sourcesContent":["/*\n Connections List Page\n * @module adaptercloud/pages/connections\n \n Every configured, authenticated target in the workspace. Lists from\n * `adaListConnections` with an adapter + status filter, a client-side search,\n * and offset pagination. Each card carries a per-adapter-kind glyph tile so the\n * fabric's reach reads at a glance (mirrors the aws/azure/gke/snowflake logos in\n * the mock).\n /\n\nimport { useState, useCallback, useMemo } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport {\n Cable,\n Plus,\n ChevronLeft,\n ChevronRight,\n MapPin,\n Server,\n Search,\n Cloud,\n Radio,\n Cpu,\n Boxes,\n Network,\n Database,\n HardDrive,\n Puzzle,\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 { useConnections, useAdapters } from '../../hooks/useAdapterCloudApi';\nimport { authMethodLabels, connectionStatusLabels } from '../../utils/domain';\nimport { formatRelativeTime } from '../../utils/formatters';\nimport type { AdaAdapterKind, AdaConnectionStatus } from '../../types';\n\nconst PAGE_SIZE = 20;\n\n/\n Per-adapter-kind glyph — stands in for the vendor logos (aws / azure / gke /\n * snowflake) in the mock. Keyed off the connection's bound adapter kind; every\n * `AdaAdapterKind` maps to one of the eight allowed lucide marks.\n */\nconst adapterKindIcon: Record<AdaAdapterKind, LucideIcon> = {\n PUBLIC_CLOUD: Cloud,\n PRIVATE_CLOUD: Cloud,\n SAAS: Cloud,\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 ConnectionsListPage() {\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 [status, setStatus] = useState<AdaConnectionStatus \| ''>('');\n const [adapterId, setAdapterId] = useState('');\n const [search, setSearch] = useState('');\n const [offset, setOffset] = useState(0);\n\n const query = useConnections({\n adapterId: adapterId \|\| undefined,\n status: status \|\| undefined,\n pagination: { limit: PAGE_SIZE, offset },\n });\n\n // Published adapters power the adapter filter dropdown (mock's \"Adapter filter\").\n const adaptersQuery = useAdapters({ status: 'PUBLISHED', pagination: { limit: 100 } });\n const adapterOptions = adaptersQuery.data?.items ?? [];\n\n const items = useMemo(() => query.data?.items ?? [], [query.data?.items]);\n const hasMore = query.data?.pageInfo.hasMore ?? false;\n\n // Client-side search over the loaded page (name / region / environment).\n const filtered = useMemo(() => {\n const q = search.trim().toLowerCase();\n if (!q) return items;\n return items.filter(\n (c) =>\n c.name.toLowerCase().includes(q) \|\|\n (c.region?.toLowerCase().includes(q) ?? false) \|\|\n (c.environment?.toLowerCase().includes(q) ?? false)\n );\n }, [items, search]);\n\n return (\n <PageLayout\n title={t('adaptercloud.connections.title', 'Connections')}\n description={t(\n 'adaptercloud.connections.subtitle',\n 'Configured, authenticated targets — each connection is where the fabric actually reaches.'\n )}\n actions={\n <button\n type=\"button\"\n onClick={() => navigateTo('/connections/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.connections.new', 'New connection')}\n </button>\n }\n >\n <div className=\"mb-6 flex flex-wrap items-center gap-3\">\n <select\n value={status}\n onChange={(e) => {\n setStatus(e.target.value as AdaConnectionStatus \| '');\n setOffset(0);\n }}\n aria-label={t('adaptercloud.connections.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.connections.allStatuses', 'All statuses')}</option>\n {(Object.keys(connectionStatusLabels) as AdaConnectionStatus[]).map((s) => (\n <option key={s} value={s}>\n {connectionStatusLabels[s]}\n </option>\n ))}\n </select>\n\n <select\n value={adapterId}\n onChange={(e) => {\n setAdapterId(e.target.value);\n setOffset(0);\n }}\n aria-label={t('adaptercloud.connections.filterByAdapter', 'Filter by adapter')}\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.connections.allAdapters', 'All adapters')}</option>\n {adapterOptions.map((a) => (\n <option key={a.id} value={a.id}>\n {a.name}\n </option>\n ))}\n </select>\n\n <div className=\"relative w-full sm:ml-auto sm:w-64\">\n <Search\n aria-hidden=\"true\"\n className=\"pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary\"\n />\n <input\n type=\"search\"\n value={search}\n onChange={(e) => setSearch(e.target.value)}\n aria-label={t('adaptercloud.connections.search', 'Search connections')}\n placeholder={t('adaptercloud.connections.searchPlaceholder', 'Search…')}\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-9 pr-3 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n />\n </div>\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.connections.emptyTitle', 'No connections yet')}\n emptyDescription={t(\n 'adaptercloud.connections.emptyDescription',\n 'Create a connection to a real target to start discovering resources.'\n )}\n emptyIcon={<Cable className=\"h-10 w-10\" />}\n emptyAction={\n <button\n type=\"button\"\n onClick={() => navigateTo('/connections/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.connections.new', 'New connection')}\n </button>\n }\n >\n {filtered.length === 0 ? (\n <p className=\"rounded-xl border border-border-subtle bg-bg-surface px-4 py-10 text-center text-sm text-text-secondary\">\n {t('adaptercloud.connections.noSearchMatch', 'No connections match your search.')}\n </p>\n ) : (\n <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n {filtered.map((conn) => {\n const KindIcon = conn.adapter?.kind ? adapterKindIcon[conn.adapter.kind] : Cable;\n return (\n <GlassCard\n key={conn.id}\n role=\"button\"\n tabIndex={0}\n onClick={() => navigateTo(`/connections/${conn.id}`)}\n onKeyDown={(e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n navigateTo(`/connections/${conn.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 gap-3\">\n <div className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-bg-sunken text-accent-blue\">\n <KindIcon className=\"h-5 w-5\" aria-hidden=\"true\" />\n </div>\n <div className=\"min-w-0 flex-1\">\n <div className=\"flex items-start justify-between gap-2\">\n <div className=\"min-w-0\">\n <h3 className=\"truncate text-base font-semibold text-text-primary\">\n {conn.name}\n </h3>\n {conn.adapter && (\n <p className=\"mt-0.5 truncate text-xs text-text-secondary\">\n {conn.adapter.name}\n </p>\n )}\n </div>\n <StatusBadge status={conn.status} />\n </div>\n </div>\n </div>\n\n <div className=\"mt-3 flex flex-wrap items-center gap-3 text-xs text-text-secondary\">\n <span className=\"inline-flex items-center rounded-full bg-bg-sunken px-2 py-0.5\">\n {authMethodLabels[conn.authMethod]}\n </span>\n {conn.region && (\n <span className=\"flex items-center gap-1\">\n <MapPin className=\"h-3 w-3\" /> {conn.region}\n </span>\n )}\n {conn.environment && <span>· {conn.environment}</span>}\n </div>\n\n <div className=\"mt-4 flex items-center gap-2 text-sm text-text-primary\">\n <Server className=\"h-4 w-4 text-text-secondary\" />\n <span className=\"font-semibold tabular-nums\">{conn.resourceCount}</span>\n <span className=\"text-text-secondary\">\n {t('adaptercloud.connections.resources', 'resources')}\n </span>\n </div>\n\n {conn.lastError && (\n <p className=\"mt-3 line-clamp-2 rounded-lg bg-status-error-bg-subtle px-2 py-1 text-xs text-status-error-text\">\n {conn.lastError}\n </p>\n )}\n\n <p className=\"mt-4 text-xs text-text-secondary\">\n {conn.lastSyncedAt\n ? `${t('adaptercloud.connections.lastSynced', 'Last synced')} ${formatRelativeTime(conn.lastSyncedAt)}`\n : t('adaptercloud.connections.neverSynced', 'Never synced')}\n </p>\n </GlassCard>\n );\n })}\n </div>\n )}\n\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":"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"}
1	+ {"version":3,"file":"ConnectionsListPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/connections/ConnectionsListPage.tsx"],"sourcesContent":["/*\n Connections List Page\n * @module adaptercloud/pages/connections\n \n Every configured, authenticated target in the workspace. Lists from\n * `adaListConnections` with an adapter + status filter, a client-side search,\n * and offset pagination. Each card carries a per-adapter-kind glyph tile so the\n * fabric's reach reads at a glance (mirrors the aws/azure/gke/snowflake logos in\n * the mock).\n /\n\nimport { useState, useCallback, useMemo } from 'react';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport {\n Cable,\n Plus,\n ChevronLeft,\n ChevronRight,\n MapPin,\n Server,\n Search,\n Cloud,\n Radio,\n Cpu,\n Boxes,\n Network,\n Database,\n HardDrive,\n Puzzle,\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 { useConnections, useAdapters } from '../../hooks/useAdapterCloudApi';\nimport { authMethodLabels, connectionStatusLabels } from '../../utils/domain';\nimport { formatRelativeTime } from '../../utils/formatters';\nimport type { AdaAdapterKind, AdaConnectionStatus } from '../../types';\n\nconst PAGE_SIZE = 20;\n\n/\n Per-adapter-kind glyph — stands in for the vendor logos (aws / azure / gke /\n * snowflake) in the mock. Keyed off the connection's bound adapter kind; every\n * `AdaAdapterKind` maps to one of the eight allowed lucide marks.\n */\nconst adapterKindIcon: Record<AdaAdapterKind, LucideIcon> = {\n PUBLIC_CLOUD: Cloud,\n PRIVATE_CLOUD: Cloud,\n SAAS: Cloud,\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 ConnectionsListPage() {\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 [status, setStatus] = useState<AdaConnectionStatus \| ''>('');\n const [adapterId, setAdapterId] = useState('');\n const [search, setSearch] = useState('');\n const [offset, setOffset] = useState(0);\n\n const query = useConnections({\n adapterId: adapterId \|\| undefined,\n status: status \|\| undefined,\n pagination: { limit: PAGE_SIZE, offset },\n });\n\n // Published adapters power the adapter filter dropdown (mock's \"Adapter filter\").\n const adaptersQuery = useAdapters({ status: 'PUBLISHED', pagination: { limit: 100 } });\n const adapterOptions = adaptersQuery.data?.items ?? [];\n\n const items = useMemo(() => query.data?.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 // Client-side search over the loaded page (name / region / environment).\n const filtered = useMemo(() => {\n const q = search.trim().toLowerCase();\n if (!q) return items;\n return items.filter(\n (c) =>\n c.name.toLowerCase().includes(q) \|\|\n (c.region?.toLowerCase().includes(q) ?? false) \|\|\n (c.environment?.toLowerCase().includes(q) ?? false)\n );\n }, [items, search]);\n\n return (\n <PageLayout\n title={t('adaptercloud.connections.title', 'Connections')}\n description={t(\n 'adaptercloud.connections.subtitle',\n 'Configured, authenticated targets — each connection is where the fabric actually reaches.'\n )}\n actions={\n <button\n type=\"button\"\n onClick={() => navigateTo('/connections/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.connections.new', 'New connection')}\n </button>\n }\n >\n <div className=\"mb-6 flex flex-wrap items-center gap-3\">\n <select\n value={status}\n onChange={(e) => {\n setStatus(e.target.value as AdaConnectionStatus \| '');\n setOffset(0);\n }}\n aria-label={t('adaptercloud.connections.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.connections.allStatuses', 'All statuses')}</option>\n {(Object.keys(connectionStatusLabels) as AdaConnectionStatus[]).map((s) => (\n <option key={s} value={s}>\n {connectionStatusLabels[s]}\n </option>\n ))}\n </select>\n\n <select\n value={adapterId}\n onChange={(e) => {\n setAdapterId(e.target.value);\n setOffset(0);\n }}\n aria-label={t('adaptercloud.connections.filterByAdapter', 'Filter by adapter')}\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.connections.allAdapters', 'All adapters')}</option>\n {adapterOptions.map((a) => (\n <option key={a.id} value={a.id}>\n {a.name}\n </option>\n ))}\n </select>\n\n <div className=\"relative w-full sm:ml-auto sm:w-64\">\n <Search\n aria-hidden=\"true\"\n className=\"pointer-events-none absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-text-secondary\"\n />\n <input\n type=\"search\"\n value={search}\n onChange={(e) => setSearch(e.target.value)}\n aria-label={t('adaptercloud.connections.search', 'Search connections')}\n placeholder={t('adaptercloud.connections.searchPlaceholder', 'Search…')}\n className=\"w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-9 pr-3 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n />\n </div>\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.connections.emptyTitle', 'No connections yet')}\n emptyDescription={t(\n 'adaptercloud.connections.emptyDescription',\n 'Create a connection to a real target to start discovering resources.'\n )}\n emptyIcon={<Cable className=\"h-10 w-10\" />}\n emptyAction={\n <button\n type=\"button\"\n onClick={() => navigateTo('/connections/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.connections.new', 'New connection')}\n </button>\n }\n >\n {filtered.length === 0 ? (\n <p className=\"rounded-xl border border-border-subtle bg-bg-surface px-4 py-10 text-center text-sm text-text-secondary\">\n {t('adaptercloud.connections.noSearchMatch', 'No connections match your search.')}\n </p>\n ) : (\n <div className=\"grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-3\">\n {filtered.map((conn) => {\n const KindIcon = conn.adapter?.kind ? adapterKindIcon[conn.adapter.kind] : Cable;\n return (\n <GlassCard\n key={conn.id}\n role=\"button\"\n tabIndex={0}\n onClick={() => navigateTo(`/connections/${conn.id}`)}\n onKeyDown={(e) => {\n if (e.key === 'Enter' \|\| e.key === ' ') {\n e.preventDefault();\n navigateTo(`/connections/${conn.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 gap-3\">\n <div className=\"flex h-10 w-10 shrink-0 items-center justify-center rounded-lg bg-bg-sunken text-accent-blue\">\n <KindIcon className=\"h-5 w-5\" aria-hidden=\"true\" />\n </div>\n <div className=\"min-w-0 flex-1\">\n <div className=\"flex items-start justify-between gap-2\">\n <div className=\"min-w-0\">\n <h3 className=\"truncate text-base font-semibold text-text-primary\">\n {conn.name}\n </h3>\n {conn.adapter && (\n <p className=\"mt-0.5 truncate text-xs text-text-secondary\">\n {conn.adapter.name}\n </p>\n )}\n </div>\n <StatusBadge status={conn.status} />\n </div>\n </div>\n </div>\n\n <div className=\"mt-3 flex flex-wrap items-center gap-3 text-xs text-text-secondary\">\n <span className=\"inline-flex items-center rounded-full bg-bg-sunken px-2 py-0.5\">\n {authMethodLabels[conn.authMethod]}\n </span>\n {conn.region && (\n <span className=\"flex items-center gap-1\">\n <MapPin className=\"h-3 w-3\" /> {conn.region}\n </span>\n )}\n {conn.environment && <span>· {conn.environment}</span>}\n </div>\n\n <div className=\"mt-4 flex items-center gap-2 text-sm text-text-primary\">\n <Server className=\"h-4 w-4 text-text-secondary\" />\n <span className=\"font-semibold tabular-nums\">{conn.resourceCount}</span>\n <span className=\"text-text-secondary\">\n {t('adaptercloud.connections.resources', 'resources')}\n </span>\n </div>\n\n {conn.lastError && (\n <p className=\"mt-3 line-clamp-2 rounded-lg bg-status-error-bg-subtle px-2 py-1 text-xs text-status-error-text\">\n {conn.lastError}\n </p>\n )}\n\n <p className=\"mt-4 text-xs text-text-secondary\">\n {conn.lastSyncedAt\n ? `${t('adaptercloud.connections.lastSynced', 'Last synced')} ${formatRelativeTime(conn.lastSyncedAt)}`\n : t('adaptercloud.connections.neverSynced', 'Never synced')}\n </p>\n </GlassCard>\n );\n })}\n </div>\n )}\n\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/costs/CostsPage.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CostsPage.d.ts","sourceRoot":"","sources":["../../../../src/adaptercloud/pages/costs/CostsPage.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;~~AAqBH~~,wBAAgB,SAAS,~~gCAkSxB~~"}
1	+ {"version":3,"file":"CostsPage.d.ts","sourceRoot":"","sources":["../../../../src/adaptercloud/pages/costs/CostsPage.tsx"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAwBH,wBAAgB,SAAS,gCAgUxB"}

package/dist/adaptercloud/pages/costs/CostsPage.js CHANGED Viewed

@@ -6,26 +6,30 @@ import { DataState as i } from "../../components/DataState.js";
 import { BarChart as a } from "../../components/viz/BarChart.js";
 import { Sparkline as o } from "../../components/viz/Sparkline.js";
 import "../../components/viz/index.js";
-import { useCostRecords as s, useCostSummary as c } from "../../hooks/useAdapterCloudApi.js";
-import { formatDate as l } from "../../utils/formatters.js";
-import { useCallback as u, useMemo as d, useState as f } from "react";
-import { useI18n as p } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { DollarSign as m, Receipt as h, Search as g, X as _ } from "lucide-react";
-import { Fragment as v, jsx as y, jsxs as b } from "react/jsx-runtime";
-import { EmphasisPanel as x, GlassCard as S, ResponsiveTable as C } from "@burdenoff/fe-libs/ui";
+import { useConnections as s, useCostRecords as c, useCostSummary as l } from "../../hooks/useAdapterCloudApi.js";
+import { formatDate as u } from "../../utils/formatters.js";
+import { useCallback as d, useMemo as f, useState as p } from "react";
+import { useI18n as m } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { DollarSign as h, Receipt as g, Search as _, X as v } from "lucide-react";
+import { Fragment as y, jsx as b, jsxs as x } from "react/jsx-runtime";
+import { EmphasisPanel as S, GlassCard as C, ResponsiveTable as w } from "@burdenoff/fe-libs/ui";
 //#region src/adaptercloud/pages/costs/CostsPage.tsx
-function w() {
-	let { navigateTo: w } = e(), { t: T } = p(), E = u((e, t) => {
-		let n = T(e);
+var T = 100;
+function E() {
+	let { navigateTo: E } = e(), { t: D } = m(), O = d((e, t) => {
+		let n = D(e);
 		return n === e ? t : n;
-	}, [T]), [D, O] = f(""), [k, A] = f(""), j = c(), M = s({ service: k || void 0 }), N = j.data?.currency ?? "USD", P = d(() => [...j.data?.lines ?? []].sort((e, t) => t.total - e.total), [j.data]), F = d(() => P.map((e) => ({
+	}, [D]), [k, A] = p(""), [j, M] = p(""), [N, P] = p(""), F = s({ pagination: { limit: T } }).data?.items ?? [], I = l(N || void 0), L = c({
+		connectionId: N || void 0,
+		service: j || void 0
+	}), R = I.data?.currency ?? "USD", z = f(() => [...I.data?.lines ?? []].sort((e, t) => t.total - e.total), [I.data]), B = f(() => z.map((e) => ({
 		key: e.service,
 		label: e.service,
 		value: e.total,
-		display: r(e.total, N)
-	})), [P, N]), I = d(() => {
+		display: r(e.total, R)
+	})), [z, R]), V = f(() => {
 		let e = /* @__PURE__ */ new Map();
-		for (let t of M.data ?? []) {
+		for (let t of L.data ?? []) {
 			let n = new Date(t.periodStart);
 			if (Number.isNaN(n.getTime())) continue;
 			let r = `${n.getUTCFullYear()}-${String(n.getUTCMonth() + 1).padStart(2, "0")}`;
@@ -36,43 +40,43 @@ function w() {
 			points: t,
 			deltaPct: r > 0 ? Math.round((n - r) / r * 100) : null
 		};
-	}, [M.data]), L = u((e) => {
-		e.preventDefault(), A(D.trim());
-	}, [D]), R = u(() => {
-		O(""), A("");
-	}, []), z = [
+	}, [L.data]), H = d((e) => {
+		e.preventDefault(), M(k.trim());
+	}, [k]), U = d(() => {
+		A(""), M("");
+	}, []), W = [
 		{
 			key: "service",
-			header: E("adaptercloud.costs.service", "Service"),
+			header: O("adaptercloud.costs.service", "Service"),
 			priority: "primary",
-			cell: (e) => /* @__PURE__ */ y("span", {
+			cell: (e) => /* @__PURE__ */ b("span", {
 				className: "font-medium text-text-primary",
 				children: e.service
 			})
 		},
 		{
 			key: "amount",
-			header: E("adaptercloud.costs.amount", "Amount"),
+			header: O("adaptercloud.costs.amount", "Amount"),
 			priority: "primary",
-			cell: (e) => /* @__PURE__ */ y("span", {
+			cell: (e) => /* @__PURE__ */ b("span", {
 				className: "tabular-nums text-text-primary",
 				children: r(e.amount, e.currency)
 			})
 		},
 		{
 			key: "period",
-			header: E("adaptercloud.costs.period", "Period"),
+			header: O("adaptercloud.costs.period", "Period"),
 			priority: "secondary",
-			cell: (e) => /* @__PURE__ */ b("span", {
+			cell: (e) => /* @__PURE__ */ x("span", {
 				className: "text-sm text-text-secondary",
 				children: [
-					l(e.periodStart, {
+					u(e.periodStart, {
 						hour: void 0,
 						minute: void 0
 					}),
 					" –",
 					" ",
-					l(e.periodEnd, {
+					u(e.periodEnd, {
 						hour: void 0,
 						minute: void 0
 					})
@@ -81,163 +85,186 @@ function w() {
 		},
 		{
 			key: "resource",
-			header: E("adaptercloud.costs.resource", "Resource"),
+			header: O("adaptercloud.costs.resource", "Resource"),
 			priority: "secondary",
-			cell: (e) => e.resource?.name ? /* @__PURE__ */ y("button", {
+			cell: (e) => e.resource?.name ? /* @__PURE__ */ b("button", {
 				type: "button",
-				onClick: () => e.resourceId && w(`/resources/${e.resourceId}`),
+				onClick: () => e.resourceId && E(`/resources/${e.resourceId}`),
 				className: "max-w-[12rem] truncate text-left text-sm text-accent-blue hover:underline",
 				children: e.resource.name
-			}) : e.resourceId ? /* @__PURE__ */ b("span", {
+			}) : e.resourceId ? /* @__PURE__ */ x("span", {
 				className: "font-mono text-xs text-text-secondary",
 				children: [e.resourceId.slice(0, 10), "…"]
-			}) : /* @__PURE__ */ y("span", {
+			}) : /* @__PURE__ */ b("span", {
 				className: "text-text-tertiary",
 				children: "—"
 			})
 		},
 		{
 			key: "connection",
-			header: E("adaptercloud.costs.connection", "Connection"),
+			header: O("adaptercloud.costs.connection", "Connection"),
 			priority: "hidden-on-mobile",
-			cell: (e) => e.connection?.name ? /* @__PURE__ */ y("span", {
+			cell: (e) => e.connection?.name ? /* @__PURE__ */ b("span", {
 				className: "max-w-[12rem] truncate text-sm text-text-primary",
 				children: e.connection.name
-			}) : /* @__PURE__ */ y("span", {
+			}) : /* @__PURE__ */ b("span", {
 				className: "text-text-tertiary",
 				children: "—"
 			})
 		}
 	];
-	return /* @__PURE__ */ b(t, {
-		title: E("adaptercloud.costs.title", "FinOps"),
-		description: E("adaptercloud.costs.subtitle", "Spend attributed to the same resources you operate — cost and topology share one model."),
-		children: [/* @__PURE__ */ b(i, {
-			isLoading: j.isLoading,
-			isError: j.isError,
-			error: j.error,
-			onRetry: () => void j.refetch(),
-			children: [/* @__PURE__ */ b(x, {
-				className: "mb-8",
-				children: [/* @__PURE__ */ y("div", {
-					className: "mb-4 flex items-center justify-between",
-					children: /* @__PURE__ */ y("h2", {
-						className: "text-lg font-semibold text-text-primary",
-						children: E("adaptercloud.costs.summary", "Cost Summary")
-					})
-				}), /* @__PURE__ */ b("div", {
-					className: "grid grid-cols-2 gap-4 lg:grid-cols-4",
-					children: [/* @__PURE__ */ y(n, {
-						featured: !0,
-						icon: /* @__PURE__ */ y(m, { className: "h-5 w-5" }),
-						value: j.data ? r(j.data.total, N) : "—",
-						label: E("adaptercloud.costs.totalSpend", "Total Spend")
-					}), P.slice(0, 3).map((e) => /* @__PURE__ */ y(n, {
-						icon: /* @__PURE__ */ y(h, { className: "h-5 w-5" }),
-						value: r(e.total, N),
-						label: e.service
-					}, e.service))]
+	return /* @__PURE__ */ x(t, {
+		title: O("adaptercloud.costs.title", "FinOps"),
+		description: O("adaptercloud.costs.subtitle", "Spend attributed to the same resources you operate — cost and topology share one model."),
+		children: [
+			/* @__PURE__ */ x("div", {
+				className: "mb-6 flex flex-wrap items-center gap-3",
+				children: [/* @__PURE__ */ b("label", {
+					htmlFor: "ada-cost-connection",
+					className: "text-sm text-text-secondary",
+					children: O("adaptercloud.costs.connection", "Connection")
+				}), /* @__PURE__ */ x("select", {
+					id: "ada-cost-connection",
+					value: N,
+					onChange: (e) => P(e.target.value),
+					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)]",
+					children: [/* @__PURE__ */ b("option", {
+						value: "",
+						children: O("adaptercloud.costs.allConnections", "All connections")
+					}), F.map((e) => /* @__PURE__ */ b("option", {
+						value: e.id,
+						children: e.name
+					}, e.id))]
 				})]
-			}), P.length > 0 && /* @__PURE__ */ b("div", {
-				className: "mb-8 grid grid-cols-1 gap-6 lg:grid-cols-3",
-				children: [/* @__PURE__ */ b("section", {
-					className: "lg:col-span-2",
-					children: [/* @__PURE__ */ y("h2", {
-						className: "mb-4 text-lg font-semibold text-text-primary",
-						children: E("adaptercloud.costs.byService", "Spend by Service")
-					}), /* @__PURE__ */ y(S, {
-						className: "p-5",
-						children: /* @__PURE__ */ y(a, {
-							data: F,
-							labelWidthClassName: "w-24 sm:w-32"
+			}),
+			/* @__PURE__ */ x(i, {
+				isLoading: I.isLoading,
+				isError: I.isError,
+				error: I.error,
+				onRetry: () => void I.refetch(),
+				children: [/* @__PURE__ */ x(S, {
+					className: "mb-8",
+					children: [/* @__PURE__ */ b("div", {
+						className: "mb-4 flex items-center justify-between",
+						children: /* @__PURE__ */ b("h2", {
+							className: "text-lg font-semibold text-text-primary",
+							children: O("adaptercloud.costs.summary", "Cost Summary")
 						})
+					}), /* @__PURE__ */ x("div", {
+						className: "grid grid-cols-2 gap-4 lg:grid-cols-4",
+						children: [/* @__PURE__ */ b(n, {
+							featured: !0,
+							icon: /* @__PURE__ */ b(h, { className: "h-5 w-5" }),
+							value: I.data ? r(I.data.total, R) : "—",
+							label: O("adaptercloud.costs.totalSpend", "Total Spend")
+						}), z.slice(0, 3).map((e) => /* @__PURE__ */ b(n, {
+							icon: /* @__PURE__ */ b(g, { className: "h-5 w-5" }),
+							value: r(e.total, R),
+							label: e.service
+						}, e.service))]
 					})]
-				}), /* @__PURE__ */ b("section", { children: [/* @__PURE__ */ y("h2", {
-					className: "mb-4 text-lg font-semibold text-text-primary",
-					children: E("adaptercloud.costs.trend", "Monthly Trend")
-				}), /* @__PURE__ */ y(S, {
-					className: "flex h-[calc(100%-2.75rem)] flex-col justify-between p-5",
-					children: I.points.length >= 2 ? /* @__PURE__ */ b(v, { children: [/* @__PURE__ */ b("div", {
-						className: "flex items-baseline gap-2",
-						children: [/* @__PURE__ */ y("span", {
-							className: "text-2xl font-bold tabular-nums text-text-primary",
-							children: r(I.points[I.points.length - 1] ?? 0, N)
-						}), I.deltaPct !== null && /* @__PURE__ */ b("span", {
-							className: `text-xs font-semibold tabular-nums ${I.deltaPct > 0 ? "text-status-error-text" : "text-status-success-text"}`,
-							children: [
-								I.deltaPct > 0 ? "▲" : "▼",
-								" ",
-								Math.abs(I.deltaPct),
-								"%",
-								" ",
-								E("adaptercloud.costs.vsPrev", "vs prev")
-							]
+				}), z.length > 0 && /* @__PURE__ */ x("div", {
+					className: "mb-8 grid grid-cols-1 gap-6 lg:grid-cols-3",
+					children: [/* @__PURE__ */ x("section", {
+						className: "lg:col-span-2",
+						children: [/* @__PURE__ */ b("h2", {
+							className: "mb-4 text-lg font-semibold text-text-primary",
+							children: O("adaptercloud.costs.byService", "Spend by Service")
+						}), /* @__PURE__ */ b(C, {
+							className: "p-5",
+							children: /* @__PURE__ */ b(a, {
+								data: B,
+								labelWidthClassName: "w-24 sm:w-32"
+							})
 						})]
-					}), /* @__PURE__ */ y(o, {
-						points: I.points,
-						className: "mt-4 h-16 w-full text-accent-blue"
-					})] }) : /* @__PURE__ */ y("p", {
-						className: "py-6 text-center text-sm text-text-secondary",
-						children: E("adaptercloud.costs.trendEmpty", "Ingest at least two months of cost to see a trend.")
-					})
-				})] })]
-			})]
-		}), /* @__PURE__ */ b("section", { children: [/* @__PURE__ */ b("div", {
-			className: "mb-4 flex flex-wrap items-center justify-between gap-3",
-			children: [/* @__PURE__ */ y("h2", {
-				className: "text-lg font-semibold text-text-primary",
-				children: E("adaptercloud.costs.records", "Cost Records")
-			}), /* @__PURE__ */ b("form", {
-				onSubmit: L,
-				role: "search",
-				className: "flex w-full items-center gap-2 sm:w-auto",
-				children: [/* @__PURE__ */ b("div", {
-					className: "relative w-full sm:w-56",
-					children: [/* @__PURE__ */ y("input", {
-						type: "text",
-						value: D,
-						onChange: (e) => O(e.target.value),
-						"aria-label": E("adaptercloud.costs.filterService", "Filter by service"),
-						placeholder: E("adaptercloud.costs.filterServicePlaceholder", "Filter by service…"),
-						className: "w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-3 pr-9 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
-					}), k && /* @__PURE__ */ y("button", {
-						type: "button",
-						onClick: R,
-						"aria-label": E("adaptercloud.costs.clearServiceFilter", "Clear service filter"),
-						className: "absolute right-2 top-1/2 -translate-y-1/2 rounded p-0.5 text-text-secondary transition-colors hover:text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
-						children: /* @__PURE__ */ y(_, { className: "h-4 w-4" })
-					})]
-				}), /* @__PURE__ */ y("button", {
-					type: "submit",
-					"aria-label": E("adaptercloud.costs.applyServiceFilter", "Apply service filter"),
-					className: "inline-flex shrink-0 items-center justify-center rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-text-primary transition-colors hover:bg-accent focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
-					children: /* @__PURE__ */ y(g, { className: "h-4 w-4" })
+					}), /* @__PURE__ */ x("section", { children: [/* @__PURE__ */ b("h2", {
+						className: "mb-4 text-lg font-semibold text-text-primary",
+						children: O("adaptercloud.costs.trend", "Monthly Trend")
+					}), /* @__PURE__ */ b(C, {
+						className: "flex h-[calc(100%-2.75rem)] flex-col justify-between p-5",
+						children: V.points.length >= 2 ? /* @__PURE__ */ x(y, { children: [/* @__PURE__ */ x("div", {
+							className: "flex items-baseline gap-2",
+							children: [/* @__PURE__ */ b("span", {
+								className: "text-2xl font-bold tabular-nums text-text-primary",
+								children: r(V.points[V.points.length - 1] ?? 0, R)
+							}), V.deltaPct !== null && /* @__PURE__ */ x("span", {
+								className: `text-xs font-semibold tabular-nums ${V.deltaPct > 0 ? "text-status-error-text" : "text-status-success-text"}`,
+								children: [
+									V.deltaPct > 0 ? "▲" : "▼",
+									" ",
+									Math.abs(V.deltaPct),
+									"%",
+									" ",
+									O("adaptercloud.costs.vsPrev", "vs prev")
+								]
+							})]
+						}), /* @__PURE__ */ b(o, {
+							points: V.points,
+							className: "mt-4 h-16 w-full text-accent-blue"
+						})] }) : /* @__PURE__ */ b("p", {
+							className: "py-6 text-center text-sm text-text-secondary",
+							children: O("adaptercloud.costs.trendEmpty", "Ingest at least two months of cost to see a trend.")
+						})
+					})] })]
 				})]
-			})]
-		}), /* @__PURE__ */ y(i, {
-			isLoading: M.isLoading,
-			isError: M.isError,
-			isEmpty: (M.data ?? []).length === 0,
-			error: M.error,
-			onRetry: () => void M.refetch(),
-			emptyTitle: E("adaptercloud.costs.emptyTitle", "No cost records"),
-			emptyDescription: E("adaptercloud.costs.emptyDescription", "Run a cost-ingest sync against a connection to populate the ledger."),
-			emptyIcon: /* @__PURE__ */ y(h, { className: "h-10 w-10" }),
-			emptyAction: /* @__PURE__ */ y("button", {
-				type: "button",
-				onClick: () => w("/connections"),
-				className: "rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:opacity-90",
-				children: E("adaptercloud.costs.goToConnections", "Go to connections")
 			}),
-			children: /* @__PURE__ */ y(C, {
-				data: M.data ?? [],
-				columns: z,
-				rowKey: (e) => e.id
-			})
-		})] })]
+			/* @__PURE__ */ x("section", { children: [/* @__PURE__ */ x("div", {
+				className: "mb-4 flex flex-wrap items-center justify-between gap-3",
+				children: [/* @__PURE__ */ b("h2", {
+					className: "text-lg font-semibold text-text-primary",
+					children: O("adaptercloud.costs.records", "Cost Records")
+				}), /* @__PURE__ */ x("form", {
+					onSubmit: H,
+					role: "search",
+					className: "flex w-full items-center gap-2 sm:w-auto",
+					children: [/* @__PURE__ */ x("div", {
+						className: "relative w-full sm:w-56",
+						children: [/* @__PURE__ */ b("input", {
+							type: "text",
+							value: k,
+							onChange: (e) => A(e.target.value),
+							"aria-label": O("adaptercloud.costs.filterService", "Filter by service"),
+							placeholder: O("adaptercloud.costs.filterServicePlaceholder", "Filter by service…"),
+							className: "w-full rounded-lg border border-border-subtle bg-bg-surface py-2 pl-3 pr-9 text-sm text-text-primary placeholder:text-text-secondary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]"
+						}), j && /* @__PURE__ */ b("button", {
+							type: "button",
+							onClick: U,
+							"aria-label": O("adaptercloud.costs.clearServiceFilter", "Clear service filter"),
+							className: "absolute right-2 top-1/2 -translate-y-1/2 rounded p-0.5 text-text-secondary transition-colors hover:text-text-primary focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
+							children: /* @__PURE__ */ b(v, { className: "h-4 w-4" })
+						})]
+					}), /* @__PURE__ */ b("button", {
+						type: "submit",
+						"aria-label": O("adaptercloud.costs.applyServiceFilter", "Apply service filter"),
+						className: "inline-flex shrink-0 items-center justify-center rounded-lg border border-border-subtle bg-bg-surface px-3 py-2 text-text-primary transition-colors hover:bg-accent focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]",
+						children: /* @__PURE__ */ b(_, { className: "h-4 w-4" })
+					})]
+				})]
+			}), /* @__PURE__ */ b(i, {
+				isLoading: L.isLoading,
+				isError: L.isError,
+				isEmpty: (L.data ?? []).length === 0,
+				error: L.error,
+				onRetry: () => void L.refetch(),
+				emptyTitle: O("adaptercloud.costs.emptyTitle", "No cost records"),
+				emptyDescription: O("adaptercloud.costs.emptyDescription", "Run a cost-ingest sync against a connection to populate the ledger."),
+				emptyIcon: /* @__PURE__ */ b(g, { className: "h-10 w-10" }),
+				emptyAction: /* @__PURE__ */ b("button", {
+					type: "button",
+					onClick: () => E("/connections"),
+					className: "rounded-lg bg-action-primary-bg px-4 py-2 text-sm font-medium text-action-primary-text transition-colors hover:opacity-90",
+					children: O("adaptercloud.costs.goToConnections", "Go to connections")
+				}),
+				children: /* @__PURE__ */ b(w, {
+					data: L.data ?? [],
+					columns: W,
+					rowKey: (e) => e.id
+				})
+			})] })
+		]
 	});
 }
 //#endregion
-export { w as CostsPage };
+export { E as CostsPage };
 //# sourceMappingURL=CostsPage.js.map