@plumile/backoffice-react 0.2.3 → 0.2.6

package/lib/esm/pages/BackofficeDashboardPage.js

@@ -7,14 +7,12 @@ import { useBackofficeDashboardConfig as a } from "../provider/useBackofficeLazy
 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, useMemo as p, useState as m } from "react";
-import { jsx as h, jsxs as g } from "react/jsx-runtime";
-import { useTranslation as _ } from "react-i18next";
-import { Spinner as v } from "@plumile/ui/backoffice/atoms/spinner/Spinner.js";
-import { BackofficeEmptyState as y } from "@plumile/ui/backoffice/molecules/backoffice_empty_state/BackofficeEmptyState.js";
-import { DetailPageTemplate as b } from "@plumile/ui/backoffice/templates/detail_page_template/DetailPageTemplate.js";
-import { DashboardPanel as x } from "@plumile/ui/components/dashboard/dashboard_panel/DashboardPanel.js";
-import { DashboardQuickActions as S } from "@plumile/ui/components/dashboard/dashboard_quick_actions/DashboardQuickActions.js";
-import { DashboardGrid as C, DashboardGridItem as w } from "@plumile/ui/components/dashboard/dashboard_grid/DashboardGrid.js";
+import { DashboardGrid as h, DashboardGridItem as g, DashboardPanel as _, DashboardQuickActions as v } from "@plumile/ui";
+import { jsx as y, jsxs as b } from "react/jsx-runtime";
+import { useTranslation as x } from "react-i18next";
+import { Spinner as S } from "@plumile/ui/backoffice/atoms/spinner/Spinner.js";
+import { BackofficeEmptyState as C } from "@plumile/ui/backoffice/molecules/backoffice_empty_state/BackofficeEmptyState.js";
+import { DetailPageTemplate as w } from "@plumile/ui/backoffice/templates/detail_page_template/DetailPageTemplate.js";
 //#region src/pages/BackofficeDashboardPage.tsx
 var T = f(async () => ({ default: (await import("./BackofficeDashboardWidgetContent.js")).BackofficeDashboardWidgetContent })), E = {
 	id: "24h",
@@ -39,12 +37,12 @@ var T = f(async () => ({ default: (await import("./BackofficeDashboardWidgetCont
 	}
 ], O = () => {
 	let { t } = e();
-	return /* @__PURE__ */ h(y, { title: t("common.notAvailable") });
+	return /* @__PURE__ */ y(C, { title: t("common.notAvailable") });
 }, k = () => {
 	let { t } = e();
-	return /* @__PURE__ */ g("div", {
+	return /* @__PURE__ */ b("div", {
 		className: c,
-		children: [/* @__PURE__ */ h(v, { ariaLabel: t("common.loading") }), /* @__PURE__ */ h("span", { children: t("common.loading") })]
+		children: [/* @__PURE__ */ y(S, { ariaLabel: t("common.loading") }), /* @__PURE__ */ y("span", { children: t("common.loading") })]
 	});
 }, A = (e) => e ?? "m", j = (e) => {
 	if (e.layout?.span != null) return e.layout.span;
@@ -59,38 +57,38 @@ var T = f(async () => ({ default: (await import("./BackofficeDashboardWidgetCont
 		to: n.toISOString()
 	};
 }, I = ({ config: t }) => {
-	let { t: r } = _(), { t: i } = e(), a = p(() => N(t), [t]), [c, l] = m(() => P(t, a)), [u, f] = m(() => Date.now()), g = s(t.title, r), v = t.subtitle == null ? void 0 : s(t.subtitle, r), y = { window: F(a.find((e) => e.id === c) ?? a[0] ?? E, u) }, S = (e) => {
+	let { t: r } = x(), { t: i } = e(), a = p(() => N(t), [t]), [c, l] = m(() => P(t, a)), [u, f] = m(() => Date.now()), v = s(t.title, r), b = t.subtitle == null ? void 0 : s(t.subtitle, r), S = { window: F(a.find((e) => e.id === c) ?? a[0] ?? E, u) }, C = (e) => {
 		l(e), f(Date.now());
 	};
-	return /* @__PURE__ */ h(b, {
+	return /* @__PURE__ */ y(w, {
 		header: {
-			title: g,
-			subtitle: v ?? i("dashboard.subtitle")
+			title: v,
+			subtitle: b ?? i("dashboard.subtitle")
 		},
-		children: /* @__PURE__ */ h(C, {
+		children: /* @__PURE__ */ y(h, {
 			columns: 12,
 			children: t.widgets.map((e) => {
 				let i = s(o(e, t), r);
-				return /* @__PURE__ */ h(w, {
+				return /* @__PURE__ */ y(g, {
 					minHeight: e.minHeight ?? "auto",
 					span: j(e),
 					tabletSpan: M(e),
-					children: /* @__PURE__ */ h(n, {
-						fallback: () => /* @__PURE__ */ h(x, {
+					children: /* @__PURE__ */ y(n, {
+						fallback: () => /* @__PURE__ */ y(_, {
 							title: i,
-							children: /* @__PURE__ */ h(O, {})
+							children: /* @__PURE__ */ y(O, {})
 						}),
-						children: /* @__PURE__ */ h(d, {
-							fallback: /* @__PURE__ */ h(x, {
+						children: /* @__PURE__ */ y(d, {
+							fallback: /* @__PURE__ */ y(_, {
 								title: i,
-								children: /* @__PURE__ */ h(k, {})
+								children: /* @__PURE__ */ y(k, {})
 							}),
-							children: /* @__PURE__ */ h(T, {
+							children: /* @__PURE__ */ y(T, {
 								widget: e,
-								context: y,
+								context: S,
 								windowPresets: a,
 								activeWindowPresetId: c,
-								onWindowPresetChange: S
+								onWindowPresetChange: C
 							})
 						})
 					})
@@ -99,35 +97,38 @@ var T = f(async () => ({ default: (await import("./BackofficeDashboardWidgetCont
 		})
 	});
 }, L = ({ prepared: n }) => {
-	let { t: o } = _(), { t: c } = e(), { entities: d } = t(), f = a(), p = n?.config ?? f, m = i(c);
+	let { t: o } = x(), { t: c } = e(), { entities: d } = t(), f = a(), p = n?.config ?? f, m = i(c);
 	if (p == null) {
 		let e = Object.values(d).filter((e) => e.kind === "list-detail" && e.hasList).map((e) => ({
 			config: e,
 			label: s(e.label, o)
 		})).sort((e, t) => e.label.localeCompare(t.label));
-		return /* @__PURE__ */ h(r, {
+		return /* @__PURE__ */ y(r, {
 			breadcrumb: m,
-			children: /* @__PURE__ */ h(b, {
+			children: /* @__PURE__ */ y(w, {
 				header: {
 					title: c("dashboard.title"),
 					subtitle: c("dashboard.subtitle")
 				},
-				children: /* @__PURE__ */ h(C, {
+				children: /* @__PURE__ */ y(h, {
 					columns: 12,
-					children: e.map(({ config: e, label: t }) => /* @__PURE__ */ h(w, {
+					children: e.map(({ config: e, label: t }) => /* @__PURE__ */ y(g, {
 						span: 4,
-						children: /* @__PURE__ */ h(x, {
+						children: /* @__PURE__ */ y(_, {
 							title: t,
-							children: /* @__PURE__ */ g("div", {
+							children: /* @__PURE__ */ b("div", {
 								className: l,
-								children: [/* @__PURE__ */ h("div", {
+								children: [/* @__PURE__ */ y("div", {
 									className: u,
 									children: c("common.notAvailable")
-								}), /* @__PURE__ */ h(S, { actions: [{
-									id: e.id,
-									href: e.routes.list,
-									label: c("dashboard.actions.openList")
-								}] })]
+								}), /* @__PURE__ */ y(v, {
+									emptyState: /* @__PURE__ */ y(O, {}),
+									actions: [{
+										id: e.id,
+										href: e.routes.list,
+										label: c("dashboard.actions.openList")
+									}]
+								})]
 							})
 						})
 					}, e.id))
@@ -135,9 +136,9 @@ var T = f(async () => ({ default: (await import("./BackofficeDashboardWidgetCont
 			})
 		});
 	}
-	return /* @__PURE__ */ h(r, {
+	return /* @__PURE__ */ y(r, {
 		breadcrumb: m,
-		children: /* @__PURE__ */ h(I, { config: p })
+		children: /* @__PURE__ */ y(I, { config: p })
 	});
 };
 //#endregion

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

@@ -1 +1 @@
-{"version":3,"file":"BackofficeDashboardPage.js","names":[],"sources":["../../../src/pages/BackofficeDashboardPage.tsx"],"sourcesContent":["/* eslint-disable no-ternary */\nimport { lazy, type JSX, Suspense, useMemo, useState } from 'react';\nimport type {\n  BackofficeDashboardConfig,\n  BackofficeDashboardContext,\n  BackofficeDashboardWindowPreset,\n  BackofficeDashboardWindowState,\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';\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 LazyBackofficeDashboardWidgetContent = lazy(async () => {\n  const module = await import('./BackofficeDashboardWidgetContent.js');\n  return {\n    default: module.BackofficeDashboardWidgetContent,\n  };\n});\n\nconst fallbackDashboardWindowPreset: BackofficeDashboardWindowPreset = {\n  id: '24h',\n  label: (t) => {\n    return t('common.time.lastDay', '24 h');\n  },\n  durationMs: 24 * 60 * 60 * 1000,\n};\n\nconst defaultDashboardWindowPresets: readonly BackofficeDashboardWindowPreset[] =\n  [\n    {\n      id: '1h',\n      label: (t) => {\n        return t('common.time.lastHour', '1 h');\n      },\n      durationMs: 60 * 60 * 1000,\n    },\n    fallbackDashboardWindowPreset,\n    {\n      id: '7d',\n      label: (t) => {\n        return t('common.time.lastSevenDays', '7 j');\n      },\n      durationMs: 7 * 24 * 60 * 60 * 1000,\n    },\n    {\n      id: '30d',\n      label: (t) => {\n        return t('common.time.lastThirtyDays', '30 j');\n      },\n      durationMs: 30 * 24 * 60 * 60 * 1000,\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};\n\nconst resolveDashboardWindowPresets = (\n  config: BackofficeDashboardConfig,\n): readonly BackofficeDashboardWindowPreset[] => {\n  if (config.windowPresets != null && config.windowPresets.length > 0) {\n    return config.windowPresets;\n  }\n  return defaultDashboardWindowPresets;\n};\n\nconst resolveDefaultDashboardWindowPresetId = (\n  config: BackofficeDashboardConfig,\n  presets: readonly BackofficeDashboardWindowPreset[],\n): string => {\n  if (\n    config.defaultWindowPresetId != null &&\n    presets.some((preset) => {\n      return preset.id === config.defaultWindowPresetId;\n    })\n  ) {\n    return config.defaultWindowPresetId;\n  }\n  return presets[1]?.id ?? presets[0]?.id ?? '24h';\n};\n\nconst buildDashboardWindowState = (\n  preset: BackofficeDashboardWindowPreset,\n  nowMs: number,\n): BackofficeDashboardWindowState => {\n  const to = new Date(nowMs);\n  const from = new Date(nowMs - preset.durationMs);\n  return {\n    id: preset.id,\n    label: preset.label,\n    from: from.toISOString(),\n    to: to.toISOString(),\n  };\n};\n\nconst DashboardContent = ({ config }: DashboardContentProps): JSX.Element => {\n  const { t: tApp } = useTranslation();\n  const { t } = useBackofficeReactTranslation();\n  const presets = useMemo(() => {\n    return resolveDashboardWindowPresets(config);\n  }, [config]);\n  const [activeWindowPresetId, setActiveWindowPresetId] = useState(() => {\n    return resolveDefaultDashboardWindowPresetId(config, presets);\n  });\n  const [windowNowMs, setWindowNowMs] = useState(() => {\n    return Date.now();\n  });\n\n  const title = resolveLabel(config.title, tApp);\n  const subtitle =\n    config.subtitle != null ? resolveLabel(config.subtitle, tApp) : undefined;\n  const activePreset =\n    presets.find((preset) => {\n      return preset.id === activeWindowPresetId;\n    }) ??\n    presets[0] ??\n    fallbackDashboardWindowPreset;\n  const dashboardContext: BackofficeDashboardContext = {\n    window: buildDashboardWindowState(activePreset, windowNowMs),\n  };\n  const handleWindowPresetChange = (presetId: string): void => {\n    setActiveWindowPresetId(presetId);\n    setWindowNowMs(Date.now());\n  };\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                    context={dashboardContext}\n                    windowPresets={presets}\n                    activeWindowPresetId={activeWindowPresetId}\n                    onWindowPresetChange={handleWindowPresetChange}\n                  />\n                </Suspense>\n              </BackofficeErrorBoundary>\n            </DashboardGridItem>\n          );\n        })}\n      </DashboardGrid>\n    </DetailPageTemplate>\n  );\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  return (\n    <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n      <DashboardContent config={dashboard} />\n    </BackofficeRightPageLayout>\n  );\n};\n\nexport default BackofficeDashboardPage;\n"],"mappings":"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"}
+{"version":3,"file":"BackofficeDashboardPage.js","names":[],"sources":["../../../src/pages/BackofficeDashboardPage.tsx"],"sourcesContent":["import { lazy, type JSX, Suspense, useMemo, useState } from 'react';\nimport type {\n  BackofficeDashboardConfig,\n  BackofficeDashboardContext,\n  BackofficeDashboardWindowPreset,\n  BackofficeDashboardWindowState,\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 {\n  DashboardPanel,\n  DashboardQuickActions,\n  DashboardGrid,\n  DashboardGridItem,\n} from '@plumile/ui';\nimport { useTranslation } from 'react-i18next';\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 LazyBackofficeDashboardWidgetContent = lazy(async () => {\n  const module = await import('./BackofficeDashboardWidgetContent.js');\n  return {\n    default: module.BackofficeDashboardWidgetContent,\n  };\n});\n\nconst fallbackDashboardWindowPreset: BackofficeDashboardWindowPreset = {\n  id: '24h',\n  label: (t) => {\n    return t('common.time.lastDay', '24 h');\n  },\n  durationMs: 24 * 60 * 60 * 1000,\n};\n\nconst defaultDashboardWindowPresets: readonly BackofficeDashboardWindowPreset[] =\n  [\n    {\n      id: '1h',\n      label: (t) => {\n        return t('common.time.lastHour', '1 h');\n      },\n      durationMs: 60 * 60 * 1000,\n    },\n    fallbackDashboardWindowPreset,\n    {\n      id: '7d',\n      label: (t) => {\n        return t('common.time.lastSevenDays', '7 j');\n      },\n      durationMs: 7 * 24 * 60 * 60 * 1000,\n    },\n    {\n      id: '30d',\n      label: (t) => {\n        return t('common.time.lastThirtyDays', '30 j');\n      },\n      durationMs: 30 * 24 * 60 * 60 * 1000,\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};\n\nconst resolveDashboardWindowPresets = (\n  config: BackofficeDashboardConfig,\n): readonly BackofficeDashboardWindowPreset[] => {\n  if (config.windowPresets != null && config.windowPresets.length > 0) {\n    return config.windowPresets;\n  }\n  return defaultDashboardWindowPresets;\n};\n\nconst resolveDefaultDashboardWindowPresetId = (\n  config: BackofficeDashboardConfig,\n  presets: readonly BackofficeDashboardWindowPreset[],\n): string => {\n  if (\n    config.defaultWindowPresetId != null &&\n    presets.some((preset) => {\n      return preset.id === config.defaultWindowPresetId;\n    })\n  ) {\n    return config.defaultWindowPresetId;\n  }\n  return presets[1]?.id ?? presets[0]?.id ?? '24h';\n};\n\nconst buildDashboardWindowState = (\n  preset: BackofficeDashboardWindowPreset,\n  nowMs: number,\n): BackofficeDashboardWindowState => {\n  const to = new Date(nowMs);\n  const from = new Date(nowMs - preset.durationMs);\n  return {\n    id: preset.id,\n    label: preset.label,\n    from: from.toISOString(),\n    to: to.toISOString(),\n  };\n};\n\nconst DashboardContent = ({ config }: DashboardContentProps): JSX.Element => {\n  const { t: tApp } = useTranslation();\n  const { t } = useBackofficeReactTranslation();\n  const presets = useMemo(() => {\n    return resolveDashboardWindowPresets(config);\n  }, [config]);\n  const [activeWindowPresetId, setActiveWindowPresetId] = useState(() => {\n    return resolveDefaultDashboardWindowPresetId(config, presets);\n  });\n  const [windowNowMs, setWindowNowMs] = useState(() => {\n    return Date.now();\n  });\n\n  const title = resolveLabel(config.title, tApp);\n  const subtitle =\n    config.subtitle != null ? resolveLabel(config.subtitle, tApp) : undefined;\n  const activePreset =\n    presets.find((preset) => {\n      return preset.id === activeWindowPresetId;\n    }) ??\n    presets[0] ??\n    fallbackDashboardWindowPreset;\n  const dashboardContext: BackofficeDashboardContext = {\n    window: buildDashboardWindowState(activePreset, windowNowMs),\n  };\n  const handleWindowPresetChange = (presetId: string): void => {\n    setActiveWindowPresetId(presetId);\n    setWindowNowMs(Date.now());\n  };\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                    context={dashboardContext}\n                    windowPresets={presets}\n                    activeWindowPresetId={activeWindowPresetId}\n                    onWindowPresetChange={handleWindowPresetChange}\n                  />\n                </Suspense>\n              </BackofficeErrorBoundary>\n            </DashboardGridItem>\n          );\n        })}\n      </DashboardGrid>\n    </DetailPageTemplate>\n  );\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                        emptyState={<DashboardUnavailableState />}\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  return (\n    <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n      <DashboardContent config={dashboard} />\n    </BackofficeRightPageLayout>\n  );\n};\n\nexport default BackofficeDashboardPage;\n"],"mappings":"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"}