@plumile/backoffice-react 0.1.84 → 0.1.86

package/lib/esm/BackofficeDashboardPage-C7lIVeA1.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"BackofficeDashboardPage-C7lIVeA1.js","names":[],"sources":["../../src/pages/backofficeDashboardPage.css.ts","../../src/pages/BackofficeDashboardPage.tsx"],"sourcesContent":["import { sprinkles } from '@plumile/ui';\n\nexport const tilesGrid = sprinkles({\n  display: 'grid',\n  gridTemplateColumns: 'autoFillMinmax320',\n  gap: 4,\n});\n\nexport const tileBody = sprinkles({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 2,\n});\n\nexport const tileCount = sprinkles({\n  fontSize: '3xl',\n  fontWeight: 'bold',\n  lineHeight: 1,\n});\n\nexport const links = sprinkles({\n  display: 'flex',\n  flexWrap: 'wrap',\n  rowGap: 2,\n  columnGap: 3,\n});\n","/* eslint-disable no-ternary */\nimport { type JSX, Suspense } from 'react';\nimport { Link } from '@plumile/router';\nimport type {\n  BackofficeDashboardConfig,\n  BackofficeDashboardWidget,\n  I18nLabel,\n} from '@plumile/backoffice-core/types.js';\nimport { DataTable, DetailPageTemplate, InfoTile } from '@plumile/ui';\nimport type { TFunction } from 'i18next';\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 { useBackofficeReactTranslation } from '../i18n/useBackofficeReactTranslation.js';\nimport { useBackofficeConfig } from '../provider/BackofficeConfigContext.js';\nimport { useBackofficeDashboardConfig } from '../provider/useBackofficeLazyValue.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';\n\nimport * as styles from './backofficeDashboardPage.css.js';\n\nconst { useLazyLoadQuery } = ReactRelay;\n\nconst resolveLabel = (label: I18nLabel, tApp: TFunction): string => {\n  return label(tApp);\n};\n\nconst getWidgetLabel = (\n  widget: BackofficeDashboardWidget,\n  config: BackofficeDashboardConfig,\n): I18nLabel => {\n  switch (widget.kind) {\n    case 'entityCount':\n    case 'shortcut':\n      return widget.label;\n    case 'tablePreview':\n    case 'textBlock':\n      return widget.title;\n    default:\n      return config.title;\n  }\n};\n\nconst hasWidgetQuery = (\n  widget: BackofficeDashboardWidget,\n): widget is BackofficeDashboardWidget & { query: GraphQLTaggedNode } => {\n  return 'query' in widget && widget.query != null;\n};\n\ntype WidgetContentProps = {\n  widget: BackofficeDashboardWidget;\n  globalData: unknown;\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\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      <InfoTile title={title}>\n        <div className={styles.tileBody}>{body}</div>\n      </InfoTile>\n    );\n  }\n\n  if (widget.kind === 'shortcut') {\n    const entity = entities[widget.entityId];\n    if (entity == null) {\n      return null;\n    }\n    const title = resolveLabel(widget.label, tApp);\n    if (entity.kind === 'tool') {\n      return (\n        <InfoTile title={title}>\n          <div className={styles.links}>\n            <Link to={entity.routes.list}>\n              {t('dashboard.actions.openTool')}\n            </Link>\n          </div>\n        </InfoTile>\n      );\n    }\n    return (\n      <InfoTile title={title}>\n        <div className={styles.links}>\n          <Link to={entity.routes.list}>{t('dashboard.actions.openList')}</Link>\n        </div>\n      </InfoTile>\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 null;\n    }\n    const columns = buildDataTableColumns(resolved.columns as never, {\n      tApp,\n      t,\n      resolveEntityHref: (entityId, refId) => {\n        const entityConfig = entities[entityId];\n        if (entityConfig == null) {\n          return null;\n        }\n        return entityConfig.routes.detail(refId);\n      },\n    });\n    const title = resolveLabel(widget.title, tApp);\n    return (\n      <InfoTile title={title}>\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      </InfoTile>\n    );\n  }\n\n  // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition\n  if (widget.kind === 'entityCount') {\n    const entityManifest = entities[widget.entityId];\n    if (entityManifest?.kind !== 'list-detail') {\n      return null;\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      <InfoTile title={title}>\n        <div className={styles.tileBody}>\n          <div className={styles.tileCount}>{countLabel}</div>\n          <div className={styles.links}>\n            <Link to={entityManifest.routes.list}>\n              {t('dashboard.actions.openList')}\n            </Link>\n          </div>\n        </div>\n      </InfoTile>\n    );\n  }\n\n  return null;\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      <div className={styles.tilesGrid}>\n        {config.widgets.map((widget) => {\n          const content = hasWidgetQuery(widget) ? (\n            <WidgetWithQuery widget={widget} />\n          ) : (\n            <WidgetContent widget={widget} globalData={globalData} />\n          );\n\n          return (\n            <BackofficeErrorBoundary\n              key={widget.id}\n              fallback={() => {\n                return (\n                  <InfoTile\n                    title={resolveLabel(getWidgetLabel(widget, config), tApp)}\n                  >\n                    <div className={styles.tileBody}>\n                      {t('common.notAvailable')}\n                    </div>\n                  </InfoTile>\n                );\n              }}\n            >\n              <Suspense\n                fallback={\n                  <InfoTile\n                    title={resolveLabel(getWidgetLabel(widget, config), tApp)}\n                  >\n                    <div className={styles.tileBody}>{t('common.loading')}</div>\n                  </InfoTile>\n                }\n              >\n                {content}\n              </Suspense>\n            </BackofficeErrorBoundary>\n          );\n        })}\n      </div>\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 const BackofficeDashboardPage = (): JSX.Element => {\n  const { t: tApp } = useTranslation();\n  const { t } = useBackofficeReactTranslation();\n  const { entities } = useBackofficeConfig();\n  const dashboard = useBackofficeDashboardConfig();\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          <div className={styles.tilesGrid}>\n            {items.map(({ config, label }) => {\n              return (\n                <InfoTile key={config.id} title={label}>\n                  <div className={styles.tileBody}>\n                    <div className={styles.tileCount}>\n                      {t('common.notAvailable')}\n                    </div>\n                    <div className={styles.links}>\n                      <Link to={config.routes.list}>\n                        {t('dashboard.actions.openList')}\n                      </Link>\n                    </div>\n                  </div>\n                </InfoTile>\n              );\n            })}\n          </div>\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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"}