@plumile/backoffice-react 0.1.151 → 0.1.152
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.
- package/lib/esm/components/backoffice/detail/backofficeDetailRelationLink.css.js +0 -1
- package/lib/esm/components/backoffice/filters/backofficeFilterAction.css.js +1 -0
- package/lib/esm/pages/BackofficeDashboardPage.js +73 -244
- package/lib/esm/pages/BackofficeDashboardPage.js.map +1 -1
- package/lib/esm/pages/BackofficeDashboardWidgetContent.js +193 -0
- package/lib/esm/pages/BackofficeDashboardWidgetContent.js.map +1 -0
- package/lib/esm/pages/BackofficeEntityDetailLayoutPage.js +8 -10
- package/lib/esm/pages/BackofficeEntityDetailLayoutPage.js.map +1 -1
- package/lib/esm/pages/BackofficeEntityDetailPage.js +130 -133
- package/lib/esm/pages/BackofficeEntityDetailPage.js.map +1 -1
- package/lib/esm/pages/BackofficeEntityDetailUnknownPageRedirect.js +10 -9
- package/lib/esm/pages/BackofficeEntityDetailUnknownPageRedirect.js.map +1 -1
- package/lib/esm/pages/BackofficeRedirect.js +13 -0
- package/lib/esm/pages/BackofficeRedirect.js.map +1 -0
- package/lib/esm/router/createBackofficeRoutes.js +100 -97
- package/lib/esm/router/createBackofficeRoutes.js.map +1 -1
- package/lib/types/pages/BackofficeDashboardPage.d.ts.map +1 -1
- package/lib/types/pages/BackofficeDashboardWidgetContent.d.ts +9 -0
- package/lib/types/pages/BackofficeDashboardWidgetContent.d.ts.map +1 -0
- package/lib/types/pages/BackofficeEntityDetailLayoutPage.d.ts.map +1 -1
- package/lib/types/pages/BackofficeEntityDetailPage.d.ts.map +1 -1
- package/lib/types/pages/BackofficeEntityDetailUnknownPageRedirect.d.ts.map +1 -1
- package/lib/types/pages/BackofficeRedirect.d.ts +7 -0
- package/lib/types/pages/BackofficeRedirect.d.ts.map +1 -0
- package/lib/types/router/createBackofficeRoutes.d.ts +3 -1
- package/lib/types/router/createBackofficeRoutes.d.ts.map +1 -1
- package/package.json +6 -6
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
/* empty css */
|
|
2
1
|
/* empty css */
|
|
3
2
|
//#region src/components/backoffice/detail/backofficeDetailRelationLink.css.ts
|
|
4
3
|
var e = "_93gupm0 qbwcueg qbwcuee txvbqb2tz txvbqb1bg1 txvbqb3f txvbqb7g txvbqb76 txvbqb7t qbwcuef txvbqb1ct1 txvbqb1dsd qbwcue0 txvbqb1ffs txvbqb1ga0 txvbqb10mx txvbqb11ki txvbqb12hq txvbqbxtt txvbqb7h txvbqb75 txvbqbfpn txvbqblt7 txvbqbhdy txvbqb28o txvbqb2sj txvbqbik txvbqb1b4r txvbqbey txvbqbem txvbqbh4k txvbqbh4y txvbqb1ct4 txvbqb1dsg", t = "txvbqb9j txvbqbhb2 txvbqbv7x txvbqbws9", n = "txvbqbfqq txvbqbey txvbqbhd8 txvbqbh6d txvbqbv7x", r = "txvbqb96 txvbqb1bg3 txvbqbws9 txvbqb18e2", i = "txvbqbfqq txvbqbey txvbqbls4 txvbqb1bg5 txvbqb9j txvbqbmzg";
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
/* empty css */
|
|
1
2
|
/* empty css */
|
|
2
3
|
//#region src/components/backoffice/filters/backofficeFilterAction.css.ts
|
|
3
4
|
var e = "hwnq700 txvbqbfqq txvbqbey txvbqbls4 txvbqb19gp txvbqbjm4 txvbqbwvi txvbqb2tz txvbqb28o txvbqb2sj txvbqb1d9 txvbqb1b83 txvbqb1bhb txvbqbv txvbqb3f txvbqb7h txvbqb75 txvbqb7t txvbqb1eol txvbqb1czh txvbqb1dth qbwcue0 txvbqb1ffs txvbqb1ga0", t = "txvbqb19fm txvbqbjl1";
|
|
@@ -1,273 +1,102 @@
|
|
|
1
1
|
import { useBackofficeReactTranslation as e } from "../i18n/useBackofficeReactTranslation.js";
|
|
2
2
|
import { useBackofficeConfig as t } from "../provider/BackofficeConfigContext.js";
|
|
3
3
|
import { BackofficeErrorBoundary as n } from "../components/backoffice/errors/BackofficeErrorBoundary.js";
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
import {
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
import {
|
|
11
|
-
import {
|
|
12
|
-
import
|
|
13
|
-
import {
|
|
14
|
-
import
|
|
15
|
-
import {
|
|
16
|
-
import {
|
|
17
|
-
import {
|
|
18
|
-
import {
|
|
19
|
-
import { DashboardPanel as C } from "@plumile/ui/components/dashboard/dashboard_panel/DashboardPanel.js";
|
|
20
|
-
import { DashboardQuickActions as w } from "@plumile/ui/components/dashboard/dashboard_quick_actions/DashboardQuickActions.js";
|
|
21
|
-
import { DashboardStatusList as T } from "@plumile/ui/components/dashboard/dashboard_status_list/DashboardStatusList.js";
|
|
22
|
-
import { DashboardGrid as E, DashboardGridItem as D } from "@plumile/ui/components/dashboard/dashboard_grid/DashboardGrid.js";
|
|
23
|
-
import { DataTable as O } from "@plumile/ui/components/data-table/DataTable.js";
|
|
4
|
+
import { BackofficeRightPageLayout as r } from "../components/backoffice/layout/breadcrumb/BackofficeRightPageLayout.js";
|
|
5
|
+
import { buildDashboardBreadcrumb as i } from "../components/backoffice/layout/breadcrumb/buildBreadcrumbs.js";
|
|
6
|
+
import { useBackofficeDashboardConfig as a } from "../provider/useBackofficeLazyValue.js";
|
|
7
|
+
import { getWidgetLabel as o, resolveLabel as s } from "./BackofficeDashboardPage.helpers.js";
|
|
8
|
+
import { loadingBody as c, tileBody as l, tileCount as u } from "./backofficeDashboardPage.css.js";
|
|
9
|
+
import { Suspense as d, lazy as f } from "react";
|
|
10
|
+
import { jsx as p, jsxs as m } from "react/jsx-runtime";
|
|
11
|
+
import { useTranslation as h } from "react-i18next";
|
|
12
|
+
import * as g from "react-relay";
|
|
13
|
+
import { Spinner as _ } from "@plumile/ui/backoffice/atoms/spinner/Spinner.js";
|
|
14
|
+
import { BackofficeEmptyState as v } from "@plumile/ui/backoffice/molecules/backoffice_empty_state/BackofficeEmptyState.js";
|
|
15
|
+
import { DetailPageTemplate as y } from "@plumile/ui/backoffice/templates/detail_page_template/DetailPageTemplate.js";
|
|
16
|
+
import { DashboardPanel as b } from "@plumile/ui/components/dashboard/dashboard_panel/DashboardPanel.js";
|
|
17
|
+
import { DashboardQuickActions as x } from "@plumile/ui/components/dashboard/dashboard_quick_actions/DashboardQuickActions.js";
|
|
18
|
+
import { DashboardGrid as S, DashboardGridItem as C } from "@plumile/ui/components/dashboard/dashboard_grid/DashboardGrid.js";
|
|
24
19
|
//#region src/pages/BackofficeDashboardPage.tsx
|
|
25
|
-
var { useLazyLoadQuery:
|
|
20
|
+
var { useLazyLoadQuery: w } = g, T = f(async () => ({ default: (await import("./BackofficeDashboardWidgetContent.js")).BackofficeDashboardWidgetContent })), E = () => {
|
|
26
21
|
let { t } = e();
|
|
27
|
-
return /* @__PURE__ */
|
|
28
|
-
},
|
|
22
|
+
return /* @__PURE__ */ p(v, { title: t("common.notAvailable") });
|
|
23
|
+
}, D = () => {
|
|
29
24
|
let { t } = e();
|
|
30
|
-
return /* @__PURE__ */
|
|
31
|
-
className:
|
|
32
|
-
children: [/* @__PURE__ */
|
|
25
|
+
return /* @__PURE__ */ m("div", {
|
|
26
|
+
className: c,
|
|
27
|
+
children: [/* @__PURE__ */ p(_, { ariaLabel: t("common.loading") }), /* @__PURE__ */ p("span", { children: t("common.loading") })]
|
|
33
28
|
});
|
|
34
|
-
},
|
|
29
|
+
}, O = (e) => e ?? "m", k = (e) => {
|
|
35
30
|
if (e.layout?.span != null) return e.layout.span;
|
|
36
|
-
let t =
|
|
31
|
+
let t = O(e.size);
|
|
37
32
|
return t === "s" ? 3 : t === "m" ? 4 : t === "l" ? 6 : t === "xl" ? 8 : 12;
|
|
38
|
-
},
|
|
39
|
-
let { t:
|
|
40
|
-
|
|
41
|
-
title: u(n.title, o),
|
|
42
|
-
subtitle: l,
|
|
43
|
-
children: /* @__PURE__ */ h("div", {
|
|
44
|
-
className: f,
|
|
45
|
-
children: u(n.body, o)
|
|
46
|
-
})
|
|
47
|
-
});
|
|
48
|
-
if (n.kind === "shortcut") {
|
|
49
|
-
let e = c[n.entityId], t = u(n.label, o);
|
|
50
|
-
return e == null ? /* @__PURE__ */ h(C, {
|
|
51
|
-
title: t,
|
|
52
|
-
subtitle: l,
|
|
53
|
-
children: /* @__PURE__ */ h(A, {})
|
|
54
|
-
}) : e.kind === "tool" ? /* @__PURE__ */ h(C, {
|
|
55
|
-
title: t,
|
|
56
|
-
subtitle: l,
|
|
57
|
-
children: /* @__PURE__ */ h(w, { actions: [{
|
|
58
|
-
id: e.id,
|
|
59
|
-
href: e.routes.list,
|
|
60
|
-
label: s("dashboard.actions.openTool")
|
|
61
|
-
}] })
|
|
62
|
-
}) : /* @__PURE__ */ h(C, {
|
|
63
|
-
title: t,
|
|
64
|
-
subtitle: l,
|
|
65
|
-
children: /* @__PURE__ */ h(w, { actions: [{
|
|
66
|
-
id: e.id,
|
|
67
|
-
href: e.routes.list,
|
|
68
|
-
label: s("dashboard.actions.openList")
|
|
69
|
-
}] })
|
|
70
|
-
});
|
|
71
|
-
}
|
|
72
|
-
if (n.kind === "tablePreview") {
|
|
73
|
-
let e = d(a);
|
|
74
|
-
if (e == null) return /* @__PURE__ */ h(C, {
|
|
75
|
-
title: u(n.title, o),
|
|
76
|
-
subtitle: l,
|
|
77
|
-
children: /* @__PURE__ */ h(A, {})
|
|
78
|
-
});
|
|
79
|
-
let t = i(e.columns, {
|
|
80
|
-
tApp: o,
|
|
81
|
-
t: s
|
|
82
|
-
});
|
|
83
|
-
return /* @__PURE__ */ h(C, {
|
|
84
|
-
title: u(n.title, o),
|
|
85
|
-
subtitle: l,
|
|
86
|
-
children: /* @__PURE__ */ h(O, {
|
|
87
|
-
columns: t,
|
|
88
|
-
rows: e.rows,
|
|
89
|
-
getRowId: (e, t) => {
|
|
90
|
-
if (typeof e == "object" && e) {
|
|
91
|
-
let { id: t } = e;
|
|
92
|
-
if (typeof t == "string" && t.trim() !== "") return t;
|
|
93
|
-
}
|
|
94
|
-
return String(t);
|
|
95
|
-
}
|
|
96
|
-
})
|
|
97
|
-
});
|
|
98
|
-
}
|
|
99
|
-
if (n.kind === "metricGroup") {
|
|
100
|
-
let e = d(a);
|
|
101
|
-
return e == null ? /* @__PURE__ */ h(A, {}) : /* @__PURE__ */ h(S, {
|
|
102
|
-
emptyState: /* @__PURE__ */ h(A, {}),
|
|
103
|
-
metrics: e.map((e) => ({
|
|
104
|
-
id: e.id,
|
|
105
|
-
href: e.href,
|
|
106
|
-
label: u(e.label, o),
|
|
107
|
-
value: e.value ?? s("common.notAvailable"),
|
|
108
|
-
hint: e.meta == null ? void 0 : u(e.meta, o)
|
|
109
|
-
}))
|
|
110
|
-
});
|
|
111
|
-
}
|
|
112
|
-
if (n.kind === "billingUsageChart") {
|
|
113
|
-
let e = d(a), t = u(n.title, o);
|
|
114
|
-
return e == null ? /* @__PURE__ */ h(C, {
|
|
115
|
-
title: t,
|
|
116
|
-
subtitle: l,
|
|
117
|
-
children: /* @__PURE__ */ h(A, {})
|
|
118
|
-
}) : /* @__PURE__ */ h(C, {
|
|
119
|
-
title: t,
|
|
120
|
-
subtitle: l,
|
|
121
|
-
children: /* @__PURE__ */ h(r, {
|
|
122
|
-
ariaLabel: u(n.ariaLabel, o),
|
|
123
|
-
buckets: e.buckets,
|
|
124
|
-
categories: n.categories.map((e) => ({
|
|
125
|
-
id: e.id,
|
|
126
|
-
label: u(e.label, o),
|
|
127
|
-
color: e.color
|
|
128
|
-
})),
|
|
129
|
-
currency: e.currency,
|
|
130
|
-
emptyLabel: u(n.emptyLabel, o),
|
|
131
|
-
from: e.from,
|
|
132
|
-
rangePrefix: u(n.rangePrefix, o),
|
|
133
|
-
to: e.to,
|
|
134
|
-
totalAmount: e.totalAmount
|
|
135
|
-
})
|
|
136
|
-
});
|
|
137
|
-
}
|
|
138
|
-
if (n.kind === "quickActions") return /* @__PURE__ */ h(C, {
|
|
139
|
-
title: n.title == null ? s("dashboard.actions.openTool") : u(n.title, o),
|
|
140
|
-
subtitle: l,
|
|
141
|
-
children: /* @__PURE__ */ h(w, {
|
|
142
|
-
layout: n.layout?.zone === "aside" ? "stack" : "grid",
|
|
143
|
-
emptyState: /* @__PURE__ */ h(A, {}),
|
|
144
|
-
actions: n.actions.map((e) => ({
|
|
145
|
-
id: e.id,
|
|
146
|
-
href: e.href,
|
|
147
|
-
label: u(e.label, o)
|
|
148
|
-
}))
|
|
149
|
-
})
|
|
150
|
-
});
|
|
151
|
-
if (n.kind === "statusSummary") {
|
|
152
|
-
let e = d(a);
|
|
153
|
-
return e == null ? /* @__PURE__ */ h(C, {
|
|
154
|
-
title: n.title == null ? void 0 : u(n.title, o),
|
|
155
|
-
subtitle: l,
|
|
156
|
-
children: /* @__PURE__ */ h(A, {})
|
|
157
|
-
}) : /* @__PURE__ */ h(C, {
|
|
158
|
-
title: n.title == null ? void 0 : u(n.title, o),
|
|
159
|
-
subtitle: l,
|
|
160
|
-
children: /* @__PURE__ */ h(T, {
|
|
161
|
-
emptyState: /* @__PURE__ */ h(A, {}),
|
|
162
|
-
items: e.map((e) => ({
|
|
163
|
-
id: e.id,
|
|
164
|
-
href: e.href,
|
|
165
|
-
label: u(e.label, o),
|
|
166
|
-
value: e.value ?? s("common.notAvailable")
|
|
167
|
-
}))
|
|
168
|
-
})
|
|
169
|
-
});
|
|
170
|
-
}
|
|
171
|
-
if (n.kind === "recentItems") return /* @__PURE__ */ h(C, {
|
|
172
|
-
title: n.title == null ? s("dashboard.title") : u(n.title, o),
|
|
173
|
-
subtitle: l,
|
|
174
|
-
children: /* @__PURE__ */ h(A, {})
|
|
175
|
-
});
|
|
176
|
-
let m = c[n.entityId];
|
|
177
|
-
if (m?.kind !== "list-detail") return /* @__PURE__ */ h(C, {
|
|
178
|
-
title: u(n.label, o),
|
|
179
|
-
subtitle: l,
|
|
180
|
-
children: /* @__PURE__ */ h(A, {})
|
|
181
|
-
});
|
|
182
|
-
let v = d(a), y = s("common.notAvailable");
|
|
183
|
-
return typeof v?.count == "number" && (y = v.count), /* @__PURE__ */ h(C, {
|
|
184
|
-
title: u(n.label, o),
|
|
185
|
-
subtitle: l,
|
|
186
|
-
children: /* @__PURE__ */ g("div", {
|
|
187
|
-
className: f,
|
|
188
|
-
children: [/* @__PURE__ */ h("div", {
|
|
189
|
-
className: p,
|
|
190
|
-
children: y
|
|
191
|
-
}), /* @__PURE__ */ h(w, {
|
|
192
|
-
emptyState: /* @__PURE__ */ h(A, {}),
|
|
193
|
-
actions: [{
|
|
194
|
-
id: m.id,
|
|
195
|
-
href: m.routes.list,
|
|
196
|
-
label: s("dashboard.actions.openList")
|
|
197
|
-
}]
|
|
198
|
-
})]
|
|
199
|
-
})
|
|
200
|
-
});
|
|
201
|
-
}, I = ({ widget: e }) => /* @__PURE__ */ h(F, {
|
|
202
|
-
widget: e,
|
|
203
|
-
globalData: k(e.query, {}, { fetchPolicy: "store-or-network" })
|
|
204
|
-
}), L = ({ config: t, globalData: r }) => {
|
|
205
|
-
let { t: i } = _(), { t: a } = e();
|
|
206
|
-
return /* @__PURE__ */ h(x, {
|
|
33
|
+
}, A = (e) => e.layout?.tabletSpan, j = ({ config: t, globalData: r }) => {
|
|
34
|
+
let { t: i } = h(), { t: a } = e();
|
|
35
|
+
return /* @__PURE__ */ p(y, {
|
|
207
36
|
header: {
|
|
208
|
-
title:
|
|
209
|
-
subtitle: (t.subtitle == null ? void 0 :
|
|
37
|
+
title: s(t.title, i),
|
|
38
|
+
subtitle: (t.subtitle == null ? void 0 : s(t.subtitle, i)) ?? a("dashboard.subtitle")
|
|
210
39
|
},
|
|
211
|
-
children: /* @__PURE__ */
|
|
40
|
+
children: /* @__PURE__ */ p(S, {
|
|
212
41
|
columns: 12,
|
|
213
42
|
children: t.widgets.map((e) => {
|
|
214
|
-
let a =
|
|
215
|
-
|
|
216
|
-
globalData: r
|
|
217
|
-
});
|
|
218
|
-
return /* @__PURE__ */ h(D, {
|
|
43
|
+
let a = s(o(e, t), i);
|
|
44
|
+
return /* @__PURE__ */ p(C, {
|
|
219
45
|
minHeight: e.minHeight ?? "auto",
|
|
220
|
-
span:
|
|
221
|
-
tabletSpan:
|
|
222
|
-
children: /* @__PURE__ */
|
|
223
|
-
fallback: () => /* @__PURE__ */
|
|
46
|
+
span: k(e),
|
|
47
|
+
tabletSpan: A(e),
|
|
48
|
+
children: /* @__PURE__ */ p(n, {
|
|
49
|
+
fallback: () => /* @__PURE__ */ p(b, {
|
|
224
50
|
title: a,
|
|
225
|
-
children: /* @__PURE__ */
|
|
51
|
+
children: /* @__PURE__ */ p(E, {})
|
|
226
52
|
}),
|
|
227
|
-
children: /* @__PURE__ */
|
|
228
|
-
fallback: /* @__PURE__ */
|
|
53
|
+
children: /* @__PURE__ */ p(d, {
|
|
54
|
+
fallback: /* @__PURE__ */ p(b, {
|
|
229
55
|
title: a,
|
|
230
|
-
children: /* @__PURE__ */
|
|
56
|
+
children: /* @__PURE__ */ p(D, {})
|
|
231
57
|
}),
|
|
232
|
-
children:
|
|
58
|
+
children: /* @__PURE__ */ p(T, {
|
|
59
|
+
widget: e,
|
|
60
|
+
globalData: r
|
|
61
|
+
})
|
|
233
62
|
})
|
|
234
63
|
})
|
|
235
64
|
}, e.id);
|
|
236
65
|
})
|
|
237
66
|
})
|
|
238
67
|
});
|
|
239
|
-
},
|
|
68
|
+
}, M = ({ config: e }) => /* @__PURE__ */ p(j, {
|
|
240
69
|
config: e,
|
|
241
|
-
globalData:
|
|
242
|
-
}),
|
|
243
|
-
let { t:
|
|
244
|
-
if (
|
|
245
|
-
let e = Object.values(
|
|
70
|
+
globalData: w(e.query, {}, { fetchPolicy: "store-or-network" })
|
|
71
|
+
}), N = ({ prepared: n }) => {
|
|
72
|
+
let { t: o } = h(), { t: c } = e(), { entities: d } = t(), f = a(), g = n?.config ?? f, _ = i(c);
|
|
73
|
+
if (g == null) {
|
|
74
|
+
let e = Object.values(d).filter((e) => e.kind === "list-detail" && e.hasList).map((e) => ({
|
|
246
75
|
config: e,
|
|
247
|
-
label:
|
|
76
|
+
label: s(e.label, o)
|
|
248
77
|
})).sort((e, t) => e.label.localeCompare(t.label));
|
|
249
|
-
return /* @__PURE__ */
|
|
250
|
-
breadcrumb:
|
|
251
|
-
children: /* @__PURE__ */
|
|
78
|
+
return /* @__PURE__ */ p(r, {
|
|
79
|
+
breadcrumb: _,
|
|
80
|
+
children: /* @__PURE__ */ p(y, {
|
|
252
81
|
header: {
|
|
253
|
-
title:
|
|
254
|
-
subtitle:
|
|
82
|
+
title: c("dashboard.title"),
|
|
83
|
+
subtitle: c("dashboard.subtitle")
|
|
255
84
|
},
|
|
256
|
-
children: /* @__PURE__ */
|
|
85
|
+
children: /* @__PURE__ */ p(S, {
|
|
257
86
|
columns: 12,
|
|
258
|
-
children: e.map(({ config: e, label: t }) => /* @__PURE__ */
|
|
87
|
+
children: e.map(({ config: e, label: t }) => /* @__PURE__ */ p(C, {
|
|
259
88
|
span: 4,
|
|
260
|
-
children: /* @__PURE__ */
|
|
89
|
+
children: /* @__PURE__ */ p(b, {
|
|
261
90
|
title: t,
|
|
262
|
-
children: /* @__PURE__ */
|
|
263
|
-
className:
|
|
264
|
-
children: [/* @__PURE__ */
|
|
265
|
-
className:
|
|
266
|
-
children:
|
|
267
|
-
}), /* @__PURE__ */
|
|
91
|
+
children: /* @__PURE__ */ m("div", {
|
|
92
|
+
className: l,
|
|
93
|
+
children: [/* @__PURE__ */ p("div", {
|
|
94
|
+
className: u,
|
|
95
|
+
children: c("common.notAvailable")
|
|
96
|
+
}), /* @__PURE__ */ p(x, { actions: [{
|
|
268
97
|
id: e.id,
|
|
269
98
|
href: e.routes.list,
|
|
270
|
-
label:
|
|
99
|
+
label: c("dashboard.actions.openList")
|
|
271
100
|
}] })]
|
|
272
101
|
})
|
|
273
102
|
})
|
|
@@ -276,18 +105,18 @@ var { useLazyLoadQuery: k } = v, A = () => {
|
|
|
276
105
|
})
|
|
277
106
|
});
|
|
278
107
|
}
|
|
279
|
-
return
|
|
280
|
-
breadcrumb:
|
|
281
|
-
children: /* @__PURE__ */
|
|
282
|
-
config:
|
|
108
|
+
return g.query == null ? /* @__PURE__ */ p(r, {
|
|
109
|
+
breadcrumb: _,
|
|
110
|
+
children: /* @__PURE__ */ p(j, {
|
|
111
|
+
config: g,
|
|
283
112
|
globalData: null
|
|
284
113
|
})
|
|
285
|
-
}) : /* @__PURE__ */
|
|
286
|
-
breadcrumb:
|
|
287
|
-
children: /* @__PURE__ */
|
|
114
|
+
}) : /* @__PURE__ */ p(r, {
|
|
115
|
+
breadcrumb: _,
|
|
116
|
+
children: /* @__PURE__ */ p(M, { config: g })
|
|
288
117
|
});
|
|
289
118
|
};
|
|
290
119
|
//#endregion
|
|
291
|
-
export {
|
|
120
|
+
export { N as BackofficeDashboardPage, N as default };
|
|
292
121
|
|
|
293
122
|
//# sourceMappingURL=BackofficeDashboardPage.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BackofficeDashboardPage.js","names":[],"sources":["../../../src/pages/BackofficeDashboardPage.tsx"],"sourcesContent":["/* eslint-disable no-ternary */\nimport { type JSX, Suspense } from 'react';\nimport type {\n BackofficeDashboardConfig,\n BackofficeDashboardWidget,\n BackofficeDashboardWidgetSpan,\n BackofficeDashboardWidgetTabletSpan,\n BackofficeDashboardWidgetSize,\n I18nLabel,\n} from '@plumile/backoffice-core/types.js';\nimport { Spinner } from '@plumile/ui/backoffice/atoms/spinner/Spinner.js';\nimport { BackofficeEmptyState } from '@plumile/ui/backoffice/molecules/backoffice_empty_state/BackofficeEmptyState.js';\nimport { DetailPageTemplate } from '@plumile/ui/backoffice/templates/detail_page_template/DetailPageTemplate.js';\nimport { DashboardMetricGroup } from '@plumile/ui/components/dashboard/dashboard_metric_group/DashboardMetricGroup.js';\nimport { DashboardPanel } from '@plumile/ui/components/dashboard/dashboard_panel/DashboardPanel.js';\nimport { DashboardQuickActions } from '@plumile/ui/components/dashboard/dashboard_quick_actions/DashboardQuickActions.js';\nimport { DashboardStatusList } from '@plumile/ui/components/dashboard/dashboard_status_list/DashboardStatusList.js';\nimport {\n DashboardGrid,\n DashboardGridItem,\n} from '@plumile/ui/components/dashboard/dashboard_grid/DashboardGrid.js';\nimport { DataTable } from '@plumile/ui/components/data-table/DataTable.js';\nimport { useTranslation } from 'react-i18next';\nimport * as ReactRelay from 'react-relay';\nimport type { GraphQLTaggedNode, OperationType } from 'relay-runtime';\n\nimport { BackofficeErrorBoundary } from '../components/backoffice/errors/BackofficeErrorBoundary.js';\nimport { BackofficeBillingUsageChart } from '../components/backoffice/billing/BackofficeBillingUsageChart.js';\nimport { useBackofficeReactTranslation } from '../i18n/useBackofficeReactTranslation.js';\nimport { useBackofficeConfig } from '../provider/BackofficeConfigContext.js';\nimport { useBackofficeDashboardConfig } from '../provider/useBackofficeLazyValue.js';\nimport type { BackofficePreparedDashboardRoute } from '../router/createBackofficeRoutes.js';\nimport { buildDataTableColumns } from '../components/backoffice/columns/buildDataTableColumns.js';\nimport { BackofficeRightPageLayout } from '../components/backoffice/layout/breadcrumb/BackofficeRightPageLayout.js';\nimport { buildDashboardBreadcrumb } from '../components/backoffice/layout/breadcrumb/buildBreadcrumbs.js';\nimport {\n getWidgetLabel,\n hasWidgetQuery,\n resolveLabel,\n} from './BackofficeDashboardPage.helpers.js';\n\nimport * as styles from './backofficeDashboardPage.css.js';\n\nconst { useLazyLoadQuery } = ReactRelay;\n\ntype WidgetContentProps = {\n widget: BackofficeDashboardWidget;\n globalData: unknown;\n};\n\nconst DashboardUnavailableState = (): JSX.Element => {\n const { t } = useBackofficeReactTranslation();\n\n return <BackofficeEmptyState title={t('common.notAvailable')} />;\n};\n\nconst DashboardLoadingState = (): JSX.Element => {\n const { t } = useBackofficeReactTranslation();\n\n return (\n <div className={styles.loadingBody}>\n <Spinner ariaLabel={t('common.loading')} />\n <span>{t('common.loading')}</span>\n </div>\n );\n};\n\nconst resolveWidgetSize = (\n size: BackofficeDashboardWidgetSize | undefined,\n): BackofficeDashboardWidgetSize => {\n return size ?? 'm';\n};\n\nconst resolveWidgetSpan = (\n widget: BackofficeDashboardWidget,\n): BackofficeDashboardWidgetSpan => {\n if (widget.layout?.span != null) {\n return widget.layout.span;\n }\n\n const size = resolveWidgetSize(widget.size);\n if (size === 's') {\n return 3;\n }\n if (size === 'm') {\n return 4;\n }\n if (size === 'l') {\n return 6;\n }\n if (size === 'xl') {\n return 8;\n }\n return 12;\n};\n\nconst resolveWidgetTabletSpan = (\n widget: BackofficeDashboardWidget,\n): BackofficeDashboardWidgetTabletSpan | undefined => {\n return widget.layout?.tabletSpan;\n};\n\nconst WidgetContent = ({\n widget,\n globalData,\n}: WidgetContentProps): JSX.Element | null => {\n const { t: tApp } = useTranslation();\n const { t } = useBackofficeReactTranslation();\n const { entities } = useBackofficeConfig();\n const description =\n widget.description != null\n ? resolveLabel(widget.description, tApp)\n : undefined;\n\n const resolveData = (data: unknown): unknown => {\n if ('resolve' in widget && widget.resolve != null) {\n return widget.resolve(data);\n }\n return null;\n };\n\n if (widget.kind === 'textBlock') {\n const title = resolveLabel(widget.title, tApp);\n const body = resolveLabel(widget.body, tApp);\n return (\n <DashboardPanel title={title} subtitle={description}>\n <div className={styles.tileBody}>{body}</div>\n </DashboardPanel>\n );\n }\n\n if (widget.kind === 'shortcut') {\n const entity = entities[widget.entityId];\n const title = resolveLabel(widget.label, tApp);\n if (entity == null) {\n return (\n <DashboardPanel title={title} subtitle={description}>\n <DashboardUnavailableState />\n </DashboardPanel>\n );\n }\n if (entity.kind === 'tool') {\n return (\n <DashboardPanel title={title} subtitle={description}>\n <DashboardQuickActions\n actions={[\n {\n id: entity.id,\n href: entity.routes.list,\n label: t('dashboard.actions.openTool'),\n },\n ]}\n />\n </DashboardPanel>\n );\n }\n return (\n <DashboardPanel title={title} subtitle={description}>\n <DashboardQuickActions\n actions={[\n {\n id: entity.id,\n href: entity.routes.list,\n label: t('dashboard.actions.openList'),\n },\n ]}\n />\n </DashboardPanel>\n );\n }\n\n if (widget.kind === 'tablePreview') {\n const resolved = resolveData(globalData) as {\n columns: readonly unknown[];\n rows: readonly unknown[];\n } | null;\n if (resolved == null) {\n return (\n <DashboardPanel\n title={resolveLabel(widget.title, tApp)}\n subtitle={description}\n >\n <DashboardUnavailableState />\n </DashboardPanel>\n );\n }\n const columns = buildDataTableColumns(resolved.columns as never, {\n tApp,\n t,\n });\n const title = resolveLabel(widget.title, tApp);\n return (\n <DashboardPanel title={title} subtitle={description}>\n <DataTable\n columns={columns}\n rows={resolved.rows}\n getRowId={(row, index) => {\n if (row != null && typeof row === 'object') {\n const record = row as Record<string, unknown>;\n const { id } = record;\n if (typeof id === 'string' && id.trim() !== '') {\n return id;\n }\n }\n return String(index);\n }}\n />\n </DashboardPanel>\n );\n }\n\n if (widget.kind === 'metricGroup') {\n const resolved = resolveData(globalData) as\n | readonly {\n id: string;\n label: I18nLabel;\n value: string | number | null;\n meta?: I18nLabel;\n href?: string;\n }[]\n | null;\n if (resolved == null) {\n return <DashboardUnavailableState />;\n }\n return (\n <DashboardMetricGroup\n emptyState={<DashboardUnavailableState />}\n metrics={resolved.map((metric) => {\n return {\n id: metric.id,\n href: metric.href,\n label: resolveLabel(metric.label, tApp),\n value: metric.value ?? t('common.notAvailable'),\n hint:\n metric.meta != null ? resolveLabel(metric.meta, tApp) : undefined,\n };\n })}\n />\n );\n }\n\n if (widget.kind === 'billingUsageChart') {\n const resolved = resolveData(globalData) as {\n currency: string;\n totalAmount: number;\n from: string | null;\n to: string | null;\n buckets: readonly {\n day: string;\n category: string;\n value: number;\n }[];\n } | null;\n const title = resolveLabel(widget.title, tApp);\n if (resolved == null) {\n return (\n <DashboardPanel title={title} subtitle={description}>\n <DashboardUnavailableState />\n </DashboardPanel>\n );\n }\n\n return (\n <DashboardPanel title={title} subtitle={description}>\n <BackofficeBillingUsageChart\n ariaLabel={resolveLabel(widget.ariaLabel, tApp)}\n buckets={resolved.buckets}\n categories={widget.categories.map((category) => {\n return {\n id: category.id,\n label: resolveLabel(category.label, tApp),\n color: category.color,\n };\n })}\n currency={resolved.currency}\n emptyLabel={resolveLabel(widget.emptyLabel, tApp)}\n from={resolved.from}\n rangePrefix={resolveLabel(widget.rangePrefix, tApp)}\n to={resolved.to}\n totalAmount={resolved.totalAmount}\n />\n </DashboardPanel>\n );\n }\n\n if (widget.kind === 'quickActions') {\n const title =\n widget.title != null\n ? resolveLabel(widget.title, tApp)\n : t('dashboard.actions.openTool');\n return (\n <DashboardPanel title={title} subtitle={description}>\n <DashboardQuickActions\n layout={widget.layout?.zone === 'aside' ? 'stack' : 'grid'}\n emptyState={<DashboardUnavailableState />}\n actions={widget.actions.map((action) => {\n return {\n id: action.id,\n href: action.href,\n label: resolveLabel(action.label, tApp),\n };\n })}\n />\n </DashboardPanel>\n );\n }\n\n if (widget.kind === 'statusSummary') {\n const resolved = resolveData(globalData) as\n | readonly {\n id: string;\n label: I18nLabel;\n value: string | number | null;\n href?: string;\n }[]\n | null;\n if (resolved == null) {\n const title =\n widget.title != null ? resolveLabel(widget.title, tApp) : undefined;\n return (\n <DashboardPanel title={title} subtitle={description}>\n <DashboardUnavailableState />\n </DashboardPanel>\n );\n }\n const title =\n widget.title != null ? resolveLabel(widget.title, tApp) : undefined;\n return (\n <DashboardPanel title={title} subtitle={description}>\n <DashboardStatusList\n emptyState={<DashboardUnavailableState />}\n items={resolved.map((item) => {\n return {\n id: item.id,\n href: item.href,\n label: resolveLabel(item.label, tApp),\n value: item.value ?? t('common.notAvailable'),\n };\n })}\n />\n </DashboardPanel>\n );\n }\n\n if (widget.kind === 'recentItems') {\n const title =\n widget.title != null\n ? resolveLabel(widget.title, tApp)\n : t('dashboard.title');\n return (\n <DashboardPanel title={title} subtitle={description}>\n <DashboardUnavailableState />\n </DashboardPanel>\n );\n }\n\n const entityManifest = entities[widget.entityId];\n if (entityManifest?.kind !== 'list-detail') {\n return (\n <DashboardPanel\n title={resolveLabel(widget.label, tApp)}\n subtitle={description}\n >\n <DashboardUnavailableState />\n </DashboardPanel>\n );\n }\n const resolved = resolveData(globalData) as { count: number | null } | null;\n let countLabel: number | string = t('common.notAvailable');\n if (typeof resolved?.count === 'number') {\n countLabel = resolved.count;\n }\n const title = resolveLabel(widget.label, tApp);\n return (\n <DashboardPanel title={title} subtitle={description}>\n <div className={styles.tileBody}>\n <div className={styles.tileCount}>{countLabel}</div>\n <DashboardQuickActions\n emptyState={<DashboardUnavailableState />}\n actions={[\n {\n id: entityManifest.id,\n href: entityManifest.routes.list,\n label: t('dashboard.actions.openList'),\n },\n ]}\n />\n </div>\n </DashboardPanel>\n );\n};\n\ntype WidgetWithQueryProps = {\n widget: BackofficeDashboardWidget & { query: GraphQLTaggedNode };\n};\n\nconst WidgetWithQuery = ({ widget }: WidgetWithQueryProps): JSX.Element => {\n const data = useLazyLoadQuery<OperationType>(\n widget.query,\n {},\n {\n fetchPolicy: 'store-or-network',\n },\n );\n\n return <WidgetContent widget={widget} globalData={data} />;\n};\n\ntype DashboardContentProps = {\n config: BackofficeDashboardConfig;\n globalData: unknown;\n};\n\nconst DashboardContent = ({\n config,\n globalData,\n}: DashboardContentProps): JSX.Element => {\n const { t: tApp } = useTranslation();\n const { t } = useBackofficeReactTranslation();\n\n const title = resolveLabel(config.title, tApp);\n const subtitle =\n config.subtitle != null ? resolveLabel(config.subtitle, tApp) : undefined;\n\n return (\n <DetailPageTemplate\n header={{\n title,\n subtitle: subtitle ?? t('dashboard.subtitle'),\n }}\n >\n <DashboardGrid columns={12}>\n {config.widgets.map((widget) => {\n const widgetTitle = resolveLabel(\n getWidgetLabel(widget, config),\n tApp,\n );\n const content = hasWidgetQuery(widget) ? (\n <WidgetWithQuery widget={widget} />\n ) : (\n <WidgetContent widget={widget} globalData={globalData} />\n );\n\n return (\n <DashboardGridItem\n key={widget.id}\n minHeight={widget.minHeight ?? 'auto'}\n span={resolveWidgetSpan(widget)}\n tabletSpan={resolveWidgetTabletSpan(widget)}\n >\n <BackofficeErrorBoundary\n fallback={() => {\n return (\n <DashboardPanel title={widgetTitle}>\n <DashboardUnavailableState />\n </DashboardPanel>\n );\n }}\n >\n <Suspense\n fallback={\n <DashboardPanel title={widgetTitle}>\n <DashboardLoadingState />\n </DashboardPanel>\n }\n >\n {content}\n </Suspense>\n </BackofficeErrorBoundary>\n </DashboardGridItem>\n );\n })}\n </DashboardGrid>\n </DetailPageTemplate>\n );\n};\n\ntype DashboardWithQueryProps = {\n config: BackofficeDashboardConfig;\n};\n\nconst DashboardWithQuery = ({\n config,\n}: DashboardWithQueryProps): JSX.Element => {\n const data = useLazyLoadQuery<OperationType>(\n config.query as never,\n {},\n { fetchPolicy: 'store-or-network' },\n );\n\n return <DashboardContent config={config} globalData={data} />;\n};\n\nexport type BackofficeDashboardPageProps = {\n prepared?: BackofficePreparedDashboardRoute | null;\n};\n\nexport const BackofficeDashboardPage = ({\n prepared,\n}: BackofficeDashboardPageProps): JSX.Element => {\n const { t: tApp } = useTranslation();\n const { t } = useBackofficeReactTranslation();\n const { entities } = useBackofficeConfig();\n const rootDashboard = useBackofficeDashboardConfig();\n const dashboard = prepared?.config ?? rootDashboard;\n const breadcrumb = buildDashboardBreadcrumb(t);\n\n if (dashboard == null) {\n const items = Object.values(entities)\n .filter((config) => {\n return config.kind === 'list-detail' && config.hasList;\n })\n .map((config) => {\n return {\n config,\n label: resolveLabel(config.label, tApp),\n };\n })\n .sort((left, right) => {\n return left.label.localeCompare(right.label);\n });\n\n return (\n <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n <DetailPageTemplate\n header={{\n title: t('dashboard.title'),\n subtitle: t('dashboard.subtitle'),\n }}\n >\n <DashboardGrid columns={12}>\n {items.map(({ config, label }) => {\n return (\n <DashboardGridItem key={config.id} span={4}>\n <DashboardPanel title={label}>\n <div className={styles.tileBody}>\n <div className={styles.tileCount}>\n {t('common.notAvailable')}\n </div>\n <DashboardQuickActions\n actions={[\n {\n id: config.id,\n href: config.routes.list,\n label: t('dashboard.actions.openList'),\n },\n ]}\n />\n </div>\n </DashboardPanel>\n </DashboardGridItem>\n );\n })}\n </DashboardGrid>\n </DetailPageTemplate>\n </BackofficeRightPageLayout>\n );\n }\n\n if (dashboard.query != null) {\n return (\n <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n <DashboardWithQuery config={dashboard} />\n </BackofficeRightPageLayout>\n );\n }\n\n return (\n <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n <DashboardContent config={dashboard} globalData={null} />\n </BackofficeRightPageLayout>\n );\n};\n\nexport default BackofficeDashboardPage;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BackofficeDashboardPage.js","names":[],"sources":["../../../src/pages/BackofficeDashboardPage.tsx"],"sourcesContent":["/* eslint-disable no-ternary */\nimport { lazy, type JSX, Suspense } from 'react';\nimport type {\n BackofficeDashboardConfig,\n BackofficeDashboardWidget,\n BackofficeDashboardWidgetSpan,\n BackofficeDashboardWidgetTabletSpan,\n BackofficeDashboardWidgetSize,\n} from '@plumile/backoffice-core/types.js';\nimport { Spinner } from '@plumile/ui/backoffice/atoms/spinner/Spinner.js';\nimport { BackofficeEmptyState } from '@plumile/ui/backoffice/molecules/backoffice_empty_state/BackofficeEmptyState.js';\nimport { DetailPageTemplate } from '@plumile/ui/backoffice/templates/detail_page_template/DetailPageTemplate.js';\nimport { DashboardPanel } from '@plumile/ui/components/dashboard/dashboard_panel/DashboardPanel.js';\nimport { DashboardQuickActions } from '@plumile/ui/components/dashboard/dashboard_quick_actions/DashboardQuickActions.js';\nimport {\n DashboardGrid,\n DashboardGridItem,\n} from '@plumile/ui/components/dashboard/dashboard_grid/DashboardGrid.js';\nimport { useTranslation } from 'react-i18next';\nimport * as ReactRelay from 'react-relay';\nimport type { OperationType } from 'relay-runtime';\n\nimport { BackofficeErrorBoundary } from '../components/backoffice/errors/BackofficeErrorBoundary.js';\nimport { useBackofficeReactTranslation } from '../i18n/useBackofficeReactTranslation.js';\nimport { useBackofficeConfig } from '../provider/BackofficeConfigContext.js';\nimport { useBackofficeDashboardConfig } from '../provider/useBackofficeLazyValue.js';\nimport type { BackofficePreparedDashboardRoute } from '../router/createBackofficeRoutes.js';\nimport { BackofficeRightPageLayout } from '../components/backoffice/layout/breadcrumb/BackofficeRightPageLayout.js';\nimport { buildDashboardBreadcrumb } from '../components/backoffice/layout/breadcrumb/buildBreadcrumbs.js';\nimport {\n getWidgetLabel,\n resolveLabel,\n} from './BackofficeDashboardPage.helpers.js';\n\nimport * as styles from './backofficeDashboardPage.css.js';\n\nconst { useLazyLoadQuery } = ReactRelay;\n\nconst LazyBackofficeDashboardWidgetContent = lazy(async () => {\n const module = await import('./BackofficeDashboardWidgetContent.js');\n return {\n default: module.BackofficeDashboardWidgetContent,\n };\n});\n\nconst DashboardUnavailableState = (): JSX.Element => {\n const { t } = useBackofficeReactTranslation();\n\n return <BackofficeEmptyState title={t('common.notAvailable')} />;\n};\n\nconst DashboardLoadingState = (): JSX.Element => {\n const { t } = useBackofficeReactTranslation();\n\n return (\n <div className={styles.loadingBody}>\n <Spinner ariaLabel={t('common.loading')} />\n <span>{t('common.loading')}</span>\n </div>\n );\n};\n\nconst resolveWidgetSize = (\n size: BackofficeDashboardWidgetSize | undefined,\n): BackofficeDashboardWidgetSize => {\n return size ?? 'm';\n};\n\nconst resolveWidgetSpan = (\n widget: BackofficeDashboardWidget,\n): BackofficeDashboardWidgetSpan => {\n if (widget.layout?.span != null) {\n return widget.layout.span;\n }\n\n const size = resolveWidgetSize(widget.size);\n if (size === 's') {\n return 3;\n }\n if (size === 'm') {\n return 4;\n }\n if (size === 'l') {\n return 6;\n }\n if (size === 'xl') {\n return 8;\n }\n return 12;\n};\n\nconst resolveWidgetTabletSpan = (\n widget: BackofficeDashboardWidget,\n): BackofficeDashboardWidgetTabletSpan | undefined => {\n return widget.layout?.tabletSpan;\n};\n\ntype DashboardContentProps = {\n config: BackofficeDashboardConfig;\n globalData: unknown;\n};\n\nconst DashboardContent = ({\n config,\n globalData,\n}: DashboardContentProps): JSX.Element => {\n const { t: tApp } = useTranslation();\n const { t } = useBackofficeReactTranslation();\n\n const title = resolveLabel(config.title, tApp);\n const subtitle =\n config.subtitle != null ? resolveLabel(config.subtitle, tApp) : undefined;\n\n return (\n <DetailPageTemplate\n header={{\n title,\n subtitle: subtitle ?? t('dashboard.subtitle'),\n }}\n >\n <DashboardGrid columns={12}>\n {config.widgets.map((widget) => {\n const widgetTitle = resolveLabel(\n getWidgetLabel(widget, config),\n tApp,\n );\n return (\n <DashboardGridItem\n key={widget.id}\n minHeight={widget.minHeight ?? 'auto'}\n span={resolveWidgetSpan(widget)}\n tabletSpan={resolveWidgetTabletSpan(widget)}\n >\n <BackofficeErrorBoundary\n fallback={() => {\n return (\n <DashboardPanel title={widgetTitle}>\n <DashboardUnavailableState />\n </DashboardPanel>\n );\n }}\n >\n <Suspense\n fallback={\n <DashboardPanel title={widgetTitle}>\n <DashboardLoadingState />\n </DashboardPanel>\n }\n >\n <LazyBackofficeDashboardWidgetContent\n widget={widget}\n globalData={globalData}\n />\n </Suspense>\n </BackofficeErrorBoundary>\n </DashboardGridItem>\n );\n })}\n </DashboardGrid>\n </DetailPageTemplate>\n );\n};\n\ntype DashboardWithQueryProps = {\n config: BackofficeDashboardConfig;\n};\n\nconst DashboardWithQuery = ({\n config,\n}: DashboardWithQueryProps): JSX.Element => {\n const data = useLazyLoadQuery<OperationType>(\n config.query as never,\n {},\n { fetchPolicy: 'store-or-network' },\n );\n\n return <DashboardContent config={config} globalData={data} />;\n};\n\nexport type BackofficeDashboardPageProps = {\n prepared?: BackofficePreparedDashboardRoute | null;\n};\n\nexport const BackofficeDashboardPage = ({\n prepared,\n}: BackofficeDashboardPageProps): JSX.Element => {\n const { t: tApp } = useTranslation();\n const { t } = useBackofficeReactTranslation();\n const { entities } = useBackofficeConfig();\n const rootDashboard = useBackofficeDashboardConfig();\n const dashboard = prepared?.config ?? rootDashboard;\n const breadcrumb = buildDashboardBreadcrumb(t);\n\n if (dashboard == null) {\n const items = Object.values(entities)\n .filter((config) => {\n return config.kind === 'list-detail' && config.hasList;\n })\n .map((config) => {\n return {\n config,\n label: resolveLabel(config.label, tApp),\n };\n })\n .sort((left, right) => {\n return left.label.localeCompare(right.label);\n });\n\n return (\n <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n <DetailPageTemplate\n header={{\n title: t('dashboard.title'),\n subtitle: t('dashboard.subtitle'),\n }}\n >\n <DashboardGrid columns={12}>\n {items.map(({ config, label }) => {\n return (\n <DashboardGridItem key={config.id} span={4}>\n <DashboardPanel title={label}>\n <div className={styles.tileBody}>\n <div className={styles.tileCount}>\n {t('common.notAvailable')}\n </div>\n <DashboardQuickActions\n actions={[\n {\n id: config.id,\n href: config.routes.list,\n label: t('dashboard.actions.openList'),\n },\n ]}\n />\n </div>\n </DashboardPanel>\n </DashboardGridItem>\n );\n })}\n </DashboardGrid>\n </DetailPageTemplate>\n </BackofficeRightPageLayout>\n );\n }\n\n if (dashboard.query != null) {\n return (\n <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n <DashboardWithQuery config={dashboard} />\n </BackofficeRightPageLayout>\n );\n }\n\n return (\n <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n <DashboardContent config={dashboard} globalData={null} />\n </BackofficeRightPageLayout>\n );\n};\n\nexport default BackofficeDashboardPage;\n"],"mappings":"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"}
|