@plumile/backoffice-react 0.1.206 → 0.2.2
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/README.md +5 -2
- package/lib/esm/auth/authRefreshNotice.css.js +1 -1
- package/lib/esm/auth/authStoryFixtures.js +29 -0
- package/lib/esm/auth/authStoryFixtures.js.map +1 -0
- package/lib/esm/auth/login/loginPage.css.js +1 -1
- package/lib/esm/components/backoffice/actions/BackofficeEntityActionFormDialog.js +1 -1
- package/lib/esm/components/backoffice/actions/backofficeEntityActionFormDialog.css.js +1 -1
- package/lib/esm/components/backoffice/billing/BackofficeBillingUsageChart.js +1 -1
- package/lib/esm/components/backoffice/billing/backofficeBillingUsageChart.css.js +1 -1
- package/lib/esm/components/backoffice/detail/BackofficeEntitySummaryHeader.js +6 -6
- package/lib/esm/components/backoffice/detail/BackofficeRelationsSummaryGrid.js +1 -1
- package/lib/esm/components/backoffice/detail/BackofficeUsageCostBreakdown.js +13 -13
- package/lib/esm/components/backoffice/detail/BackofficeUsageCostBreakdown.js.map +1 -1
- package/lib/esm/components/backoffice/detail/backofficeDetailBadgeRow.css.js +1 -1
- package/lib/esm/components/backoffice/detail/backofficeDetailErrorList.css.js +1 -1
- package/lib/esm/components/backoffice/detail/backofficeDetailLayout.css.js +1 -1
- package/lib/esm/components/backoffice/detail/backofficeDetailRelationList.css.js +1 -1
- package/lib/esm/components/backoffice/detail/backofficeEntitySummaryHeader.css.js +1 -1
- package/lib/esm/components/backoffice/detail/backofficeRelationsSummaryGrid.css.js +1 -1
- package/lib/esm/components/backoffice/detail/backofficeUsageCostBreakdown.css.js +1 -1
- package/lib/esm/components/backoffice/errors/BackofficeErrorBoundary.js +2 -16
- package/lib/esm/components/backoffice/errors/BackofficeErrorBoundary.js.map +1 -1
- package/lib/esm/components/backoffice/filters/EntityIdFilterField.js +1 -1
- package/lib/esm/components/backoffice/filters/backofficeFilterAction.css.js +1 -1
- package/lib/esm/components/backoffice/filters/deferredFilterSearchInput.css.js +1 -1
- package/lib/esm/components/backoffice/filters/entityIdFilterField.css.js +1 -1
- package/lib/esm/components/backoffice/hub/BackofficeHubTemplate.js +5 -5
- package/lib/esm/components/backoffice/hub/backofficeHubTemplate.css.js +1 -1
- package/lib/esm/components/backoffice/layout/backofficeSidebarActions.css.js +1 -1
- package/lib/esm/components/backoffice/layout/breadcrumb/BackofficeTopbarBreadcrumb.js +2 -2
- package/lib/esm/components/backoffice/layout/breadcrumb/backofficeTopbarBreadcrumb.css.js +1 -1
- package/lib/esm/components/backoffice/links/BackofficeLinkContent.js +1 -1
- package/lib/esm/components/backoffice/links/backofficeLink.css.js +1 -1
- package/lib/esm/components/backoffice/list/RowFlagsCell.css.js +1 -1
- package/lib/esm/components/backoffice/overview/backofficeOverviewLayout.css.js +1 -1
- package/lib/esm/components/backoffice/pickers/entityIdPickerDialog.css.js +1 -1
- package/lib/esm/components/backoffice/refs/backofficeRelatedCountLink.css.js +1 -1
- package/lib/esm/components/backoffice/routing/backofficeContentBoundary.css.js +1 -1
- package/lib/esm/components/backoffice/routing/backofficeContentError.css.js +1 -1
- package/lib/esm/components/backoffice/routing/backofficeContentFallback.css.js +1 -1
- package/lib/esm/components/backoffice/scaffolds/BackofficeEntityDetailScaffold.js.map +1 -1
- package/lib/esm/components/backoffice/scaffolds/BackofficeEntityListScaffold.js +311 -351
- package/lib/esm/components/backoffice/scaffolds/BackofficeEntityListScaffold.js.map +1 -1
- package/lib/esm/components/backoffice/scaffolds/BackofficeTabbedDetailShell.js +6 -11
- package/lib/esm/components/backoffice/scaffolds/BackofficeTabbedDetailShell.js.map +1 -1
- package/lib/esm/components/backoffice/scaffolds/backofficeEntityListScaffold.css.js +1 -1
- package/lib/esm/components/backoffice/scaffolds/backofficeTabbedDetailShell.css.js +1 -1
- package/lib/esm/components/backoffice/shared/backofficeFilterableCell.css.js +5 -5
- package/lib/esm/components/backoffice/shared/backofficeInlineFilterRow.css.js +1 -1
- package/lib/esm/components/backoffice/technical/TechnicalIdentifierValue.js +2 -26
- package/lib/esm/components/backoffice/tools/BackofficeToolsDocPanel.js +1 -1
- package/lib/esm/components/backoffice/tools/backofficeToolsDocPanel.css.js +1 -1
- package/lib/esm/components/backoffice/tools/backofficeToolsForm.css.js +1 -1
- package/lib/esm/components/backoffice/tools/backofficeToolsJsonForm.css.js +1 -1
- package/lib/esm/i18n/locales/en/backofficeReact.js +1 -5
- package/lib/esm/i18n/locales/en/backofficeReact.js.map +1 -1
- package/lib/esm/i18n/locales/fr/backofficeReact.js +1 -6
- package/lib/esm/i18n/locales/fr/backofficeReact.js.map +1 -1
- package/lib/esm/pages/BackofficeEntityDetailLayoutPage.js +1 -1
- package/lib/esm/pages/BackofficeEntityDetailLayoutPage.js.map +1 -1
- package/lib/esm/pages/BackofficeEntityDetailPage.js +158 -158
- package/lib/esm/pages/BackofficeEntityDetailPage.js.map +1 -1
- package/lib/esm/pages/BackofficeEntityListDataPage.js +60 -62
- package/lib/esm/pages/BackofficeEntityListDataPage.js.map +1 -1
- package/lib/esm/pages/BackofficeEntityListPage.js +87 -91
- package/lib/esm/pages/BackofficeEntityListPage.js.map +1 -1
- package/lib/esm/pages/BackofficeEntityListRouteContext.js.map +1 -1
- package/lib/esm/pages/backofficeDashboardPage.css.js +1 -1
- package/lib/esm/pages/backofficeEntityDetailPage.css.js +1 -1
- package/lib/esm/pages/backofficeEntityListPage.css.js +1 -1
- package/lib/esm/pages/detail/BackofficeEntityDetailLayoutContext.js.map +1 -1
- package/lib/esm/pages/detail/BackofficeEntityDetailManifestFallback.js +1 -1
- package/lib/esm/pages/detail/BackofficeEntityDetailManifestFallback.js.map +1 -1
- package/lib/esm/pages/detail/buildTabsItems.js.map +1 -1
- package/lib/esm/provider/BackofficeProvider.js +79 -80
- package/lib/esm/provider/BackofficeProvider.js.map +1 -1
- package/lib/esm/relay/typedRelayHooks.js.map +1 -1
- package/lib/esm/storybook/relay/RelayStory.css.js +1 -1
- package/lib/esm/style.css +1 -1
- package/lib/types/auth/authStoryFixtures.d.ts +3 -0
- package/lib/types/auth/authStoryFixtures.d.ts.map +1 -0
- package/lib/types/components/backoffice/errors/BackofficeErrorBoundary.d.ts +3 -17
- package/lib/types/components/backoffice/errors/BackofficeErrorBoundary.d.ts.map +1 -1
- package/lib/types/components/backoffice/scaffolds/BackofficeEntityDetailScaffold.d.ts +2 -6
- package/lib/types/components/backoffice/scaffolds/BackofficeEntityDetailScaffold.d.ts.map +1 -1
- package/lib/types/components/backoffice/scaffolds/BackofficeEntityListScaffold.d.ts +0 -2
- package/lib/types/components/backoffice/scaffolds/BackofficeEntityListScaffold.d.ts.map +1 -1
- package/lib/types/components/backoffice/scaffolds/BackofficeTabbedDetailShell.d.ts +2 -2
- package/lib/types/components/backoffice/scaffolds/BackofficeTabbedDetailShell.d.ts.map +1 -1
- package/lib/types/components/backoffice/technical/TechnicalIdentifierValue.d.ts +1 -11
- package/lib/types/components/backoffice/technical/TechnicalIdentifierValue.d.ts.map +1 -1
- package/lib/types/i18n/resources.d.ts +0 -13
- package/lib/types/i18n/resources.d.ts.map +1 -1
- package/lib/types/pages/BackofficeEntityDetailLayoutPage.d.ts.map +1 -1
- package/lib/types/pages/BackofficeEntityDetailPage.d.ts.map +1 -1
- package/lib/types/pages/BackofficeEntityListDataPage.d.ts.map +1 -1
- package/lib/types/pages/BackofficeEntityListPage.d.ts.map +1 -1
- package/lib/types/pages/BackofficeEntityListRouteContext.d.ts +0 -2
- package/lib/types/pages/BackofficeEntityListRouteContext.d.ts.map +1 -1
- package/lib/types/pages/detail/BackofficeEntityDetailLayoutContext.d.ts +2 -2
- package/lib/types/pages/detail/BackofficeEntityDetailLayoutContext.d.ts.map +1 -1
- package/lib/types/pages/detail/buildTabsItems.d.ts +2 -2
- package/lib/types/pages/detail/buildTabsItems.d.ts.map +1 -1
- package/lib/types/provider/BackofficeProvider.d.ts.map +1 -1
- package/lib/types/relay/typedRelayHooks.d.ts +3 -5
- package/lib/types/relay/typedRelayHooks.d.ts.map +1 -1
- package/package.json +17 -17
- package/lib/esm/components/backoffice/technical/TechnicalIdentifierValue.js.map +0 -1
- package/lib/esm/provider/BackofficeListUiStateContext.js +0 -88
- package/lib/esm/provider/BackofficeListUiStateContext.js.map +0 -1
- package/lib/types/provider/BackofficeListUiStateContext.d.ts +0 -21
- package/lib/types/provider/BackofficeListUiStateContext.d.ts.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BackofficeEntityDetailPage.js","names":[],"sources":["../../../src/pages/BackofficeEntityDetailPage.tsx"],"sourcesContent":["/* eslint-disable no-ternary */\nimport { type JSX, type ReactNode, useContext, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport {\n commitMutation,\n type PreloadedQuery,\n usePreloadedQuery,\n} from 'react-relay';\nimport type { OperationType } from 'relay-runtime';\nimport { resolveMutationOutcome } from '../relay/mutationResult.js';\n\nimport { BACKOFFICE_DATE_TIME_OPTIONS } from '@plumile/backoffice-core/constants.js';\nimport type {\n BackofficePreparedDetailPageDataRoute,\n BackofficeResolvedDetailPageFacetConfig,\n} from '@plumile/backoffice-core/types.js';\nimport { Button } from '@plumile/ui/atomic/atoms/button/Button.js';\nimport { LinkButton } from '@plumile/ui/atomic/atoms/button/LinkButton.js';\nimport { FormattedDate } from '@plumile/ui/atomic/atoms/formatted-date/FormattedDate.js';\nimport { useToast } from '@plumile/ui/atomic/molecules/toast/ToastProvider.js';\nimport { Tag } from '@plumile/ui/backoffice/atoms/tag/Tag.js';\nimport { BackofficeDetailSection } from '@plumile/ui/backoffice/molecules/backoffice_detail_section/BackofficeDetailSection.js';\nimport { BackofficeKeyValueList } from '@plumile/ui/backoffice/molecules/backoffice_key_value_list/BackofficeKeyValueList.js';\nimport { BackofficePayloadViewer } from '@plumile/ui/backoffice/molecules/backoffice_payload_viewer/BackofficePayloadViewer.js';\nimport { BackofficeScopeStack } from '@plumile/ui/backoffice/molecules/backoffice_scope_stack/BackofficeScopeStack.js';\nimport { AuditTimeline } from '@plumile/ui/backoffice/organisms/audit_timeline/AuditTimeline.js';\nimport { MetricCard } from '@plumile/ui/components/dashboard/metric_card/MetricCard.js';\nimport { MetricTileGroup } from '@plumile/ui/components/dashboard/metric_tile_group/MetricTileGroup.js';\nimport { DataTable } from '@plumile/ui/components/data-table/DataTable.js';\nimport { ChatCheckSvg } from '@plumile/ui/icons/ChatCheckSvg.js';\nimport { KeyOffSvg } from '@plumile/ui/icons/KeyOffSvg.js';\nimport { KeySvg } from '@plumile/ui/icons/KeySvg.js';\nimport { LockOpenSvg } from '@plumile/ui/icons/LockOpenSvg.js';\nimport { LockSvg } from '@plumile/ui/icons/LockSvg.js';\nimport { RobotCheckSvg } from '@plumile/ui/icons/RobotCheckSvg.js';\nimport { RobotXSvg } from '@plumile/ui/icons/RobotXSvg.js';\nimport { RocketOffSvg } from '@plumile/ui/icons/RocketOffSvg.js';\nimport { RocketSvg } from '@plumile/ui/icons/RocketSvg.js';\nimport { SettingsCheckSvg } from '@plumile/ui/icons/SettingsCheckSvg.js';\nimport { SettingsXSvg } from '@plumile/ui/icons/SettingsXSvg.js';\nimport { ShieldLockSvg } from '@plumile/ui/icons/ShieldLockSvg.js';\nimport { ShieldOffSvg } from '@plumile/ui/icons/ShieldOffSvg.js';\nimport { XBadgeSvg } from '@plumile/ui/icons/XBadgeSvg.js';\nimport Link from '@plumile/router/routing/Link.js';\nimport RoutingContext from '@plumile/router/routing/RoutingContext.js';\n\nimport { buildDataTableColumns } from '../components/backoffice/columns/buildDataTableColumns.js';\nimport { BackofficeEntityDetailScaffold } from '../components/backoffice/scaffolds/BackofficeEntityDetailScaffold.js';\nimport { useBackofficeEntityDetailNotFoundState } from '../components/backoffice/scaffolds/BackofficeEntityDetailNotFound.js';\nimport { BackofficeDetailBadgeRow } from '../components/backoffice/detail/BackofficeDetailBadgeRow.js';\nimport { BackofficeDetailFlagTag } from '@plumile/ui/backoffice/molecules/backoffice_detail_flag_tag/BackofficeDetailFlagTag.js';\nimport { BackofficeDetailTaggedValue } from '@plumile/ui/backoffice/molecules/backoffice_detail_tagged_value/BackofficeDetailTaggedValue.js';\nimport { BackofficeLifecycleTimelineSection } from '../components/backoffice/detail/BackofficeLifecycleTimelineSection.js';\nimport { BackofficeRelationsSummaryGrid } from '../components/backoffice/detail/BackofficeRelationsSummaryGrid.js';\nimport * as detailLayoutStyles from '../components/backoffice/detail/backofficeDetailLayout.css.js';\nimport { LazyBackofficeEntityActionFormDialog } from '../components/backoffice/actions/LazyBackofficeEntityActionFormDialog.js';\nimport {\n resolveToastSpec,\n resolveToastViewActions,\n} from '../components/backoffice/actions/toastViewAction.js';\nimport * as pageStyles from './backofficeEntityDetailPage.css.js';\nimport { useBackofficeFormats } from '../i18n/useBackofficeFormats.js';\nimport { useBackofficeReactTranslation } from '../i18n/useBackofficeReactTranslation.js';\nimport { useBackofficeConfig } from '../provider/BackofficeConfigContext.js';\nimport { useBackofficeRuntimeFragment } from '../relay/typedRelayHooks.js';\nimport { useRelayEnvironment } from '../relay/useRelayEnvironment.js';\nimport {\n extractMutationPayload,\n isFormMutationAction,\n isMutationAction,\n isRouteAction,\n resolveLabel,\n} from './BackofficeEntityDetailPage.helpers.js';\nimport {\n buildFieldItems,\n renderBlocks,\n type FlagIconName,\n} from './BackofficeEntityDetailPage.view-helpers.js';\n\nexport type BackofficeEntityDetailPageProps = {\n prepared: BackofficePreparedDetailPageDataRoute;\n};\n\nconst isBackofficeRelayNode = (\n value: unknown,\n): value is { readonly __typename: string } => {\n if (value == null || typeof value !== 'object') {\n return false;\n }\n const typename = Reflect.get(value, '__typename');\n return typeof typename === 'string';\n};\n\nconst renderFlagIcon = (iconName: FlagIconName): JSX.Element => {\n const iconSize = 14;\n switch (iconName) {\n case 'shield-lock':\n return (\n <ShieldLockSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'shield-off':\n return (\n <ShieldOffSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'settings-check':\n return (\n <SettingsCheckSvg\n width={iconSize}\n height={iconSize}\n aria-hidden=\"true\"\n />\n );\n case 'settings-x':\n return (\n <SettingsXSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'x-badge':\n return (\n <XBadgeSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'chat-check':\n return (\n <ChatCheckSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'key':\n return <KeySvg width={iconSize} height={iconSize} aria-hidden=\"true\" />;\n case 'key-off':\n return (\n <KeyOffSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'lock':\n return <LockSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />;\n case 'lock-open':\n return (\n <LockOpenSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'robot-check':\n return (\n <RobotCheckSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'robot-x':\n return (\n <RobotXSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'rocket':\n return (\n <RocketSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'rocket-off':\n return (\n <RocketOffSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n default:\n throw new Error(`Unsupported flag icon: ${String(iconName)}`);\n }\n};\n\nconst resolveDetailPlacement = (item: {\n placement?: 'primary' | 'secondary' | 'main' | 'side' | 'fullWidth';\n presentation?: {\n group?: string;\n desktop?: 'primary' | 'secondary' | 'fullWidth';\n };\n kind?: string;\n fields?: readonly {\n presentation?: {\n group?: string;\n desktop?: 'primary' | 'secondary' | 'fullWidth';\n };\n }[];\n}): 'primary' | 'secondary' => {\n if (item.presentation?.desktop === 'secondary') {\n return 'secondary';\n }\n if (\n item.presentation?.group === 'scope' ||\n item.presentation?.group === 'status'\n ) {\n return 'secondary';\n }\n const fieldGroups =\n item.fields?.map((field) => {\n return field.presentation?.group;\n }) ?? [];\n if (\n fieldGroups.length > 0 &&\n fieldGroups.every((group) => {\n return group === 'scope' || group === 'status';\n })\n ) {\n return 'secondary';\n }\n if (item.placement === 'side') {\n return 'secondary';\n }\n if (item.placement === 'secondary') {\n return 'secondary';\n }\n return 'primary';\n};\n\nconst BackofficeEntityDetailPageContent = ({\n config,\n prepared,\n}: {\n config: BackofficeResolvedDetailPageFacetConfig;\n prepared: {\n pageQuery: PreloadedQuery<OperationType>;\n id: string;\n detailId?: string;\n pageId: string;\n pagePath: string;\n };\n}): JSX.Element => {\n const { t: tApp } = useTranslation();\n const { t } = useBackofficeReactTranslation();\n const { formatNumber, formatCurrency, formatCurrencyTitle, formatPercent } =\n useBackofficeFormats();\n const { entities } = useBackofficeConfig();\n const routing = useContext(RoutingContext);\n const environment = useRelayEnvironment();\n const toast = useToast();\n const [actionState, setActionState] = useState<Record<string, boolean>>({});\n const [activeFormActionId, setActiveFormActionId] = useState<string | null>(\n null,\n );\n const setActionLoading = (actionId: string, isLoading: boolean) => {\n setActionState((prev) => {\n if (prev[actionId] === isLoading) {\n return prev;\n }\n return { ...prev, [actionId]: isLoading };\n });\n };\n\n const { page } = config;\n const notFound = useBackofficeEntityDetailNotFoundState({\n listHref: config.routes.list,\n });\n\n const pageQueryData = usePreloadedQuery(page.query, prepared.pageQuery);\n const pageNodeRef = page.resolveNode(pageQueryData, {\n id: prepared.id,\n detailId: prepared.detailId,\n });\n const fragmentNode = useBackofficeRuntimeFragment(page.fragment, pageNodeRef);\n const resolvedNode = isBackofficeRelayNode(fragmentNode)\n ? fragmentNode\n : null;\n return (\n <BackofficeEntityDetailScaffold\n node={resolvedNode}\n notFound={notFound}\n render={(node) => {\n const view = page.toView(node);\n const resolveEntityHref = (entityId: string, refId: string) => {\n const entityConfig = entities[entityId];\n if (entityConfig == null) {\n return null;\n }\n return entityConfig.routes.detail(refId);\n };\n const actions = page.actions ?? [];\n let headerActionButtons: ReactNode[] = [];\n if (actions.length > 0) {\n const visibleActions = actions.filter((action) => {\n if (action.isVisible == null) {\n return true;\n }\n return action.isVisible(view);\n });\n\n if (visibleActions.length > 0) {\n headerActionButtons = visibleActions.map((action) => {\n const label = resolveLabel(action.label, tApp);\n const ariaLabel =\n action.ariaLabel != null\n ? resolveLabel(action.ariaLabel, tApp)\n : label;\n const variant = action.variant ?? 'secondary';\n const size = action.size ?? 'small';\n const isLoading = actionState[action.id] ?? false;\n const isDisabled =\n isLoading || action.isDisabled?.(view) === true;\n\n if (isRouteAction(action)) {\n const href = action.to(view);\n return (\n <LinkButton\n key={action.id}\n to={href}\n variant={variant}\n size={size}\n isDisabled={isDisabled}\n aria-label={ariaLabel}\n preloadOnHover=\"code-and-data\"\n >\n {label}\n </LinkButton>\n );\n }\n\n if (isFormMutationAction(action)) {\n return (\n <Button\n key={action.id}\n type=\"button\"\n variant={variant}\n size={size}\n isLoading={false}\n disabled={isDisabled}\n onClick={() => {\n setActiveFormActionId(action.id);\n }}\n aria-label={ariaLabel}\n >\n {label}\n </Button>\n );\n }\n\n if (isMutationAction(action)) {\n const handleClick = () => {\n if (isLoading) {\n return;\n }\n const variables = action.getVariables(view);\n setActionLoading(action.id, true);\n commitMutation(environment, {\n mutation: action.mutation,\n variables,\n updater: (store) => {\n action.updater?.(store, view);\n },\n onCompleted: (response) => {\n setActionLoading(action.id, false);\n const mutationPayload = extractMutationPayload(response);\n if (mutationPayload != null) {\n let defaultErrorMessage = t(\n 'actions.form.errors.invalidPayload',\n );\n if (action.toasts?.error?.message != null) {\n defaultErrorMessage = resolveLabel(\n action.toasts.error.message,\n tApp,\n );\n } else if (action.toasts?.error?.title != null) {\n defaultErrorMessage = resolveLabel(\n action.toasts.error.title,\n tApp,\n );\n }\n\n const outcome = resolveMutationOutcome(\n mutationPayload,\n {\n defaultErrorMessage,\n mapReason: (reason) => {\n const mapped = action.mapErrorReason?.(\n reason,\n view,\n );\n if (mapped == null) {\n return null;\n }\n if (typeof mapped === 'function') {\n return resolveLabel(mapped, tApp);\n }\n return String(mapped);\n },\n },\n );\n if (!outcome.ok) {\n const error = new Error(outcome.message);\n action.onError?.(error, view);\n if (action.toasts?.error != null) {\n const toastSpec = resolveToastSpec(\n action.toasts.error,\n tApp,\n );\n toast.error(toastSpec.title, toastSpec.message);\n }\n return;\n }\n }\n\n action.onCompleted?.(response, view);\n if (action.toasts?.success != null) {\n const toastSpec = resolveToastSpec(\n action.toasts.success,\n tApp,\n );\n const toastActions = resolveToastViewActions({\n toast: action.toasts.success,\n response,\n node: view,\n tApp,\n entities,\n defaultLabel: t('actions.view'),\n navigateTo: (to) => {\n routing?.history.push({ pathname: to });\n },\n });\n toast.push({\n kind: 'info',\n title: toastSpec.title,\n message: toastSpec.message,\n actions: toastActions,\n });\n }\n },\n onError: (error) => {\n setActionLoading(action.id, false);\n action.onError?.(error, view);\n if (action.toasts?.error != null) {\n const toastSpec = resolveToastSpec(\n action.toasts.error,\n tApp,\n );\n toast.error(toastSpec.title, toastSpec.message);\n }\n },\n });\n };\n\n return (\n <Button\n key={action.id}\n type=\"button\"\n variant={variant}\n size={size}\n isLoading={isLoading}\n disabled={isDisabled}\n onClick={handleClick}\n aria-label={ariaLabel}\n >\n {label}\n </Button>\n );\n }\n\n return null;\n });\n }\n }\n\n const activeFormAction = actions.find((action) => {\n return action.id === activeFormActionId;\n });\n\n const { content } = page;\n\n const primaryNodes: ReactNode[] = [];\n const secondaryNodes: ReactNode[] = [];\n content.forEach((item, index) => {\n const placement = resolveDetailPlacement(item);\n const targetNodes =\n placement === 'secondary' ? secondaryNodes : primaryNodes;\n\n if (item.kind === 'fieldSet') {\n const sectionLabel = resolveLabel(item.title, tApp);\n const description =\n item.description != null\n ? resolveLabel(item.description, tApp)\n : undefined;\n const { items, customNodes } = buildFieldItems(item.fields, view, {\n tApp,\n t,\n resolveEntityHref,\n formatNumber,\n formatCurrency,\n formatCurrencyTitle,\n formatPercent,\n renderTag: (tone, label) => {\n return <Tag tone={tone}>{label}</Tag>;\n },\n renderBadgeRow: (items) => {\n return <BackofficeDetailBadgeRow items={items} />;\n },\n renderDate: (value, fallback) => {\n return (\n <FormattedDate\n value={value}\n options={BACKOFFICE_DATE_TIME_OPTIONS}\n fallback={fallback}\n />\n );\n },\n renderFlagTag: (tag) => {\n return (\n <BackofficeDetailFlagTag\n tone={tag.tone}\n icon={\n tag.iconName != null\n ? renderFlagIcon(tag.iconName)\n : undefined\n }\n label={tag.label}\n />\n );\n },\n renderLink: (href, label) => {\n return (\n <Link to={href} preloadOnHover=\"code-and-data\">\n {label}\n </Link>\n );\n },\n renderTaggedValue: (tag, value) => {\n return <BackofficeDetailTaggedValue tag={tag} value={value} />;\n },\n wrapCustomNode: (id, custom) => {\n return <div key={id}>{custom}</div>;\n },\n });\n\n const hasContent = items.length > 0 || customNodes.length > 0;\n\n if (!hasContent) {\n return;\n }\n\n targetNodes.push(\n <BackofficeDetailSection\n key={`${sectionLabel}-${index}`}\n title={sectionLabel}\n description={description}\n items={items.length > 0 ? items : undefined}\n >\n {customNodes}\n </BackofficeDetailSection>,\n );\n return;\n }\n\n const rendered = renderBlocks([item], view, {\n tApp,\n t,\n resolveEntityHref,\n keyPrefix: String(index),\n renderLink: (href, label) => {\n return (\n <Link to={href} preloadOnHover=\"code-and-data\">\n {label}\n </Link>\n );\n },\n renderDate: (value, fallback) => {\n return (\n <FormattedDate\n value={value}\n options={BACKOFFICE_DATE_TIME_OPTIONS}\n fallback={fallback}\n />\n );\n },\n renderTag: (tone, label) => {\n return <Tag tone={tone}>{label}</Tag>;\n },\n renderMetricGroup: ({\n key,\n title,\n description,\n density,\n items,\n }) => {\n return (\n <BackofficeDetailSection\n key={key}\n title={title}\n description={description}\n >\n {items.length > 0 && (\n <MetricTileGroup\n density={density ?? 'comfortable'}\n minColumn=\"180\"\n >\n {items.map((metric) => {\n return (\n <MetricCard\n key={metric.id}\n label={metric.label}\n value={metric.value}\n hint={metric.hint}\n tone={metric.tone ?? 'neutral'}\n density={density ?? 'comfortable'}\n copyValue={metric.copyValue}\n copyLabel={t('common.actions.copy')}\n copiedLabel={t('common.actions.copied')}\n />\n );\n })}\n </MetricTileGroup>\n )}\n </BackofficeDetailSection>\n );\n },\n renderTimeline: ({ key, title, description, events }) => {\n return (\n <BackofficeLifecycleTimelineSection\n key={key}\n title={title}\n description={description}\n events={events}\n />\n );\n },\n renderAuditTimeline: ({ key, title, description, events }) => {\n return (\n <BackofficeDetailSection\n key={key}\n title={title}\n description={description}\n >\n <AuditTimeline events={events} />\n </BackofficeDetailSection>\n );\n },\n renderRelations: ({ key, title, items }) => {\n return (\n <BackofficeRelationsSummaryGrid\n key={key}\n title={title}\n items={items}\n />\n );\n },\n renderContextStack: ({ key, title, items }) => {\n return (\n <BackofficeScopeStack key={key} title={title} items={items} />\n );\n },\n renderCustomSection: (key, title, child) => {\n return (\n <BackofficeDetailSection key={key} title={title}>\n {child}\n </BackofficeDetailSection>\n );\n },\n wrapCustomNode: (key, custom) => {\n return <div key={key}>{custom}</div>;\n },\n resolveTableColumns: (columns) => {\n return buildDataTableColumns(columns, {\n tApp,\n t,\n });\n },\n renderTable: ({ key, title, description, columns, rows }) => {\n return (\n <BackofficeDetailSection\n key={key}\n title={title}\n description={description}\n >\n <DataTable\n columns={columns}\n rows={rows}\n getRowId={(row, rowIndex) => {\n if (row != null && typeof row === 'object') {\n const record = row as Record<string, unknown>;\n const maybeId = record.id;\n if (\n typeof maybeId === 'string' &&\n maybeId.trim() !== ''\n ) {\n return maybeId;\n }\n }\n return String(rowIndex);\n }}\n />\n </BackofficeDetailSection>\n );\n },\n renderPayload: ({ key, title, description, content, format }) => {\n return (\n <BackofficeDetailSection\n key={key}\n title={title}\n description={description}\n >\n <BackofficePayloadViewer\n content={content}\n format={format}\n emptyState={t('common.notAvailable')}\n />\n </BackofficeDetailSection>\n );\n },\n renderKeyValueListSection: ({ key, title, description, items }) => {\n return (\n <BackofficeDetailSection\n key={key}\n title={title}\n description={description}\n >\n <BackofficeKeyValueList items={items} />\n </BackofficeDetailSection>\n );\n },\n });\n const blockNode = rendered[0];\n if (blockNode != null) {\n targetNodes.push(blockNode);\n }\n });\n\n const tabActionsNode =\n headerActionButtons.length > 0 ? (\n <div className={pageStyles.headerActions}>\n <div className={pageStyles.headerActionGroup}>\n {headerActionButtons}\n </div>\n </div>\n ) : null;\n\n const hasAside = secondaryNodes.length > 0;\n const contentNode = hasAside ? (\n <div className={detailLayoutStyles.layout}>\n <div className={detailLayoutStyles.primary}>{primaryNodes}</div>\n <aside className={detailLayoutStyles.secondary}>\n {secondaryNodes}\n </aside>\n </div>\n ) : (\n <div className={detailLayoutStyles.stacked}>{primaryNodes}</div>\n );\n\n return (\n <>\n {tabActionsNode}\n {contentNode}\n {activeFormAction != null &&\n isFormMutationAction(activeFormAction) && (\n <LazyBackofficeEntityActionFormDialog\n isOpen\n action={activeFormAction}\n node={view}\n onClose={() => {\n setActiveFormActionId(null);\n }}\n />\n )}\n </>\n );\n }}\n />\n );\n};\n\nexport const BackofficeEntityDetailPage = ({\n prepared,\n}: BackofficeEntityDetailPageProps): JSX.Element => {\n return (\n <BackofficeEntityDetailPageContent\n config={prepared.pageConfig}\n prepared={prepared}\n />\n );\n};\n\nexport default BackofficeEntityDetailPage;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BackofficeEntityDetailPage.js","names":[],"sources":["../../../src/pages/BackofficeEntityDetailPage.tsx"],"sourcesContent":["/* eslint-disable no-ternary */\nimport { type JSX, type ReactNode, useContext, useState } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport {\n commitMutation,\n type PreloadedQuery,\n usePreloadedQuery,\n} from 'react-relay';\nimport type { OperationType } from 'relay-runtime';\nimport { resolveMutationOutcome } from '../relay/mutationResult.js';\n\nimport { BACKOFFICE_DATE_TIME_OPTIONS } from '@plumile/backoffice-core/constants.js';\nimport type {\n BackofficePreparedDetailPageDataRoute,\n BackofficeResolvedDetailPageFacetConfig,\n} from '@plumile/backoffice-core/types.js';\nimport { Button } from '@plumile/ui/atomic/atoms/button/Button.js';\nimport { LinkButton } from '@plumile/ui/atomic/atoms/button/LinkButton.js';\nimport { FormattedDate } from '@plumile/ui/atomic/atoms/formatted-date/FormattedDate.js';\nimport { useToast } from '@plumile/ui/atomic/molecules/toast/ToastProvider.js';\nimport { Tag } from '@plumile/ui/backoffice/atoms/tag/Tag.js';\nimport { BackofficeDetailSection } from '@plumile/ui/backoffice/molecules/backoffice_detail_section/BackofficeDetailSection.js';\nimport { BackofficeKeyValueList } from '@plumile/ui/backoffice/molecules/backoffice_key_value_list/BackofficeKeyValueList.js';\nimport { BackofficePayloadViewer } from '@plumile/ui/backoffice/molecules/backoffice_payload_viewer/BackofficePayloadViewer.js';\nimport { BackofficeScopeStack } from '@plumile/ui/backoffice/molecules/backoffice_scope_stack/BackofficeScopeStack.js';\nimport { AuditTimeline } from '@plumile/ui/backoffice/organisms/audit_timeline/AuditTimeline.js';\nimport { MetricCard } from '@plumile/ui/components/dashboard/metric_card/MetricCard.js';\nimport { MetricTileGroup } from '@plumile/ui/components/dashboard/metric_tile_group/MetricTileGroup.js';\nimport { DataTable } from '@plumile/ui/components/data-table/DataTable.js';\nimport { ChatCheckSvg } from '@plumile/ui/icons/ChatCheckSvg.js';\nimport { KeyOffSvg } from '@plumile/ui/icons/KeyOffSvg.js';\nimport { KeySvg } from '@plumile/ui/icons/KeySvg.js';\nimport { LockOpenSvg } from '@plumile/ui/icons/LockOpenSvg.js';\nimport { LockSvg } from '@plumile/ui/icons/LockSvg.js';\nimport { RobotCheckSvg } from '@plumile/ui/icons/RobotCheckSvg.js';\nimport { RobotXSvg } from '@plumile/ui/icons/RobotXSvg.js';\nimport { RocketOffSvg } from '@plumile/ui/icons/RocketOffSvg.js';\nimport { RocketSvg } from '@plumile/ui/icons/RocketSvg.js';\nimport { SettingsCheckSvg } from '@plumile/ui/icons/SettingsCheckSvg.js';\nimport { SettingsXSvg } from '@plumile/ui/icons/SettingsXSvg.js';\nimport { ShieldLockSvg } from '@plumile/ui/icons/ShieldLockSvg.js';\nimport { ShieldOffSvg } from '@plumile/ui/icons/ShieldOffSvg.js';\nimport { XBadgeSvg } from '@plumile/ui/icons/XBadgeSvg.js';\nimport Link from '@plumile/router/routing/Link.js';\nimport RoutingContext from '@plumile/router/routing/RoutingContext.js';\n\nimport { buildDataTableColumns } from '../components/backoffice/columns/buildDataTableColumns.js';\nimport { BackofficeEntityDetailScaffold } from '../components/backoffice/scaffolds/BackofficeEntityDetailScaffold.js';\nimport { useBackofficeEntityDetailNotFoundState } from '../components/backoffice/scaffolds/BackofficeEntityDetailNotFound.js';\nimport { BackofficeDetailBadgeRow } from '../components/backoffice/detail/BackofficeDetailBadgeRow.js';\nimport { BackofficeDetailFlagTag } from '@plumile/ui/backoffice/molecules/backoffice_detail_flag_tag/BackofficeDetailFlagTag.js';\nimport { BackofficeDetailTaggedValue } from '@plumile/ui/backoffice/molecules/backoffice_detail_tagged_value/BackofficeDetailTaggedValue.js';\nimport { BackofficeLifecycleTimelineSection } from '../components/backoffice/detail/BackofficeLifecycleTimelineSection.js';\nimport { BackofficeRelationsSummaryGrid } from '../components/backoffice/detail/BackofficeRelationsSummaryGrid.js';\nimport * as detailLayoutStyles from '../components/backoffice/detail/backofficeDetailLayout.css.js';\nimport { LazyBackofficeEntityActionFormDialog } from '../components/backoffice/actions/LazyBackofficeEntityActionFormDialog.js';\nimport {\n resolveToastSpec,\n resolveToastViewActions,\n} from '../components/backoffice/actions/toastViewAction.js';\nimport * as pageStyles from './backofficeEntityDetailPage.css.js';\nimport { useBackofficeFormats } from '../i18n/useBackofficeFormats.js';\nimport { useBackofficeReactTranslation } from '../i18n/useBackofficeReactTranslation.js';\nimport { useBackofficeConfig } from '../provider/BackofficeConfigContext.js';\nimport { useBackofficeRuntimeFragment } from '../relay/typedRelayHooks.js';\nimport { useRelayEnvironment } from '../relay/useRelayEnvironment.js';\nimport {\n extractMutationPayload,\n isFormMutationAction,\n isMutationAction,\n isRouteAction,\n resolveLabel,\n} from './BackofficeEntityDetailPage.helpers.js';\nimport {\n buildFieldItems,\n renderBlocks,\n type FlagIconName,\n} from './BackofficeEntityDetailPage.view-helpers.js';\n\nexport type BackofficeEntityDetailPageProps = {\n prepared: BackofficePreparedDetailPageDataRoute;\n};\n\nconst renderFlagIcon = (iconName: FlagIconName): JSX.Element => {\n const iconSize = 14;\n switch (iconName) {\n case 'shield-lock':\n return (\n <ShieldLockSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'shield-off':\n return (\n <ShieldOffSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'settings-check':\n return (\n <SettingsCheckSvg\n width={iconSize}\n height={iconSize}\n aria-hidden=\"true\"\n />\n );\n case 'settings-x':\n return (\n <SettingsXSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'x-badge':\n return (\n <XBadgeSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'chat-check':\n return (\n <ChatCheckSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'key':\n return <KeySvg width={iconSize} height={iconSize} aria-hidden=\"true\" />;\n case 'key-off':\n return (\n <KeyOffSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'lock':\n return <LockSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />;\n case 'lock-open':\n return (\n <LockOpenSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'robot-check':\n return (\n <RobotCheckSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'robot-x':\n return (\n <RobotXSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'rocket':\n return (\n <RocketSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n case 'rocket-off':\n return (\n <RocketOffSvg width={iconSize} height={iconSize} aria-hidden=\"true\" />\n );\n default:\n throw new Error(`Unsupported flag icon: ${String(iconName)}`);\n }\n};\n\nconst resolveDetailPlacement = (item: {\n placement?: 'primary' | 'secondary' | 'main' | 'side' | 'fullWidth';\n presentation?: {\n group?: string;\n desktop?: 'primary' | 'secondary' | 'fullWidth';\n };\n kind?: string;\n fields?: readonly {\n presentation?: {\n group?: string;\n desktop?: 'primary' | 'secondary' | 'fullWidth';\n };\n }[];\n}): 'primary' | 'secondary' => {\n if (item.presentation?.desktop === 'secondary') {\n return 'secondary';\n }\n if (\n item.presentation?.group === 'scope' ||\n item.presentation?.group === 'status'\n ) {\n return 'secondary';\n }\n const fieldGroups =\n item.fields?.map((field) => {\n return field.presentation?.group;\n }) ?? [];\n if (\n fieldGroups.length > 0 &&\n fieldGroups.every((group) => {\n return group === 'scope' || group === 'status';\n })\n ) {\n return 'secondary';\n }\n if (item.placement === 'side') {\n return 'secondary';\n }\n if (item.placement === 'secondary') {\n return 'secondary';\n }\n return 'primary';\n};\n\nconst BackofficeEntityDetailPageContent = ({\n config,\n prepared,\n}: {\n config: BackofficeResolvedDetailPageFacetConfig;\n prepared: {\n pageQuery: PreloadedQuery<OperationType>;\n id: string;\n detailId?: string;\n pageId: string;\n pagePath: string;\n };\n}): JSX.Element => {\n const { t: tApp } = useTranslation();\n const { t } = useBackofficeReactTranslation();\n const { formatNumber, formatCurrency, formatCurrencyTitle, formatPercent } =\n useBackofficeFormats();\n const { entities } = useBackofficeConfig();\n const routing = useContext(RoutingContext);\n const environment = useRelayEnvironment();\n const toast = useToast();\n const [actionState, setActionState] = useState<Record<string, boolean>>({});\n const [activeFormActionId, setActiveFormActionId] = useState<string | null>(\n null,\n );\n const setActionLoading = (actionId: string, isLoading: boolean) => {\n setActionState((prev) => {\n if (prev[actionId] === isLoading) {\n return prev;\n }\n return { ...prev, [actionId]: isLoading };\n });\n };\n\n const { page } = config;\n const notFound = useBackofficeEntityDetailNotFoundState({\n listHref: config.routes.list,\n });\n\n const pageQueryData = usePreloadedQuery(page.query, prepared.pageQuery);\n const pageNodeRef = page.resolveNode(pageQueryData, {\n id: prepared.id,\n detailId: prepared.detailId,\n });\n const fragmentNode = useBackofficeRuntimeFragment(page.fragment, pageNodeRef);\n return (\n <BackofficeEntityDetailScaffold\n node={fragmentNode}\n notFound={notFound}\n render={(node) => {\n const view = page.toView(node);\n const resolveEntityHref = (entityId: string, refId: string) => {\n const entityConfig = entities[entityId];\n if (entityConfig == null) {\n return null;\n }\n return entityConfig.routes.detail(refId);\n };\n const actions = page.actions ?? [];\n let headerActionButtons: ReactNode[] = [];\n if (actions.length > 0) {\n const visibleActions = actions.filter((action) => {\n if (action.isVisible == null) {\n return true;\n }\n return action.isVisible(view);\n });\n\n if (visibleActions.length > 0) {\n headerActionButtons = visibleActions.map((action) => {\n const label = resolveLabel(action.label, tApp);\n const ariaLabel =\n action.ariaLabel != null\n ? resolveLabel(action.ariaLabel, tApp)\n : label;\n const variant = action.variant ?? 'secondary';\n const size = action.size ?? 'small';\n const isLoading = actionState[action.id] ?? false;\n const isDisabled =\n isLoading || action.isDisabled?.(view) === true;\n\n if (isRouteAction(action)) {\n const href = action.to(view);\n return (\n <LinkButton\n key={action.id}\n to={href}\n variant={variant}\n size={size}\n isDisabled={isDisabled}\n aria-label={ariaLabel}\n preloadOnHover=\"code-and-data\"\n >\n {label}\n </LinkButton>\n );\n }\n\n if (isFormMutationAction(action)) {\n return (\n <Button\n key={action.id}\n type=\"button\"\n variant={variant}\n size={size}\n isLoading={false}\n disabled={isDisabled}\n onClick={() => {\n setActiveFormActionId(action.id);\n }}\n aria-label={ariaLabel}\n >\n {label}\n </Button>\n );\n }\n\n if (isMutationAction(action)) {\n const handleClick = () => {\n if (isLoading) {\n return;\n }\n const variables = action.getVariables(view);\n setActionLoading(action.id, true);\n commitMutation(environment, {\n mutation: action.mutation,\n variables,\n updater: (store) => {\n action.updater?.(store, view);\n },\n onCompleted: (response) => {\n setActionLoading(action.id, false);\n const mutationPayload = extractMutationPayload(response);\n if (mutationPayload != null) {\n let defaultErrorMessage = t(\n 'actions.form.errors.invalidPayload',\n );\n if (action.toasts?.error?.message != null) {\n defaultErrorMessage = resolveLabel(\n action.toasts.error.message,\n tApp,\n );\n } else if (action.toasts?.error?.title != null) {\n defaultErrorMessage = resolveLabel(\n action.toasts.error.title,\n tApp,\n );\n }\n\n const outcome = resolveMutationOutcome(\n mutationPayload,\n {\n defaultErrorMessage,\n mapReason: (reason) => {\n const mapped = action.mapErrorReason?.(\n reason,\n view,\n );\n if (mapped == null) {\n return null;\n }\n if (typeof mapped === 'function') {\n return resolveLabel(mapped, tApp);\n }\n return String(mapped);\n },\n },\n );\n if (!outcome.ok) {\n const error = new Error(outcome.message);\n action.onError?.(error, view);\n if (action.toasts?.error != null) {\n const toastSpec = resolveToastSpec(\n action.toasts.error,\n tApp,\n );\n toast.error(toastSpec.title, toastSpec.message);\n }\n return;\n }\n }\n\n action.onCompleted?.(response, view);\n if (action.toasts?.success != null) {\n const toastSpec = resolveToastSpec(\n action.toasts.success,\n tApp,\n );\n const toastActions = resolveToastViewActions({\n toast: action.toasts.success,\n response,\n node: view,\n tApp,\n entities,\n defaultLabel: t('actions.view'),\n navigateTo: (to) => {\n routing?.history.push({ pathname: to });\n },\n });\n toast.push({\n kind: 'info',\n title: toastSpec.title,\n message: toastSpec.message,\n actions: toastActions,\n });\n }\n },\n onError: (error) => {\n setActionLoading(action.id, false);\n action.onError?.(error, view);\n if (action.toasts?.error != null) {\n const toastSpec = resolveToastSpec(\n action.toasts.error,\n tApp,\n );\n toast.error(toastSpec.title, toastSpec.message);\n }\n },\n });\n };\n\n return (\n <Button\n key={action.id}\n type=\"button\"\n variant={variant}\n size={size}\n isLoading={isLoading}\n disabled={isDisabled}\n onClick={handleClick}\n aria-label={ariaLabel}\n >\n {label}\n </Button>\n );\n }\n\n return null;\n });\n }\n }\n\n const activeFormAction = actions.find((action) => {\n return action.id === activeFormActionId;\n });\n\n const { content } = page;\n\n const primaryNodes: ReactNode[] = [];\n const secondaryNodes: ReactNode[] = [];\n content.forEach((item, index) => {\n const placement = resolveDetailPlacement(item);\n const targetNodes =\n placement === 'secondary' ? secondaryNodes : primaryNodes;\n\n if (item.kind === 'fieldSet') {\n const sectionLabel = resolveLabel(item.title, tApp);\n const description =\n item.description != null\n ? resolveLabel(item.description, tApp)\n : undefined;\n const { items, customNodes } = buildFieldItems(item.fields, view, {\n tApp,\n t,\n resolveEntityHref,\n formatNumber,\n formatCurrency,\n formatCurrencyTitle,\n formatPercent,\n renderTag: (tone, label) => {\n return <Tag tone={tone}>{label}</Tag>;\n },\n renderBadgeRow: (items) => {\n return <BackofficeDetailBadgeRow items={items} />;\n },\n renderDate: (value, fallback) => {\n return (\n <FormattedDate\n value={value}\n options={BACKOFFICE_DATE_TIME_OPTIONS}\n fallback={fallback}\n />\n );\n },\n renderFlagTag: (tag) => {\n return (\n <BackofficeDetailFlagTag\n tone={tag.tone}\n icon={\n tag.iconName != null\n ? renderFlagIcon(tag.iconName)\n : undefined\n }\n label={tag.label}\n />\n );\n },\n renderLink: (href, label) => {\n return (\n <Link to={href} preloadOnHover=\"code-and-data\">\n {label}\n </Link>\n );\n },\n renderTaggedValue: (tag, value) => {\n return <BackofficeDetailTaggedValue tag={tag} value={value} />;\n },\n wrapCustomNode: (id, custom) => {\n return <div key={id}>{custom}</div>;\n },\n });\n\n const hasContent = items.length > 0 || customNodes.length > 0;\n\n if (!hasContent) {\n return;\n }\n\n targetNodes.push(\n <BackofficeDetailSection\n key={`${sectionLabel}-${index}`}\n title={sectionLabel}\n description={description}\n items={items.length > 0 ? items : undefined}\n >\n {customNodes}\n </BackofficeDetailSection>,\n );\n return;\n }\n\n const rendered = renderBlocks([item], view, {\n tApp,\n t,\n resolveEntityHref,\n keyPrefix: String(index),\n renderLink: (href, label) => {\n return (\n <Link to={href} preloadOnHover=\"code-and-data\">\n {label}\n </Link>\n );\n },\n renderDate: (value, fallback) => {\n return (\n <FormattedDate\n value={value}\n options={BACKOFFICE_DATE_TIME_OPTIONS}\n fallback={fallback}\n />\n );\n },\n renderTag: (tone, label) => {\n return <Tag tone={tone}>{label}</Tag>;\n },\n renderMetricGroup: ({\n key,\n title,\n description,\n density,\n items,\n }) => {\n return (\n <BackofficeDetailSection\n key={key}\n title={title}\n description={description}\n >\n {items.length > 0 && (\n <MetricTileGroup\n density={density ?? 'comfortable'}\n minColumn=\"180\"\n >\n {items.map((metric) => {\n return (\n <MetricCard\n key={metric.id}\n label={metric.label}\n value={metric.value}\n hint={metric.hint}\n tone={metric.tone ?? 'neutral'}\n density={density ?? 'comfortable'}\n copyValue={metric.copyValue}\n copyLabel={t('common.actions.copy')}\n copiedLabel={t('common.actions.copied')}\n />\n );\n })}\n </MetricTileGroup>\n )}\n </BackofficeDetailSection>\n );\n },\n renderTimeline: ({ key, title, description, events }) => {\n return (\n <BackofficeLifecycleTimelineSection\n key={key}\n title={title}\n description={description}\n events={events}\n />\n );\n },\n renderAuditTimeline: ({ key, title, description, events }) => {\n return (\n <BackofficeDetailSection\n key={key}\n title={title}\n description={description}\n >\n <AuditTimeline events={events} />\n </BackofficeDetailSection>\n );\n },\n renderRelations: ({ key, title, items }) => {\n return (\n <BackofficeRelationsSummaryGrid\n key={key}\n title={title}\n items={items}\n />\n );\n },\n renderContextStack: ({ key, title, items }) => {\n return (\n <BackofficeScopeStack key={key} title={title} items={items} />\n );\n },\n renderCustomSection: (key, title, child) => {\n return (\n <BackofficeDetailSection key={key} title={title}>\n {child}\n </BackofficeDetailSection>\n );\n },\n wrapCustomNode: (key, custom) => {\n return <div key={key}>{custom}</div>;\n },\n resolveTableColumns: (columns) => {\n return buildDataTableColumns(columns, {\n tApp,\n t,\n });\n },\n renderTable: ({ key, title, description, columns, rows }) => {\n return (\n <BackofficeDetailSection\n key={key}\n title={title}\n description={description}\n >\n <DataTable\n columns={columns}\n rows={rows}\n getRowId={(row, rowIndex) => {\n if (row != null && typeof row === 'object') {\n const record = row as Record<string, unknown>;\n const maybeId = record.id;\n if (\n typeof maybeId === 'string' &&\n maybeId.trim() !== ''\n ) {\n return maybeId;\n }\n }\n return String(rowIndex);\n }}\n />\n </BackofficeDetailSection>\n );\n },\n renderPayload: ({ key, title, description, content, format }) => {\n return (\n <BackofficeDetailSection\n key={key}\n title={title}\n description={description}\n >\n <BackofficePayloadViewer\n content={content}\n format={format}\n emptyState={t('common.notAvailable')}\n />\n </BackofficeDetailSection>\n );\n },\n renderKeyValueListSection: ({ key, title, description, items }) => {\n return (\n <BackofficeDetailSection\n key={key}\n title={title}\n description={description}\n >\n <BackofficeKeyValueList items={items} />\n </BackofficeDetailSection>\n );\n },\n });\n const blockNode = rendered[0];\n if (blockNode != null) {\n targetNodes.push(blockNode);\n }\n });\n\n const tabActionsNode =\n headerActionButtons.length > 0 ? (\n <div className={pageStyles.headerActions}>\n <div className={pageStyles.headerActionGroup}>\n {headerActionButtons}\n </div>\n </div>\n ) : null;\n\n const hasAside = secondaryNodes.length > 0;\n const contentNode = hasAside ? (\n <div className={detailLayoutStyles.layout}>\n <div className={detailLayoutStyles.primary}>{primaryNodes}</div>\n <aside className={detailLayoutStyles.secondary}>\n {secondaryNodes}\n </aside>\n </div>\n ) : (\n <div className={detailLayoutStyles.stacked}>{primaryNodes}</div>\n );\n\n return (\n <>\n {tabActionsNode}\n {contentNode}\n {activeFormAction != null &&\n isFormMutationAction(activeFormAction) && (\n <LazyBackofficeEntityActionFormDialog\n isOpen\n action={activeFormAction}\n node={view}\n onClose={() => {\n setActiveFormActionId(null);\n }}\n />\n )}\n </>\n );\n }}\n />\n );\n};\n\nexport const BackofficeEntityDetailPage = ({\n prepared,\n}: BackofficeEntityDetailPageProps): JSX.Element => {\n return (\n <BackofficeEntityDetailPageContent\n config={prepared.pageConfig}\n prepared={prepared}\n />\n );\n};\n\nexport default BackofficeEntityDetailPage;\n"],"mappings":"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"}
|
|
@@ -16,54 +16,54 @@ import { BACKOFFICE_LIST_DEFAULTS as y, BACKOFFICE_LIST_REFETCH_POLICY as b } fr
|
|
|
16
16
|
import { stableListVariablesKey as x } from "@plumile/backoffice-core/state/stableKey.js";
|
|
17
17
|
//#region src/pages/BackofficeEntityListDataPage.tsx
|
|
18
18
|
function S({ queryRef: t }) {
|
|
19
|
-
let { config: o, state: p, pushState: m, headerActions: g, columns: _, gridTemplateColumns: S, getRowId: C, countFetchKey: w, bumpCountFetchKey: T,
|
|
19
|
+
let { config: o, state: p, pushState: m, headerActions: g, columns: _, gridTemplateColumns: S, getRowId: C, countFetchKey: w, bumpCountFetchKey: T, registerRefresh: E } = c(), D = o.list, { t: O } = e(), k = v(D.query, t), { data: A, loadNext: j, hasNext: M, isLoadingNext: N, refetch: P } = r(D.fragment, k), F = D.getConnection(A), I = d(() => F.edges.map((e) => D.toRow(e.node)), [F.edges, D]), { listDefaults: L } = o, R = p.sort ?? L.sort, { pageSize: z } = y, B = d(() => ({
|
|
20
20
|
where: p.where,
|
|
21
|
-
sort:
|
|
22
|
-
count:
|
|
21
|
+
sort: R,
|
|
22
|
+
count: z,
|
|
23
23
|
cursor: null
|
|
24
24
|
}), [
|
|
25
|
-
B,
|
|
26
25
|
z,
|
|
26
|
+
R,
|
|
27
27
|
p.where
|
|
28
|
-
]),
|
|
29
|
-
refetch:
|
|
30
|
-
variables:
|
|
28
|
+
]), V = d(() => x(B), [B]), H = f(V), { isRefreshing: U, onRefresh: W } = s({
|
|
29
|
+
refetch: P,
|
|
30
|
+
variables: B,
|
|
31
31
|
defaults: {
|
|
32
|
-
where:
|
|
33
|
-
sort:
|
|
34
|
-
count:
|
|
32
|
+
where: L.where,
|
|
33
|
+
sort: L.sort,
|
|
34
|
+
count: z,
|
|
35
35
|
cursor: null
|
|
36
36
|
},
|
|
37
37
|
fetchPolicy: b,
|
|
38
|
-
buildQueryVariables:
|
|
38
|
+
buildQueryVariables: D.buildQueryVariables
|
|
39
39
|
});
|
|
40
40
|
u(() => {
|
|
41
|
-
|
|
42
|
-
}, [T,
|
|
43
|
-
let
|
|
44
|
-
T(),
|
|
45
|
-
}, [T,
|
|
46
|
-
u(() => (
|
|
47
|
-
|
|
48
|
-
}), [
|
|
49
|
-
let
|
|
50
|
-
|
|
51
|
-
}, [
|
|
52
|
-
nodes:
|
|
53
|
-
hasNext:
|
|
54
|
-
isLoadingNext:
|
|
55
|
-
runLoadMore:
|
|
41
|
+
H.current !== V && (H.current = V, T());
|
|
42
|
+
}, [T, V]);
|
|
43
|
+
let G = l(() => {
|
|
44
|
+
T(), W();
|
|
45
|
+
}, [T, W]);
|
|
46
|
+
u(() => (E(G), () => {
|
|
47
|
+
E(null);
|
|
48
|
+
}), [G, E]);
|
|
49
|
+
let K = l((e) => {
|
|
50
|
+
j(z, { onComplete: e });
|
|
51
|
+
}, [j, z]), q = n({
|
|
52
|
+
nodes: I,
|
|
53
|
+
hasNext: M,
|
|
54
|
+
isLoadingNext: N,
|
|
55
|
+
runLoadMore: K,
|
|
56
56
|
surface: `backoffice.entity-list.${o.id}`,
|
|
57
|
-
resetKey:
|
|
58
|
-
}),
|
|
59
|
-
|
|
60
|
-
let
|
|
61
|
-
count:
|
|
57
|
+
resetKey: V
|
|
58
|
+
}), J = /* @__PURE__ */ h("span", { children: O("common.loading") });
|
|
59
|
+
I.length > 0 && (J = /* @__PURE__ */ h("span", { children: O("list.loaded", { count: I.length }) }));
|
|
60
|
+
let Y = /* @__PURE__ */ h(i, {
|
|
61
|
+
count: D.count,
|
|
62
62
|
where: p.where,
|
|
63
63
|
fetchKey: w,
|
|
64
|
-
loadingFallback:
|
|
65
|
-
children: (e) => /* @__PURE__ */ h("span", { children:
|
|
66
|
-
shown:
|
|
64
|
+
loadingFallback: J,
|
|
65
|
+
children: (e) => /* @__PURE__ */ h("span", { children: O("list.showing", {
|
|
66
|
+
shown: I.length,
|
|
67
67
|
total: e
|
|
68
68
|
}) })
|
|
69
69
|
});
|
|
@@ -72,43 +72,42 @@ function S({ queryRef: t }) {
|
|
|
72
72
|
state: p,
|
|
73
73
|
pushState: m,
|
|
74
74
|
headerActions: g,
|
|
75
|
-
rows:
|
|
75
|
+
rows: q.nodes,
|
|
76
76
|
columns: _,
|
|
77
77
|
gridTemplateColumns: S,
|
|
78
78
|
getRowId: C,
|
|
79
|
-
hasNextPage:
|
|
80
|
-
isLoadingMore:
|
|
81
|
-
incrementalError:
|
|
82
|
-
isRefreshing:
|
|
83
|
-
onLoadMore:
|
|
84
|
-
onRetryLoadMore:
|
|
85
|
-
onRefresh:
|
|
79
|
+
hasNextPage: q.hasNext,
|
|
80
|
+
isLoadingMore: q.isLoadingNext,
|
|
81
|
+
incrementalError: q.incrementalError,
|
|
82
|
+
isRefreshing: U,
|
|
83
|
+
onLoadMore: q.loadMoreSafe,
|
|
84
|
+
onRetryLoadMore: q.retryLoadMore,
|
|
85
|
+
onRefresh: G,
|
|
86
86
|
totalCount: null,
|
|
87
|
-
loadedCountLabel:
|
|
88
|
-
filterDrawerState: E
|
|
87
|
+
loadedCountLabel: Y
|
|
89
88
|
});
|
|
90
89
|
}
|
|
91
90
|
var C = ({ prepared: n }) => {
|
|
92
|
-
let { config: r, state: i, pushState: s, headerActions: d, columns: v, gridTemplateColumns: b, getRowId: x
|
|
93
|
-
|
|
91
|
+
let { config: r, state: i, pushState: s, headerActions: d, columns: v, gridTemplateColumns: b, getRowId: x } = c(), C = o(), { t: w } = e(), [T, E] = p(() => n.query), D = f(null), O = l(() => {
|
|
92
|
+
D.current?.dispose(), D.current = null;
|
|
94
93
|
}, []);
|
|
95
94
|
u(() => {
|
|
96
|
-
|
|
97
|
-
}, [
|
|
98
|
-
|
|
99
|
-
}, [
|
|
100
|
-
let
|
|
95
|
+
O(), E(n.query);
|
|
96
|
+
}, [O, n.query]), u(() => () => {
|
|
97
|
+
O();
|
|
98
|
+
}, [O]);
|
|
99
|
+
let k = l(() => {
|
|
101
100
|
let e = r.list, { listDefaults: t } = r, { pageSize: n } = y, a = {
|
|
102
101
|
where: i.where,
|
|
103
102
|
sort: i.sort ?? t.sort,
|
|
104
103
|
count: n,
|
|
105
104
|
cursor: null
|
|
106
|
-
}, o = e.buildQueryVariables(a), s = _(
|
|
107
|
-
|
|
105
|
+
}, o = e.buildQueryVariables(a), s = _(C, e.query, o, { fetchPolicy: "network-only" });
|
|
106
|
+
O(), D.current = s, E(s);
|
|
108
107
|
}, [
|
|
109
108
|
r,
|
|
110
|
-
|
|
111
|
-
|
|
109
|
+
O,
|
|
110
|
+
C,
|
|
112
111
|
i.sort,
|
|
113
112
|
i.where
|
|
114
113
|
]);
|
|
@@ -129,26 +128,25 @@ var C = ({ prepared: n }) => {
|
|
|
129
128
|
onLoadMore: () => {},
|
|
130
129
|
onRetryLoadMore: () => {},
|
|
131
130
|
onRefresh: () => {
|
|
132
|
-
e(),
|
|
131
|
+
e(), k();
|
|
133
132
|
},
|
|
134
133
|
totalCount: null,
|
|
135
|
-
filterDrawerState: C,
|
|
136
134
|
emptyState: /* @__PURE__ */ h(m, {
|
|
137
135
|
tone: "danger",
|
|
138
|
-
title:
|
|
136
|
+
title: w("list.errors.title"),
|
|
139
137
|
actions: /* @__PURE__ */ h(g, {
|
|
140
138
|
type: "button",
|
|
141
139
|
variant: "secondary",
|
|
142
140
|
size: "small",
|
|
143
141
|
onClick: () => {
|
|
144
|
-
e(),
|
|
142
|
+
e(), k();
|
|
145
143
|
},
|
|
146
|
-
children:
|
|
144
|
+
children: w("list.actions.retry")
|
|
147
145
|
}),
|
|
148
|
-
children:
|
|
146
|
+
children: w("list.errors.tableFailed")
|
|
149
147
|
})
|
|
150
148
|
}),
|
|
151
|
-
children: /* @__PURE__ */ h(S, { queryRef:
|
|
149
|
+
children: /* @__PURE__ */ h(S, { queryRef: T })
|
|
152
150
|
});
|
|
153
151
|
};
|
|
154
152
|
//#endregion
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BackofficeEntityListDataPage.js","names":[],"sources":["../../../src/pages/BackofficeEntityListDataPage.tsx"],"sourcesContent":["import {\n type JSX,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { loadQuery, usePreloadedQuery } from 'react-relay';\nimport type { OperationType } from 'relay-runtime';\nimport {\n BACKOFFICE_LIST_DEFAULTS,\n BACKOFFICE_LIST_REFETCH_POLICY,\n} from '@plumile/backoffice-core/constants.js';\nimport { stableListVariablesKey } from '@plumile/backoffice-core/state/stableKey.js';\nimport type { BackofficePreparedListDataRoute } from '@plumile/backoffice-core/types.js';\nimport { Button } from '@plumile/ui/atomic/atoms/button/Button.js';\nimport { InlineBanner } from '@plumile/ui/components/feedback/InlineBanner.js';\n\nimport { BackofficeErrorBoundary } from '../components/backoffice/errors/BackofficeErrorBoundary.js';\nimport { BackofficeEntityListScaffold } from '../components/backoffice/scaffolds/BackofficeEntityListScaffold.js';\nimport { BackofficeLazyEntityCountLabel } from '../components/backoffice/refs/BackofficeLazyEntityCount.js';\nimport { useInfiniteConnection } from '../hooks/useInfiniteConnection.js';\nimport { useBackofficeListRefetch } from '../hooks/useBackofficeListRefetch.js';\nimport { useBackofficeReactTranslation } from '../i18n/useBackofficeReactTranslation.js';\nimport { useBackofficeRuntimePaginationFragment } from '../relay/typedRelayHooks.js';\nimport { useRelayEnvironment } from '../relay/useRelayEnvironment.js';\nimport { useBackofficeEntityListRouteContext } from './BackofficeEntityListRouteContext.js';\n\nexport type BackofficeEntityListDataPageProps = {\n prepared: BackofficePreparedListDataRoute;\n};\n\ntype BackofficeEntityConnectionListDataProps = {\n queryRef: BackofficePreparedListDataRoute['query'];\n};\n\n/**\n * Renders the Relay-backed row data under the list layout route boundary.\n */\nfunction BackofficeEntityConnectionListData({\n queryRef,\n}: BackofficeEntityConnectionListDataProps): JSX.Element | null {\n const {\n config,\n state,\n pushState,\n headerActions,\n columns,\n gridTemplateColumns,\n getRowId,\n countFetchKey,\n bumpCountFetchKey,\n filterDrawerState,\n registerRefresh,\n } = useBackofficeEntityListRouteContext();\n const listConfig = config.list;\n const { t } = useBackofficeReactTranslation();\n\n const queryData = usePreloadedQuery(listConfig.query, queryRef);\n const {\n data: fragmentData,\n loadNext,\n hasNext,\n isLoadingNext,\n refetch,\n } = useBackofficeRuntimePaginationFragment<OperationType>(\n listConfig.fragment,\n queryData,\n );\n\n const connection = listConfig.getConnection(fragmentData);\n\n const rows = useMemo(() => {\n return connection.edges.map((edge) => {\n return listConfig.toRow(edge.node);\n });\n }, [connection.edges, listConfig]);\n\n const { listDefaults } = config;\n const resolvedSort = state.sort ?? listDefaults.sort;\n const { pageSize } = BACKOFFICE_LIST_DEFAULTS;\n\n const baseVariables = useMemo(() => {\n return {\n where: state.where,\n sort: resolvedSort,\n count: pageSize,\n cursor: null,\n };\n }, [pageSize, resolvedSort, state.where]);\n const countVariablesKey = useMemo(() => {\n return stableListVariablesKey(baseVariables);\n }, [baseVariables]);\n const previousCountVariablesKeyRef = useRef(countVariablesKey);\n\n const { isRefreshing, onRefresh } = useBackofficeListRefetch({\n refetch,\n variables: baseVariables,\n defaults: {\n where: listDefaults.where,\n sort: listDefaults.sort,\n count: pageSize,\n cursor: null,\n },\n fetchPolicy: BACKOFFICE_LIST_REFETCH_POLICY,\n buildQueryVariables: listConfig.buildQueryVariables,\n });\n\n useEffect(() => {\n if (previousCountVariablesKeyRef.current === countVariablesKey) {\n return;\n }\n previousCountVariablesKeyRef.current = countVariablesKey;\n bumpCountFetchKey();\n }, [bumpCountFetchKey, countVariablesKey]);\n\n const handleRefresh = useCallback(() => {\n bumpCountFetchKey();\n onRefresh();\n }, [bumpCountFetchKey, onRefresh]);\n\n useEffect(() => {\n registerRefresh(handleRefresh);\n return () => {\n registerRefresh(null);\n };\n }, [handleRefresh, registerRefresh]);\n\n const runLoadMore = useCallback(\n (onComplete: (error: Error | null) => void) => {\n loadNext(pageSize, { onComplete });\n },\n [loadNext, pageSize],\n );\n const pagination = useInfiniteConnection({\n nodes: rows,\n hasNext,\n isLoadingNext,\n runLoadMore,\n surface: `backoffice.entity-list.${config.id}`,\n resetKey: countVariablesKey,\n });\n\n let loadedCountFallback: JSX.Element = <span>{t('common.loading')}</span>;\n if (rows.length > 0) {\n loadedCountFallback = (\n <span>\n {t('list.loaded', {\n count: rows.length,\n })}\n </span>\n );\n }\n const loadedCountLabel = (\n <BackofficeLazyEntityCountLabel\n count={listConfig.count}\n where={state.where}\n fetchKey={countFetchKey}\n loadingFallback={loadedCountFallback}\n >\n {(totalCount) => {\n return (\n <span>\n {t('list.showing', {\n shown: rows.length,\n total: totalCount,\n })}\n </span>\n );\n }}\n </BackofficeLazyEntityCountLabel>\n );\n\n return (\n <BackofficeEntityListScaffold\n config={config}\n state={state}\n pushState={pushState}\n headerActions={headerActions}\n rows={pagination.nodes}\n columns={columns}\n gridTemplateColumns={gridTemplateColumns}\n getRowId={getRowId}\n hasNextPage={pagination.hasNext}\n isLoadingMore={pagination.isLoadingNext}\n incrementalError={pagination.incrementalError}\n isRefreshing={isRefreshing}\n onLoadMore={pagination.loadMoreSafe}\n onRetryLoadMore={pagination.retryLoadMore}\n onRefresh={handleRefresh}\n totalCount={null}\n loadedCountLabel={loadedCountLabel}\n filterDrawerState={filterDrawerState}\n />\n );\n}\n\nexport const BackofficeEntityListDataPage = ({\n prepared,\n}: BackofficeEntityListDataPageProps): JSX.Element | null => {\n const {\n config,\n state,\n pushState,\n headerActions,\n columns,\n gridTemplateColumns,\n getRowId,\n filterDrawerState,\n } = useBackofficeEntityListRouteContext();\n const relayEnvironment = useRelayEnvironment();\n const { t } = useBackofficeReactTranslation();\n const [queryRef, setQueryRef] = useState(() => {\n return prepared.query;\n });\n const ownedQueryRef = useRef<BackofficePreparedListDataRoute['query'] | null>(\n null,\n );\n\n const disposeOwnedQueryRef = useCallback(() => {\n ownedQueryRef.current?.dispose();\n ownedQueryRef.current = null;\n }, []);\n\n useEffect(() => {\n disposeOwnedQueryRef();\n setQueryRef(prepared.query);\n }, [disposeOwnedQueryRef, prepared.query]);\n\n useEffect(() => {\n return () => {\n disposeOwnedQueryRef();\n };\n }, [disposeOwnedQueryRef]);\n\n const reloadInitialQuery = useCallback(() => {\n const listConfig = config.list;\n const { listDefaults } = config;\n const { pageSize } = BACKOFFICE_LIST_DEFAULTS;\n const variablesBase = {\n where: state.where,\n sort: state.sort ?? listDefaults.sort,\n count: pageSize,\n cursor: null,\n };\n const variables = listConfig.buildQueryVariables(variablesBase);\n const nextQueryRef = loadQuery<OperationType>(\n relayEnvironment,\n listConfig.query,\n variables,\n {\n fetchPolicy: 'network-only',\n },\n );\n disposeOwnedQueryRef();\n ownedQueryRef.current = nextQueryRef;\n setQueryRef(nextQueryRef);\n }, [config, disposeOwnedQueryRef, relayEnvironment, state.sort, state.where]);\n\n return (\n <BackofficeErrorBoundary\n fallback={({ reset }) => {\n return (\n <BackofficeEntityListScaffold\n config={config}\n state={state}\n pushState={pushState}\n headerActions={headerActions}\n rows={[]}\n columns={columns}\n gridTemplateColumns={gridTemplateColumns}\n getRowId={getRowId}\n hasNextPage={false}\n isLoadingMore={false}\n incrementalError={null}\n isRefreshing={false}\n onLoadMore={() => {}}\n onRetryLoadMore={() => {}}\n onRefresh={() => {\n reset();\n reloadInitialQuery();\n }}\n totalCount={null}\n filterDrawerState={filterDrawerState}\n emptyState={\n <InlineBanner\n tone=\"danger\"\n title={t('list.errors.title')}\n actions={\n <Button\n type=\"button\"\n variant=\"secondary\"\n size=\"small\"\n onClick={() => {\n reset();\n reloadInitialQuery();\n }}\n >\n {t('list.actions.retry')}\n </Button>\n }\n >\n {t('list.errors.tableFailed')}\n </InlineBanner>\n }\n />\n );\n }}\n >\n <BackofficeEntityConnectionListData queryRef={queryRef} />\n </BackofficeErrorBoundary>\n );\n};\n\nexport default BackofficeEntityListDataPage;\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BackofficeEntityListDataPage.js","names":[],"sources":["../../../src/pages/BackofficeEntityListDataPage.tsx"],"sourcesContent":["import {\n type JSX,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport { loadQuery, usePreloadedQuery } from 'react-relay';\nimport type { OperationType } from 'relay-runtime';\nimport {\n BACKOFFICE_LIST_DEFAULTS,\n BACKOFFICE_LIST_REFETCH_POLICY,\n} from '@plumile/backoffice-core/constants.js';\nimport { stableListVariablesKey } from '@plumile/backoffice-core/state/stableKey.js';\nimport type { BackofficePreparedListDataRoute } from '@plumile/backoffice-core/types.js';\nimport { Button } from '@plumile/ui/atomic/atoms/button/Button.js';\nimport { InlineBanner } from '@plumile/ui/components/feedback/InlineBanner.js';\n\nimport { BackofficeErrorBoundary } from '../components/backoffice/errors/BackofficeErrorBoundary.js';\nimport { BackofficeEntityListScaffold } from '../components/backoffice/scaffolds/BackofficeEntityListScaffold.js';\nimport { BackofficeLazyEntityCountLabel } from '../components/backoffice/refs/BackofficeLazyEntityCount.js';\nimport { useInfiniteConnection } from '../hooks/useInfiniteConnection.js';\nimport { useBackofficeListRefetch } from '../hooks/useBackofficeListRefetch.js';\nimport { useBackofficeReactTranslation } from '../i18n/useBackofficeReactTranslation.js';\nimport { useBackofficeRuntimePaginationFragment } from '../relay/typedRelayHooks.js';\nimport { useRelayEnvironment } from '../relay/useRelayEnvironment.js';\nimport { useBackofficeEntityListRouteContext } from './BackofficeEntityListRouteContext.js';\n\nexport type BackofficeEntityListDataPageProps = {\n prepared: BackofficePreparedListDataRoute;\n};\n\ntype BackofficeEntityConnectionListDataProps = {\n queryRef: BackofficePreparedListDataRoute['query'];\n};\n\n/**\n * Renders the Relay-backed row data under the list layout route boundary.\n */\nfunction BackofficeEntityConnectionListData({\n queryRef,\n}: BackofficeEntityConnectionListDataProps): JSX.Element | null {\n const {\n config,\n state,\n pushState,\n headerActions,\n columns,\n gridTemplateColumns,\n getRowId,\n countFetchKey,\n bumpCountFetchKey,\n registerRefresh,\n } = useBackofficeEntityListRouteContext();\n const listConfig = config.list;\n const { t } = useBackofficeReactTranslation();\n\n const queryData = usePreloadedQuery(listConfig.query, queryRef);\n const {\n data: fragmentData,\n loadNext,\n hasNext,\n isLoadingNext,\n refetch,\n } = useBackofficeRuntimePaginationFragment<OperationType>(\n listConfig.fragment,\n queryData,\n );\n\n const connection = listConfig.getConnection(fragmentData);\n\n const rows = useMemo(() => {\n return connection.edges.map((edge) => {\n return listConfig.toRow(edge.node);\n });\n }, [connection.edges, listConfig]);\n\n const { listDefaults } = config;\n const resolvedSort = state.sort ?? listDefaults.sort;\n const { pageSize } = BACKOFFICE_LIST_DEFAULTS;\n\n const baseVariables = useMemo(() => {\n return {\n where: state.where,\n sort: resolvedSort,\n count: pageSize,\n cursor: null,\n };\n }, [pageSize, resolvedSort, state.where]);\n const countVariablesKey = useMemo(() => {\n return stableListVariablesKey(baseVariables);\n }, [baseVariables]);\n const previousCountVariablesKeyRef = useRef(countVariablesKey);\n\n const { isRefreshing, onRefresh } = useBackofficeListRefetch({\n refetch,\n variables: baseVariables,\n defaults: {\n where: listDefaults.where,\n sort: listDefaults.sort,\n count: pageSize,\n cursor: null,\n },\n fetchPolicy: BACKOFFICE_LIST_REFETCH_POLICY,\n buildQueryVariables: listConfig.buildQueryVariables,\n });\n\n useEffect(() => {\n if (previousCountVariablesKeyRef.current === countVariablesKey) {\n return;\n }\n previousCountVariablesKeyRef.current = countVariablesKey;\n bumpCountFetchKey();\n }, [bumpCountFetchKey, countVariablesKey]);\n\n const handleRefresh = useCallback(() => {\n bumpCountFetchKey();\n onRefresh();\n }, [bumpCountFetchKey, onRefresh]);\n\n useEffect(() => {\n registerRefresh(handleRefresh);\n return () => {\n registerRefresh(null);\n };\n }, [handleRefresh, registerRefresh]);\n\n const runLoadMore = useCallback(\n (onComplete: (error: Error | null) => void) => {\n loadNext(pageSize, { onComplete });\n },\n [loadNext, pageSize],\n );\n const pagination = useInfiniteConnection({\n nodes: rows,\n hasNext,\n isLoadingNext,\n runLoadMore,\n surface: `backoffice.entity-list.${config.id}`,\n resetKey: countVariablesKey,\n });\n\n let loadedCountFallback: JSX.Element = <span>{t('common.loading')}</span>;\n if (rows.length > 0) {\n loadedCountFallback = (\n <span>\n {t('list.loaded', {\n count: rows.length,\n })}\n </span>\n );\n }\n const loadedCountLabel = (\n <BackofficeLazyEntityCountLabel\n count={listConfig.count}\n where={state.where}\n fetchKey={countFetchKey}\n loadingFallback={loadedCountFallback}\n >\n {(totalCount) => {\n return (\n <span>\n {t('list.showing', {\n shown: rows.length,\n total: totalCount,\n })}\n </span>\n );\n }}\n </BackofficeLazyEntityCountLabel>\n );\n\n return (\n <BackofficeEntityListScaffold\n config={config}\n state={state}\n pushState={pushState}\n headerActions={headerActions}\n rows={pagination.nodes}\n columns={columns}\n gridTemplateColumns={gridTemplateColumns}\n getRowId={getRowId}\n hasNextPage={pagination.hasNext}\n isLoadingMore={pagination.isLoadingNext}\n incrementalError={pagination.incrementalError}\n isRefreshing={isRefreshing}\n onLoadMore={pagination.loadMoreSafe}\n onRetryLoadMore={pagination.retryLoadMore}\n onRefresh={handleRefresh}\n totalCount={null}\n loadedCountLabel={loadedCountLabel}\n />\n );\n}\n\nexport const BackofficeEntityListDataPage = ({\n prepared,\n}: BackofficeEntityListDataPageProps): JSX.Element | null => {\n const {\n config,\n state,\n pushState,\n headerActions,\n columns,\n gridTemplateColumns,\n getRowId,\n } = useBackofficeEntityListRouteContext();\n const relayEnvironment = useRelayEnvironment();\n const { t } = useBackofficeReactTranslation();\n const [queryRef, setQueryRef] = useState(() => {\n return prepared.query;\n });\n const ownedQueryRef = useRef<BackofficePreparedListDataRoute['query'] | null>(\n null,\n );\n\n const disposeOwnedQueryRef = useCallback(() => {\n ownedQueryRef.current?.dispose();\n ownedQueryRef.current = null;\n }, []);\n\n useEffect(() => {\n disposeOwnedQueryRef();\n setQueryRef(prepared.query);\n }, [disposeOwnedQueryRef, prepared.query]);\n\n useEffect(() => {\n return () => {\n disposeOwnedQueryRef();\n };\n }, [disposeOwnedQueryRef]);\n\n const reloadInitialQuery = useCallback(() => {\n const listConfig = config.list;\n const { listDefaults } = config;\n const { pageSize } = BACKOFFICE_LIST_DEFAULTS;\n const variablesBase = {\n where: state.where,\n sort: state.sort ?? listDefaults.sort,\n count: pageSize,\n cursor: null,\n };\n const variables = listConfig.buildQueryVariables(variablesBase);\n const nextQueryRef = loadQuery<OperationType>(\n relayEnvironment,\n listConfig.query,\n variables,\n {\n fetchPolicy: 'network-only',\n },\n );\n disposeOwnedQueryRef();\n ownedQueryRef.current = nextQueryRef;\n setQueryRef(nextQueryRef);\n }, [config, disposeOwnedQueryRef, relayEnvironment, state.sort, state.where]);\n\n return (\n <BackofficeErrorBoundary\n fallback={({ reset }) => {\n return (\n <BackofficeEntityListScaffold\n config={config}\n state={state}\n pushState={pushState}\n headerActions={headerActions}\n rows={[]}\n columns={columns}\n gridTemplateColumns={gridTemplateColumns}\n getRowId={getRowId}\n hasNextPage={false}\n isLoadingMore={false}\n incrementalError={null}\n isRefreshing={false}\n onLoadMore={() => {}}\n onRetryLoadMore={() => {}}\n onRefresh={() => {\n reset();\n reloadInitialQuery();\n }}\n totalCount={null}\n emptyState={\n <InlineBanner\n tone=\"danger\"\n title={t('list.errors.title')}\n actions={\n <Button\n type=\"button\"\n variant=\"secondary\"\n size=\"small\"\n onClick={() => {\n reset();\n reloadInitialQuery();\n }}\n >\n {t('list.actions.retry')}\n </Button>\n }\n >\n {t('list.errors.tableFailed')}\n </InlineBanner>\n }\n />\n );\n }}\n >\n <BackofficeEntityConnectionListData queryRef={queryRef} />\n </BackofficeErrorBoundary>\n );\n};\n\nexport default BackofficeEntityListDataPage;\n"],"mappings":"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"}
|