@burdenoff/microfe-bigconsole 2026.730.5 → 2026.730.6

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.
@@ -5,58 +5,59 @@ import { useBigConsoleNavigate as n } from "../context/BigConsoleContext.js";
5
5
  import "../context/index.js";
6
6
  import r from "../hooks/useWidgetOperations.js";
7
7
  import i from "../hooks/useDashboardOperations.js";
8
- import a from "../hooks/useFilterUrlSync.js";
9
- import ee from "../hooks/usePageOperations.js";
8
+ import ee from "../hooks/useFilterUrlSync.js";
9
+ import te from "../hooks/usePageOperations.js";
10
10
  import "../hooks/index.js";
11
- import o from "../components/dashboard/DashboardCanvas.js";
12
- import te from "../components/dashboard/LiveCanvasToggle.js";
13
- import s from "../components/dashboard/ExportDashboardDialog.js";
14
- import c from "../components/dashboard/DrilldownBreadcrumb.js";
11
+ import ne from "../components/dashboard/DashboardCanvas.js";
12
+ import re from "../components/dashboard/LiveCanvasToggle.js";
13
+ import ie from "../components/dashboard/ExportDashboardDialog.js";
14
+ import ae from "../components/dashboard/DrilldownBreadcrumb.js";
15
+ import oe from "../components/dashboard/PublishToStoreDialog.js";
15
16
  import "../components/dashboard/index.js";
16
- import { memo as l, useCallback as u, useEffect as d, useRef as f, useState as p } from "react";
17
- import { useParams as m } from "react-router-dom";
18
- import { ArrowLeft as ne } from "lucide-react";
19
- import { Button as re, IllustratedEmptyState as h } from "@burdenoff/fe-libs/ui";
20
- import { Fragment as ie, jsx as g, jsxs as _ } from "react/jsx-runtime";
17
+ import { memo as a, useCallback as o, useEffect as s, useRef as se, useState as c } from "react";
18
+ import { useParams as l } from "react-router-dom";
19
+ import { ArrowLeft as u } from "lucide-react";
20
+ import { Button as d, IllustratedEmptyState as f } from "@burdenoff/fe-libs/ui";
21
+ import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
21
22
  //#region src/bigconsole/pages/DashboardViewPage.tsx
22
- var v = l(function() {
23
- let { dashboardId: l } = m(), v = n(), [y, b] = p(null), [ae, x] = p(!1), [S, C] = p(!1), [oe, w] = p(!1), [T, E] = p(!1), { isInDrilldown: D, getContextFromUrl: O, getDrilldownMetadata: k } = a(), A = t((e) => e.currentDashboard), j = t((e) => e.setCurrentDashboard), M = t((e) => e.setGlobalFilterValue), N = t((e) => e.clearAllGlobalFilters), P = e((e) => e.widgets), F = e((e) => e.clipboardWidgetId), I = e((e) => e.clipboardAction), L = e((e) => e.clearClipboard), R = e((e) => e.selectWidget), { loading: z, error: B, fetchDashboard: V, updateDashboard: H } = i(), { createWidget: U, deleteWidget: W, duplicateWidget: G, batchUpdatePositions: K, refetch: q } = r(y || void 0, l), { createPage: J, updatePage: Y, deletePage: X, reorderPages: Z } = ee();
24
- d(() => {
25
- if (!l) {
26
- v("/dashboards");
23
+ var g = a(function() {
24
+ let { dashboardId: a } = l(), g = n(), [_, v] = c(null), [ce, y] = c(!1), [b, x] = c(!1), [S, C] = c(!1), [w, T] = c(!1), { isInDrilldown: E, getContextFromUrl: D, getDrilldownMetadata: O } = ee(), k = t((e) => e.currentDashboard), A = t((e) => e.setCurrentDashboard), j = t((e) => e.setGlobalFilterValue), M = t((e) => e.clearAllGlobalFilters), N = e((e) => e.widgets), P = e((e) => e.clipboardWidgetId), F = e((e) => e.clipboardAction), I = e((e) => e.clearClipboard), L = e((e) => e.selectWidget), { loading: R, error: z, fetchDashboard: B, updateDashboard: V } = i(), { createWidget: H, deleteWidget: U, duplicateWidget: W, batchUpdatePositions: G, refetch: K } = r(_ || void 0, a), { createPage: q, updatePage: J, deletePage: Y, reorderPages: X } = te();
25
+ s(() => {
26
+ if (!a) {
27
+ g("/dashboards");
27
28
  return;
28
29
  }
29
- return N(), C(!1), V(l).then((e) => {
30
- e ? e.pages && e.pages.length > 0 && b(e.pages[0].id) : C(!0);
30
+ return M(), x(!1), B(a).then((e) => {
31
+ e ? e.pages && e.pages.length > 0 && v(e.pages[0].id) : x(!0);
31
32
  }), () => {
32
- j(null), N(), C(!1);
33
+ A(null), M(), x(!1);
33
34
  };
34
35
  }, [
35
- l,
36
- v,
37
- V,
38
- j,
39
- N
40
- ]), d(() => {
41
- if (!D) return;
42
- let e = O(), t = k();
36
+ a,
37
+ g,
38
+ B,
39
+ A,
40
+ M
41
+ ]), s(() => {
42
+ if (!E) return;
43
+ let e = D(), t = O();
43
44
  Object.entries(e).forEach(([e, t]) => {
44
- M(`ctx_${e}`, t);
45
- }), t.depth > 0 && (M("__drilldown_depth", t.depth), M("__drilldown_parent", t.parent), M("__drilldown_path", t.path)), Object.keys(e).length > 0 && console.debug("[DashboardViewPage] Loaded drilldown context:", {
45
+ j(`ctx_${e}`, t);
46
+ }), t.depth > 0 && (j("__drilldown_depth", t.depth), j("__drilldown_parent", t.parent), j("__drilldown_path", t.path)), Object.keys(e).length > 0 && console.debug("[DashboardViewPage] Loaded drilldown context:", {
46
47
  context: e,
47
48
  metadata: t
48
49
  });
49
50
  }, [
51
+ E,
50
52
  D,
51
53
  O,
52
- k,
53
- M
54
+ j
54
55
  ]);
55
- let Q = f(q);
56
- Q.current = q, d(() => {
57
- if (!T || !l) return;
56
+ let Z = se(K);
57
+ Z.current = K, s(() => {
58
+ if (!w || !a) return;
58
59
  let e = () => {
59
- typeof document < "u" && document.visibilityState !== "visible" || t.getState().viewMode !== "edit" && (V(l, { silent: !0 }), Q.current());
60
+ typeof document < "u" && document.visibilityState !== "visible" || t.getState().viewMode !== "edit" && (B(a, { silent: !0 }), Z.current());
60
61
  };
61
62
  e();
62
63
  let n = window.setInterval(e, 3500), r = () => {
@@ -66,60 +67,60 @@ var v = l(function() {
66
67
  window.clearInterval(n), document.removeEventListener("visibilitychange", r);
67
68
  };
68
69
  }, [
69
- T,
70
- l,
71
- V
70
+ w,
71
+ a,
72
+ B
72
73
  ]);
73
- let se = u(async () => {
74
- if (l) {
75
- x(!0);
74
+ let le = o(async () => {
75
+ if (a) {
76
+ y(!0);
76
77
  try {
77
- let e = Array.from(P.values());
78
- e.length > 0 && await K(e.map((e) => ({
78
+ let e = Array.from(N.values());
79
+ e.length > 0 && await G(e.map((e) => ({
79
80
  id: e.id,
80
81
  position: e.position
81
- }))), A && await H({
82
- id: l,
83
- name: A.name,
84
- description: A.description
82
+ }))), k && await V({
83
+ id: a,
84
+ name: k.name,
85
+ description: k.description
85
86
  });
86
87
  } catch {} finally {
87
- x(!1);
88
+ y(!1);
88
89
  }
89
90
  }
90
91
  }, [
91
- l,
92
- P,
93
- A,
94
- K,
95
- H
96
- ]), ce = u(() => {
97
- v("/dashboards");
98
- }, [v]), le = u((e) => {
99
- b(e);
100
- }, []), $ = u(async () => {
101
- let e = y || A?.pages?.[0]?.id;
102
- if (!F || !l || !e) return;
103
- let t = P.get(F);
92
+ a,
93
+ N,
94
+ k,
95
+ G,
96
+ V
97
+ ]), Q = o(() => {
98
+ g("/dashboards");
99
+ }, [g]), ue = o((e) => {
100
+ v(e);
101
+ }, []), de = o(async () => {
102
+ let e = _ || k?.pages?.[0]?.id;
103
+ if (!P || !a || !e) return;
104
+ let t = N.get(P);
104
105
  if (!t) {
105
- L();
106
+ I();
106
107
  return;
107
108
  }
108
109
  let n = {
109
110
  x: 0,
110
- y: Array.from(P.values()).reduce((e, t) => {
111
+ y: Array.from(N.values()).reduce((e, t) => {
111
112
  let n = (t.positionY ?? 0) + (t.positionHeight ?? 4);
112
113
  return Math.max(e, n);
113
114
  }, 0),
114
115
  width: t.positionWidth ?? 4,
115
116
  height: t.positionHeight ?? 4
116
- }, r = I === "copy" ? `${t.title} (Copy)` : t.title, i = null;
117
+ }, r = F === "copy" ? `${t.title} (Copy)` : t.title, i = null;
117
118
  try {
118
- i = await G(F, n, r);
119
+ i = await W(P, n, r);
119
120
  } catch {}
120
- i ||= await U({
121
+ i ||= await H({
121
122
  pageId: e,
122
- dashboardId: l,
123
+ dashboardId: a,
123
124
  type: t.type,
124
125
  title: r,
125
126
  description: t.description,
@@ -131,223 +132,235 @@ var v = l(function() {
131
132
  position: n,
132
133
  refreshInterval: t.refreshInterval ?? void 0,
133
134
  metadata: t.metadata
134
- }), i && (R(i.id), I === "cut" && await W(F)), L();
135
+ }), i && (L(i.id), F === "cut" && await U(P)), I();
135
136
  }, [
136
- F,
137
- I,
138
- l,
139
- y,
140
- A,
141
137
  P,
142
- G,
143
- U,
138
+ F,
139
+ a,
140
+ _,
141
+ k,
142
+ N,
144
143
  W,
145
- R,
146
- L
147
- ]), ue = u(() => {
148
- w(!0);
149
- }, []), de = u(() => {
150
- w(!1);
151
- }, []), fe = u(async () => {
152
- if (!A || !l) return;
153
- let e = await J({
154
- dashboardId: l,
155
- name: `Page ${(A.pages?.length || 0) + 1}`
144
+ H,
145
+ U,
146
+ L,
147
+ I
148
+ ]), fe = o(() => {
149
+ C(!0);
150
+ }, []), [pe, $] = c(!1), me = o(() => {
151
+ $(!0);
152
+ }, []), he = o(() => {
153
+ $(!1);
154
+ }, []), ge = o(() => {
155
+ C(!1);
156
+ }, []), _e = o(async () => {
157
+ if (!k || !a) return;
158
+ let e = await q({
159
+ dashboardId: a,
160
+ name: `Page ${(k.pages?.length || 0) + 1}`
156
161
  });
157
- e && (j({
158
- ...A,
159
- pages: [...A.pages || [], e]
160
- }), b(e.id));
162
+ e && (A({
163
+ ...k,
164
+ pages: [...k.pages || [], e]
165
+ }), v(e.id));
161
166
  }, [
167
+ k,
168
+ a,
162
169
  A,
163
- l,
164
- j,
165
- J
166
- ]), pe = u(async (e, t) => {
167
- A && await Y({
170
+ q
171
+ ]), ve = o(async (e, t) => {
172
+ k && await J({
168
173
  id: e,
169
174
  name: t
170
- }) && j({
171
- ...A,
172
- pages: A.pages?.map((n) => n.id === e ? {
175
+ }) && A({
176
+ ...k,
177
+ pages: k.pages?.map((n) => n.id === e ? {
173
178
  ...n,
174
179
  name: t
175
180
  } : n)
176
181
  });
177
182
  }, [
183
+ k,
178
184
  A,
179
- j,
180
- Y
181
- ]), me = u(async (e) => {
182
- if (!A || !l) return;
183
- let t = A.pages?.find((t) => t.id === e);
185
+ J
186
+ ]), ye = o(async (e) => {
187
+ if (!k || !a) return;
188
+ let t = k.pages?.find((t) => t.id === e);
184
189
  if (!t) return;
185
- let n = await J({
186
- dashboardId: l,
190
+ let n = await q({
191
+ dashboardId: a,
187
192
  name: `${t.name} (Copy)`
188
193
  });
189
- n && (j({
190
- ...A,
191
- pages: [...A.pages || [], n]
192
- }), b(n.id));
194
+ n && (A({
195
+ ...k,
196
+ pages: [...k.pages || [], n]
197
+ }), v(n.id));
193
198
  }, [
199
+ k,
200
+ a,
194
201
  A,
195
- l,
196
- j,
197
- J
198
- ]), he = u(async (e) => {
199
- if (!(!A || (A.pages?.length || 0) <= 1) && await X(e)) {
200
- let t = A.pages?.filter((t) => t.id !== e).map((e, t) => ({
202
+ q
203
+ ]), be = o(async (e) => {
204
+ if (!(!k || (k.pages?.length || 0) <= 1) && await Y(e)) {
205
+ let t = k.pages?.filter((t) => t.id !== e).map((e, t) => ({
201
206
  ...e,
202
207
  order: t
203
208
  }));
204
- j({
205
- ...A,
209
+ A({
210
+ ...k,
206
211
  pages: t
207
- }), y === e && b(t?.[0]?.id || null);
212
+ }), _ === e && v(t?.[0]?.id || null);
208
213
  }
209
214
  }, [
215
+ k,
210
216
  A,
211
- j,
212
- y,
213
- X
214
- ]), ge = u(async (e) => {
215
- !A || !l || (j({
216
- ...A,
217
+ _,
218
+ Y
219
+ ]), xe = o(async (e) => {
220
+ !k || !a || (A({
221
+ ...k,
217
222
  pages: e.map((e, t) => ({
218
223
  ...e,
219
224
  order: t
220
225
  }))
221
- }), await Z(l, e.map((e) => e.id)));
226
+ }), await X(a, e.map((e) => e.id)));
222
227
  }, [
228
+ k,
229
+ a,
223
230
  A,
224
- l,
225
- j,
226
- Z
231
+ X
227
232
  ]);
228
- return B ? /* @__PURE__ */ g("div", {
233
+ return z ? /* @__PURE__ */ m("div", {
229
234
  className: "flex flex-col items-center justify-center h-full",
230
235
  style: { padding: "var(--space-pagePadding)" },
231
- children: /* @__PURE__ */ _("div", {
236
+ children: /* @__PURE__ */ h("div", {
232
237
  className: "bg-status-error-bg border border-status-error-border rounded-lg p-6 w-full max-w-md",
233
238
  children: [
234
- /* @__PURE__ */ g("h3", {
239
+ /* @__PURE__ */ m("h3", {
235
240
  className: "text-lg font-medium text-status-error-text mb-2",
236
241
  children: "Error loading dashboard"
237
242
  }),
238
- /* @__PURE__ */ g("p", {
243
+ /* @__PURE__ */ m("p", {
239
244
  className: "text-sm text-text-secondary mb-4 break-words",
240
- children: B.message
245
+ children: z.message
241
246
  }),
242
- /* @__PURE__ */ _("div", {
247
+ /* @__PURE__ */ h("div", {
243
248
  className: "flex flex-wrap gap-3",
244
- children: [/* @__PURE__ */ g("button", {
249
+ children: [/* @__PURE__ */ m("button", {
245
250
  type: "button",
246
- onClick: () => V(l),
251
+ onClick: () => B(a),
247
252
  className: "px-4 py-2 text-sm font-medium text-action-primary-fg bg-action-primary-bg hover:bg-action-primary-bgHover rounded-md",
248
253
  children: "Retry"
249
- }), /* @__PURE__ */ g("button", {
254
+ }), /* @__PURE__ */ m("button", {
250
255
  type: "button",
251
- onClick: () => v("/dashboards"),
256
+ onClick: () => g("/dashboards"),
252
257
  className: "px-4 py-2 text-sm font-medium text-text-secondary bg-bg-sunken hover:bg-bg-sunken/80 rounded-md",
253
258
  children: "Back to Dashboards"
254
259
  })]
255
260
  })
256
261
  ]
257
262
  })
258
- }) : S ? /* @__PURE__ */ g("div", {
263
+ }) : b ? /* @__PURE__ */ m("div", {
259
264
  className: "flex flex-col items-center justify-center h-full",
260
265
  style: { padding: "var(--space-pagePadding)" },
261
- children: /* @__PURE__ */ g(h, {
266
+ children: /* @__PURE__ */ m(f, {
262
267
  illustration: "empty-data",
263
268
  title: "Dashboard not found",
264
- description: /* @__PURE__ */ _(ie, { children: ["The dashboard you're looking for doesn't exist or has been deleted.", /* @__PURE__ */ _("span", {
269
+ description: /* @__PURE__ */ h(p, { children: ["The dashboard you're looking for doesn't exist or has been deleted.", /* @__PURE__ */ h("span", {
265
270
  className: "mt-2 block font-mono text-xs text-text-tertiary break-all",
266
- children: ["ID: ", l]
271
+ children: ["ID: ", a]
267
272
  })] }),
268
- action: /* @__PURE__ */ g("button", {
273
+ action: /* @__PURE__ */ m("button", {
269
274
  type: "button",
270
- onClick: () => v("/dashboards"),
275
+ onClick: () => g("/dashboards"),
271
276
  className: "px-4 py-2 text-sm font-medium text-action-primary-fg bg-action-primary-bg hover:bg-action-primary-bgHover rounded-md",
272
277
  children: "Back to Dashboards"
273
278
  })
274
279
  })
275
- }) : z || !A ? /* @__PURE__ */ g("div", {
280
+ }) : R || !k ? /* @__PURE__ */ m("div", {
276
281
  className: "flex items-center justify-center h-full",
277
- children: /* @__PURE__ */ _("div", {
282
+ children: /* @__PURE__ */ h("div", {
278
283
  className: "flex flex-col items-center gap-4",
279
- children: [/* @__PURE__ */ g("div", { className: "animate-spin w-8 h-8 border-4 border-action-primary-bg border-t-transparent rounded-full" }), /* @__PURE__ */ g("p", {
284
+ children: [/* @__PURE__ */ m("div", { className: "animate-spin w-8 h-8 border-4 border-action-primary-bg border-t-transparent rounded-full" }), /* @__PURE__ */ m("p", {
280
285
  className: "text-sm text-text-secondary",
281
286
  children: "Loading dashboard..."
282
287
  })]
283
288
  })
284
- }) : /* @__PURE__ */ _("div", {
289
+ }) : /* @__PURE__ */ h("div", {
285
290
  className: "h-full flex flex-col overflow-hidden",
286
291
  children: [
287
- /* @__PURE__ */ _("div", {
292
+ /* @__PURE__ */ h("div", {
288
293
  className: "flex items-center gap-3 px-3 py-2 border-b border-border-default bg-bg-surface flex-shrink-0",
289
294
  children: [
290
- /* @__PURE__ */ _(re, {
291
- onClick: ce,
295
+ /* @__PURE__ */ h(d, {
296
+ onClick: Q,
292
297
  variant: "ghost",
293
298
  size: "sm",
294
299
  title: "Back to Dashboards",
295
300
  "aria-label": "Back to Dashboards",
296
- children: [/* @__PURE__ */ g(ne, { className: "w-4 h-4 mr-2" }), "Back"]
301
+ children: [/* @__PURE__ */ m(u, { className: "w-4 h-4 mr-2" }), "Back"]
297
302
  }),
298
- /* @__PURE__ */ g("h2", {
303
+ /* @__PURE__ */ m("h2", {
299
304
  className: "text-sm font-semibold text-text-primary truncate",
300
- children: A.name
305
+ children: k.name
301
306
  }),
302
- /* @__PURE__ */ g("div", {
307
+ /* @__PURE__ */ m("div", {
303
308
  className: "ml-auto flex-shrink-0",
304
- children: /* @__PURE__ */ g(te, {
305
- isLive: T,
306
- onToggle: () => E((e) => !e)
309
+ children: /* @__PURE__ */ m(re, {
310
+ isLive: w,
311
+ onToggle: () => T((e) => !e)
307
312
  })
308
313
  })
309
314
  ]
310
315
  }),
311
- D && /* @__PURE__ */ g(c, {
312
- currentDashboardId: A.id,
313
- currentDashboardName: A.name,
316
+ E && /* @__PURE__ */ m(ae, {
317
+ currentDashboardId: k.id,
318
+ currentDashboardName: k.name,
314
319
  basePath: "/bigconsole/dashboards"
315
320
  }),
316
- /* @__PURE__ */ g("div", {
321
+ /* @__PURE__ */ m("div", {
317
322
  className: "flex-1 min-w-0 overflow-hidden",
318
- children: /* @__PURE__ */ g(o, {
319
- dashboardId: A.id,
320
- pageId: y || A.pages?.[0]?.id,
321
- title: A.name,
322
- onPaste: $,
323
- onSave: se,
324
- isSaving: ae,
325
- onExport: ue,
326
- pages: (A.pages || []).map((e, t) => ({
323
+ children: /* @__PURE__ */ m(ne, {
324
+ dashboardId: k.id,
325
+ pageId: _ || k.pages?.[0]?.id,
326
+ title: k.name,
327
+ onPaste: de,
328
+ onSave: le,
329
+ isSaving: ce,
330
+ onExport: fe,
331
+ onPublishTemplate: me,
332
+ pages: (k.pages || []).map((e, t) => ({
327
333
  id: e.id,
328
334
  name: e.name || `Page ${t + 1}`,
329
335
  order: e.order ?? 0
330
336
  })),
331
- activePageId: y || A.pages?.[0]?.id,
332
- onPageChange: le,
333
- onPageAdd: fe,
334
- onPageRename: pe,
335
- onPageDuplicate: me,
336
- onPageDelete: he,
337
- onPagesReorder: ge,
337
+ activePageId: _ || k.pages?.[0]?.id,
338
+ onPageChange: ue,
339
+ onPageAdd: _e,
340
+ onPageRename: ve,
341
+ onPageDuplicate: ye,
342
+ onPageDelete: be,
343
+ onPagesReorder: xe,
338
344
  showPageTabs: !0
339
345
  })
340
346
  }),
341
- /* @__PURE__ */ g(s, {
342
- isOpen: oe,
343
- dashboardId: A.id,
344
- dashboardName: A.name,
345
- onClose: de
347
+ /* @__PURE__ */ m(ie, {
348
+ isOpen: S,
349
+ dashboardId: k.id,
350
+ dashboardName: k.name,
351
+ onClose: ge
352
+ }),
353
+ /* @__PURE__ */ m(oe, {
354
+ isOpen: pe,
355
+ dashboardId: k.id,
356
+ dashboardName: k.name,
357
+ dashboardDescription: k.description,
358
+ onClose: he
346
359
  })
347
360
  ]
348
361
  });
349
362
  });
350
363
  //#endregion
351
- export { v as DashboardViewPage, v as default };
364
+ export { g as DashboardViewPage, g as default };
352
365
 
353
366
  //# sourceMappingURL=DashboardViewPage.js.map