npm - @plumile/backoffice-react - Versions diffs - 0.1.150 → 0.1.152 - Mend

@plumile/backoffice-react 0.1.150 → 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.

Files changed (36) hide show

package/lib/esm/pages/BackofficeDashboardPage.js CHANGED Viewed

@@ -1,273 +1,102 @@
 import { useBackofficeReactTranslation as e } from "../i18n/useBackofficeReactTranslation.js";
 import { useBackofficeConfig as t } from "../provider/BackofficeConfigContext.js";
 import { BackofficeErrorBoundary as n } from "../components/backoffice/errors/BackofficeErrorBoundary.js";
-import { BackofficeBillingUsageChart as r } from "../components/backoffice/billing/BackofficeBillingUsageChart.js";
-import { buildDataTableColumns as i } from "../components/backoffice/columns/buildDataTableColumns.js";
-import { BackofficeRightPageLayout as a } from "../components/backoffice/layout/breadcrumb/BackofficeRightPageLayout.js";
-import { buildDashboardBreadcrumb as o } from "../components/backoffice/layout/breadcrumb/buildBreadcrumbs.js";
-import { useBackofficeDashboardConfig as s } from "../provider/useBackofficeLazyValue.js";
-import { getWidgetLabel as c, hasWidgetQuery as l, resolveLabel as u } from "./BackofficeDashboardPage.helpers.js";
-import { loadingBody as d, tileBody as f, tileCount as p } from "./backofficeDashboardPage.css.js";
-import { Suspense as m } from "react";
-import { jsx as h, jsxs as g } from "react/jsx-runtime";
-import { useTranslation as _ } from "react-i18next";
-import * as v from "react-relay";
-import { Spinner as y } from "@plumile/ui/backoffice/atoms/spinner/Spinner.js";
-import { BackofficeEmptyState as b } from "@plumile/ui/backoffice/molecules/backoffice_empty_state/BackofficeEmptyState.js";
-import { DetailPageTemplate as x } from "@plumile/ui/backoffice/templates/detail_page_template/DetailPageTemplate.js";
-import { DashboardMetricGroup as S } from "@plumile/ui/components/dashboard/dashboard_metric_group/DashboardMetricGroup.js";
-import { DashboardPanel as C } from "@plumile/ui/components/dashboard/dashboard_panel/DashboardPanel.js";
-import { DashboardQuickActions as w } from "@plumile/ui/components/dashboard/dashboard_quick_actions/DashboardQuickActions.js";
-import { DashboardStatusList as T } from "@plumile/ui/components/dashboard/dashboard_status_list/DashboardStatusList.js";
-import { DashboardGrid as E, DashboardGridItem as D } from "@plumile/ui/components/dashboard/dashboard_grid/DashboardGrid.js";
-import { DataTable as O } from "@plumile/ui/components/data-table/DataTable.js";
+import { BackofficeRightPageLayout as r } from "../components/backoffice/layout/breadcrumb/BackofficeRightPageLayout.js";
+import { buildDashboardBreadcrumb as i } from "../components/backoffice/layout/breadcrumb/buildBreadcrumbs.js";
+import { useBackofficeDashboardConfig as a } from "../provider/useBackofficeLazyValue.js";
+import { getWidgetLabel as o, resolveLabel as s } from "./BackofficeDashboardPage.helpers.js";
+import { loadingBody as c, tileBody as l, tileCount as u } from "./backofficeDashboardPage.css.js";
+import { Suspense as d, lazy as f } from "react";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+import { useTranslation as h } from "react-i18next";
+import * as g from "react-relay";
+import { Spinner as _ } from "@plumile/ui/backoffice/atoms/spinner/Spinner.js";
+import { BackofficeEmptyState as v } from "@plumile/ui/backoffice/molecules/backoffice_empty_state/BackofficeEmptyState.js";
+import { DetailPageTemplate as y } from "@plumile/ui/backoffice/templates/detail_page_template/DetailPageTemplate.js";
+import { DashboardPanel as b } from "@plumile/ui/components/dashboard/dashboard_panel/DashboardPanel.js";
+import { DashboardQuickActions as x } from "@plumile/ui/components/dashboard/dashboard_quick_actions/DashboardQuickActions.js";
+import { DashboardGrid as S, DashboardGridItem as C } from "@plumile/ui/components/dashboard/dashboard_grid/DashboardGrid.js";
 //#region src/pages/BackofficeDashboardPage.tsx
-var { useLazyLoadQuery: k } = v, A = () => {
+var { useLazyLoadQuery: w } = g, T = f(async () => ({ default: (await import("./BackofficeDashboardWidgetContent.js")).BackofficeDashboardWidgetContent })), E = () => {
 	let { t } = e();
-	return /* @__PURE__ */ h(b, { title: t("common.notAvailable") });
-}, j = () => {
+	return /* @__PURE__ */ p(v, { title: t("common.notAvailable") });
+}, D = () => {
 	let { t } = e();
-	return /* @__PURE__ */ g("div", {
-		className: d,
-		children: [/* @__PURE__ */ h(y, { ariaLabel: t("common.loading") }), /* @__PURE__ */ h("span", { children: t("common.loading") })]
+	return /* @__PURE__ */ m("div", {
+		className: c,
+		children: [/* @__PURE__ */ p(_, { ariaLabel: t("common.loading") }), /* @__PURE__ */ p("span", { children: t("common.loading") })]
 	});
-}, M = (e) => e ?? "m", N = (e) => {
+}, O = (e) => e ?? "m", k = (e) => {
 	if (e.layout?.span != null) return e.layout.span;
-	let t = M(e.size);
+	let t = O(e.size);
 	return t === "s" ? 3 : t === "m" ? 4 : t === "l" ? 6 : t === "xl" ? 8 : 12;
-}, P = (e) => e.layout?.tabletSpan, F = ({ widget: n, globalData: a }) => {
-	let { t: o } = _(), { t: s } = e(), { entities: c } = t(), l = n.description == null ? void 0 : u(n.description, o), d = (e) => "resolve" in n && n.resolve != null ? n.resolve(e) : null;
-	if (n.kind === "textBlock") return /* @__PURE__ */ h(C, {
-		title: u(n.title, o),
-		subtitle: l,
-		children: /* @__PURE__ */ h("div", {
-			className: f,
-			children: u(n.body, o)
-		})
-	});
-	if (n.kind === "shortcut") {
-		let e = c[n.entityId], t = u(n.label, o);
-		return e == null ? /* @__PURE__ */ h(C, {
-			title: t,
-			subtitle: l,
-			children: /* @__PURE__ */ h(A, {})
-		}) : e.kind === "tool" ? /* @__PURE__ */ h(C, {
-			title: t,
-			subtitle: l,
-			children: /* @__PURE__ */ h(w, { actions: [{
-				id: e.id,
-				href: e.routes.list,
-				label: s("dashboard.actions.openTool")
-			}] })
-		}) : /* @__PURE__ */ h(C, {
-			title: t,
-			subtitle: l,
-			children: /* @__PURE__ */ h(w, { actions: [{
-				id: e.id,
-				href: e.routes.list,
-				label: s("dashboard.actions.openList")
-			}] })
-		});
-	}
-	if (n.kind === "tablePreview") {
-		let e = d(a);
-		if (e == null) return /* @__PURE__ */ h(C, {
-			title: u(n.title, o),
-			subtitle: l,
-			children: /* @__PURE__ */ h(A, {})
-		});
-		let t = i(e.columns, {
-			tApp: o,
-			t: s
-		});
-		return /* @__PURE__ */ h(C, {
-			title: u(n.title, o),
-			subtitle: l,
-			children: /* @__PURE__ */ h(O, {
-				columns: t,
-				rows: e.rows,
-				getRowId: (e, t) => {
-					if (typeof e == "object" && e) {
-						let { id: t } = e;
-						if (typeof t == "string" && t.trim() !== "") return t;
-					}
-					return String(t);
-				}
-			})
-		});
-	}
-	if (n.kind === "metricGroup") {
-		let e = d(a);
-		return e == null ? /* @__PURE__ */ h(A, {}) : /* @__PURE__ */ h(S, {
-			emptyState: /* @__PURE__ */ h(A, {}),
-			metrics: e.map((e) => ({
-				id: e.id,
-				href: e.href,
-				label: u(e.label, o),
-				value: e.value ?? s("common.notAvailable"),
-				hint: e.meta == null ? void 0 : u(e.meta, o)
-			}))
-		});
-	}
-	if (n.kind === "billingUsageChart") {
-		let e = d(a), t = u(n.title, o);
-		return e == null ? /* @__PURE__ */ h(C, {
-			title: t,
-			subtitle: l,
-			children: /* @__PURE__ */ h(A, {})
-		}) : /* @__PURE__ */ h(C, {
-			title: t,
-			subtitle: l,
-			children: /* @__PURE__ */ h(r, {
-				ariaLabel: u(n.ariaLabel, o),
-				buckets: e.buckets,
-				categories: n.categories.map((e) => ({
-					id: e.id,
-					label: u(e.label, o),
-					color: e.color
-				})),
-				currency: e.currency,
-				emptyLabel: u(n.emptyLabel, o),
-				from: e.from,
-				rangePrefix: u(n.rangePrefix, o),
-				to: e.to,
-				totalAmount: e.totalAmount
-			})
-		});
-	}
-	if (n.kind === "quickActions") return /* @__PURE__ */ h(C, {
-		title: n.title == null ? s("dashboard.actions.openTool") : u(n.title, o),
-		subtitle: l,
-		children: /* @__PURE__ */ h(w, {
-			layout: n.layout?.zone === "aside" ? "stack" : "grid",
-			emptyState: /* @__PURE__ */ h(A, {}),
-			actions: n.actions.map((e) => ({
-				id: e.id,
-				href: e.href,
-				label: u(e.label, o)
-			}))
-		})
-	});
-	if (n.kind === "statusSummary") {
-		let e = d(a);
-		return e == null ? /* @__PURE__ */ h(C, {
-			title: n.title == null ? void 0 : u(n.title, o),
-			subtitle: l,
-			children: /* @__PURE__ */ h(A, {})
-		}) : /* @__PURE__ */ h(C, {
-			title: n.title == null ? void 0 : u(n.title, o),
-			subtitle: l,
-			children: /* @__PURE__ */ h(T, {
-				emptyState: /* @__PURE__ */ h(A, {}),
-				items: e.map((e) => ({
-					id: e.id,
-					href: e.href,
-					label: u(e.label, o),
-					value: e.value ?? s("common.notAvailable")
-				}))
-			})
-		});
-	}
-	if (n.kind === "recentItems") return /* @__PURE__ */ h(C, {
-		title: n.title == null ? s("dashboard.title") : u(n.title, o),
-		subtitle: l,
-		children: /* @__PURE__ */ h(A, {})
-	});
-	let m = c[n.entityId];
-	if (m?.kind !== "list-detail") return /* @__PURE__ */ h(C, {
-		title: u(n.label, o),
-		subtitle: l,
-		children: /* @__PURE__ */ h(A, {})
-	});
-	let v = d(a), y = s("common.notAvailable");
-	return typeof v?.count == "number" && (y = v.count), /* @__PURE__ */ h(C, {
-		title: u(n.label, o),
-		subtitle: l,
-		children: /* @__PURE__ */ g("div", {
-			className: f,
-			children: [/* @__PURE__ */ h("div", {
-				className: p,
-				children: y
-			}), /* @__PURE__ */ h(w, {
-				emptyState: /* @__PURE__ */ h(A, {}),
-				actions: [{
-					id: m.id,
-					href: m.routes.list,
-					label: s("dashboard.actions.openList")
-				}]
-			})]
-		})
-	});
-}, I = ({ widget: e }) => /* @__PURE__ */ h(F, {
-	widget: e,
-	globalData: k(e.query, {}, { fetchPolicy: "store-or-network" })
-}), L = ({ config: t, globalData: r }) => {
-	let { t: i } = _(), { t: a } = e();
-	return /* @__PURE__ */ h(x, {
+}, A = (e) => e.layout?.tabletSpan, j = ({ config: t, globalData: r }) => {
+	let { t: i } = h(), { t: a } = e();
+	return /* @__PURE__ */ p(y, {
 		header: {
-			title: u(t.title, i),
-			subtitle: (t.subtitle == null ? void 0 : u(t.subtitle, i)) ?? a("dashboard.subtitle")
+			title: s(t.title, i),
+			subtitle: (t.subtitle == null ? void 0 : s(t.subtitle, i)) ?? a("dashboard.subtitle")
 		},
-		children: /* @__PURE__ */ h(E, {
+		children: /* @__PURE__ */ p(S, {
 			columns: 12,
 			children: t.widgets.map((e) => {
-				let a = u(c(e, t), i), o = l(e) ? /* @__PURE__ */ h(I, { widget: e }) : /* @__PURE__ */ h(F, {
-					widget: e,
-					globalData: r
-				});
-				return /* @__PURE__ */ h(D, {
+				let a = s(o(e, t), i);
+				return /* @__PURE__ */ p(C, {
 					minHeight: e.minHeight ?? "auto",
-					span: N(e),
-					tabletSpan: P(e),
-					children: /* @__PURE__ */ h(n, {
-						fallback: () => /* @__PURE__ */ h(C, {
+					span: k(e),
+					tabletSpan: A(e),
+					children: /* @__PURE__ */ p(n, {
+						fallback: () => /* @__PURE__ */ p(b, {
 							title: a,
-							children: /* @__PURE__ */ h(A, {})
+							children: /* @__PURE__ */ p(E, {})
 						}),
-						children: /* @__PURE__ */ h(m, {
-							fallback: /* @__PURE__ */ h(C, {
+						children: /* @__PURE__ */ p(d, {
+							fallback: /* @__PURE__ */ p(b, {
 								title: a,
-								children: /* @__PURE__ */ h(j, {})
+								children: /* @__PURE__ */ p(D, {})
 							}),
-							children: o
+							children: /* @__PURE__ */ p(T, {
+								widget: e,
+								globalData: r
+							})
 						})
 					})
 				}, e.id);
 			})
 		})
 	});
-}, R = ({ config: e }) => /* @__PURE__ */ h(L, {
+}, M = ({ config: e }) => /* @__PURE__ */ p(j, {
 	config: e,
-	globalData: k(e.query, {}, { fetchPolicy: "store-or-network" })
-}), z = ({ prepared: n }) => {
-	let { t: r } = _(), { t: i } = e(), { entities: c } = t(), l = s(), d = n?.config ?? l, m = o(i);
-	if (d == null) {
-		let e = Object.values(c).filter((e) => e.kind === "list-detail" && e.hasList).map((e) => ({
+	globalData: w(e.query, {}, { fetchPolicy: "store-or-network" })
+}), N = ({ prepared: n }) => {
+	let { t: o } = h(), { t: c } = e(), { entities: d } = t(), f = a(), g = n?.config ?? f, _ = i(c);
+	if (g == null) {
+		let e = Object.values(d).filter((e) => e.kind === "list-detail" && e.hasList).map((e) => ({
 			config: e,
-			label: u(e.label, r)
+			label: s(e.label, o)
 		})).sort((e, t) => e.label.localeCompare(t.label));
-		return /* @__PURE__ */ h(a, {
-			breadcrumb: m,
-			children: /* @__PURE__ */ h(x, {
+		return /* @__PURE__ */ p(r, {
+			breadcrumb: _,
+			children: /* @__PURE__ */ p(y, {
 				header: {
-					title: i("dashboard.title"),
-					subtitle: i("dashboard.subtitle")
+					title: c("dashboard.title"),
+					subtitle: c("dashboard.subtitle")
 				},
-				children: /* @__PURE__ */ h(E, {
+				children: /* @__PURE__ */ p(S, {
 					columns: 12,
-					children: e.map(({ config: e, label: t }) => /* @__PURE__ */ h(D, {
+					children: e.map(({ config: e, label: t }) => /* @__PURE__ */ p(C, {
 						span: 4,
-						children: /* @__PURE__ */ h(C, {
+						children: /* @__PURE__ */ p(b, {
 							title: t,
-							children: /* @__PURE__ */ g("div", {
-								className: f,
-								children: [/* @__PURE__ */ h("div", {
-									className: p,
-									children: i("common.notAvailable")
-								}), /* @__PURE__ */ h(w, { actions: [{
+							children: /* @__PURE__ */ m("div", {
+								className: l,
+								children: [/* @__PURE__ */ p("div", {
+									className: u,
+									children: c("common.notAvailable")
+								}), /* @__PURE__ */ p(x, { actions: [{
 									id: e.id,
 									href: e.routes.list,
-									label: i("dashboard.actions.openList")
+									label: c("dashboard.actions.openList")
 								}] })]
 							})
 						})
@@ -276,18 +105,18 @@ var { useLazyLoadQuery: k } = v, A = () => {
 			})
 		});
 	}
-	return d.query == null ? /* @__PURE__ */ h(a, {
-		breadcrumb: m,
-		children: /* @__PURE__ */ h(L, {
-			config: d,
+	return g.query == null ? /* @__PURE__ */ p(r, {
+		breadcrumb: _,
+		children: /* @__PURE__ */ p(j, {
+			config: g,
 			globalData: null
 		})
-	}) : /* @__PURE__ */ h(a, {
-		breadcrumb: m,
-		children: /* @__PURE__ */ h(R, { config: d })
+	}) : /* @__PURE__ */ p(r, {
+		breadcrumb: _,
+		children: /* @__PURE__ */ p(M, { config: g })
 	});
 };
 //#endregion
-export { z as BackofficeDashboardPage, z as default };
+export { N as BackofficeDashboardPage, N as default };
 //# sourceMappingURL=BackofficeDashboardPage.js.map

package/lib/esm/pages/BackofficeDashboardPage.js.map CHANGED Viewed

	@@ -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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"}

package/lib/esm/pages/BackofficeDashboardWidgetContent.js ADDED Viewed

@@ -0,0 +1,193 @@
+import { useBackofficeReactTranslation as e } from "../i18n/useBackofficeReactTranslation.js";
+import { useBackofficeConfig as t } from "../provider/BackofficeConfigContext.js";
+import { BackofficeBillingUsageChart as n } from "../components/backoffice/billing/BackofficeBillingUsageChart.js";
+import { buildDataTableColumns as r } from "../components/backoffice/columns/buildDataTableColumns.js";
+import { hasWidgetQuery as i, resolveLabel as a } from "./BackofficeDashboardPage.helpers.js";
+import { tileBody as o, tileCount as s } from "./backofficeDashboardPage.css.js";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { useTranslation as u } from "react-i18next";
+import * as d from "react-relay";
+import { BackofficeEmptyState as f } from "@plumile/ui/backoffice/molecules/backoffice_empty_state/BackofficeEmptyState.js";
+import { DashboardPanel as p } from "@plumile/ui/components/dashboard/dashboard_panel/DashboardPanel.js";
+import { DashboardQuickActions as m } from "@plumile/ui/components/dashboard/dashboard_quick_actions/DashboardQuickActions.js";
+import { DashboardMetricGroup as h } from "@plumile/ui/components/dashboard/dashboard_metric_group/DashboardMetricGroup.js";
+import { DashboardStatusList as g } from "@plumile/ui/components/dashboard/dashboard_status_list/DashboardStatusList.js";
+import { DataTable as _ } from "@plumile/ui/components/data-table/DataTable.js";
+//#region src/pages/BackofficeDashboardWidgetContent.tsx
+var { useLazyLoadQuery: v } = d, y = () => {
+	let { t } = e();
+	return /* @__PURE__ */ c(f, { title: t("common.notAvailable") });
+}, b = ({ widget: i, globalData: d }) => {
+	let { t: f } = u(), { t: v } = e(), { entities: b } = t(), x = i.description == null ? void 0 : a(i.description, f), S = (e) => "resolve" in i && i.resolve != null ? i.resolve(e) : null;
+	if (i.kind === "textBlock") return /* @__PURE__ */ c(p, {
+		title: a(i.title, f),
+		subtitle: x,
+		children: /* @__PURE__ */ c("div", {
+			className: o,
+			children: a(i.body, f)
+		})
+	});
+	if (i.kind === "shortcut") {
+		let e = b[i.entityId], t = a(i.label, f);
+		return e == null ? /* @__PURE__ */ c(p, {
+			title: t,
+			subtitle: x,
+			children: /* @__PURE__ */ c(y, {})
+		}) : e.kind === "tool" ? /* @__PURE__ */ c(p, {
+			title: t,
+			subtitle: x,
+			children: /* @__PURE__ */ c(m, { actions: [{
+				id: e.id,
+				href: e.routes.list,
+				label: v("dashboard.actions.openTool")
+			}] })
+		}) : /* @__PURE__ */ c(p, {
+			title: t,
+			subtitle: x,
+			children: /* @__PURE__ */ c(m, { actions: [{
+				id: e.id,
+				href: e.routes.list,
+				label: v("dashboard.actions.openList")
+			}] })
+		});
+	}
+	if (i.kind === "tablePreview") {
+		let e = S(d);
+		if (e == null) return /* @__PURE__ */ c(p, {
+			title: a(i.title, f),
+			subtitle: x,
+			children: /* @__PURE__ */ c(y, {})
+		});
+		let t = r(e.columns, {
+			tApp: f,
+			t: v
+		});
+		return /* @__PURE__ */ c(p, {
+			title: a(i.title, f),
+			subtitle: x,
+			children: /* @__PURE__ */ c(_, {
+				columns: t,
+				rows: e.rows,
+				getRowId: (e, t) => {
+					if (typeof e == "object" && e) {
+						let { id: t } = e;
+						if (typeof t == "string" && t.trim() !== "") return t;
+					}
+					return String(t);
+				}
+			})
+		});
+	}
+	if (i.kind === "metricGroup") {
+		let e = S(d);
+		return e == null ? /* @__PURE__ */ c(y, {}) : /* @__PURE__ */ c(h, {
+			emptyState: /* @__PURE__ */ c(y, {}),
+			metrics: e.map((e) => ({
+				id: e.id,
+				href: e.href,
+				label: a(e.label, f),
+				value: e.value ?? v("common.notAvailable"),
+				hint: e.meta == null ? void 0 : a(e.meta, f)
+			}))
+		});
+	}
+	if (i.kind === "billingUsageChart") {
+		let e = S(d), t = a(i.title, f);
+		return e == null ? /* @__PURE__ */ c(p, {
+			title: t,
+			subtitle: x,
+			children: /* @__PURE__ */ c(y, {})
+		}) : /* @__PURE__ */ c(p, {
+			title: t,
+			subtitle: x,
+			children: /* @__PURE__ */ c(n, {
+				ariaLabel: a(i.ariaLabel, f),
+				buckets: e.buckets,
+				categories: i.categories.map((e) => ({
+					id: e.id,
+					label: a(e.label, f),
+					color: e.color
+				})),
+				currency: e.currency,
+				emptyLabel: a(i.emptyLabel, f),
+				from: e.from,
+				rangePrefix: a(i.rangePrefix, f),
+				to: e.to,
+				totalAmount: e.totalAmount
+			})
+		});
+	}
+	if (i.kind === "quickActions") return /* @__PURE__ */ c(p, {
+		title: i.title == null ? v("dashboard.actions.openTool") : a(i.title, f),
+		subtitle: x,
+		children: /* @__PURE__ */ c(m, {
+			layout: i.layout?.zone === "aside" ? "stack" : "grid",
+			emptyState: /* @__PURE__ */ c(y, {}),
+			actions: i.actions.map((e) => ({
+				id: e.id,
+				href: e.href,
+				label: a(e.label, f)
+			}))
+		})
+	});
+	if (i.kind === "statusSummary") {
+		let e = S(d);
+		return e == null ? /* @__PURE__ */ c(p, {
+			title: i.title == null ? void 0 : a(i.title, f),
+			subtitle: x,
+			children: /* @__PURE__ */ c(y, {})
+		}) : /* @__PURE__ */ c(p, {
+			title: i.title == null ? void 0 : a(i.title, f),
+			subtitle: x,
+			children: /* @__PURE__ */ c(g, {
+				emptyState: /* @__PURE__ */ c(y, {}),
+				items: e.map((e) => ({
+					id: e.id,
+					href: e.href,
+					label: a(e.label, f),
+					value: e.value ?? v("common.notAvailable")
+				}))
+			})
+		});
+	}
+	if (i.kind === "recentItems") return /* @__PURE__ */ c(p, {
+		title: i.title == null ? v("dashboard.title") : a(i.title, f),
+		subtitle: x,
+		children: /* @__PURE__ */ c(y, {})
+	});
+	let C = b[i.entityId];
+	if (C?.kind !== "list-detail") return /* @__PURE__ */ c(p, {
+		title: a(i.label, f),
+		subtitle: x,
+		children: /* @__PURE__ */ c(y, {})
+	});
+	let w = S(d), T = v("common.notAvailable");
+	return typeof w?.count == "number" && (T = w.count), /* @__PURE__ */ c(p, {
+		title: a(i.label, f),
+		subtitle: x,
+		children: /* @__PURE__ */ l("div", {
+			className: o,
+			children: [/* @__PURE__ */ c("div", {
+				className: s,
+				children: T
+			}), /* @__PURE__ */ c(m, {
+				emptyState: /* @__PURE__ */ c(y, {}),
+				actions: [{
+					id: C.id,
+					href: C.routes.list,
+					label: v("dashboard.actions.openList")
+				}]
+			})]
+		})
+	});
+}, x = ({ widget: e }) => /* @__PURE__ */ c(b, {
+	widget: e,
+	globalData: v(e.query, {}, { fetchPolicy: "store-or-network" })
+}), S = ({ widget: e, globalData: t }) => i(e) ? /* @__PURE__ */ c(x, { widget: e }) : /* @__PURE__ */ c(b, {
+	widget: e,
+	globalData: t
+});
+//#endregion
+export { S as BackofficeDashboardWidgetContent, S as default };
+//# sourceMappingURL=BackofficeDashboardWidgetContent.js.map