@burdenoff/microfe-adaptercloud 2026.706.2 → 2026.706.4

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 (40) hide show
  1. package/dist/adaptercloud/AdapterCloudRoot.js +52 -44
  2. package/dist/adaptercloud/AdapterCloudRoot.js.map +1 -1
  3. package/dist/adaptercloud/AdapterCloudRoutes.js +18 -14
  4. package/dist/adaptercloud/AdapterCloudRoutes.js.map +1 -1
  5. package/dist/adaptercloud/components/ConfirmDialog.js.map +1 -1
  6. package/dist/adaptercloud/components/viz/BarChart.js +32 -0
  7. package/dist/adaptercloud/components/viz/BarChart.js.map +1 -0
  8. package/dist/adaptercloud/components/viz/Sparkline.js +50 -0
  9. package/dist/adaptercloud/components/viz/Sparkline.js.map +1 -0
  10. package/dist/adaptercloud/components/viz/StackedBar.js +1 -0
  11. package/dist/adaptercloud/components/viz/TopologyGraph.js +96 -0
  12. package/dist/adaptercloud/components/viz/TopologyGraph.js.map +1 -0
  13. package/dist/adaptercloud/components/viz/index.js +4 -0
  14. package/dist/adaptercloud/hooks/useAdapterCloudApi.js +22 -4
  15. package/dist/adaptercloud/hooks/useAdapterCloudApi.js.map +1 -1
  16. package/dist/adaptercloud/pages/OverviewPage.js.map +1 -1
  17. package/dist/adaptercloud/pages/adapters/AdapterDetailPage.js +176 -123
  18. package/dist/adaptercloud/pages/adapters/AdapterDetailPage.js.map +1 -1
  19. package/dist/adaptercloud/pages/adapters/AdapterFormPage.js +261 -179
  20. package/dist/adaptercloud/pages/adapters/AdapterFormPage.js.map +1 -1
  21. package/dist/adaptercloud/pages/adapters/AdaptersListPage.js.map +1 -1
  22. package/dist/adaptercloud/pages/connections/ConnectionsListPage.js +158 -94
  23. package/dist/adaptercloud/pages/connections/ConnectionsListPage.js.map +1 -1
  24. package/dist/adaptercloud/pages/costs/CostsPage.js +160 -111
  25. package/dist/adaptercloud/pages/costs/CostsPage.js.map +1 -1
  26. package/dist/adaptercloud/pages/drift/DriftListPage.js +163 -84
  27. package/dist/adaptercloud/pages/drift/DriftListPage.js.map +1 -1
  28. package/dist/adaptercloud/pages/policies/PoliciesListPage.js +177 -96
  29. package/dist/adaptercloud/pages/policies/PoliciesListPage.js.map +1 -1
  30. package/dist/adaptercloud/pages/resources/ResourceDetailPage.js +145 -131
  31. package/dist/adaptercloud/pages/resources/ResourceDetailPage.js.map +1 -1
  32. package/dist/adaptercloud/pages/resources/ResourcesListPage.js +10 -1
  33. package/dist/adaptercloud/pages/resources/ResourcesListPage.js.map +1 -1
  34. package/dist/adaptercloud/pages/sync-runs/SyncRunsListPage.js +226 -165
  35. package/dist/adaptercloud/pages/sync-runs/SyncRunsListPage.js.map +1 -1
  36. package/dist/adaptercloud/pages/topology/TopologyPage.js +397 -0
  37. package/dist/adaptercloud/pages/topology/TopologyPage.js.map +1 -0
  38. package/dist/adaptercloud/pages/violations/ViolationsListPage.js +184 -131
  39. package/dist/adaptercloud/pages/violations/ViolationsListPage.js.map +1 -1
  40. package/package.json +1 -1
package/dist/adaptercloud/pages/resources/ResourceDetailPage.js CHANGED
@@ -7,115 +7,143 @@ import { DataState as s } from "../../components/DataState.js";
7
7
  import { useDriftRecords as c, useRemediateDrift as l, useResource as u } from "../../hooks/useAdapterCloudApi.js";
8
8
  import { formatDate as d } from "../../utils/formatters.js";
9
9
  import { ConfirmDialog as f } from "../../components/ConfirmDialog.js";
10
- import { useCallback as p, useState as m } from "react";
11
- import { useI18n as h } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
12
- import { ArrowLeft as g, Cable as _, GitCompareArrows as v, Loader2 as y, Server as b, Wrench as x } from "lucide-react";
13
- import { useParams as S } from "react-router-dom";
14
- import { jsx as C, jsxs as w } from "react/jsx-runtime";
15
- import { GlassCard as T } from "@burdenoff/fe-libs/ui";
10
+ import { TopologyGraph as p } from "../../components/viz/TopologyGraph.js";
11
+ import "../../components/viz/index.js";
12
+ import { useCallback as m, useMemo as h, useState as g } from "react";
13
+ import { useI18n as _ } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
14
+ import { ArrowLeft as v, Cable as y, GitCompareArrows as b, Loader2 as x, Wrench as S } from "lucide-react";
15
+ import { useParams as C } from "react-router-dom";
16
+ import { Fragment as w, jsx as T, jsxs as E } from "react/jsx-runtime";
17
+ import { GlassCard as D } from "@burdenoff/fe-libs/ui";
16
18
  //#region src/adaptercloud/pages/resources/ResourceDetailPage.tsx
17
- function E() {
18
- let { id: E } = S(), { navigateTo: D } = e(), { t: O } = h(), k = p((e, t) => {
19
- let n = O(e);
19
+ function O() {
20
+ let { id: O } = C(), { navigateTo: k } = e(), { t: A } = _(), j = m((e, t) => {
21
+ let n = A(e);
20
22
  return n === e ? t : n;
21
- }, [O]), A = u(E), j = c({ resourceId: E }), M = l(), N = A.data, [P, F] = m(null), [I, L] = m(null), R = M.isPending ? M.variables : void 0, z = p((e) => {
22
- L(null), M.mutate(e, {
23
- onSuccess: () => F(null),
24
- onError: (e) => L(e instanceof Error ? e.message : "Failed to remediate drift.")
23
+ }, [A]), M = u(O), N = c({ resourceId: O }), P = l(), F = M.data, { topoNodes: I, topoEdges: L } = h(() => {
24
+ let e = F?.dependsOn ?? [];
25
+ return !F || e.length === 0 ? {
26
+ topoNodes: [],
27
+ topoEdges: []
28
+ } : {
29
+ topoNodes: [...e.map((e) => ({
30
+ id: e.id,
31
+ label: e.name,
32
+ group: "deps",
33
+ type: e.resourceType,
34
+ state: e.state
35
+ })), {
36
+ id: F.id,
37
+ label: F.name,
38
+ group: "focus",
39
+ type: F.resourceType,
40
+ state: F.state
41
+ }],
42
+ topoEdges: e.map((e) => ({
43
+ id: `${e.id}->${F.id}`,
44
+ from: e.id,
45
+ to: F.id,
46
+ kind: "DEPENDS_ON"
47
+ }))
48
+ };
49
+ }, [F]), [R, z] = g(null), [B, V] = g(null), H = P.isPending ? P.variables : void 0, U = m((e) => {
50
+ V(null), P.mutate(e, {
51
+ onSuccess: () => z(null),
52
+ onError: (e) => V(e instanceof Error ? e.message : "Failed to remediate drift.")
25
53
  });
26
- }, [M]);
27
- return /* @__PURE__ */ w(t, {
28
- title: N?.name ?? k("adaptercloud.resources.detailTitle", "Resource"),
29
- description: N?.resourceType,
30
- actions: /* @__PURE__ */ w("button", {
54
+ }, [P]);
55
+ return /* @__PURE__ */ E(t, {
56
+ title: F?.name ?? j("adaptercloud.resources.detailTitle", "Resource"),
57
+ description: F?.resourceType,
58
+ actions: /* @__PURE__ */ E("button", {
31
59
  type: "button",
32
- onClick: () => D("/resources"),
60
+ onClick: () => k("/resources"),
33
61
  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",
34
- children: [/* @__PURE__ */ C(g, { className: "h-4 w-4" }), k("adaptercloud.common.back", "Back")]
62
+ children: [/* @__PURE__ */ T(v, { className: "h-4 w-4" }), j("adaptercloud.common.back", "Back")]
35
63
  }),
36
- children: [/* @__PURE__ */ C(s, {
37
- isLoading: A.isLoading,
38
- isError: A.isError,
39
- isEmpty: !A.isLoading && !N,
40
- error: A.error,
41
- onRetry: () => void A.refetch(),
42
- emptyTitle: k("adaptercloud.resources.notFound", "Resource not found"),
43
- children: N && /* @__PURE__ */ w("div", {
64
+ children: [/* @__PURE__ */ T(s, {
65
+ isLoading: M.isLoading,
66
+ isError: M.isError,
67
+ isEmpty: !M.isLoading && !F,
68
+ error: M.error,
69
+ onRetry: () => void M.refetch(),
70
+ emptyTitle: j("adaptercloud.resources.notFound", "Resource not found"),
71
+ children: F && /* @__PURE__ */ E("div", {
44
72
  className: "space-y-6",
45
73
  children: [
46
- /* @__PURE__ */ w(T, {
74
+ /* @__PURE__ */ E(D, {
47
75
  className: "p-6",
48
76
  children: [
49
- /* @__PURE__ */ w("div", {
77
+ /* @__PURE__ */ E("div", {
50
78
  className: "mb-4 flex flex-wrap items-center gap-3",
51
79
  children: [
52
- /* @__PURE__ */ C(a, {
53
- status: N.state,
54
- label: i[N.state]
80
+ /* @__PURE__ */ T(a, {
81
+ status: F.state,
82
+ label: i[F.state]
55
83
  }),
56
- /* @__PURE__ */ C("span", {
84
+ /* @__PURE__ */ T("span", {
57
85
  className: "inline-flex items-center rounded-full bg-bg-sunken px-2.5 py-0.5 text-xs font-medium text-text-secondary",
58
- children: N.resourceType
86
+ children: F.resourceType
59
87
  }),
60
- /* @__PURE__ */ w("span", {
88
+ /* @__PURE__ */ E("span", {
61
89
  className: "text-sm font-semibold tabular-nums text-text-primary",
62
- children: [r(N.monthlyCost), /* @__PURE__ */ C("span", {
90
+ children: [r(F.monthlyCost), /* @__PURE__ */ T("span", {
63
91
  className: "ml-1 text-xs font-normal text-text-secondary",
64
- children: k("adaptercloud.resources.perMonth", "/mo")
92
+ children: j("adaptercloud.resources.perMonth", "/mo")
65
93
  })]
66
94
  })
67
95
  ]
68
96
  }),
69
- /* @__PURE__ */ w("dl", {
97
+ /* @__PURE__ */ E("dl", {
70
98
  className: "grid grid-cols-2 gap-4 text-sm sm:grid-cols-3",
71
99
  children: [
72
- /* @__PURE__ */ w("div", {
100
+ /* @__PURE__ */ E("div", {
73
101
  className: "col-span-2 sm:col-span-3",
74
- children: [/* @__PURE__ */ C("dt", {
102
+ children: [/* @__PURE__ */ T("dt", {
75
103
  className: "text-text-secondary",
76
- children: k("adaptercloud.resources.externalId", "External ID")
77
- }), /* @__PURE__ */ C("dd", {
104
+ children: j("adaptercloud.resources.externalId", "External ID")
105
+ }), /* @__PURE__ */ T("dd", {
78
106
  className: "mt-0.5 break-all font-mono text-xs text-text-primary",
79
- children: N.externalId
107
+ children: F.externalId
80
108
  })]
81
109
  }),
82
- /* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("dt", {
110
+ /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("dt", {
83
111
  className: "text-text-secondary",
84
- children: k("adaptercloud.resources.region", "Region")
85
- }), /* @__PURE__ */ C("dd", {
112
+ children: j("adaptercloud.resources.region", "Region")
113
+ }), /* @__PURE__ */ T("dd", {
86
114
  className: "mt-0.5 font-medium text-text-primary",
87
- children: N.region ?? "—"
115
+ children: F.region ?? "—"
88
116
  })] }),
89
- /* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("dt", {
117
+ /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("dt", {
90
118
  className: "text-text-secondary",
91
- children: k("adaptercloud.resources.lastSeen", "Last Seen")
92
- }), /* @__PURE__ */ C("dd", {
119
+ children: j("adaptercloud.resources.lastSeen", "Last Seen")
120
+ }), /* @__PURE__ */ T("dd", {
93
121
  className: "mt-0.5 font-medium text-text-primary",
94
- children: N.lastSeenAt ? d(N.lastSeenAt) : "—"
122
+ children: F.lastSeenAt ? d(F.lastSeenAt) : "—"
95
123
  })] }),
96
- /* @__PURE__ */ w("div", { children: [/* @__PURE__ */ C("dt", {
124
+ /* @__PURE__ */ E("div", { children: [/* @__PURE__ */ T("dt", {
97
125
  className: "text-text-secondary",
98
- children: k("adaptercloud.common.updated", "Updated")
99
- }), /* @__PURE__ */ C("dd", {
126
+ children: j("adaptercloud.common.updated", "Updated")
127
+ }), /* @__PURE__ */ T("dd", {
100
128
  className: "mt-0.5 font-medium text-text-primary",
101
- children: d(N.updatedAt)
129
+ children: d(F.updatedAt)
102
130
  })] })
103
131
  ]
104
132
  }),
105
- N.connection && /* @__PURE__ */ w("button", {
133
+ F.connection && /* @__PURE__ */ E("button", {
106
134
  type: "button",
107
- onClick: () => D(`/connections/${N.connection?.id}`),
135
+ onClick: () => k(`/connections/${F.connection?.id}`),
108
136
  className: "mt-4 inline-flex items-center gap-2 rounded-lg border border-border-subtle px-3 py-2 text-sm text-text-primary transition-colors hover:bg-accent",
109
- children: [/* @__PURE__ */ C(_, { className: "h-4 w-4 text-text-secondary" }), N.connection.name]
137
+ children: [/* @__PURE__ */ T(y, { className: "h-4 w-4 text-text-secondary" }), F.connection.name]
110
138
  }),
111
- N.tags.length > 0 && /* @__PURE__ */ w("div", {
139
+ F.tags.length > 0 && /* @__PURE__ */ E("div", {
112
140
  className: "mt-4",
113
- children: [/* @__PURE__ */ C("h3", {
141
+ children: [/* @__PURE__ */ T("h3", {
114
142
  className: "mb-2 text-sm font-semibold text-text-primary",
115
- children: k("adaptercloud.common.tags", "Tags")
116
- }), /* @__PURE__ */ C("div", {
143
+ children: j("adaptercloud.common.tags", "Tags")
144
+ }), /* @__PURE__ */ T("div", {
117
145
  className: "flex flex-wrap gap-1.5",
118
- children: N.tags.map((e) => /* @__PURE__ */ C("span", {
146
+ children: F.tags.map((e) => /* @__PURE__ */ T("span", {
119
147
  className: "inline-flex items-center rounded-full bg-bg-sunken px-2.5 py-0.5 text-xs text-text-secondary",
120
148
  children: e
121
149
  }, e))
@@ -123,83 +151,69 @@ function E() {
123
151
  })
124
152
  ]
125
153
  }),
126
- /* @__PURE__ */ w("div", {
154
+ /* @__PURE__ */ E("div", {
127
155
  className: "grid grid-cols-1 gap-6 lg:grid-cols-2",
128
- children: [N.providerTags != null && /* @__PURE__ */ w(T, {
156
+ children: [F.providerTags != null && /* @__PURE__ */ E(D, {
129
157
  className: "p-6",
130
- children: [/* @__PURE__ */ C("h3", {
158
+ children: [/* @__PURE__ */ T("h3", {
131
159
  className: "mb-3 text-sm font-semibold text-text-primary",
132
- children: k("adaptercloud.resources.providerTags", "Provider Tags")
133
- }), /* @__PURE__ */ C("pre", {
160
+ children: j("adaptercloud.resources.providerTags", "Provider Tags")
161
+ }), /* @__PURE__ */ T("pre", {
134
162
  className: "max-h-72 overflow-auto rounded-lg bg-bg-sunken p-4 text-xs text-text-secondary",
135
- children: JSON.stringify(N.providerTags, null, 2)
163
+ children: JSON.stringify(F.providerTags, null, 2)
136
164
  })]
137
- }), N.attributes != null && /* @__PURE__ */ w(T, {
165
+ }), F.attributes != null && /* @__PURE__ */ E(D, {
138
166
  className: "p-6",
139
- children: [/* @__PURE__ */ C("h3", {
167
+ children: [/* @__PURE__ */ T("h3", {
140
168
  className: "mb-3 text-sm font-semibold text-text-primary",
141
- children: k("adaptercloud.resources.attributes", "Attributes")
142
- }), /* @__PURE__ */ C("pre", {
169
+ children: j("adaptercloud.resources.attributes", "Attributes")
170
+ }), /* @__PURE__ */ T("pre", {
143
171
  className: "max-h-72 overflow-auto rounded-lg bg-bg-sunken p-4 text-xs text-text-secondary",
144
- children: JSON.stringify(N.attributes, null, 2)
172
+ children: JSON.stringify(F.attributes, null, 2)
145
173
  })]
146
174
  })]
147
175
  }),
148
- /* @__PURE__ */ w("section", { children: [/* @__PURE__ */ C("h3", {
176
+ /* @__PURE__ */ E("section", { children: [/* @__PURE__ */ T("h3", {
149
177
  className: "mb-3 text-base font-semibold text-text-primary",
150
- children: k("adaptercloud.resources.dependencies", "Dependencies")
151
- }), N.dependsOn && N.dependsOn.length > 0 ? /* @__PURE__ */ C("div", {
152
- className: "divide-y divide-border rounded-xl border border-border-subtle bg-bg-surface",
153
- children: N.dependsOn.map((e) => /* @__PURE__ */ w("button", {
154
- type: "button",
155
- onClick: () => D(`/resources/${e.id}`),
156
- className: "flex w-full items-center gap-3 px-4 py-3 text-left transition-colors hover:bg-accent/50",
157
- children: [
158
- /* @__PURE__ */ C(b, { className: "h-4 w-4 shrink-0 text-text-secondary" }),
159
- /* @__PURE__ */ w("div", {
160
- className: "min-w-0 flex-1",
161
- children: [/* @__PURE__ */ C("p", {
162
- className: "truncate text-sm font-medium text-text-primary",
163
- children: e.name
164
- }), /* @__PURE__ */ w("p", {
165
- className: "mt-0.5 text-xs text-text-secondary",
166
- children: [e.resourceType, e.region ? ` · ${e.region}` : ""]
167
- })]
168
- }),
169
- /* @__PURE__ */ C(a, {
170
- status: e.state,
171
- label: i[e.state]
172
- })
173
- ]
174
- }, e.id))
175
- }) : /* @__PURE__ */ C("p", {
178
+ children: j("adaptercloud.resources.dependencies", "Dependencies (topology)")
179
+ }), F.dependsOn && F.dependsOn.length > 0 ? /* @__PURE__ */ E(w, { children: [/* @__PURE__ */ T(p, {
180
+ nodes: I,
181
+ edges: L,
182
+ selectedId: F.id,
183
+ onSelect: (e) => {
184
+ e !== F.id && k(`/resources/${e}`);
185
+ }
186
+ }), /* @__PURE__ */ T("p", {
187
+ className: "mt-2 text-xs text-text-secondary",
188
+ children: j("adaptercloud.resources.dependenciesHint", "Upstream resources this one depends on. Select a node to open it.")
189
+ })] }) : /* @__PURE__ */ T("p", {
176
190
  className: "rounded-xl border border-border-subtle bg-bg-surface px-4 py-6 text-center text-sm text-text-secondary",
177
- children: k("adaptercloud.resources.noDependencies", "No dependency edges recorded.")
191
+ children: j("adaptercloud.resources.noDependencies", "No dependency edges recorded.")
178
192
  })] }),
179
- /* @__PURE__ */ w("section", { children: [
180
- /* @__PURE__ */ w("h3", {
193
+ /* @__PURE__ */ E("section", { children: [
194
+ /* @__PURE__ */ E("h3", {
181
195
  className: "mb-3 flex items-center gap-2 text-base font-semibold text-text-primary",
182
- children: [/* @__PURE__ */ C(v, { className: "h-4 w-4" }), k("adaptercloud.resources.drift", "Drift")]
196
+ children: [/* @__PURE__ */ T(b, { className: "h-4 w-4" }), j("adaptercloud.resources.drift", "Drift")]
183
197
  }),
184
- I && /* @__PURE__ */ C("p", {
198
+ B && /* @__PURE__ */ T("p", {
185
199
  role: "alert",
186
200
  "aria-live": "polite",
187
201
  className: "mb-3 rounded-lg bg-status-error-bg-subtle px-3 py-2 text-sm text-status-error-text",
188
- children: I
202
+ children: B
189
203
  }),
190
- j.data && j.data.length > 0 ? /* @__PURE__ */ C("div", {
204
+ N.data && N.data.length > 0 ? /* @__PURE__ */ T("div", {
191
205
  className: "divide-y divide-border rounded-xl border border-border-subtle bg-bg-surface",
192
- children: j.data.map((e) => {
206
+ children: N.data.map((e) => {
193
207
  let t = e.status === "DETECTED" || e.status === "ACKNOWLEDGED";
194
- return /* @__PURE__ */ w("div", {
208
+ return /* @__PURE__ */ E("div", {
195
209
  className: "flex items-start gap-3 px-4 py-3",
196
210
  children: [
197
- /* @__PURE__ */ w("div", {
211
+ /* @__PURE__ */ E("div", {
198
212
  className: "min-w-0 flex-1",
199
- children: [/* @__PURE__ */ C("p", {
213
+ children: [/* @__PURE__ */ T("p", {
200
214
  className: "truncate font-mono text-sm text-text-primary",
201
215
  children: e.attributePath
202
- }), /* @__PURE__ */ w("p", {
216
+ }), /* @__PURE__ */ E("p", {
203
217
  className: "mt-0.5 text-xs text-text-secondary",
204
218
  children: [
205
219
  n[e.status],
@@ -208,42 +222,42 @@ function E() {
208
222
  ]
209
223
  })]
210
224
  }),
211
- /* @__PURE__ */ C(o, { severity: e.severity }),
212
- t && /* @__PURE__ */ w("button", {
225
+ /* @__PURE__ */ T(o, { severity: e.severity }),
226
+ t && /* @__PURE__ */ E("button", {
213
227
  type: "button",
214
- disabled: R === e.id,
228
+ disabled: H === e.id,
215
229
  onClick: () => {
216
- L(null), F(e);
230
+ V(null), z(e);
217
231
  },
218
232
  className: "inline-flex shrink-0 items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium text-status-success-text transition-colors hover:bg-status-success-bg-subtle disabled:opacity-50",
219
- children: [R === e.id ? /* @__PURE__ */ C(y, { className: "h-3.5 w-3.5 animate-spin" }) : /* @__PURE__ */ C(x, { className: "h-3.5 w-3.5" }), k("adaptercloud.drift.remediate", "Remediate")]
233
+ children: [H === e.id ? /* @__PURE__ */ T(x, { className: "h-3.5 w-3.5 animate-spin" }) : /* @__PURE__ */ T(S, { className: "h-3.5 w-3.5" }), j("adaptercloud.drift.remediate", "Remediate")]
220
234
  })
221
235
  ]
222
236
  }, e.id);
223
237
  })
224
- }) : /* @__PURE__ */ C("p", {
238
+ }) : /* @__PURE__ */ T("p", {
225
239
  className: "rounded-xl border border-border-subtle bg-bg-surface px-4 py-6 text-center text-sm text-text-secondary",
226
- children: k("adaptercloud.resources.noDrift", "No drift detected for this resource.")
240
+ children: j("adaptercloud.resources.noDrift", "No drift detected for this resource.")
227
241
  })
228
242
  ] })
229
243
  ]
230
244
  })
231
- }), /* @__PURE__ */ C(f, {
232
- open: !!P,
245
+ }), /* @__PURE__ */ T(f, {
246
+ open: !!R,
233
247
  onOpenChange: (e) => {
234
- e || F(null);
248
+ e || z(null);
235
249
  },
236
- title: k("adaptercloud.drift.remediateTitle", "Mark this drift remediated?"),
237
- description: k("adaptercloud.drift.remediatePrompt", "This records the divergence as remediated. Confirm only if the observed state now matches the desired state."),
238
- confirmLabel: k("adaptercloud.drift.remediate", "Remediate"),
239
- cancelLabel: k("adaptercloud.common.cancel", "Cancel"),
240
- onConfirm: () => P && z(P.id),
241
- isPending: !!P && R === P?.id,
250
+ title: j("adaptercloud.drift.remediateTitle", "Mark this drift remediated?"),
251
+ description: j("adaptercloud.drift.remediatePrompt", "This records the divergence as remediated. Confirm only if the observed state now matches the desired state."),
252
+ confirmLabel: j("adaptercloud.drift.remediate", "Remediate"),
253
+ cancelLabel: j("adaptercloud.common.cancel", "Cancel"),
254
+ onConfirm: () => R && U(R.id),
255
+ isPending: !!R && H === R?.id,
242
256
  tone: "primary"
243
257
  })]
244
258
  });
245
259
  }
246
260
  //#endregion
247
- export { E as ResourceDetailPage };
261
+ export { O as ResourceDetailPage };
248
262
 
249
263
  //# sourceMappingURL=ResourceDetailPage.js.map
package/dist/adaptercloud/pages/resources/ResourceDetailPage.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ResourceDetailPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/resources/ResourceDetailPage.tsx"],"sourcesContent":["/**\n * Resource Detail Page\n * @module adaptercloud/pages/resources\n *\n * One discovered resource (`adaResource`) — its connection, lifecycle state,\n * cost, provider tags / attributes, dependency edges, and any drift records that\n * reference it (`adaListDriftRecords`).\n */\n\nimport { useCallback, useState } from 'react';\nimport { useParams } from 'react-router-dom';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { ArrowLeft, Server, GitCompareArrows, Cable, Wrench, Loader2 } from 'lucide-react';\nimport { GlassCard } from '@burdenoff/fe-libs/ui';\nimport { PageLayout } from '../../components/PageLayout';\nimport { StatusBadge } from '../../components/StatusBadge';\nimport { SeverityBadge } from '../../components/SeverityBadge';\nimport { DataState } from '../../components/DataState';\nimport { ConfirmDialog } from '../../components/ConfirmDialog';\nimport { useAdapterCloud } from '../../context/AdapterCloudContext';\nimport { useResource, useDriftRecords, useRemediateDrift } from '../../hooks/useAdapterCloudApi';\nimport { resourceStateLabels, driftStatusLabels, formatMoney } from '../../utils/domain';\nimport { formatDate } from '../../utils/formatters';\nimport type { AdaDriftRecord } from '../../types';\n\nexport function ResourceDetailPage() {\n const { id } = useParams<{ id: string }>();\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 query = useResource(id);\n const drift = useDriftRecords({ resourceId: id });\n const remediate = useRemediateDrift();\n const resource = query.data;\n\n const [confirmTarget, setConfirmTarget] = useState<AdaDriftRecord | null>(null);\n const [actionError, setActionError] = useState<string | null>(null);\n\n // Per-id pending so only the acted drift row spins/disables.\n const pendingId = remediate.isPending ? remediate.variables : undefined;\n\n const handleRemediate = useCallback(\n (driftId: string) => {\n setActionError(null);\n remediate.mutate(driftId, {\n onSuccess: () => setConfirmTarget(null),\n onError: (err) =>\n setActionError(err instanceof Error ? err.message : 'Failed to remediate drift.'),\n });\n },\n [remediate]\n );\n\n return (\n <PageLayout\n title={resource?.name ?? t('adaptercloud.resources.detailTitle', 'Resource')}\n description={resource?.resourceType}\n actions={\n <button\n type=\"button\"\n onClick={() => navigateTo('/resources')}\n 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\"\n >\n <ArrowLeft className=\"h-4 w-4\" />\n {t('adaptercloud.common.back', 'Back')}\n </button>\n }\n >\n <DataState\n isLoading={query.isLoading}\n isError={query.isError}\n isEmpty={!query.isLoading && !resource}\n error={query.error}\n onRetry={() => void query.refetch()}\n emptyTitle={t('adaptercloud.resources.notFound', 'Resource not found')}\n >\n {resource && (\n <div className=\"space-y-6\">\n {/* Summary */}\n <GlassCard className=\"p-6\">\n <div className=\"mb-4 flex flex-wrap items-center gap-3\">\n <StatusBadge status={resource.state} label={resourceStateLabels[resource.state]} />\n <span className=\"inline-flex items-center rounded-full bg-bg-sunken px-2.5 py-0.5 text-xs font-medium text-text-secondary\">\n {resource.resourceType}\n </span>\n <span className=\"text-sm font-semibold tabular-nums text-text-primary\">\n {formatMoney(resource.monthlyCost)}\n <span className=\"ml-1 text-xs font-normal text-text-secondary\">\n {t('adaptercloud.resources.perMonth', '/mo')}\n </span>\n </span>\n </div>\n\n <dl className=\"grid grid-cols-2 gap-4 text-sm sm:grid-cols-3\">\n <div className=\"col-span-2 sm:col-span-3\">\n <dt className=\"text-text-secondary\">\n {t('adaptercloud.resources.externalId', 'External ID')}\n </dt>\n <dd className=\"mt-0.5 break-all font-mono text-xs text-text-primary\">\n {resource.externalId}\n </dd>\n </div>\n <div>\n <dt className=\"text-text-secondary\">\n {t('adaptercloud.resources.region', 'Region')}\n </dt>\n <dd className=\"mt-0.5 font-medium text-text-primary\">{resource.region ?? '—'}</dd>\n </div>\n <div>\n <dt className=\"text-text-secondary\">\n {t('adaptercloud.resources.lastSeen', 'Last Seen')}\n </dt>\n <dd className=\"mt-0.5 font-medium text-text-primary\">\n {resource.lastSeenAt ? formatDate(resource.lastSeenAt) : '—'}\n </dd>\n </div>\n <div>\n <dt className=\"text-text-secondary\">\n {t('adaptercloud.common.updated', 'Updated')}\n </dt>\n <dd className=\"mt-0.5 font-medium text-text-primary\">\n {formatDate(resource.updatedAt)}\n </dd>\n </div>\n </dl>\n\n {resource.connection && (\n <button\n type=\"button\"\n onClick={() => navigateTo(`/connections/${resource.connection?.id}`)}\n className=\"mt-4 inline-flex items-center gap-2 rounded-lg border border-border-subtle px-3 py-2 text-sm text-text-primary transition-colors hover:bg-accent\"\n >\n <Cable className=\"h-4 w-4 text-text-secondary\" />\n {resource.connection.name}\n </button>\n )}\n\n {resource.tags.length > 0 && (\n <div className=\"mt-4\">\n <h3 className=\"mb-2 text-sm font-semibold text-text-primary\">\n {t('adaptercloud.common.tags', 'Tags')}\n </h3>\n <div className=\"flex flex-wrap gap-1.5\">\n {resource.tags.map((tag) => (\n <span\n key={tag}\n className=\"inline-flex items-center rounded-full bg-bg-sunken px-2.5 py-0.5 text-xs text-text-secondary\"\n >\n {tag}\n </span>\n ))}\n </div>\n </div>\n )}\n </GlassCard>\n\n {/* Provider tags + attributes */}\n <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-2\">\n {resource.providerTags != null && (\n <GlassCard className=\"p-6\">\n <h3 className=\"mb-3 text-sm font-semibold text-text-primary\">\n {t('adaptercloud.resources.providerTags', 'Provider Tags')}\n </h3>\n <pre className=\"max-h-72 overflow-auto rounded-lg bg-bg-sunken p-4 text-xs text-text-secondary\">\n {JSON.stringify(resource.providerTags, null, 2)}\n </pre>\n </GlassCard>\n )}\n {resource.attributes != null && (\n <GlassCard className=\"p-6\">\n <h3 className=\"mb-3 text-sm font-semibold text-text-primary\">\n {t('adaptercloud.resources.attributes', 'Attributes')}\n </h3>\n <pre className=\"max-h-72 overflow-auto rounded-lg bg-bg-sunken p-4 text-xs text-text-secondary\">\n {JSON.stringify(resource.attributes, null, 2)}\n </pre>\n </GlassCard>\n )}\n </div>\n\n {/* Dependencies */}\n <section>\n <h3 className=\"mb-3 text-base font-semibold text-text-primary\">\n {t('adaptercloud.resources.dependencies', 'Dependencies')}\n </h3>\n {resource.dependsOn && resource.dependsOn.length > 0 ? (\n <div className=\"divide-y divide-border rounded-xl border border-border-subtle bg-bg-surface\">\n {resource.dependsOn.map((dep) => (\n <button\n key={dep.id}\n type=\"button\"\n onClick={() => navigateTo(`/resources/${dep.id}`)}\n className=\"flex w-full items-center gap-3 px-4 py-3 text-left transition-colors hover:bg-accent/50\"\n >\n <Server className=\"h-4 w-4 shrink-0 text-text-secondary\" />\n <div className=\"min-w-0 flex-1\">\n <p className=\"truncate text-sm font-medium text-text-primary\">{dep.name}</p>\n <p className=\"mt-0.5 text-xs text-text-secondary\">\n {dep.resourceType}\n {dep.region ? ` · ${dep.region}` : ''}\n </p>\n </div>\n <StatusBadge status={dep.state} label={resourceStateLabels[dep.state]} />\n </button>\n ))}\n </div>\n ) : (\n <p className=\"rounded-xl border border-border-subtle bg-bg-surface px-4 py-6 text-center text-sm text-text-secondary\">\n {t('adaptercloud.resources.noDependencies', 'No dependency edges recorded.')}\n </p>\n )}\n </section>\n\n {/* Drift */}\n <section>\n <h3 className=\"mb-3 flex items-center gap-2 text-base font-semibold text-text-primary\">\n <GitCompareArrows className=\"h-4 w-4\" />\n {t('adaptercloud.resources.drift', 'Drift')}\n </h3>\n {actionError && (\n <p\n role=\"alert\"\n aria-live=\"polite\"\n className=\"mb-3 rounded-lg bg-status-error-bg-subtle px-3 py-2 text-sm text-status-error-text\"\n >\n {actionError}\n </p>\n )}\n {drift.data && drift.data.length > 0 ? (\n <div className=\"divide-y divide-border rounded-xl border border-border-subtle bg-bg-surface\">\n {drift.data.map((d) => {\n const canRemediate = d.status === 'DETECTED' || d.status === 'ACKNOWLEDGED';\n return (\n <div key={d.id} className=\"flex items-start gap-3 px-4 py-3\">\n <div className=\"min-w-0 flex-1\">\n <p className=\"truncate font-mono text-sm text-text-primary\">\n {d.attributePath}\n </p>\n <p className=\"mt-0.5 text-xs text-text-secondary\">\n {driftStatusLabels[d.status]} · {formatDate(d.detectedAt)}\n </p>\n </div>\n <SeverityBadge severity={d.severity} />\n {canRemediate && (\n <button\n type=\"button\"\n disabled={pendingId === d.id}\n onClick={() => {\n setActionError(null);\n setConfirmTarget(d);\n }}\n className=\"inline-flex shrink-0 items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium text-status-success-text transition-colors hover:bg-status-success-bg-subtle disabled:opacity-50\"\n >\n {pendingId === d.id ? (\n <Loader2 className=\"h-3.5 w-3.5 animate-spin\" />\n ) : (\n <Wrench className=\"h-3.5 w-3.5\" />\n )}\n {t('adaptercloud.drift.remediate', 'Remediate')}\n </button>\n )}\n </div>\n );\n })}\n </div>\n ) : (\n <p className=\"rounded-xl border border-border-subtle bg-bg-surface px-4 py-6 text-center text-sm text-text-secondary\">\n {t('adaptercloud.resources.noDrift', 'No drift detected for this resource.')}\n </p>\n )}\n </section>\n </div>\n )}\n </DataState>\n\n <ConfirmDialog\n open={Boolean(confirmTarget)}\n onOpenChange={(open) => {\n if (!open) setConfirmTarget(null);\n }}\n title={t('adaptercloud.drift.remediateTitle', 'Mark this drift remediated?')}\n description={t(\n 'adaptercloud.drift.remediatePrompt',\n 'This records the divergence as remediated. Confirm only if the observed state now matches the desired state.'\n )}\n confirmLabel={t('adaptercloud.drift.remediate', 'Remediate')}\n cancelLabel={t('adaptercloud.common.cancel', 'Cancel')}\n onConfirm={() => confirmTarget && handleRemediate(confirmTarget.id)}\n isPending={Boolean(confirmTarget) && pendingId === confirmTarget?.id}\n tone=\"primary\"\n />\n </PageLayout>\n );\n}\n"],"mappings":"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"}
1
+ {"version":3,"file":"ResourceDetailPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/resources/ResourceDetailPage.tsx"],"sourcesContent":["/**\n * Resource Detail Page\n * @module adaptercloud/pages/resources\n *\n * One discovered resource (`adaResource`) — its connection, lifecycle state,\n * cost, provider tags / attributes, dependency edges, and any drift records that\n * reference it (`adaListDriftRecords`).\n */\n\nimport { useCallback, useMemo, useState } from 'react';\nimport { useParams } from 'react-router-dom';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { ArrowLeft, GitCompareArrows, Cable, Wrench, Loader2 } from 'lucide-react';\nimport { GlassCard } from '@burdenoff/fe-libs/ui';\nimport { PageLayout } from '../../components/PageLayout';\nimport { StatusBadge } from '../../components/StatusBadge';\nimport { SeverityBadge } from '../../components/SeverityBadge';\nimport { DataState } from '../../components/DataState';\nimport { ConfirmDialog } from '../../components/ConfirmDialog';\nimport { TopologyGraph, type TopologyEdge, type TopologyNode } from '../../components/viz';\nimport { useAdapterCloud } from '../../context/AdapterCloudContext';\nimport { useResource, useDriftRecords, useRemediateDrift } from '../../hooks/useAdapterCloudApi';\nimport { resourceStateLabels, driftStatusLabels, formatMoney } from '../../utils/domain';\nimport { formatDate } from '../../utils/formatters';\nimport type { AdaDriftRecord } from '../../types';\n\nexport function ResourceDetailPage() {\n const { id } = useParams<{ id: string }>();\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 query = useResource(id);\n const drift = useDriftRecords({ resourceId: id });\n const remediate = useRemediateDrift();\n const resource = query.data;\n\n // Dependency topology: upstream `dependsOn` nodes on the left, this resource\n // (the focused node) on the right, edges pointing into it — mirrors the mock.\n const { topoNodes, topoEdges } = useMemo(() => {\n const deps = resource?.dependsOn ?? [];\n if (!resource || deps.length === 0) {\n return { topoNodes: [] as TopologyNode[], topoEdges: [] as TopologyEdge[] };\n }\n const nodes: TopologyNode[] = [\n ...deps.map((dep) => ({\n id: dep.id,\n label: dep.name,\n group: 'deps',\n type: dep.resourceType,\n state: dep.state,\n })),\n {\n id: resource.id,\n label: resource.name,\n group: 'focus',\n type: resource.resourceType,\n state: resource.state,\n },\n ];\n const edges: TopologyEdge[] = deps.map((dep) => ({\n id: `${dep.id}->${resource.id}`,\n from: dep.id,\n to: resource.id,\n kind: 'DEPENDS_ON',\n }));\n return { topoNodes: nodes, topoEdges: edges };\n }, [resource]);\n\n const [confirmTarget, setConfirmTarget] = useState<AdaDriftRecord | null>(null);\n const [actionError, setActionError] = useState<string | null>(null);\n\n // Per-id pending so only the acted drift row spins/disables.\n const pendingId = remediate.isPending ? remediate.variables : undefined;\n\n const handleRemediate = useCallback(\n (driftId: string) => {\n setActionError(null);\n remediate.mutate(driftId, {\n onSuccess: () => setConfirmTarget(null),\n onError: (err) =>\n setActionError(err instanceof Error ? err.message : 'Failed to remediate drift.'),\n });\n },\n [remediate]\n );\n\n return (\n <PageLayout\n title={resource?.name ?? t('adaptercloud.resources.detailTitle', 'Resource')}\n description={resource?.resourceType}\n actions={\n <button\n type=\"button\"\n onClick={() => navigateTo('/resources')}\n 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\"\n >\n <ArrowLeft className=\"h-4 w-4\" />\n {t('adaptercloud.common.back', 'Back')}\n </button>\n }\n >\n <DataState\n isLoading={query.isLoading}\n isError={query.isError}\n isEmpty={!query.isLoading && !resource}\n error={query.error}\n onRetry={() => void query.refetch()}\n emptyTitle={t('adaptercloud.resources.notFound', 'Resource not found')}\n >\n {resource && (\n <div className=\"space-y-6\">\n {/* Summary */}\n <GlassCard className=\"p-6\">\n <div className=\"mb-4 flex flex-wrap items-center gap-3\">\n <StatusBadge status={resource.state} label={resourceStateLabels[resource.state]} />\n <span className=\"inline-flex items-center rounded-full bg-bg-sunken px-2.5 py-0.5 text-xs font-medium text-text-secondary\">\n {resource.resourceType}\n </span>\n <span className=\"text-sm font-semibold tabular-nums text-text-primary\">\n {formatMoney(resource.monthlyCost)}\n <span className=\"ml-1 text-xs font-normal text-text-secondary\">\n {t('adaptercloud.resources.perMonth', '/mo')}\n </span>\n </span>\n </div>\n\n <dl className=\"grid grid-cols-2 gap-4 text-sm sm:grid-cols-3\">\n <div className=\"col-span-2 sm:col-span-3\">\n <dt className=\"text-text-secondary\">\n {t('adaptercloud.resources.externalId', 'External ID')}\n </dt>\n <dd className=\"mt-0.5 break-all font-mono text-xs text-text-primary\">\n {resource.externalId}\n </dd>\n </div>\n <div>\n <dt className=\"text-text-secondary\">\n {t('adaptercloud.resources.region', 'Region')}\n </dt>\n <dd className=\"mt-0.5 font-medium text-text-primary\">{resource.region ?? '—'}</dd>\n </div>\n <div>\n <dt className=\"text-text-secondary\">\n {t('adaptercloud.resources.lastSeen', 'Last Seen')}\n </dt>\n <dd className=\"mt-0.5 font-medium text-text-primary\">\n {resource.lastSeenAt ? formatDate(resource.lastSeenAt) : '—'}\n </dd>\n </div>\n <div>\n <dt className=\"text-text-secondary\">\n {t('adaptercloud.common.updated', 'Updated')}\n </dt>\n <dd className=\"mt-0.5 font-medium text-text-primary\">\n {formatDate(resource.updatedAt)}\n </dd>\n </div>\n </dl>\n\n {resource.connection && (\n <button\n type=\"button\"\n onClick={() => navigateTo(`/connections/${resource.connection?.id}`)}\n className=\"mt-4 inline-flex items-center gap-2 rounded-lg border border-border-subtle px-3 py-2 text-sm text-text-primary transition-colors hover:bg-accent\"\n >\n <Cable className=\"h-4 w-4 text-text-secondary\" />\n {resource.connection.name}\n </button>\n )}\n\n {resource.tags.length > 0 && (\n <div className=\"mt-4\">\n <h3 className=\"mb-2 text-sm font-semibold text-text-primary\">\n {t('adaptercloud.common.tags', 'Tags')}\n </h3>\n <div className=\"flex flex-wrap gap-1.5\">\n {resource.tags.map((tag) => (\n <span\n key={tag}\n className=\"inline-flex items-center rounded-full bg-bg-sunken px-2.5 py-0.5 text-xs text-text-secondary\"\n >\n {tag}\n </span>\n ))}\n </div>\n </div>\n )}\n </GlassCard>\n\n {/* Provider tags + attributes */}\n <div className=\"grid grid-cols-1 gap-6 lg:grid-cols-2\">\n {resource.providerTags != null && (\n <GlassCard className=\"p-6\">\n <h3 className=\"mb-3 text-sm font-semibold text-text-primary\">\n {t('adaptercloud.resources.providerTags', 'Provider Tags')}\n </h3>\n <pre className=\"max-h-72 overflow-auto rounded-lg bg-bg-sunken p-4 text-xs text-text-secondary\">\n {JSON.stringify(resource.providerTags, null, 2)}\n </pre>\n </GlassCard>\n )}\n {resource.attributes != null && (\n <GlassCard className=\"p-6\">\n <h3 className=\"mb-3 text-sm font-semibold text-text-primary\">\n {t('adaptercloud.resources.attributes', 'Attributes')}\n </h3>\n <pre className=\"max-h-72 overflow-auto rounded-lg bg-bg-sunken p-4 text-xs text-text-secondary\">\n {JSON.stringify(resource.attributes, null, 2)}\n </pre>\n </GlassCard>\n )}\n </div>\n\n {/* Dependencies (topology) */}\n <section>\n <h3 className=\"mb-3 text-base font-semibold text-text-primary\">\n {t('adaptercloud.resources.dependencies', 'Dependencies (topology)')}\n </h3>\n {resource.dependsOn && resource.dependsOn.length > 0 ? (\n <>\n <TopologyGraph\n nodes={topoNodes}\n edges={topoEdges}\n selectedId={resource.id}\n onSelect={(nodeId) => {\n if (nodeId !== resource.id) navigateTo(`/resources/${nodeId}`);\n }}\n />\n <p className=\"mt-2 text-xs text-text-secondary\">\n {t(\n 'adaptercloud.resources.dependenciesHint',\n 'Upstream resources this one depends on. Select a node to open it.'\n )}\n </p>\n </>\n ) : (\n <p className=\"rounded-xl border border-border-subtle bg-bg-surface px-4 py-6 text-center text-sm text-text-secondary\">\n {t('adaptercloud.resources.noDependencies', 'No dependency edges recorded.')}\n </p>\n )}\n </section>\n\n {/* Drift */}\n <section>\n <h3 className=\"mb-3 flex items-center gap-2 text-base font-semibold text-text-primary\">\n <GitCompareArrows className=\"h-4 w-4\" />\n {t('adaptercloud.resources.drift', 'Drift')}\n </h3>\n {actionError && (\n <p\n role=\"alert\"\n aria-live=\"polite\"\n className=\"mb-3 rounded-lg bg-status-error-bg-subtle px-3 py-2 text-sm text-status-error-text\"\n >\n {actionError}\n </p>\n )}\n {drift.data && drift.data.length > 0 ? (\n <div className=\"divide-y divide-border rounded-xl border border-border-subtle bg-bg-surface\">\n {drift.data.map((d) => {\n const canRemediate = d.status === 'DETECTED' || d.status === 'ACKNOWLEDGED';\n return (\n <div key={d.id} className=\"flex items-start gap-3 px-4 py-3\">\n <div className=\"min-w-0 flex-1\">\n <p className=\"truncate font-mono text-sm text-text-primary\">\n {d.attributePath}\n </p>\n <p className=\"mt-0.5 text-xs text-text-secondary\">\n {driftStatusLabels[d.status]} · {formatDate(d.detectedAt)}\n </p>\n </div>\n <SeverityBadge severity={d.severity} />\n {canRemediate && (\n <button\n type=\"button\"\n disabled={pendingId === d.id}\n onClick={() => {\n setActionError(null);\n setConfirmTarget(d);\n }}\n className=\"inline-flex shrink-0 items-center gap-1.5 rounded-lg border border-border-subtle px-3 py-1.5 text-xs font-medium text-status-success-text transition-colors hover:bg-status-success-bg-subtle disabled:opacity-50\"\n >\n {pendingId === d.id ? (\n <Loader2 className=\"h-3.5 w-3.5 animate-spin\" />\n ) : (\n <Wrench className=\"h-3.5 w-3.5\" />\n )}\n {t('adaptercloud.drift.remediate', 'Remediate')}\n </button>\n )}\n </div>\n );\n })}\n </div>\n ) : (\n <p className=\"rounded-xl border border-border-subtle bg-bg-surface px-4 py-6 text-center text-sm text-text-secondary\">\n {t('adaptercloud.resources.noDrift', 'No drift detected for this resource.')}\n </p>\n )}\n </section>\n </div>\n )}\n </DataState>\n\n <ConfirmDialog\n open={Boolean(confirmTarget)}\n onOpenChange={(open) => {\n if (!open) setConfirmTarget(null);\n }}\n title={t('adaptercloud.drift.remediateTitle', 'Mark this drift remediated?')}\n description={t(\n 'adaptercloud.drift.remediatePrompt',\n 'This records the divergence as remediated. Confirm only if the observed state now matches the desired state.'\n )}\n confirmLabel={t('adaptercloud.drift.remediate', 'Remediate')}\n cancelLabel={t('adaptercloud.common.cancel', 'Cancel')}\n onConfirm={() => confirmTarget && handleRemediate(confirmTarget.id)}\n isPending={Boolean(confirmTarget) && pendingId === confirmTarget?.id}\n tone=\"primary\"\n />\n </PageLayout>\n );\n}\n"],"mappings":"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"}
package/dist/adaptercloud/pages/resources/ResourcesListPage.js CHANGED
@@ -52,10 +52,19 @@ function x() {
52
52
  header: T("adaptercloud.resources.type", "Type"),
53
53
  priority: "primary",
54
54
  cell: (e) => /* @__PURE__ */ _("span", {
55
- className: "text-sm text-text-primary",
55
+ className: "font-mono text-xs text-text-primary",
56
56
  children: e.resourceType
57
57
  })
58
58
  },
59
+ {
60
+ key: "connection",
61
+ header: T("adaptercloud.resources.connection", "Connection"),
62
+ priority: "secondary",
63
+ cell: (e) => /* @__PURE__ */ _("span", {
64
+ className: "truncate text-sm text-text-secondary",
65
+ children: e.connection?.name ?? "—"
66
+ })
67
+ },
59
68
  {
60
69
  key: "region",
61
70
  header: T("adaptercloud.resources.region", "Region"),
package/dist/adaptercloud/pages/resources/ResourcesListPage.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ResourcesListPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/resources/ResourcesListPage.tsx"],"sourcesContent":["/**\n * Resources List Page\n * @module adaptercloud/pages/resources\n *\n * The unified resource inventory across the workspace (`adaListResources`).\n * Supports filtering by lifecycle state, resource type (free text) and, via the\n * `?connectionId=` URL param, by connection. Offset pagination.\n */\n\nimport { useState, useCallback } from 'react';\nimport { useSearchParams } from 'react-router-dom';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { Server, ChevronLeft, ChevronRight, Search, X } from 'lucide-react';\nimport { ResponsiveTable, type ResponsiveTableColumn } 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 { useResources } from '../../hooks/useAdapterCloudApi';\nimport { resourceStateLabels, formatMoney } from '../../utils/domain';\nimport { formatRelativeTime } from '../../utils/formatters';\nimport type { AdaResource, AdaResourceState } from '../../types';\n\nconst PAGE_SIZE = 25;\n\nexport function ResourcesListPage() {\n const { navigateTo } = useAdapterCloud();\n const [searchParams] = useSearchParams();\n const connectionId = searchParams.get('connectionId') ?? undefined;\n\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 [state, setState] = useState<AdaResourceState | ''>('');\n const [typeInput, setTypeInput] = useState('');\n const [appliedType, setAppliedType] = useState('');\n const [offset, setOffset] = useState(0);\n\n const query = useResources({\n connectionId,\n state: state || undefined,\n resourceType: appliedType || 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 onSearch = useCallback(\n (e: React.FormEvent) => {\n e.preventDefault();\n setAppliedType(typeInput.trim());\n setOffset(0);\n },\n [typeInput]\n );\n\n const clearType = useCallback(() => {\n setTypeInput('');\n setAppliedType('');\n setOffset(0);\n }, []);\n\n // Clearing the connection scope must return to a clean page 1 of the full\n // inventory — reset offset AND the applied filters, then drop the URL param.\n const clearScope = useCallback(() => {\n setState('');\n setTypeInput('');\n setAppliedType('');\n setOffset(0);\n navigateTo('/resources');\n }, [navigateTo]);\n\n const columns: ResponsiveTableColumn<AdaResource>[] = [\n {\n key: 'name',\n header: t('adaptercloud.resources.name', 'Name'),\n priority: 'primary',\n cell: (r) => (\n <div className=\"min-w-0\">\n <p className=\"truncate font-medium text-text-primary\">{r.name}</p>\n <p className=\"truncate text-xs text-text-secondary\">{r.externalId}</p>\n </div>\n ),\n },\n {\n key: 'type',\n header: t('adaptercloud.resources.type', 'Type'),\n priority: 'primary',\n cell: (r) => <span className=\"text-sm text-text-primary\">{r.resourceType}</span>,\n },\n {\n key: 'region',\n header: t('adaptercloud.resources.region', 'Region'),\n priority: 'secondary',\n cell: (r) => <span className=\"text-sm text-text-secondary\">{r.region ?? '—'}</span>,\n },\n {\n key: 'cost',\n header: t('adaptercloud.resources.monthlyCost', 'Monthly Cost'),\n priority: 'secondary',\n cell: (r) => (\n <span className=\"text-sm tabular-nums text-text-primary\">{formatMoney(r.monthlyCost)}</span>\n ),\n },\n {\n key: 'state',\n header: t('adaptercloud.resources.state', 'State'),\n priority: 'primary',\n cell: (r) => <StatusBadge status={r.state} label={resourceStateLabels[r.state]} />,\n },\n {\n key: 'seen',\n header: t('adaptercloud.resources.lastSeen', 'Last Seen'),\n priority: 'hidden-on-mobile',\n cell: (r) => (\n <span className=\"text-xs text-text-secondary\">\n {r.lastSeenAt ? formatRelativeTime(r.lastSeenAt) : '—'}\n </span>\n ),\n },\n ];\n\n return (\n <PageLayout\n title={t('adaptercloud.resources.title', 'Resources')}\n description={t(\n 'adaptercloud.resources.subtitle',\n 'The unified inventory of everything discovered across every connection.'\n )}\n >\n {/* Filters */}\n <div className=\"mb-6 flex flex-wrap items-center gap-3\">\n <select\n value={state}\n onChange={(e) => {\n setState(e.target.value as AdaResourceState | '');\n setOffset(0);\n }}\n aria-label={t('adaptercloud.resources.filterByState', 'Filter by lifecycle state')}\n className=\"w-full 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)] sm:w-auto\"\n >\n <option value=\"\">{t('adaptercloud.resources.allStates', 'All states')}</option>\n {(Object.keys(resourceStateLabels) as AdaResourceState[]).map((s) => (\n <option key={s} value={s}>\n {resourceStateLabels[s]}\n </option>\n ))}\n </select>\n <form onSubmit={onSearch} role=\"search\" className=\"flex w-full items-center gap-2 sm:w-auto\">\n <div className=\"relative w-full sm:w-56\">\n <input\n type=\"text\"\n value={typeInput}\n onChange={(e) => setTypeInput(e.target.value)}\n aria-label={t('adaptercloud.resources.filterType', 'Filter by resource type')}\n placeholder={t('adaptercloud.resources.filterTypePlaceholder', 'Filter by type…')}\n 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)]\"\n />\n {appliedType && (\n <button\n type=\"button\"\n onClick={clearType}\n aria-label={t('adaptercloud.resources.clearTypeFilter', 'Clear type filter')}\n 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)]\"\n >\n <X className=\"h-4 w-4\" />\n </button>\n )}\n </div>\n <button\n type=\"submit\"\n aria-label={t('adaptercloud.resources.applyTypeFilter', 'Apply type filter')}\n 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)]\"\n >\n <Search className=\"h-4 w-4\" />\n </button>\n </form>\n {connectionId && (\n <span className=\"inline-flex items-center gap-1.5 rounded-full bg-accent-blue-subtle px-2.5 py-1 text-xs text-accent-blue\">\n {t('adaptercloud.resources.scopedToConnection', 'Scoped to connection')}\n <button\n type=\"button\"\n onClick={clearScope}\n aria-label={t('adaptercloud.resources.clearScope', 'Clear connection scope')}\n className=\"inline-flex items-center rounded p-0.5 font-semibold transition-colors hover:text-accent-blue-hover focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n >\n <X className=\"h-3.5 w-3.5\" />\n </button>\n </span>\n )}\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.resources.emptyTitle', 'No resources found')}\n emptyDescription={t(\n 'adaptercloud.resources.emptyDescription',\n 'Run a discovery sync against a connection to populate the inventory.'\n )}\n emptyIcon={<Server className=\"h-10 w-10\" />}\n emptyAction={\n <button\n type=\"button\"\n onClick={() => navigateTo('/connections')}\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.resources.goToConnections', 'Go to connections')}\n </button>\n }\n >\n <ResponsiveTable\n data={items}\n columns={columns}\n rowKey={(r) => r.id}\n onRowClick={(r) => navigateTo(`/resources/${r.id}`)}\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":"ResourcesListPage.js","names":[],"sources":["../../../../src/adaptercloud/pages/resources/ResourcesListPage.tsx"],"sourcesContent":["/**\n * Resources List Page\n * @module adaptercloud/pages/resources\n *\n * The unified resource inventory across the workspace (`adaListResources`).\n * Supports filtering by lifecycle state, resource type (free text) and, via the\n * `?connectionId=` URL param, by connection. Offset pagination.\n */\n\nimport { useState, useCallback } from 'react';\nimport { useSearchParams } from 'react-router-dom';\nimport { useI18n } from '@burdenoff/fe-libs/shared/providers/shell/I18nProvider';\nimport { Server, ChevronLeft, ChevronRight, Search, X } from 'lucide-react';\nimport { ResponsiveTable, type ResponsiveTableColumn } 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 { useResources } from '../../hooks/useAdapterCloudApi';\nimport { resourceStateLabels, formatMoney } from '../../utils/domain';\nimport { formatRelativeTime } from '../../utils/formatters';\nimport type { AdaResource, AdaResourceState } from '../../types';\n\nconst PAGE_SIZE = 25;\n\nexport function ResourcesListPage() {\n const { navigateTo } = useAdapterCloud();\n const [searchParams] = useSearchParams();\n const connectionId = searchParams.get('connectionId') ?? undefined;\n\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 [state, setState] = useState<AdaResourceState | ''>('');\n const [typeInput, setTypeInput] = useState('');\n const [appliedType, setAppliedType] = useState('');\n const [offset, setOffset] = useState(0);\n\n const query = useResources({\n connectionId,\n state: state || undefined,\n resourceType: appliedType || 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 onSearch = useCallback(\n (e: React.FormEvent) => {\n e.preventDefault();\n setAppliedType(typeInput.trim());\n setOffset(0);\n },\n [typeInput]\n );\n\n const clearType = useCallback(() => {\n setTypeInput('');\n setAppliedType('');\n setOffset(0);\n }, []);\n\n // Clearing the connection scope must return to a clean page 1 of the full\n // inventory — reset offset AND the applied filters, then drop the URL param.\n const clearScope = useCallback(() => {\n setState('');\n setTypeInput('');\n setAppliedType('');\n setOffset(0);\n navigateTo('/resources');\n }, [navigateTo]);\n\n const columns: ResponsiveTableColumn<AdaResource>[] = [\n {\n key: 'name',\n header: t('adaptercloud.resources.name', 'Name'),\n priority: 'primary',\n cell: (r) => (\n <div className=\"min-w-0\">\n <p className=\"truncate font-medium text-text-primary\">{r.name}</p>\n <p className=\"truncate text-xs text-text-secondary\">{r.externalId}</p>\n </div>\n ),\n },\n {\n key: 'type',\n header: t('adaptercloud.resources.type', 'Type'),\n priority: 'primary',\n cell: (r) => <span className=\"font-mono text-xs text-text-primary\">{r.resourceType}</span>,\n },\n {\n key: 'connection',\n header: t('adaptercloud.resources.connection', 'Connection'),\n priority: 'secondary',\n cell: (r) => (\n <span className=\"truncate text-sm text-text-secondary\">{r.connection?.name ?? '—'}</span>\n ),\n },\n {\n key: 'region',\n header: t('adaptercloud.resources.region', 'Region'),\n priority: 'secondary',\n cell: (r) => <span className=\"text-sm text-text-secondary\">{r.region ?? '—'}</span>,\n },\n {\n key: 'cost',\n header: t('adaptercloud.resources.monthlyCost', 'Monthly Cost'),\n priority: 'secondary',\n cell: (r) => (\n <span className=\"text-sm tabular-nums text-text-primary\">{formatMoney(r.monthlyCost)}</span>\n ),\n },\n {\n key: 'state',\n header: t('adaptercloud.resources.state', 'State'),\n priority: 'primary',\n cell: (r) => <StatusBadge status={r.state} label={resourceStateLabels[r.state]} />,\n },\n {\n key: 'seen',\n header: t('adaptercloud.resources.lastSeen', 'Last Seen'),\n priority: 'hidden-on-mobile',\n cell: (r) => (\n <span className=\"text-xs text-text-secondary\">\n {r.lastSeenAt ? formatRelativeTime(r.lastSeenAt) : '—'}\n </span>\n ),\n },\n ];\n\n return (\n <PageLayout\n title={t('adaptercloud.resources.title', 'Resources')}\n description={t(\n 'adaptercloud.resources.subtitle',\n 'The unified inventory of everything discovered across every connection.'\n )}\n >\n {/* Filters */}\n <div className=\"mb-6 flex flex-wrap items-center gap-3\">\n <select\n value={state}\n onChange={(e) => {\n setState(e.target.value as AdaResourceState | '');\n setOffset(0);\n }}\n aria-label={t('adaptercloud.resources.filterByState', 'Filter by lifecycle state')}\n className=\"w-full 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)] sm:w-auto\"\n >\n <option value=\"\">{t('adaptercloud.resources.allStates', 'All states')}</option>\n {(Object.keys(resourceStateLabels) as AdaResourceState[]).map((s) => (\n <option key={s} value={s}>\n {resourceStateLabels[s]}\n </option>\n ))}\n </select>\n <form\n onSubmit={onSearch}\n role=\"search\"\n className=\"flex w-full items-center gap-2 sm:w-auto\"\n >\n <div className=\"relative w-full sm:w-56\">\n <input\n type=\"text\"\n value={typeInput}\n onChange={(e) => setTypeInput(e.target.value)}\n aria-label={t('adaptercloud.resources.filterType', 'Filter by resource type')}\n placeholder={t('adaptercloud.resources.filterTypePlaceholder', 'Filter by type…')}\n 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)]\"\n />\n {appliedType && (\n <button\n type=\"button\"\n onClick={clearType}\n aria-label={t('adaptercloud.resources.clearTypeFilter', 'Clear type filter')}\n 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)]\"\n >\n <X className=\"h-4 w-4\" />\n </button>\n )}\n </div>\n <button\n type=\"submit\"\n aria-label={t('adaptercloud.resources.applyTypeFilter', 'Apply type filter')}\n 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)]\"\n >\n <Search className=\"h-4 w-4\" />\n </button>\n </form>\n {connectionId && (\n <span className=\"inline-flex items-center gap-1.5 rounded-full bg-accent-blue-subtle px-2.5 py-1 text-xs text-accent-blue\">\n {t('adaptercloud.resources.scopedToConnection', 'Scoped to connection')}\n <button\n type=\"button\"\n onClick={clearScope}\n aria-label={t('adaptercloud.resources.clearScope', 'Clear connection scope')}\n className=\"inline-flex items-center rounded p-0.5 font-semibold transition-colors hover:text-accent-blue-hover focus:outline-none focus:ring-2 focus:ring-[var(--color-focus-ring)]\"\n >\n <X className=\"h-3.5 w-3.5\" />\n </button>\n </span>\n )}\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.resources.emptyTitle', 'No resources found')}\n emptyDescription={t(\n 'adaptercloud.resources.emptyDescription',\n 'Run a discovery sync against a connection to populate the inventory.'\n )}\n emptyIcon={<Server className=\"h-10 w-10\" />}\n emptyAction={\n <button\n type=\"button\"\n onClick={() => navigateTo('/connections')}\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.resources.goToConnections', 'Go to connections')}\n </button>\n }\n >\n <ResponsiveTable\n data={items}\n columns={columns}\n rowKey={(r) => r.id}\n onRowClick={(r) => navigateTo(`/resources/${r.id}`)}\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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"}