npm - @plumile/backoffice-react - Versions diffs - 0.1.101 → 0.1.102 - Mend

@plumile/backoffice-react 0.1.101 → 0.1.102

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (79) hide show

package/lib/esm/{BackofficeEntityListPage-DVT3rrfa.js.map → BackofficeEntityListPage-dyE4er_s.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"BackofficeEntityListPage-DVT3rrfa.js","names":[],"sources":["../../src/components/backoffice/list/RowFlagsCell.css.ts","../../src/components/backoffice/list/RowFlagsCell.tsx","../../src/pages/backofficeEntityListPage.css.ts","../../src/pages/BackofficeEntityListPage.helpers.tsx","../../src/pages/BackofficeEntityListPage.tsx"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nexport const rowFlagsColumnCell = style({\n justifyContent: 'center',\n padding: '0 4px',\n});\n\nexport const container = style({\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n gap: 6,\n width: '100%',\n});\n\nexport const flag = style({\n display: 'grid',\n placeItems: 'center',\n width: 24,\n height: 24,\n});\n","import { useMemo, type JSX, type ReactNode } from 'react';\nimport type { TFunction } from 'i18next';\n\nimport type { BackofficeRowFlagSpec } from '@plumile/backoffice-core/types.js';\n\nimport * as styles from './RowFlagsCell.css.js';\n\nexport type RowFlagsCellProps<Row> = {\n row: Row;\n flags: readonly BackofficeRowFlagSpec<Row>[];\n tApp: TFunction;\n};\n\n/*\n Renders row-level flags (icons) in a dedicated compact column.\n /\nexport const RowFlagsCell = <Row,>({\n row,\n flags,\n tApp,\n}: RowFlagsCellProps<Row>): JSX.Element => {\n const resolved = useMemo(() => {\n const out: { id: string; node: ReactNode; label: string }[] = [];\n for (const flag of flags) {\n const node = flag.render(row) as ReactNode;\n if (node != null && node !== '' && node !== false) {\n out.push({ id: flag.id, node, label: flag.label(row)(tApp) });\n }\n }\n return out;\n }, [flags, row, tApp]);\n\n const ariaLabel = resolved\n .map((entry) => {\n return entry.label.trim();\n })\n .filter((label) => {\n return label !== '';\n })\n .join(', ');\n\n let ariaLabelProp: string \| undefined;\n if (ariaLabel !== '') {\n ariaLabelProp = ariaLabel;\n }\n\n return (\n <div className={styles.container} aria-label={ariaLabelProp}>\n {resolved.map((entry) => {\n return (\n <span\n key={entry.id}\n className={styles.flag}\n title={entry.label}\n role=\"img\"\n aria-label={entry.label}\n >\n {entry.node}\n </span>\n );\n })}\n </div>\n );\n};\n","import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui';\n\nexport const headerActions = sprinkles({\n display: 'flex',\n alignItems: 'center',\n gap: 2,\n flexWrap: 'wrap',\n});\n\nexport const actionsColumnCell = style({\n justifyContent: 'flex-end',\n});\n\nexport const actionTrigger = style({\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n width: '2rem',\n height: '2rem',\n flexShrink: 0,\n});\n","import type { ComponentProps, JSX } from 'react';\n\nimport type {\n BackofficeEntityFormMutationActionSpec,\n BackofficeEntityRouteActionSpec,\n BackofficeListActionSpec,\n BackofficeRecordListConfig,\n BackofficeResolvedListFacetConfig,\n I18nLabel,\n} from '@plumile/backoffice-core/types.js';\nimport type { Button, DataTableColumn } from '@plumile/ui';\nimport type { TFunction } from 'i18next';\n\nimport type { BackofficeSizedDataTableColumn } from '../components/backoffice/columns/buildDataTableColumns.js';\n\ntype ButtonVariant = ComponentProps<typeof Button>['variant'];\n\nconst ROW_FLAGS_SLOT_PX = 24;\nconst ROW_FLAGS_GAP_PX = 6;\nconst ROW_FLAGS_PADDING_X_PX = 4;\n\nconst ACTIONS_SLOT_PX = 32;\nconst ACTIONS_GAP_PX = 8;\nconst ACTIONS_PADDING_X_PX = 12;\nconst ACTIONS_SAFETY_PX = 4;\n\nconst listColumnTrackBySize: Record<\n BackofficeSizedDataTableColumn<unknown>['size'],\n string\n> = {\n xs: 'minmax(56px, 76px)',\n s: 'minmax(88px, 120px)',\n m: 'minmax(120px, 168px)',\n l: 'minmax(160px, 220px)',\n xl: 'minmax(220px, 300px)',\n fluid: 'minmax(0, 1fr)',\n};\n\nexport const computeRowFlagsColumnWidthPx = (flagCount: number): number => {\n if (flagCount <= 0) {\n return 0;\n }\n return (\n ROW_FLAGS_PADDING_X_PX 2 +\n ROW_FLAGS_SLOT_PX * flagCount +\n ROW_FLAGS_GAP_PX * Math.max(0, flagCount - 1)\n );\n};\n\nexport const computeActionsColumnWidthPx = (actionCount: number): number => {\n if (actionCount <= 0) {\n return 0;\n }\n return (\n ACTIONS_SAFETY_PX +\n ACTIONS_PADDING_X_PX * 2 +\n ACTIONS_SLOT_PX * actionCount +\n ACTIONS_GAP_PX * Math.max(0, actionCount - 1)\n );\n};\n\nexport const resolveTrackBySize = (\n column: DataTableColumn<unknown>,\n fallback: string,\n): string => {\n if ('size' in column && typeof column.size === 'string') {\n return listColumnTrackBySize[\n column.size as BackofficeSizedDataTableColumn<unknown>['size']\n ];\n }\n return fallback;\n};\n\nexport const isRouteAction = (\n action: BackofficeListActionSpec,\n): action is BackofficeEntityRouteActionSpec<null> => {\n return action.kind === 'route';\n};\n\nexport const isFormMutationAction = (\n action: BackofficeListActionSpec,\n): action is BackofficeEntityFormMutationActionSpec<null> => {\n return action.kind === 'formMutation';\n};\n\nexport const resolveActionVariant = (\n actionVariant: ButtonVariant \| undefined,\n index: number,\n): Exclude<ButtonVariant, undefined> => {\n if (actionVariant != null) {\n return actionVariant;\n }\n if (index === 0) {\n return 'primary';\n }\n return 'secondary';\n};\n\nexport const resolveRowId = (row: unknown): string \| null => {\n if (row == null \|\| typeof row !== 'object') {\n return null;\n }\n if (!('id' in row)) {\n return null;\n }\n const value = (row as { id?: unknown }).id;\n if (typeof value !== 'string') {\n return null;\n }\n const trimmed = value.trim();\n if (trimmed === '') {\n return null;\n }\n return trimmed;\n};\n\ntype RecordListConfig = BackofficeResolvedListFacetConfig & {\n list: BackofficeRecordListConfig<\n Record<string, unknown>,\n string,\n unknown,\n unknown,\n unknown,\n unknown,\n Record<string, unknown>\n >;\n};\n\nexport const isRecordListConfig = (\n config: BackofficeResolvedListFacetConfig,\n): config is RecordListConfig => {\n return config.list.kind === 'records';\n};\n\nexport const resolveLabel = (label: I18nLabel, tApp: TFunction): string => {\n return label(tApp);\n};\n\nexport const buildActionsColumn = (options: {\n ariaLabel: string;\n fallback: string;\n resolveDetailHref: (id: string) => string \| null;\n className?: string;\n renderAction: (input: { href: string; ariaLabel: string }) => JSX.Element;\n}): DataTableColumn<unknown> => {\n const { ariaLabel, fallback, resolveDetailHref, className, renderAction } =\n options;\n\n return {\n id: 'actions',\n header: '',\n className,\n mobileRole: 'action',\n cell: (row) => {\n const id = resolveRowId(row);\n if (id == null) {\n return fallback;\n }\n const href = resolveDetailHref(id);\n if (href == null) {\n return fallback;\n }\n return renderAction({ href, ariaLabel });\n },\n };\n};\n","/* eslint-disable react-hooks/rules-of-hooks /\nimport {\n type JSX,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport type { TFunction } from 'i18next';\nimport { useTranslation } from 'react-i18next';\nimport {\n useFragment,\n usePaginationFragment,\n usePreloadedQuery,\n useRelayEnvironment,\n} from 'react-relay';\nimport { fetchQuery } 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 {\n BackofficeEntityManifestItem,\n BackofficePreparedListRoute,\n BackofficeResolvedListFacetConfig,\n BackofficeRowFlagSpec,\n} from '@plumile/backoffice-core/types.js';\nimport {\n Button,\n EyeSvg,\n LinkButton,\n TableCell,\n type DataTableColumn,\n type GetRowId,\n} from '@plumile/ui';\nimport { BackofficeEntityListScaffold } from '../components/backoffice/scaffolds/BackofficeEntityListScaffold.js';\nimport { LazyBackofficeEntityActionFormDialog } from '../components/backoffice/actions/LazyBackofficeEntityActionFormDialog.js';\nimport { buildDataTableColumns } from '../components/backoffice/columns/buildDataTableColumns.js';\nimport { RowFlagsCell } from '../components/backoffice/list/RowFlagsCell.js';\nimport { useBackofficeListUrlState } from '../hooks/useBackofficeListUrlState.js';\nimport { useBackofficeLoadMore } from '../hooks/useBackofficeLoadMore.js';\nimport { useBackofficeListRefetch } from '../hooks/useBackofficeListRefetch.js';\nimport { useBackofficeReactTranslation } from '../i18n/useBackofficeReactTranslation.js';\nimport { useBackofficeConfig } from '../provider/BackofficeConfigContext.js';\nimport as pageStyles from './backofficeEntityListPage.css.js';\nimport { rowFlagsColumnCell } from '../components/backoffice/list/RowFlagsCell.css.js';\nimport { BackofficeRightPageLayout } from '../components/backoffice/layout/breadcrumb/BackofficeRightPageLayout.js';\nimport { buildEntityListBreadcrumb } from '../components/backoffice/layout/breadcrumb/buildBreadcrumbs.js';\nimport {\n buildActionsColumn,\n computeActionsColumnWidthPx,\n computeRowFlagsColumnWidthPx,\n isFormMutationAction,\n isRecordListConfig,\n isRouteAction,\n resolveLabel,\n resolveActionVariant,\n resolveTrackBySize,\n} from './BackofficeEntityListPage.helpers.js';\n\nexport type BackofficeEntityListPageProps = {\n entityManifest: BackofficeEntityManifestItem;\n config: BackofficeResolvedListFacetConfig;\n prepared: BackofficePreparedListRoute;\n};\n\ntype RecordFetchMode = 'append' \| 'reset';\ntype RecordFetchInput = {\n where: Record<string, unknown> \| null;\n sort: string \| null;\n count: number;\n cursor: string \| null;\n mode: RecordFetchMode;\n};\n\nconst RECORD_FETCH_POLICY = 'store-or-network' as const;\n\nconst applyListEdgeColumns = <Row,>(\n inputColumns: readonly DataTableColumn<Row>[],\n rowFlags: readonly BackofficeRowFlagSpec<Row>[] \| undefined,\n actionCount: number,\n tApp: TFunction,\n): {\n columns: readonly DataTableColumn<Row>[];\n gridTemplateColumns?: string;\n} => {\n const hasFlags = rowFlags != null && rowFlags.length > 0;\n\n let columns = inputColumns;\n if (hasFlags) {\n const flagsColumn: DataTableColumn<Row> = {\n id: '__rowFlags',\n header: '',\n className: rowFlagsColumnCell,\n mobileRole: 'badge',\n cell: (row) => {\n return <RowFlagsCell row={row} flags={rowFlags} tApp={tApp} />;\n },\n };\n\n // Ensure we never pick the flags column as \"primary\".\n const withFlags = [flagsColumn, ...inputColumns];\n const hasPrimary = withFlags.some((col) => {\n return col.isPrimary === true;\n });\n\n columns = withFlags;\n if (!hasPrimary) {\n columns = withFlags.map((col, index) => {\n if (index === 1) {\n return { ...col, isPrimary: true };\n }\n return col;\n });\n }\n }\n\n let flagCount = 0;\n if (hasFlags) {\n flagCount = rowFlags.length;\n }\n const flagsWidthPx = computeRowFlagsColumnWidthPx(flagCount);\n const actionsWidthPx = computeActionsColumnWidthPx(actionCount);\n\n // We always include the right-side \"actions\" column in list pages.\n let leftColumnCount = 0;\n if (hasFlags) {\n leftColumnCount = 1;\n }\n const middleCount = columns.length - leftColumnCount - 1;\n\n const middleTracks = columns\n .slice(leftColumnCount, leftColumnCount + Math.max(0, middleCount))\n .map((column) => {\n return resolveTrackBySize(column as DataTableColumn<unknown>, '1fr');\n })\n .join(' ');\n\n let gridTemplateColumns = '';\n if (hasFlags) {\n gridTemplateColumns = `${flagsWidthPx}px ${middleTracks} ${actionsWidthPx}px`;\n } else {\n gridTemplateColumns = `${middleTracks} ${actionsWidthPx}px`;\n }\n\n return { columns, gridTemplateColumns };\n};\n\nconst BackofficeEntityRecordListPage = ({\n config,\n prepared,\n}: BackofficeEntityListPageProps): JSX.Element \| null => {\n const { t: tApp } = useTranslation();\n const { t } = useBackofficeReactTranslation();\n const { entities } = useBackofficeConfig();\n const [activeFormActionId, setActiveFormActionId] = useState<string \| null>(\n null,\n );\n const environment = useRelayEnvironment();\n\n if (!isRecordListConfig(config)) {\n return null;\n }\n\n const listConfig = config.list;\n const listDefaults = config.listDefaults ??\n listConfig.defaultState ?? { where: null, sort: null };\n const queryData = usePreloadedQuery(listConfig.query, prepared.query);\n const fragmentData = useFragment(listConfig.fragment, queryData as never);\n\n const initialRows = useMemo(() => {\n return listConfig.getRows(fragmentData).map((row) => {\n return listConfig.toRow(row);\n });\n }, [fragmentData, listConfig]);\n\n const initialCursor = useMemo(() => {\n return listConfig.getNextCursor?.(queryData) ?? null;\n }, [listConfig, queryData]);\n\n const [rows, setRows] = useState(initialRows);\n const [nextCursor, setNextCursor] = useState(initialCursor);\n const [isLoadingMore, setIsLoadingMore] = useState(false);\n const [isRefreshing, setIsRefreshing] = useState(false);\n\n useEffect(() => {\n setRows(initialRows);\n setNextCursor(initialCursor);\n }, [initialCursor, initialRows]);\n\n const { columns, gridTemplateColumns } = useMemo((): {\n columns: readonly DataTableColumn<unknown>[];\n gridTemplateColumns?: string;\n } => {\n const baseColumns = buildDataTableColumns(listConfig.columns, {\n tApp,\n t,\n resolveEntityHref: (entityId, refId) => {\n const entityManifest = entities[entityId];\n if (entityManifest == null) {\n return null;\n }\n return entityManifest.routes.detail(refId);\n },\n });\n const actionsColumn = buildActionsColumn({\n ariaLabel: t('actions.view'),\n fallback: t('common.notAvailable'),\n className: pageStyles.actionsColumnCell,\n resolveDetailHref: (id) => {\n return config.routes.detail(id);\n },\n renderAction: ({ href, ariaLabel }) => {\n return (\n <TableCell.Actions>\n <span className={pageStyles.actionTrigger} title={ariaLabel}>\n <LinkButton\n to={href}\n variant=\"icon\"\n size=\"small\"\n aria-label={ariaLabel}\n >\n <EyeSvg width={16} height={16} />\n </LinkButton>\n </span>\n </TableCell.Actions>\n );\n },\n });\n const allColumns = [...baseColumns, actionsColumn];\n return applyListEdgeColumns(allColumns, listConfig.rowFlags, 1, tApp);\n }, [\n config.routes,\n listConfig.columns,\n listConfig.rowFlags,\n entities,\n t,\n tApp,\n ]);\n\n const getRowId = useCallback<GetRowId<unknown>>(\n (row) => {\n return listConfig.getRowId(row);\n },\n [listConfig],\n );\n\n const { state, pushState } = useBackofficeListUrlState(config);\n const resolvedSort = state.sort ?? listDefaults.sort;\n const { pageSize } = BACKOFFICE_LIST_DEFAULTS;\n\n const buildVariables = useCallback(\n (input: {\n where: Record<string, unknown> \| null;\n sort: string \| null;\n count: number;\n cursor: string \| null;\n }) => {\n if (listConfig.buildVariables != null) {\n return listConfig.buildVariables(input);\n }\n return input;\n },\n [listConfig],\n );\n\n const requestIdRef = useRef(0);\n const lastRefetchKeyRef = useRef(\n stableListVariablesKey({\n where: listDefaults.where,\n sort: listDefaults.sort,\n count: pageSize,\n }),\n );\n\n const runFetch = useCallback(\n async (input: RecordFetchInput) => {\n const requestId = requestIdRef.current + 1;\n requestIdRef.current = requestId;\n\n if (input.mode === 'append') {\n setIsLoadingMore(true);\n } else {\n setIsRefreshing(true);\n }\n\n try {\n const variables = buildVariables({\n where: input.where,\n sort: input.sort,\n count: input.count,\n cursor: input.cursor,\n });\n\n const response = await fetchQuery(\n environment,\n listConfig.query,\n variables as never,\n { fetchPolicy: RECORD_FETCH_POLICY },\n ).toPromise();\n\n if (response == null \|\| requestIdRef.current !== requestId) {\n return;\n }\n\n const nextRows = listConfig.getRows(response as never).map((row) => {\n return listConfig.toRow(row);\n });\n setRows((prev) => {\n if (input.mode === 'append') {\n return [...prev, ...nextRows];\n }\n return nextRows;\n });\n const cursor = listConfig.getNextCursor?.(response) ?? null;\n setNextCursor(cursor);\n } finally {\n if (input.mode === 'append') {\n setIsLoadingMore(false);\n } else {\n setIsRefreshing(false);\n }\n }\n },\n [buildVariables, environment, listConfig],\n );\n\n useEffect(() => {\n const key = stableListVariablesKey({\n where: state.where,\n sort: resolvedSort,\n count: pageSize,\n });\n if (lastRefetchKeyRef.current === key) {\n return;\n }\n lastRefetchKeyRef.current = key;\n runFetch({\n where: state.where,\n sort: resolvedSort,\n count: pageSize,\n cursor: null,\n mode: 'reset',\n }).catch(() => {});\n }, [pageSize, resolvedSort, runFetch, state.where]);\n\n const handleRefresh = useCallback(() => {\n if (isRefreshing) {\n return;\n }\n runFetch({\n where: state.where,\n sort: resolvedSort,\n count: pageSize,\n cursor: null,\n mode: 'reset',\n }).catch(() => {});\n }, [isRefreshing, pageSize, resolvedSort, runFetch, state.where]);\n\n const handleLoadMore = useBackofficeLoadMore({\n hasNext: nextCursor != null,\n isLoadingNext: isLoadingMore,\n loadNext: (count) => {\n if (nextCursor == null) {\n return;\n }\n runFetch({\n where: state.where,\n sort: resolvedSort,\n count,\n cursor: nextCursor,\n mode: 'append',\n }).catch(() => {});\n },\n count: pageSize,\n });\n\n const listActions = useMemo(() => {\n return config.listActions ?? [];\n }, [config.listActions]);\n const visibleActions = useMemo(() => {\n return listActions.filter((action) => {\n if (action.isVisible == null) {\n return true;\n }\n return action.isVisible(null);\n });\n }, [listActions]);\n\n const headerActions = useMemo(() => {\n if (visibleActions.length === 0) {\n return undefined;\n }\n return (\n <div className={pageStyles.headerActions}>\n {visibleActions.map((action, index) => {\n const { variant: actionVariant } = action;\n const label = resolveLabel(action.label, tApp);\n let ariaLabel = label;\n if (action.ariaLabel != null) {\n ariaLabel = resolveLabel(action.ariaLabel, tApp);\n }\n const variant = resolveActionVariant(actionVariant, index);\n const size = action.size ?? 'small';\n const isDisabled = action.isDisabled?.(null) === true;\n\n if (isRouteAction(action)) {\n const href = action.to(null);\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 >\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 disabled={isDisabled}\n onClick={() => {\n setActiveFormActionId(action.id);\n }}\n aria-label={ariaLabel}\n >\n {label}\n </Button>\n );\n }\n\n return null;\n })}\n </div>\n );\n }, [tApp, visibleActions]);\n\n const activeFormAction = listActions.find((action) => {\n return action.id === activeFormActionId;\n });\n\n return (\n <>\n <BackofficeEntityListScaffold\n config={config}\n state={state}\n pushState={pushState}\n headerActions={headerActions}\n rows={rows}\n columns={columns}\n gridTemplateColumns={gridTemplateColumns}\n getRowId={getRowId}\n hasNextPage={nextCursor != null}\n isLoadingMore={isLoadingMore}\n onLoadMore={handleLoadMore}\n onRefresh={handleRefresh}\n totalCount={null}\n />\n {activeFormAction != null && isFormMutationAction(activeFormAction) && (\n <LazyBackofficeEntityActionFormDialog\n isOpen\n action={activeFormAction}\n node={null}\n onClose={() => {\n setActiveFormActionId(null);\n }}\n onSuccess={handleRefresh}\n />\n )}\n </>\n );\n};\n\nexport const BackofficeEntityListPage = ({\n entityManifest,\n config,\n prepared,\n}: BackofficeEntityListPageProps): JSX.Element \| null => {\n const { t: tApp } = useTranslation();\n const breadcrumb = buildEntityListBreadcrumb(config, tApp);\n\n if (isRecordListConfig(config)) {\n return (\n <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n <BackofficeEntityRecordListPage\n entityManifest={entityManifest}\n config={config}\n prepared={prepared}\n />\n </BackofficeRightPageLayout>\n );\n }\n const listConfig = config.list;\n if (listConfig.kind === 'records') {\n return null;\n }\n\n const { t } = useBackofficeReactTranslation();\n const { entities } = useBackofficeConfig();\n const [activeFormActionId, setActiveFormActionId] = useState<string \| null>(\n null,\n );\n\n const queryData = usePreloadedQuery(listConfig.query, prepared.query);\n const {\n data: fragmentData,\n loadNext,\n hasNext,\n isLoadingNext,\n refetch,\n } = usePaginationFragment(listConfig.fragment, queryData as never);\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 { columns, gridTemplateColumns } = useMemo((): {\n columns: readonly DataTableColumn<unknown>[];\n gridTemplateColumns?: string;\n } => {\n const baseColumns = buildDataTableColumns(listConfig.columns, {\n tApp,\n t,\n resolveEntityHref: (entityId, refId) => {\n const entityManifest = entities[entityId];\n if (entityManifest == null) {\n return null;\n }\n return entityManifest.routes.detail(refId);\n },\n });\n const actionsColumn = buildActionsColumn({\n ariaLabel: t('actions.view'),\n fallback: t('common.notAvailable'),\n className: pageStyles.actionsColumnCell,\n resolveDetailHref: (id) => {\n return config.routes.detail(id);\n },\n renderAction: ({ href, ariaLabel }) => {\n return (\n <TableCell.Actions>\n <span className={pageStyles.actionTrigger} title={ariaLabel}>\n <LinkButton\n to={href}\n variant=\"icon\"\n size=\"small\"\n aria-label={ariaLabel}\n >\n <EyeSvg width={16} height={16} />\n </LinkButton>\n </span>\n </TableCell.Actions>\n );\n },\n });\n const allColumns = [...baseColumns, actionsColumn];\n return applyListEdgeColumns(allColumns, listConfig.rowFlags, 1, tApp);\n }, [\n config.routes,\n listConfig.columns,\n listConfig.rowFlags,\n entities,\n t,\n tApp,\n ]);\n\n const getRowId = useCallback<GetRowId<unknown>>(\n (row) => {\n return listConfig.getRowId(row);\n },\n [listConfig],\n );\n\n const { state, pushState } = useBackofficeListUrlState(config);\n const listDefaults = config.listDefaults ??\n listConfig.defaultState ?? { where: null, sort: null };\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\n const { 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 buildVariables: listConfig.buildVariables,\n });\n\n const handleLoadMore = useBackofficeLoadMore({\n hasNext,\n isLoadingNext,\n loadNext,\n count: pageSize,\n });\n\n const listActions = useMemo(() => {\n return config.listActions ?? [];\n }, [config.listActions]);\n const visibleActions = useMemo(() => {\n return listActions.filter((action) => {\n if (action.isVisible == null) {\n return true;\n }\n return action.isVisible(null);\n });\n }, [listActions]);\n\n const headerActions = useMemo(() => {\n if (visibleActions.length === 0) {\n return undefined;\n }\n return (\n <div className={pageStyles.headerActions}>\n {visibleActions.map((action, index) => {\n const { variant: actionVariant } = action;\n const label = resolveLabel(action.label, tApp);\n let ariaLabel = label;\n if (action.ariaLabel != null) {\n ariaLabel = resolveLabel(action.ariaLabel, tApp);\n }\n const variant = resolveActionVariant(actionVariant, index);\n const size = action.size ?? 'small';\n const isDisabled = action.isDisabled?.(null) === true;\n\n if (isRouteAction(action)) {\n const href = action.to(null);\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 >\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 disabled={isDisabled}\n onClick={() => {\n setActiveFormActionId(action.id);\n }}\n aria-label={ariaLabel}\n >\n {label}\n </Button>\n );\n }\n\n return null;\n })}\n </div>\n );\n }, [tApp, visibleActions]);\n\n const activeFormAction = listActions.find((action) => {\n return action.id === activeFormActionId;\n });\n\n return (\n <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n <BackofficeEntityListScaffold\n config={config}\n state={state}\n pushState={pushState}\n headerActions={headerActions}\n rows={rows}\n columns={columns}\n gridTemplateColumns={gridTemplateColumns}\n getRowId={getRowId}\n hasNextPage={hasNext}\n isLoadingMore={isLoadingNext}\n onLoadMore={handleLoadMore}\n onRefresh={onRefresh}\n totalCount={connection.totalCount ?? null}\n />\n {activeFormAction != null && isFormMutationAction(activeFormAction) && (\n <LazyBackofficeEntityActionFormDialog\n isOpen\n action={activeFormAction}\n node={null}\n onClose={() => {\n setActiveFormActionId(null);\n }}\n onSuccess={onRefresh}\n />\n )}\n </BackofficeRightPageLayout>\n );\n};\n\nexport default BackofficeEntityListPage;\n"],"mappings":"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"}
1	+ {"version":3,"file":"BackofficeEntityListPage-dyE4er_s.js","names":[],"sources":["../../src/components/backoffice/list/RowFlagsCell.css.ts","../../src/components/backoffice/list/RowFlagsCell.tsx","../../src/pages/backofficeEntityListPage.css.ts","../../src/pages/BackofficeEntityListPage.helpers.tsx","../../src/pages/BackofficeEntityListPage.tsx"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nexport const rowFlagsColumnCell = style({\n justifyContent: 'center',\n padding: '0 4px',\n});\n\nexport const container = style({\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n gap: 6,\n width: '100%',\n});\n\nexport const flag = style({\n display: 'grid',\n placeItems: 'center',\n width: 24,\n height: 24,\n});\n","import { useMemo, type JSX, type ReactNode } from 'react';\nimport type { TFunction } from 'i18next';\n\nimport type { BackofficeRowFlagSpec } from '@plumile/backoffice-core/types.js';\n\nimport * as styles from './RowFlagsCell.css.js';\n\nexport type RowFlagsCellProps<Row> = {\n row: Row;\n flags: readonly BackofficeRowFlagSpec<Row>[];\n tApp: TFunction;\n};\n\n/*\n Renders row-level flags (icons) in a dedicated compact column.\n /\nexport const RowFlagsCell = <Row,>({\n row,\n flags,\n tApp,\n}: RowFlagsCellProps<Row>): JSX.Element => {\n const resolved = useMemo(() => {\n const out: { id: string; node: ReactNode; label: string }[] = [];\n for (const flag of flags) {\n const node = flag.render(row) as ReactNode;\n if (node != null && node !== '' && node !== false) {\n out.push({ id: flag.id, node, label: flag.label(row)(tApp) });\n }\n }\n return out;\n }, [flags, row, tApp]);\n\n const ariaLabel = resolved\n .map((entry) => {\n return entry.label.trim();\n })\n .filter((label) => {\n return label !== '';\n })\n .join(', ');\n\n let ariaLabelProp: string \| undefined;\n if (ariaLabel !== '') {\n ariaLabelProp = ariaLabel;\n }\n\n return (\n <div className={styles.container} aria-label={ariaLabelProp}>\n {resolved.map((entry) => {\n return (\n <span\n key={entry.id}\n className={styles.flag}\n title={entry.label}\n role=\"img\"\n aria-label={entry.label}\n >\n {entry.node}\n </span>\n );\n })}\n </div>\n );\n};\n","import { style } from '@vanilla-extract/css';\nimport { sprinkles } from '@plumile/ui';\n\nexport const headerActions = sprinkles({\n display: 'flex',\n alignItems: 'center',\n gap: 2,\n flexWrap: 'wrap',\n});\n\nexport const actionsColumnCell = style({\n justifyContent: 'flex-end',\n});\n\nexport const actionTrigger = style({\n display: 'inline-flex',\n alignItems: 'center',\n justifyContent: 'center',\n width: '2rem',\n height: '2rem',\n flexShrink: 0,\n});\n","import type { ComponentProps, JSX } from 'react';\n\nimport type {\n BackofficeEntityFormMutationActionSpec,\n BackofficeEntityRouteActionSpec,\n BackofficeListActionSpec,\n BackofficeRecordListConfig,\n BackofficeResolvedListFacetConfig,\n I18nLabel,\n} from '@plumile/backoffice-core/types.js';\nimport type { Button, DataTableColumn } from '@plumile/ui';\nimport type { TFunction } from 'i18next';\n\nimport type { BackofficeSizedDataTableColumn } from '../components/backoffice/columns/buildDataTableColumns.js';\n\ntype ButtonVariant = ComponentProps<typeof Button>['variant'];\n\nconst ROW_FLAGS_SLOT_PX = 24;\nconst ROW_FLAGS_GAP_PX = 6;\nconst ROW_FLAGS_PADDING_X_PX = 4;\n\nconst ACTIONS_SLOT_PX = 32;\nconst ACTIONS_GAP_PX = 8;\nconst ACTIONS_PADDING_X_PX = 12;\nconst ACTIONS_SAFETY_PX = 4;\n\nconst listColumnTrackBySize: Record<\n BackofficeSizedDataTableColumn<unknown>['size'],\n string\n> = {\n xs: 'minmax(56px, 76px)',\n s: 'minmax(88px, 120px)',\n m: 'minmax(120px, 168px)',\n l: 'minmax(160px, 220px)',\n xl: 'minmax(220px, 300px)',\n fluid: 'minmax(0, 1fr)',\n};\n\nexport const computeRowFlagsColumnWidthPx = (flagCount: number): number => {\n if (flagCount <= 0) {\n return 0;\n }\n return (\n ROW_FLAGS_PADDING_X_PX 2 +\n ROW_FLAGS_SLOT_PX * flagCount +\n ROW_FLAGS_GAP_PX * Math.max(0, flagCount - 1)\n );\n};\n\nexport const computeActionsColumnWidthPx = (actionCount: number): number => {\n if (actionCount <= 0) {\n return 0;\n }\n return (\n ACTIONS_SAFETY_PX +\n ACTIONS_PADDING_X_PX * 2 +\n ACTIONS_SLOT_PX * actionCount +\n ACTIONS_GAP_PX * Math.max(0, actionCount - 1)\n );\n};\n\nexport const resolveTrackBySize = (\n column: DataTableColumn<unknown>,\n fallback: string,\n): string => {\n if ('size' in column && typeof column.size === 'string') {\n return listColumnTrackBySize[\n column.size as BackofficeSizedDataTableColumn<unknown>['size']\n ];\n }\n return fallback;\n};\n\nexport const isRouteAction = (\n action: BackofficeListActionSpec,\n): action is BackofficeEntityRouteActionSpec<null> => {\n return action.kind === 'route';\n};\n\nexport const isFormMutationAction = (\n action: BackofficeListActionSpec,\n): action is BackofficeEntityFormMutationActionSpec<null> => {\n return action.kind === 'formMutation';\n};\n\nexport const resolveActionVariant = (\n actionVariant: ButtonVariant \| undefined,\n index: number,\n): Exclude<ButtonVariant, undefined> => {\n if (actionVariant != null) {\n return actionVariant;\n }\n if (index === 0) {\n return 'primary';\n }\n return 'secondary';\n};\n\nexport const resolveRowId = (row: unknown): string \| null => {\n if (row == null \|\| typeof row !== 'object') {\n return null;\n }\n if (!('id' in row)) {\n return null;\n }\n const value = (row as { id?: unknown }).id;\n if (typeof value !== 'string') {\n return null;\n }\n const trimmed = value.trim();\n if (trimmed === '') {\n return null;\n }\n return trimmed;\n};\n\ntype RecordListConfig = BackofficeResolvedListFacetConfig & {\n list: BackofficeRecordListConfig<\n Record<string, unknown>,\n string,\n unknown,\n unknown,\n unknown,\n unknown,\n Record<string, unknown>\n >;\n};\n\nexport const isRecordListConfig = (\n config: BackofficeResolvedListFacetConfig,\n): config is RecordListConfig => {\n return config.list.kind === 'records';\n};\n\nexport const resolveLabel = (label: I18nLabel, tApp: TFunction): string => {\n return label(tApp);\n};\n\nexport const buildActionsColumn = (options: {\n ariaLabel: string;\n fallback: string;\n resolveDetailHref: (id: string) => string \| null;\n className?: string;\n renderAction: (input: { href: string; ariaLabel: string }) => JSX.Element;\n}): DataTableColumn<unknown> => {\n const { ariaLabel, fallback, resolveDetailHref, className, renderAction } =\n options;\n\n return {\n id: 'actions',\n header: '',\n className,\n mobileRole: 'action',\n cell: (row) => {\n const id = resolveRowId(row);\n if (id == null) {\n return fallback;\n }\n const href = resolveDetailHref(id);\n if (href == null) {\n return fallback;\n }\n return renderAction({ href, ariaLabel });\n },\n };\n};\n","/* eslint-disable react-hooks/rules-of-hooks /\nimport {\n type JSX,\n useCallback,\n useEffect,\n useMemo,\n useRef,\n useState,\n} from 'react';\nimport type { TFunction } from 'i18next';\nimport { useTranslation } from 'react-i18next';\nimport {\n useFragment,\n usePaginationFragment,\n usePreloadedQuery,\n useRelayEnvironment,\n} from 'react-relay';\nimport { fetchQuery } 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 {\n BackofficeEntityManifestItem,\n BackofficePreparedListRoute,\n BackofficeResolvedListFacetConfig,\n BackofficeRowFlagSpec,\n} from '@plumile/backoffice-core/types.js';\nimport {\n Button,\n EyeSvg,\n LinkButton,\n TableCell,\n type DataTableColumn,\n type GetRowId,\n} from '@plumile/ui';\nimport { BackofficeEntityListScaffold } from '../components/backoffice/scaffolds/BackofficeEntityListScaffold.js';\nimport { LazyBackofficeEntityActionFormDialog } from '../components/backoffice/actions/LazyBackofficeEntityActionFormDialog.js';\nimport { buildDataTableColumns } from '../components/backoffice/columns/buildDataTableColumns.js';\nimport { RowFlagsCell } from '../components/backoffice/list/RowFlagsCell.js';\nimport { useBackofficeListUrlState } from '../hooks/useBackofficeListUrlState.js';\nimport { useBackofficeLoadMore } from '../hooks/useBackofficeLoadMore.js';\nimport { useBackofficeListRefetch } from '../hooks/useBackofficeListRefetch.js';\nimport { useBackofficeReactTranslation } from '../i18n/useBackofficeReactTranslation.js';\nimport { useBackofficeConfig } from '../provider/BackofficeConfigContext.js';\nimport as pageStyles from './backofficeEntityListPage.css.js';\nimport { rowFlagsColumnCell } from '../components/backoffice/list/RowFlagsCell.css.js';\nimport { BackofficeRightPageLayout } from '../components/backoffice/layout/breadcrumb/BackofficeRightPageLayout.js';\nimport { buildEntityListBreadcrumb } from '../components/backoffice/layout/breadcrumb/buildBreadcrumbs.js';\nimport {\n buildActionsColumn,\n computeActionsColumnWidthPx,\n computeRowFlagsColumnWidthPx,\n isFormMutationAction,\n isRecordListConfig,\n isRouteAction,\n resolveLabel,\n resolveActionVariant,\n resolveTrackBySize,\n} from './BackofficeEntityListPage.helpers.js';\n\nexport type BackofficeEntityListPageProps = {\n entityManifest: BackofficeEntityManifestItem;\n config: BackofficeResolvedListFacetConfig;\n prepared: BackofficePreparedListRoute;\n};\n\ntype RecordFetchMode = 'append' \| 'reset';\ntype RecordFetchInput = {\n where: Record<string, unknown> \| null;\n sort: string \| null;\n count: number;\n cursor: string \| null;\n mode: RecordFetchMode;\n};\n\nconst RECORD_FETCH_POLICY = 'store-or-network' as const;\n\nconst applyListEdgeColumns = <Row,>(\n inputColumns: readonly DataTableColumn<Row>[],\n rowFlags: readonly BackofficeRowFlagSpec<Row>[] \| undefined,\n actionCount: number,\n tApp: TFunction,\n): {\n columns: readonly DataTableColumn<Row>[];\n gridTemplateColumns?: string;\n} => {\n const hasFlags = rowFlags != null && rowFlags.length > 0;\n\n let columns = inputColumns;\n if (hasFlags) {\n const flagsColumn: DataTableColumn<Row> = {\n id: '__rowFlags',\n header: '',\n className: rowFlagsColumnCell,\n mobileRole: 'badge',\n cell: (row) => {\n return <RowFlagsCell row={row} flags={rowFlags} tApp={tApp} />;\n },\n };\n\n // Ensure we never pick the flags column as \"primary\".\n const withFlags = [flagsColumn, ...inputColumns];\n const hasPrimary = withFlags.some((col) => {\n return col.isPrimary === true;\n });\n\n columns = withFlags;\n if (!hasPrimary) {\n columns = withFlags.map((col, index) => {\n if (index === 1) {\n return { ...col, isPrimary: true };\n }\n return col;\n });\n }\n }\n\n let flagCount = 0;\n if (hasFlags) {\n flagCount = rowFlags.length;\n }\n const flagsWidthPx = computeRowFlagsColumnWidthPx(flagCount);\n const actionsWidthPx = computeActionsColumnWidthPx(actionCount);\n\n // We always include the right-side \"actions\" column in list pages.\n let leftColumnCount = 0;\n if (hasFlags) {\n leftColumnCount = 1;\n }\n const middleCount = columns.length - leftColumnCount - 1;\n\n const middleTracks = columns\n .slice(leftColumnCount, leftColumnCount + Math.max(0, middleCount))\n .map((column) => {\n return resolveTrackBySize(column as DataTableColumn<unknown>, '1fr');\n })\n .join(' ');\n\n let gridTemplateColumns = '';\n if (hasFlags) {\n gridTemplateColumns = `${flagsWidthPx}px ${middleTracks} ${actionsWidthPx}px`;\n } else {\n gridTemplateColumns = `${middleTracks} ${actionsWidthPx}px`;\n }\n\n return { columns, gridTemplateColumns };\n};\n\nconst BackofficeEntityRecordListPage = ({\n config,\n prepared,\n}: BackofficeEntityListPageProps): JSX.Element \| null => {\n const { t: tApp } = useTranslation();\n const { t } = useBackofficeReactTranslation();\n const { entities } = useBackofficeConfig();\n const [activeFormActionId, setActiveFormActionId] = useState<string \| null>(\n null,\n );\n const environment = useRelayEnvironment();\n\n if (!isRecordListConfig(config)) {\n return null;\n }\n\n const listConfig = config.list;\n const listDefaults = config.listDefaults ??\n listConfig.defaultState ?? { where: null, sort: null };\n const queryData = usePreloadedQuery(listConfig.query, prepared.query);\n const fragmentData = useFragment(listConfig.fragment, queryData as never);\n\n const initialRows = useMemo(() => {\n return listConfig.getRows(fragmentData).map((row) => {\n return listConfig.toRow(row);\n });\n }, [fragmentData, listConfig]);\n\n const initialCursor = useMemo(() => {\n return listConfig.getNextCursor?.(queryData) ?? null;\n }, [listConfig, queryData]);\n\n const [rows, setRows] = useState(initialRows);\n const [nextCursor, setNextCursor] = useState(initialCursor);\n const [isLoadingMore, setIsLoadingMore] = useState(false);\n const [isRefreshing, setIsRefreshing] = useState(false);\n\n useEffect(() => {\n setRows(initialRows);\n setNextCursor(initialCursor);\n }, [initialCursor, initialRows]);\n\n const { columns, gridTemplateColumns } = useMemo((): {\n columns: readonly DataTableColumn<unknown>[];\n gridTemplateColumns?: string;\n } => {\n const baseColumns = buildDataTableColumns(listConfig.columns, {\n tApp,\n t,\n resolveEntityHref: (entityId, refId) => {\n const entityManifest = entities[entityId];\n if (entityManifest == null) {\n return null;\n }\n return entityManifest.routes.detail(refId);\n },\n });\n const actionsColumn = buildActionsColumn({\n ariaLabel: t('actions.view'),\n fallback: t('common.notAvailable'),\n className: pageStyles.actionsColumnCell,\n resolveDetailHref: (id) => {\n return config.routes.detail(id);\n },\n renderAction: ({ href, ariaLabel }) => {\n return (\n <TableCell.Actions>\n <span className={pageStyles.actionTrigger} title={ariaLabel}>\n <LinkButton\n to={href}\n variant=\"icon\"\n size=\"small\"\n aria-label={ariaLabel}\n >\n <EyeSvg width={16} height={16} />\n </LinkButton>\n </span>\n </TableCell.Actions>\n );\n },\n });\n const allColumns = [...baseColumns, actionsColumn];\n return applyListEdgeColumns(allColumns, listConfig.rowFlags, 1, tApp);\n }, [\n config.routes,\n listConfig.columns,\n listConfig.rowFlags,\n entities,\n t,\n tApp,\n ]);\n\n const getRowId = useCallback<GetRowId<unknown>>(\n (row) => {\n return listConfig.getRowId(row);\n },\n [listConfig],\n );\n\n const { state, pushState } = useBackofficeListUrlState(config);\n const resolvedSort = state.sort ?? listDefaults.sort;\n const { pageSize } = BACKOFFICE_LIST_DEFAULTS;\n\n const buildVariables = useCallback(\n (input: {\n where: Record<string, unknown> \| null;\n sort: string \| null;\n count: number;\n cursor: string \| null;\n }) => {\n if (listConfig.buildVariables != null) {\n return listConfig.buildVariables(input);\n }\n return input;\n },\n [listConfig],\n );\n\n const requestIdRef = useRef(0);\n const lastRefetchKeyRef = useRef(\n stableListVariablesKey({\n where: listDefaults.where,\n sort: listDefaults.sort,\n count: pageSize,\n }),\n );\n\n const runFetch = useCallback(\n async (input: RecordFetchInput) => {\n const requestId = requestIdRef.current + 1;\n requestIdRef.current = requestId;\n\n if (input.mode === 'append') {\n setIsLoadingMore(true);\n } else {\n setIsRefreshing(true);\n }\n\n try {\n const variables = buildVariables({\n where: input.where,\n sort: input.sort,\n count: input.count,\n cursor: input.cursor,\n });\n\n const response = await fetchQuery(\n environment,\n listConfig.query,\n variables as never,\n { fetchPolicy: RECORD_FETCH_POLICY },\n ).toPromise();\n\n if (response == null \|\| requestIdRef.current !== requestId) {\n return;\n }\n\n const nextRows = listConfig.getRows(response as never).map((row) => {\n return listConfig.toRow(row);\n });\n setRows((prev) => {\n if (input.mode === 'append') {\n return [...prev, ...nextRows];\n }\n return nextRows;\n });\n const cursor = listConfig.getNextCursor?.(response) ?? null;\n setNextCursor(cursor);\n } finally {\n if (input.mode === 'append') {\n setIsLoadingMore(false);\n } else {\n setIsRefreshing(false);\n }\n }\n },\n [buildVariables, environment, listConfig],\n );\n\n useEffect(() => {\n const key = stableListVariablesKey({\n where: state.where,\n sort: resolvedSort,\n count: pageSize,\n });\n if (lastRefetchKeyRef.current === key) {\n return;\n }\n lastRefetchKeyRef.current = key;\n runFetch({\n where: state.where,\n sort: resolvedSort,\n count: pageSize,\n cursor: null,\n mode: 'reset',\n }).catch(() => {});\n }, [pageSize, resolvedSort, runFetch, state.where]);\n\n const handleRefresh = useCallback(() => {\n if (isRefreshing) {\n return;\n }\n runFetch({\n where: state.where,\n sort: resolvedSort,\n count: pageSize,\n cursor: null,\n mode: 'reset',\n }).catch(() => {});\n }, [isRefreshing, pageSize, resolvedSort, runFetch, state.where]);\n\n const handleLoadMore = useBackofficeLoadMore({\n hasNext: nextCursor != null,\n isLoadingNext: isLoadingMore,\n loadNext: (count) => {\n if (nextCursor == null) {\n return;\n }\n runFetch({\n where: state.where,\n sort: resolvedSort,\n count,\n cursor: nextCursor,\n mode: 'append',\n }).catch(() => {});\n },\n count: pageSize,\n });\n\n const listActions = useMemo(() => {\n return config.listActions ?? [];\n }, [config.listActions]);\n const visibleActions = useMemo(() => {\n return listActions.filter((action) => {\n if (action.isVisible == null) {\n return true;\n }\n return action.isVisible(null);\n });\n }, [listActions]);\n\n const headerActions = useMemo(() => {\n if (visibleActions.length === 0) {\n return undefined;\n }\n return (\n <div className={pageStyles.headerActions}>\n {visibleActions.map((action, index) => {\n const { variant: actionVariant } = action;\n const label = resolveLabel(action.label, tApp);\n let ariaLabel = label;\n if (action.ariaLabel != null) {\n ariaLabel = resolveLabel(action.ariaLabel, tApp);\n }\n const variant = resolveActionVariant(actionVariant, index);\n const size = action.size ?? 'small';\n const isDisabled = action.isDisabled?.(null) === true;\n\n if (isRouteAction(action)) {\n const href = action.to(null);\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 >\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 disabled={isDisabled}\n onClick={() => {\n setActiveFormActionId(action.id);\n }}\n aria-label={ariaLabel}\n >\n {label}\n </Button>\n );\n }\n\n return null;\n })}\n </div>\n );\n }, [tApp, visibleActions]);\n\n const activeFormAction = listActions.find((action) => {\n return action.id === activeFormActionId;\n });\n\n return (\n <>\n <BackofficeEntityListScaffold\n config={config}\n state={state}\n pushState={pushState}\n headerActions={headerActions}\n rows={rows}\n columns={columns}\n gridTemplateColumns={gridTemplateColumns}\n getRowId={getRowId}\n hasNextPage={nextCursor != null}\n isLoadingMore={isLoadingMore}\n onLoadMore={handleLoadMore}\n onRefresh={handleRefresh}\n totalCount={null}\n />\n {activeFormAction != null && isFormMutationAction(activeFormAction) && (\n <LazyBackofficeEntityActionFormDialog\n isOpen\n action={activeFormAction}\n node={null}\n onClose={() => {\n setActiveFormActionId(null);\n }}\n onSuccess={handleRefresh}\n />\n )}\n </>\n );\n};\n\nexport const BackofficeEntityListPage = ({\n entityManifest,\n config,\n prepared,\n}: BackofficeEntityListPageProps): JSX.Element \| null => {\n const { t: tApp } = useTranslation();\n const breadcrumb = buildEntityListBreadcrumb(config, tApp);\n\n if (isRecordListConfig(config)) {\n return (\n <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n <BackofficeEntityRecordListPage\n entityManifest={entityManifest}\n config={config}\n prepared={prepared}\n />\n </BackofficeRightPageLayout>\n );\n }\n const listConfig = config.list;\n if (listConfig.kind === 'records') {\n return null;\n }\n\n const { t } = useBackofficeReactTranslation();\n const { entities } = useBackofficeConfig();\n const [activeFormActionId, setActiveFormActionId] = useState<string \| null>(\n null,\n );\n\n const queryData = usePreloadedQuery(listConfig.query, prepared.query);\n const {\n data: fragmentData,\n loadNext,\n hasNext,\n isLoadingNext,\n refetch,\n } = usePaginationFragment(listConfig.fragment, queryData as never);\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 { columns, gridTemplateColumns } = useMemo((): {\n columns: readonly DataTableColumn<unknown>[];\n gridTemplateColumns?: string;\n } => {\n const baseColumns = buildDataTableColumns(listConfig.columns, {\n tApp,\n t,\n resolveEntityHref: (entityId, refId) => {\n const entityManifest = entities[entityId];\n if (entityManifest == null) {\n return null;\n }\n return entityManifest.routes.detail(refId);\n },\n });\n const actionsColumn = buildActionsColumn({\n ariaLabel: t('actions.view'),\n fallback: t('common.notAvailable'),\n className: pageStyles.actionsColumnCell,\n resolveDetailHref: (id) => {\n return config.routes.detail(id);\n },\n renderAction: ({ href, ariaLabel }) => {\n return (\n <TableCell.Actions>\n <span className={pageStyles.actionTrigger} title={ariaLabel}>\n <LinkButton\n to={href}\n variant=\"icon\"\n size=\"small\"\n aria-label={ariaLabel}\n >\n <EyeSvg width={16} height={16} />\n </LinkButton>\n </span>\n </TableCell.Actions>\n );\n },\n });\n const allColumns = [...baseColumns, actionsColumn];\n return applyListEdgeColumns(allColumns, listConfig.rowFlags, 1, tApp);\n }, [\n config.routes,\n listConfig.columns,\n listConfig.rowFlags,\n entities,\n t,\n tApp,\n ]);\n\n const getRowId = useCallback<GetRowId<unknown>>(\n (row) => {\n return listConfig.getRowId(row);\n },\n [listConfig],\n );\n\n const { state, pushState } = useBackofficeListUrlState(config);\n const listDefaults = config.listDefaults ??\n listConfig.defaultState ?? { where: null, sort: null };\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\n const { 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 buildVariables: listConfig.buildVariables,\n });\n\n const handleLoadMore = useBackofficeLoadMore({\n hasNext,\n isLoadingNext,\n loadNext,\n count: pageSize,\n });\n\n const listActions = useMemo(() => {\n return config.listActions ?? [];\n }, [config.listActions]);\n const visibleActions = useMemo(() => {\n return listActions.filter((action) => {\n if (action.isVisible == null) {\n return true;\n }\n return action.isVisible(null);\n });\n }, [listActions]);\n\n const headerActions = useMemo(() => {\n if (visibleActions.length === 0) {\n return undefined;\n }\n return (\n <div className={pageStyles.headerActions}>\n {visibleActions.map((action, index) => {\n const { variant: actionVariant } = action;\n const label = resolveLabel(action.label, tApp);\n let ariaLabel = label;\n if (action.ariaLabel != null) {\n ariaLabel = resolveLabel(action.ariaLabel, tApp);\n }\n const variant = resolveActionVariant(actionVariant, index);\n const size = action.size ?? 'small';\n const isDisabled = action.isDisabled?.(null) === true;\n\n if (isRouteAction(action)) {\n const href = action.to(null);\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 >\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 disabled={isDisabled}\n onClick={() => {\n setActiveFormActionId(action.id);\n }}\n aria-label={ariaLabel}\n >\n {label}\n </Button>\n );\n }\n\n return null;\n })}\n </div>\n );\n }, [tApp, visibleActions]);\n\n const activeFormAction = listActions.find((action) => {\n return action.id === activeFormActionId;\n });\n\n return (\n <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n <BackofficeEntityListScaffold\n config={config}\n state={state}\n pushState={pushState}\n headerActions={headerActions}\n rows={rows}\n columns={columns}\n gridTemplateColumns={gridTemplateColumns}\n getRowId={getRowId}\n hasNextPage={hasNext}\n isLoadingMore={isLoadingNext}\n onLoadMore={handleLoadMore}\n onRefresh={onRefresh}\n totalCount={connection.totalCount ?? null}\n />\n {activeFormAction != null && isFormMutationAction(activeFormAction) && (\n <LazyBackofficeEntityActionFormDialog\n isOpen\n action={activeFormAction}\n node={null}\n onClose={() => {\n setActiveFormActionId(null);\n }}\n onSuccess={onRefresh}\n />\n )}\n </BackofficeRightPageLayout>\n );\n};\n\nexport default BackofficeEntityListPage;\n"],"mappings":"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"}

package/lib/esm/BackofficeHubPage-D2k0ZO6c.js ADDED Viewed

@@ -0,0 +1,136 @@
+import { r as e, t } from "./useBackofficeReactTranslation-Btt58EIo.js";
+import { o as n } from "./sidebarUtils-BZETlHea.js";
+import { t as r } from "./BackofficeRightPageLayout-BZb7LhT-.js";
+import { i } from "./buildBreadcrumbs-C9cyiXb7.js";
+import { n as a } from "./BackofficePermissionsContext-CmWwudBU.js";
+import { useMemo as o, useState as s } from "react";
+import { useTranslation as c } from "react-i18next";
+import { Link as l } from "@plumile/router";
+import { DetailPageTemplate as u, Input as d, SidebarTasksSvg as f } from "@plumile/ui";
+import { jsx as p, jsxs as m } from "react/jsx-runtime";
+//#region src/pages/backofficeHubPage.css.ts
+var h = "txvbqb9ip txvbqbai7 txvbqbaoy", g = "txvbqb9ip txvbqbai7 txvbqbap7", _ = "txvbqb9ip txvbqbai7 txvbqbaog", v = "txvbqb9ip txvbqbai7 txvbqbany", y = "txvbqb9g txvbqbamp txvbqbv9z", b = "txvbqb9iy txvbqbc1g txvbqbaog", x = "_1myhzvp0 txvbqb9ip txvbqbai7 txvbqbao7 txvbqblbg txvbqb1rp txvbqb1cp txvbqb1qg txvbqbwp txvbqbv41 txvbqbv9z txvbqb3b", S = "txvbqb9ip txvbqbcp txvbqbao7", C = "txvbqb9jg txvbqbcp txvbqbva3", w = "txvbqbamp", T = "txvbqbva3 txvbqb8y", E = "txvbqblbp txvbqb1rp txvbqb1cp txvbqb1qg txvbqbwp txvbqbv45 txvbqbva3", D = (e) => {
+	let { entity: t, kind: n, permissions: r, sidebar: i } = e;
+	return t == null || n === "entity" && t.kind !== "tool" && !t.hasList ? !1 : i?.isItemVisible?.({
+		kind: n,
+		id: t.id
+	}, r) !== !1;
+}, O = ({ prepared: O }) => {
+	let { t: k } = c(), { t: A } = t(), { entities: j, sidebar: M } = e(), N = a(), [P, F] = s(""), { hub: I } = O, L = n(I.title, k), R;
+	I.description != null && (R = n(I.description, k));
+	let z = i({
+		id: I.id,
+		title: L
+	}), B = P.trim().toLowerCase(), V = I.search?.enabled !== !1, H = A("hub.search.placeholder");
+	I.search?.placeholder != null && (H = n(I.search.placeholder, k));
+	let U = o(() => I.groups.map((e) => {
+		let t = e.items.map((e) => {
+			let t = j[e.id];
+			if (t == null || !D({
+				entity: t,
+				kind: e.kind,
+				permissions: N,
+				sidebar: M
+			})) return null;
+			let r = t, i = n(r.label, k);
+			return B !== "" && !i.toLowerCase().includes(B) ? null : {
+				id: e.id,
+				kind: e.kind,
+				label: i,
+				href: r.routes.list,
+				icon: /* @__PURE__ */ p(f, {
+					width: 18,
+					height: 18,
+					"aria-hidden": "true"
+				})
+			};
+		}).filter((e) => e != null), r = null;
+		return e.description != null && (r = n(e.description, k)), {
+			id: e.id,
+			title: n(e.title, k),
+			description: r,
+			items: t
+		};
+	}).filter((e) => e.items.length > 0), [
+		j,
+		I.groups,
+		B,
+		N,
+		M,
+		k
+	]), W = A("hub.empty.title");
+	I.emptyState?.title != null && (W = n(I.emptyState.title, k));
+	let G = A("hub.empty.description");
+	I.emptyState?.description != null && (G = n(I.emptyState.description, k));
+	let K = A("hub.subtitle");
+	R != null && (K = R);
+	let q;
+	return q = U.length === 0 ? /* @__PURE__ */ m("div", {
+		className: E,
+		children: [/* @__PURE__ */ p("strong", { children: W }), /* @__PURE__ */ p("div", { children: G })]
+	}) : /* @__PURE__ */ p("div", {
+		className: g,
+		children: U.map((e) => /* @__PURE__ */ m("section", {
+			className: _,
+			children: [/* @__PURE__ */ m("div", {
+				className: v,
+				children: [/* @__PURE__ */ p("h2", {
+					className: y,
+					children: e.title
+				}), e.description != null && /* @__PURE__ */ p("div", {
+					className: "txvbqbva3 txvbqb8y",
+					children: e.description
+				})]
+			}), /* @__PURE__ */ p("div", {
+				className: b,
+				children: e.items.map((e) => {
+					let t = A("hub.itemKinds.entity");
+					return e.kind === "tool" && (t = A("hub.itemKinds.tool")), /* @__PURE__ */ m(l, {
+						to: e.href,
+						className: x,
+						children: [/* @__PURE__ */ m("span", {
+							className: S,
+							children: [/* @__PURE__ */ p("span", {
+								className: C,
+								children: e.icon
+							}), /* @__PURE__ */ p("span", {
+								className: w,
+								children: e.label
+							})]
+						}), /* @__PURE__ */ p("span", {
+							className: T,
+							children: t
+						})]
+					}, `${e.kind}-${e.id}`);
+				})
+			})]
+		}, e.id))
+	}), /* @__PURE__ */ p(r, {
+		breadcrumb: z,
+		children: /* @__PURE__ */ p(u, {
+			header: {
+				title: L,
+				subtitle: K
+			},
+			children: /* @__PURE__ */ m("div", {
+				className: h,
+				children: [V && /* @__PURE__ */ p("div", {
+					className: "txvbqbjbp",
+					children: /* @__PURE__ */ p(d, {
+						value: P,
+						onChange: (e) => {
+							F(e.target.value);
+						},
+						placeholder: H,
+						"aria-label": H,
+						fullWidth: !0
+					})
+				}), q]
+			})
+		})
+	});
+};
+//#endregion
+export { O as BackofficeHubPage, O as default };
+//# sourceMappingURL=BackofficeHubPage-D2k0ZO6c.js.map

package/lib/esm/BackofficeHubPage-D2k0ZO6c.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"BackofficeHubPage-D2k0ZO6c.js","names":[],"sources":["../../src/pages/backofficeHubPage.css.ts","../../src/pages/BackofficeHubPage.tsx"],"sourcesContent":["import { style } from '@vanilla-extract/css';\n\nimport { sprinkles, vars } from '@plumile/ui';\n\nexport const content = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 5,\n});\n\nexport const search = sprinkles({\n maxWidth: '2xl',\n});\n\nexport const groups = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 6,\n});\n\nexport const group = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 3,\n});\n\nexport const groupHeader = sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 1,\n});\n\nexport const groupTitle = sprinkles({\n fontSize: 'lg',\n fontWeight: 'semibold',\n color: 'text',\n});\n\nexport const groupDescription = sprinkles({\n color: 'textMuted',\n fontSize: 'sm',\n});\n\nexport const grid = sprinkles({\n display: 'grid',\n gridTemplateColumns: 'autoFitMinmax260',\n gap: 3,\n});\n\nexport const item = style([\n sprinkles({\n display: 'flex',\n flexDirection: 'column',\n gap: 2,\n padding: 4,\n borderRadius: 'lg',\n borderWidth: 'default',\n borderStyle: 'solid',\n borderColor: 'borderSubtle',\n backgroundColor: 'surface',\n color: 'text',\n textDecoration: 'none',\n }),\n {\n minHeight: '112px',\n selectors: {\n '&:hover': {\n borderColor: vars.colors.border,\n backgroundColor: vars.colors.surfaceMuted,\n },\n '&:focus-visible': {\n outline: `2px solid ${vars.colors.primary}`,\n outlineOffset: '2px',\n },\n },\n },\n]);\n\nexport const itemHeader = sprinkles({\n display: 'flex',\n alignItems: 'center',\n gap: 2,\n});\n\nexport const itemIcon = sprinkles({\n display: 'inline-flex',\n alignItems: 'center',\n color: 'textMuted',\n});\n\nexport const itemTitle = sprinkles({\n fontWeight: 'semibold',\n});\n\nexport const itemDescription = sprinkles({\n color: 'textMuted',\n fontSize: 'sm',\n});\n\nexport const empty = sprinkles({\n padding: 5,\n borderRadius: 'lg',\n borderWidth: 'default',\n borderStyle: 'solid',\n borderColor: 'borderSubtle',\n backgroundColor: 'surfaceMuted',\n color: 'textMuted',\n});\n","import { useMemo, useState, type JSX, type ReactNode } from 'react';\nimport { useTranslation } from 'react-i18next';\nimport { Link } from '@plumile/router';\n\nimport { DetailPageTemplate, Input, SidebarTasksSvg } from '@plumile/ui';\nimport type { BackofficeEntityManifestMap } from '@plumile/backoffice-core/types.js';\n\nimport { useBackofficeReactTranslation } from '../i18n/useBackofficeReactTranslation.js';\nimport { useBackofficeConfig } from '../provider/BackofficeConfigContext.js';\nimport type { BackofficePreparedHubRoute } from '../router/createBackofficeRoutes.js';\nimport { BackofficeRightPageLayout } from '../components/backoffice/layout/breadcrumb/BackofficeRightPageLayout.js';\nimport { buildHubBreadcrumb } from '../components/backoffice/layout/breadcrumb/buildBreadcrumbs.js';\nimport { useBackofficePermissions } from '../components/backoffice/layout/BackofficePermissionsContext.js';\nimport { resolveLabel } from '../components/backoffice/layout/sidebarUtils.js';\n\nimport * as styles from './backofficeHubPage.css.js';\n\nexport type BackofficeHubPageProps = {\n prepared: BackofficePreparedHubRoute;\n};\n\ntype HubPageItemView = {\n id: string;\n kind: 'entity' | 'tool';\n label: string;\n href: string;\n icon: ReactNode;\n};\n\ntype HubPageGroupView = {\n id: string;\n title: string;\n description: string | null;\n items: readonly HubPageItemView[];\n};\n\nconst isItemVisible = (input: {\n entity: BackofficeEntityManifestMap[string] | null | undefined;\n kind: 'entity' | 'tool';\n permissions: unknown;\n sidebar: ReturnType<typeof useBackofficeConfig>['sidebar'];\n}): boolean => {\n const { entity, kind, permissions, sidebar } = input;\n if (entity == null) {\n return false;\n }\n if (kind === 'entity' && entity.kind !== 'tool' && !entity.hasList) {\n return false;\n }\n const isVisible = sidebar?.isItemVisible?.(\n {\n kind,\n id: entity.id,\n },\n permissions,\n );\n return isVisible !== false;\n};\n\nexport const BackofficeHubPage = ({\n prepared,\n}: BackofficeHubPageProps): JSX.Element => {\n const { t: tApp } = useTranslation();\n const { t } = useBackofficeReactTranslation();\n const { entities, sidebar } = useBackofficeConfig();\n const permissions = useBackofficePermissions();\n const [search, setSearch] = useState('');\n const { hub } = prepared;\n const title = resolveLabel(hub.title, tApp);\n let description: string | undefined;\n if (hub.description != null) {\n description = resolveLabel(hub.description, tApp);\n }\n const breadcrumb = buildHubBreadcrumb({ id: hub.id, title });\n const normalizedSearch = search.trim().toLowerCase();\n const searchEnabled = hub.search?.enabled !== false;\n let searchPlaceholder = t('hub.search.placeholder');\n if (hub.search?.placeholder != null) {\n searchPlaceholder = resolveLabel(hub.search.placeholder, tApp);\n }\n\n const groups = useMemo<readonly HubPageGroupView[]>(() => {\n return hub.groups\n .map((group) => {\n const items = group.items\n .map((item): HubPageItemView | null => {\n const entity = entities[item.id];\n if (entity == null) {\n return null;\n }\n if (\n !isItemVisible({\n entity,\n kind: item.kind,\n permissions,\n sidebar,\n })\n ) {\n return null;\n }\n const entityConfig = entity;\n const label = resolveLabel(entityConfig.label, tApp);\n if (\n normalizedSearch !== '' &&\n !label.toLowerCase().includes(normalizedSearch)\n ) {\n return null;\n }\n return {\n id: item.id,\n kind: item.kind,\n label,\n href: entityConfig.routes.list,\n icon: (\n <SidebarTasksSvg width={18} height={18} aria-hidden=\"true\" />\n ),\n };\n })\n .filter((item): item is HubPageItemView => {\n return item != null;\n });\n let groupDescription: string | null = null;\n if (group.description != null) {\n groupDescription = resolveLabel(group.description, tApp);\n }\n return {\n id: group.id,\n title: resolveLabel(group.title, tApp),\n description: groupDescription,\n items,\n };\n })\n .filter((group) => {\n return group.items.length > 0;\n });\n }, [entities, hub.groups, normalizedSearch, permissions, sidebar, tApp]);\n\n let emptyTitle = t('hub.empty.title');\n if (hub.emptyState?.title != null) {\n emptyTitle = resolveLabel(hub.emptyState.title, tApp);\n }\n let emptyDescription = t('hub.empty.description');\n if (hub.emptyState?.description != null) {\n emptyDescription = resolveLabel(hub.emptyState.description, tApp);\n }\n let subtitle = t('hub.subtitle');\n if (description != null) {\n subtitle = description;\n }\n let body: JSX.Element;\n if (groups.length === 0) {\n body = (\n <div className={styles.empty}>\n <strong>{emptyTitle}</strong>\n <div>{emptyDescription}</div>\n </div>\n );\n } else {\n body = (\n <div className={styles.groups}>\n {groups.map((group) => {\n return (\n <section key={group.id} className={styles.group}>\n <div className={styles.groupHeader}>\n <h2 className={styles.groupTitle}>{group.title}</h2>\n {group.description != null && (\n <div className={styles.groupDescription}>\n {group.description}\n </div>\n )}\n </div>\n <div className={styles.grid}>\n {group.items.map((item) => {\n let itemKindLabel = t('hub.itemKinds.entity');\n if (item.kind === 'tool') {\n itemKindLabel = t('hub.itemKinds.tool');\n }\n return (\n <Link\n key={`${item.kind}-${item.id}`}\n to={item.href}\n className={styles.item}\n >\n <span className={styles.itemHeader}>\n <span className={styles.itemIcon}>{item.icon}</span>\n <span className={styles.itemTitle}>{item.label}</span>\n </span>\n <span className={styles.itemDescription}>\n {itemKindLabel}\n </span>\n </Link>\n );\n })}\n </div>\n </section>\n );\n })}\n </div>\n );\n }\n\n return (\n <BackofficeRightPageLayout breadcrumb={breadcrumb}>\n <DetailPageTemplate\n header={{\n title,\n subtitle,\n }}\n >\n <div className={styles.content}>\n {searchEnabled && (\n <div className={styles.search}>\n <Input\n value={search}\n onChange={(event) => {\n setSearch(event.target.value);\n }}\n placeholder={searchPlaceholder}\n aria-label={searchPlaceholder}\n fullWidth\n />\n </div>\n )}\n {body}\n </div>\n </DetailPageTemplate>\n </BackofficeRightPageLayout>\n );\n};\n\nexport default BackofficeHubPage;\n"],"mappings":"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"}