@plumile/backoffice-react 0.1.88 → 0.1.90

package/lib/esm/{BackofficeEntityListPage-DmZozSNk.js.map → BackofficeEntityListPage-C8Ucmc_E.js.map}

@@ -1 +1 @@
-{"version":3,"file":"BackofficeEntityListPage-DmZozSNk.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    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      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":";;;;;;;;;;;;;;;iDCgBa,KAAsB,EACjC,QACA,UACA,cACyC;CACzC,IAAM,IAAW,QAAc;EAC7B,IAAM,IAAwD,EAAE;AAChE,OAAK,IAAM,KAAQ,GAAO;GACxB,IAAM,IAAO,EAAK,OAAO,EAAI;AAC7B,GAAI,KAAQ,QAAQ,MAAS,MAAM,MAAS,MAC1C,EAAI,KAAK;IAAE,IAAI,EAAK;IAAI;IAAM,OAAO,EAAK,MAAM,EAAI,CAAC,EAAK;IAAE,CAAC;;AAGjE,SAAO;IACN;EAAC;EAAO;EAAK;EAAK,CAAC,EAEhB,IAAY,EACf,KAAK,MACG,EAAM,MAAM,MAAM,CACzB,CACD,QAAQ,MACA,MAAU,GACjB,CACD,KAAK,KAAK,EAET;AAKJ,QAJI,MAAc,OAChB,IAAgB,IAIhB,kBAAC,OAAD;EAAK,WAAW;EAAkB,cAAY;YAC3C,EAAS,KAAK,MAEX,kBAAC,QAAD;GAEE,WAAW;GACX,OAAO,EAAM;GACb,MAAK;GACL,cAAY,EAAM;aAEjB,EAAM;GACF,EAPA,EAAM,GAON,CAET;EACE,CAAA;gFE5CJ,IAAoB,IACpB,IAAmB,GACnB,IAAyB,GAEzB,IAAkB,IAClB,IAAiB,GACjB,IAAuB,IACvB,IAAoB,GAEpB,IAGF;CACF,IAAI;CACJ,GAAG;CACH,GAAG;CACH,GAAG;CACH,IAAI;CACJ,OAAO;CACR,EAEY,KAAgC,MACvC,KAAa,IACR,IAGP,IAAyB,IACzB,IAAoB,IACpB,IAAmB,KAAK,IAAI,GAAG,IAAY,EAAE,EAIpC,KAA+B,MACtC,KAAe,IACV,IAGP,IACA,IAAuB,IACvB,IAAkB,IAClB,IAAiB,KAAK,IAAI,GAAG,IAAc,EAAE,EAIpC,KACX,GACA,MAEI,UAAU,KAAU,OAAO,EAAO,QAAS,WACtC,EACL,EAAO,QAGJ,GAGI,MACX,MAEO,EAAO,SAAS,SAGZ,KACX,MAEO,EAAO,SAAS,gBAGZ,MACX,GACA,MAEI,MAGA,MAAU,IACL,YAEF,cAGI,KAAgB,MAAgC;AAI3D,KAHmB,OAAO,KAAQ,aAA9B,KAGA,EAAE,QAAQ,GACZ,QAAO;CAET,IAAM,IAAS,EAAyB;AACxC,KAAI,OAAO,KAAU,SACnB,QAAO;CAET,IAAM,IAAU,EAAM,MAAM;AAI5B,QAHI,MAAY,KACP,OAEF;GAeI,MACX,MAEO,EAAO,KAAK,SAAS,WAGjB,KAAgB,GAAkB,MACtC,EAAM,EAAK,EAGP,MAAsB,MAMH;CAC9B,IAAM,EAAE,cAAW,aAAU,sBAAmB,cAAW,oBACzD;AAEF,QAAO;EACL,IAAI;EACJ,QAAQ;EACR;EACA,OAAO,MAAQ;GACb,IAAM,IAAK,EAAa,EAAI;AAC5B,OAAI,KAAM,KACR,QAAO;GAET,IAAM,IAAO,EAAkB,EAAG;AAIlC,UAHI,KAAQ,OACH,IAEF,EAAa;IAAE;IAAM;IAAW,CAAC;;EAE3C;GCtFG,IAAsB,oBAEtB,MACJ,GACA,GACA,GACA,MAIG;CACH,IAAM,IAAW,KAAY,QAAQ,EAAS,SAAS,GAEnD,IAAU;AACd,KAAI,GAAU;EAWZ,IAAM,IAAY,CAAC;GATjB,IAAI;GACJ,QAAQ;GACR,WAAW;GACX,OAAO,MACE,kBAAC,GAAD;IAAmB;IAAK,OAAO;IAAgB;IAAQ,CAAA;GAK/C,EAAa,GAAG,EAAa,EAC1C,IAAa,EAAU,MAAM,MAC1B,EAAI,cAAc,GACzB;AAGF,EADA,IAAU,GACL,MACH,IAAU,EAAU,KAAK,GAAK,MACxB,MAAU,IACL;GAAE,GAAG;GAAK,WAAW;GAAM,GAE7B,EACP;;CAIN,IAAI,IAAY;AAChB,CAAI,MACF,IAAY,EAAS;CAEvB,IAAM,IAAe,EAA6B,EAAU,EACtD,IAAiB,EAA4B,EAAY,EAG3D,IAAkB;AACtB,CAAI,MACF,IAAkB;CAEpB,IAAM,IAAc,EAAQ,SAAS,IAAkB,GAEjD,IAAe,EAClB,MAAM,GAAiB,IAAkB,KAAK,IAAI,GAAG,EAAY,CAAC,CAClE,KAAK,MACG,EAAmB,GAAoC,MAAM,CACpE,CACD,KAAK,IAAI,EAER,IAAsB;AAO1B,QANA,AAGE,IAHE,IACoB,GAAG,EAAa,KAAK,EAAa,GAAG,EAAe,MAEpD,GAAG,EAAa,GAAG,EAAe,KAGnD;EAAE;EAAS;EAAqB;GAGnC,KAAkC,EACtC,WACA,kBACuD;CACvD,IAAM,EAAE,GAAG,MAAS,IAAgB,EAC9B,EAAE,SAAM,GAA+B,EACvC,EAAE,gBAAa,GAAqB,EACpC,CAAC,GAAoB,KAAyB,EAClD,KACD,EACK,IAAc,GAAqB;AAEzC,KAAI,CAAC,GAAmB,EAAO,CAC7B,QAAO;CAGT,IAAM,IAAa,EAAO,MACpB,IAAe,EAAO,gBAC1B,EAAW,gBAAgB;EAAE,OAAO;EAAM,MAAM;EAAM,EAClD,IAAY,GAAkB,EAAW,OAAO,EAAS,MAAM,EAC/D,IAAe,EAAY,EAAW,UAAU,EAAmB,EAEnE,IAAc,QACX,EAAW,QAAQ,EAAa,CAAC,KAAK,MACpC,EAAW,MAAM,EAAI,CAC5B,EACD,CAAC,GAAc,EAAW,CAAC,EAExB,IAAgB,QACb,EAAW,gBAAgB,EAAU,IAAI,MAC/C,CAAC,GAAY,EAAU,CAAC,EAErB,CAAC,GAAM,KAAW,EAAS,EAAY,EACvC,CAAC,GAAY,KAAiB,EAAS,EAAc,EACrD,CAAC,GAAe,KAAoB,EAAS,GAAM,EACnD,CAAC,GAAc,KAAmB,EAAS,GAAM;AAEvD,SAAgB;AAEd,EADA,EAAQ,EAAY,EACpB,EAAc,EAAc;IAC3B,CAAC,GAAe,EAAY,CAAC;CAEhC,IAAM,EAAE,YAAS,2BAAwB,QAGpC;EACH,IAAM,IAAc,EAAsB,EAAW,SAAS;GAC5D;GACA;GACA,oBAAoB,GAAU,MAAU;IACtC,IAAM,IAAiB,EAAS;AAIhC,WAHI,KAAkB,OACb,OAEF,EAAe,OAAO,OAAO,EAAM;;GAE7C,CAAC,EACI,IAAgB,GAAmB;GACvC,WAAW,EAAE,eAAe;GAC5B,UAAU,EAAE,sBAAsB;GAClC,WAAW;GACX,oBAAoB,MACX,EAAO,OAAO,OAAO,EAAG;GAEjC,eAAe,EAAE,SAAM,mBAEnB,kBAAC,GAAU,SAAX,EAAA,UACE,kBAAC,QAAD;IAAM,WAAW;IAA0B,OAAO;cAChD,kBAAC,GAAD;KACE,IAAI;KACJ,SAAQ;KACR,MAAK;KACL,cAAY;eAEZ,kBAAC,IAAD;MAAQ,OAAO;MAAI,QAAQ;MAAM,CAAA;KACtB,CAAA;IACR,CAAA,EACW,CAAA;GAGzB,CAAC;AAEF,SAAO,GAAqB,CADR,GAAG,GAAa,EACR,EAAY,EAAW,UAAU,GAAG,EAAK;IACpE;EACD,EAAO;EACP,EAAW;EACX,EAAW;EACX;EACA;EACA;EACD,CAAC,EAEI,IAAW,GACd,MACQ,EAAW,SAAS,EAAI,EAEjC,CAAC,EAAW,CACb,EAEK,EAAE,UAAO,iBAAc,EAA0B,EAAO,EACxD,IAAe,EAAM,QAAQ,EAAa,MAC1C,EAAE,gBAAa,IAEf,IAAiB,GACpB,MAMK,EAAW,kBAAkB,OAG1B,IAFE,EAAW,eAAe,EAAM,EAI3C,CAAC,EAAW,CACb,EAEK,KAAe,EAAO,EAAE,EACxB,KAAoB,EACxB,EAAuB;EACrB,OAAO,EAAa;EACpB,MAAM,EAAa;EACnB,OAAO;EACR,CAAC,CACH,EAEK,IAAW,EACf,OAAO,MAA4B;EACjC,IAAM,IAAY,GAAa,UAAU;AAGzC,EAFA,GAAa,UAAU,GAEnB,EAAM,SAAS,WACjB,EAAiB,GAAK,GAEtB,EAAgB,GAAK;AAGvB,MAAI;GACF,IAAM,IAAY,EAAe;IAC/B,OAAO,EAAM;IACb,MAAM,EAAM;IACZ,OAAO,EAAM;IACb,QAAQ,EAAM;IACf,CAAC,EAEI,IAAW,MAAM,EACrB,GACA,EAAW,OACX,GACA,EAAE,aAAa,GAAqB,CACrC,CAAC,WAAW;AAEb,OAAI,KAAY,QAAQ,GAAa,YAAY,EAC/C;GAGF,IAAM,IAAW,EAAW,QAAQ,EAAkB,CAAC,KAAK,MACnD,EAAW,MAAM,EAAI,CAC5B;AAQF,GAPA,GAAS,MACH,EAAM,SAAS,WACV,CAAC,GAAG,GAAM,GAAG,EAAS,GAExB,EACP,EAEF,EADe,EAAW,gBAAgB,EAAS,IAAI,KAClC;YACb;AACR,GAAI,EAAM,SAAS,WACjB,EAAiB,GAAM,GAEvB,EAAgB,GAAM;;IAI5B;EAAC;EAAgB;EAAa;EAAW,CAC1C;AAED,SAAgB;EACd,IAAM,IAAM,EAAuB;GACjC,OAAO,EAAM;GACb,MAAM;GACN,OAAO;GACR,CAAC;AACE,KAAkB,YAAY,MAGlC,GAAkB,UAAU,GAC5B,EAAS;GACP,OAAO,EAAM;GACb,MAAM;GACN,OAAO;GACP,QAAQ;GACR,MAAM;GACP,CAAC,CAAC,YAAY,GAAG;IACjB;EAAC;EAAU;EAAc;EAAU,EAAM;EAAM,CAAC;CAEnD,IAAM,KAAgB,QAAkB;AAClC,OAGJ,EAAS;GACP,OAAO,EAAM;GACb,MAAM;GACN,OAAO;GACP,QAAQ;GACR,MAAM;GACP,CAAC,CAAC,YAAY,GAAG;IACjB;EAAC;EAAc;EAAU;EAAc;EAAU,EAAM;EAAM,CAAC,EAE3D,KAAiB,EAAsB;EAC3C,SAAS,KAAc;EACvB,eAAe;EACf,WAAW,MAAU;AACf,QAAc,QAGlB,EAAS;IACP,OAAO,EAAM;IACb,MAAM;IACN;IACA,QAAQ;IACR,MAAM;IACP,CAAC,CAAC,YAAY,GAAG;;EAEpB,OAAO;EACR,CAAC,EAEI,KAAc,QACX,EAAO,eAAe,EAAE,EAC9B,CAAC,EAAO,YAAY,CAAC,EAClB,KAAiB,QACd,GAAY,QAAQ,MACrB,EAAO,aAAa,OACf,KAEF,EAAO,UAAU,KAAK,CAC7B,EACD,CAAC,GAAY,CAAC,EAEX,KAAgB,QAAc;AAC9B,SAAe,WAAW,EAG9B,QACE,kBAAC,OAAD;GAAK,WAAW;aACb,GAAe,KAAK,GAAQ,MAAU;IACrC,IAAM,EAAE,SAAS,MAAkB,GAC7B,IAAQ,EAAa,EAAO,OAAO,EAAK,EAC1C,IAAY;AAChB,IAAI,EAAO,aAAa,SACtB,IAAY,EAAa,EAAO,WAAW,EAAK;IAElD,IAAM,IAAU,GAAqB,GAAe,EAAM,EACpD,IAAO,EAAO,QAAQ,SACtB,IAAa,EAAO,aAAa,KAAK,KAAK;AAoCjD,WAlCI,GAAc,EAAO,GAGrB,kBAAC,GAAD;KAEE,IAJS,EAAO,GAAG,KAIf;KACK;KACH;KACM;KACZ,cAAY;eAEX;KACU,EARN,EAAO,GAQD,GAIb,EAAqB,EAAO,GAE5B,kBAAC,IAAD;KAEE,MAAK;KACI;KACH;KACN,UAAU;KACV,eAAe;AACb,QAAsB,EAAO,GAAG;;KAElC,cAAY;eAEX;KACM,EAXF,EAAO,GAWL,GAIN;KACP;GACE,CAAA;IAEP,CAAC,GAAM,GAAe,CAAC,EAEpB,IAAmB,GAAY,MAAM,MAClC,EAAO,OAAO,EACrB;AAEF,QACE,mBAAA,GAAA,EAAA,UAAA,CACE,kBAAC,GAAD;EACU;EACD;EACI;EACI,eAAA;EACT;EACG;EACY;EACX;EACV,aAAa,KAAc;EACZ;EACf,YAAY;EACZ,WAAW;EACX,YAAY;EACZ,CAAA,EACD,KAAoB,QAAQ,EAAqB,EAAiB,IACjE,kBAAC,GAAD;EACE,QAAA;EACA,QAAQ;EACR,MAAM;EACN,eAAe;AACb,KAAsB,KAAK;;EAE7B,WAAW;EACX,CAAA,CAEH,EAAA,CAAA;GAIM,KAA4B,EACvC,mBACA,WACA,kBACuD;CACvD,IAAM,EAAE,GAAG,MAAS,IAAgB,EAC9B,IAAa,EAA0B,GAAQ,EAAK;AAE1D,KAAI,GAAmB,EAAO,CAC5B,QACE,kBAAC,GAAD;EAAuC;YACrC,kBAAC,GAAD;GACkB;GACR;GACE;GACV,CAAA;EACwB,CAAA;CAGhC,IAAM,IAAa,EAAO;AAC1B,KAAI,EAAW,SAAS,UACtB,QAAO;CAGT,IAAM,EAAE,SAAM,GAA+B,EACvC,EAAE,gBAAa,GAAqB,EACpC,CAAC,GAAoB,KAAyB,EAClD,KACD,EAEK,IAAY,GAAkB,EAAW,OAAO,EAAS,MAAM,EAC/D,EACJ,MAAM,GACN,aACA,YACA,kBACA,eACE,EAAsB,EAAW,UAAU,EAAmB,EAE5D,IAAa,EAAW,cAAc,EAAa,EAEnD,IAAO,QACJ,EAAW,MAAM,KAAK,MACpB,EAAW,MAAM,EAAK,KAAK,CAClC,EACD,CAAC,EAAW,OAAO,EAAW,CAAC,EAE5B,EAAE,YAAS,2BAAwB,QAGpC;EACH,IAAM,IAAc,EAAsB,EAAW,SAAS;GAC5D;GACA;GACA,oBAAoB,GAAU,MAAU;IACtC,IAAM,IAAiB,EAAS;AAIhC,WAHI,KAAkB,OACb,OAEF,EAAe,OAAO,OAAO,EAAM;;GAE7C,CAAC,EACI,IAAgB,GAAmB;GACvC,WAAW,EAAE,eAAe;GAC5B,UAAU,EAAE,sBAAsB;GAClC,WAAW;GACX,oBAAoB,MACX,EAAO,OAAO,OAAO,EAAG;GAEjC,eAAe,EAAE,SAAM,mBAEnB,kBAAC,GAAU,SAAX,EAAA,UACE,kBAAC,QAAD;IAAM,WAAW;IAA0B,OAAO;cAChD,kBAAC,GAAD;KACE,IAAI;KACJ,SAAQ;KACR,MAAK;KACL,cAAY;eAEZ,kBAAC,IAAD;MAAQ,OAAO;MAAI,QAAQ;MAAM,CAAA;KACtB,CAAA;IACR,CAAA,EACW,CAAA;GAGzB,CAAC;AAEF,SAAO,GAAqB,CADR,GAAG,GAAa,EACR,EAAY,EAAW,UAAU,GAAG,EAAK;IACpE;EACD,EAAO;EACP,EAAW;EACX,EAAW;EACX;EACA;EACA;EACD,CAAC,EAEI,IAAW,GACd,MACQ,EAAW,SAAS,EAAI,EAEjC,CAAC,EAAW,CACb,EAEK,EAAE,UAAO,iBAAc,EAA0B,EAAO,EACxD,IAAe,EAAO,gBAC1B,EAAW,gBAAgB;EAAE,OAAO;EAAM,MAAM;EAAM,EAClD,IAAe,EAAM,QAAQ,EAAa,MAC1C,EAAE,gBAAa,IAWf,EAAE,iBAAc,EAAyB;EAC7C;EACA,WAXoB,SACb;GACL,OAAO,EAAM;GACb,MAAM;GACN,OAAO;GACP,QAAQ;GACT,GACA;GAAC;GAAU;GAAc,EAAM;GAAM,CAI3B;EACX,UAAU;GACR,OAAO,EAAa;GACpB,MAAM,EAAa;GACnB,OAAO;GACP,QAAQ;GACT;EACD,aAAa;EACb,gBAAgB,EAAW;EAC5B,CAAC,EAEI,IAAiB,EAAsB;EAC3C;EACA;EACA;EACA,OAAO;EACR,CAAC,EAEI,IAAc,QACX,EAAO,eAAe,EAAE,EAC9B,CAAC,EAAO,YAAY,CAAC,EAClB,IAAiB,QACd,EAAY,QAAQ,MACrB,EAAO,aAAa,OACf,KAEF,EAAO,UAAU,KAAK,CAC7B,EACD,CAAC,EAAY,CAAC,EAEX,IAAgB,QAAc;AAC9B,QAAe,WAAW,EAG9B,QACE,kBAAC,OAAD;GAAK,WAAW;aACb,EAAe,KAAK,GAAQ,MAAU;IACrC,IAAM,EAAE,SAAS,MAAkB,GAC7B,IAAQ,EAAa,EAAO,OAAO,EAAK,EAC1C,IAAY;AAChB,IAAI,EAAO,aAAa,SACtB,IAAY,EAAa,EAAO,WAAW,EAAK;IAElD,IAAM,IAAU,GAAqB,GAAe,EAAM,EACpD,IAAO,EAAO,QAAQ,SACtB,IAAa,EAAO,aAAa,KAAK,KAAK;AAoCjD,WAlCI,GAAc,EAAO,GAGrB,kBAAC,GAAD;KAEE,IAJS,EAAO,GAAG,KAIf;KACK;KACH;KACM;KACZ,cAAY;eAEX;KACU,EARN,EAAO,GAQD,GAIb,EAAqB,EAAO,GAE5B,kBAAC,IAAD;KAEE,MAAK;KACI;KACH;KACN,UAAU;KACV,eAAe;AACb,QAAsB,EAAO,GAAG;;KAElC,cAAY;eAEX;KACM,EAXF,EAAO,GAWL,GAIN;KACP;GACE,CAAA;IAEP,CAAC,GAAM,EAAe,CAAC,EAEpB,IAAmB,EAAY,MAAM,MAClC,EAAO,OAAO,EACrB;AAEF,QACE,mBAAC,GAAD;EAAuC;YAAvC,CACE,kBAAC,GAAD;GACU;GACD;GACI;GACI,eAAA;GACT;GACG;GACY;GACX;GACV,aAAa;GACb,eAAe;GACf,YAAY;GACD;GACX,YAAY,EAAW,cAAc;GACrC,CAAA,EACD,KAAoB,QAAQ,EAAqB,EAAiB,IACjE,kBAAC,GAAD;GACE,QAAA;GACA,QAAQ;GACR,MAAM;GACN,eAAe;AACb,MAAsB,KAAK;;GAE7B,WAAW;GACX,CAAA,CAEsB"}
+{"version":3,"file":"BackofficeEntityListPage-C8Ucmc_E.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    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      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/{useBackofficeReactTranslation-WfXU8kCf.js → BackofficeErrorBoundary-BwRVSDHU.js}

@@ -1,7 +1,6 @@
 import { Component as e } from "react";
-import { useTranslation as t } from "react-i18next";
 //#region src/components/backoffice/errors/BackofficeErrorBoundary.tsx
-var n = class extends e {
+var t = class extends e {
 	state = { error: null };
 	static getDerivedStateFromError(e) {
 		return { error: e };
@@ -17,11 +16,6 @@ var n = class extends e {
 	}
 };
 //#endregion
-//#region src/i18n/useBackofficeReactTranslation.ts
-function r() {
-	return t("backofficeReact");
-}
-//#endregion
-export { n, r as t };
+export { t };
 
-//# sourceMappingURL=useBackofficeReactTranslation-WfXU8kCf.js.map
+//# sourceMappingURL=BackofficeErrorBoundary-BwRVSDHU.js.map

package/lib/esm/BackofficeErrorBoundary-BwRVSDHU.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BackofficeErrorBoundary-BwRVSDHU.js","names":[],"sources":["../../src/components/backoffice/errors/BackofficeErrorBoundary.tsx"],"sourcesContent":["import { Component, type ReactNode } from 'react';\n\nexport type BackofficeErrorBoundaryProps = {\n  children: ReactNode;\n  fallback: (args: { error: unknown; reset: () => void }) => ReactNode;\n};\n\ntype State = { error: unknown };\n\nexport class BackofficeErrorBoundary extends Component<\n  BackofficeErrorBoundaryProps,\n  State\n> {\n  public state: State = { error: null };\n\n  public static getDerivedStateFromError(error: unknown): State {\n    return { error };\n  }\n\n  public reset = (): void => {\n    this.setState({ error: null });\n  };\n\n  public render(): ReactNode {\n    if (this.state.error != null) {\n      return this.props.fallback({\n        error: this.state.error,\n        reset: this.reset,\n      });\n    }\n    return this.props.children;\n  }\n}\n\nexport default BackofficeErrorBoundary;\n"],"mappings":";;AASA,IAAa,IAAb,cAA6C,EAG3C;CACA,QAAsB,EAAE,OAAO,MAAM;CAErC,OAAc,yBAAyB,GAAuB;AAC5D,SAAO,EAAE,UAAO;;CAGlB,cAA2B;AACzB,OAAK,SAAS,EAAE,OAAO,MAAM,CAAC;;CAGhC,SAA2B;AAOzB,SANI,KAAK,MAAM,SAAS,OAMjB,KAAK,MAAM,WALT,KAAK,MAAM,SAAS;GACzB,OAAO,KAAK,MAAM;GAClB,OAAO,KAAK;GACb,CAAC"}

package/lib/esm/{BackofficeLayoutPage-DtFDn_nU.js → BackofficeLayoutPage-j3VUX3Tu.js}

@@ -1,8 +1,8 @@
 import { i as e } from "./environment-BXoBq_6e.js";
 import { t } from "./useRelayEnvironment-vQ86aW-n.js";
-import { n } from "./BackofficeConfigContext-R0t1owTI.js";
-import { a as r, i, n as a, r as o, t as s } from "./sidebarUtils-CuwJ_3mD.js";
-import { n as c, t as l } from "./useBackofficeReactTranslation-WfXU8kCf.js";
+import { r as n, t as r } from "./useBackofficeReactTranslation-Btt58EIo.js";
+import { a as i, i as a, n as o, r as s, t as c } from "./sidebarUtils-CuwJ_3mD.js";
+import { t as l } from "./BackofficeErrorBoundary-BwRVSDHU.js";
 import { t as u } from "./BackofficeTopbarPortalContext-iD7dm4_h.js";
 import { t as d } from "./backofficeAuthPaths-BiJvoI5Q.js";
 import { Suspense as f, useCallback as p, useContext as m, useEffect as h, useMemo as g, useState as _ } from "react";
@@ -109,7 +109,7 @@ var I = "backoffice.sidebar.pins.v1", L = (e) => {
 	"aria-hidden": "true"
 });
 function ie(e) {
-	let { basePath: t, pathname: n, entities: r, sidebar: c, permissions: l, searchQuery: u, tApp: d, t: f, pinnedEntityIds: p = [], onTogglePin: m, onReorderPin: h, collapsedByGroupId: g, onGroupCollapsedChange: _ } = e, v = i(r, c), y = Object.entries(v), b = new Set(p), x = f("sidebar.actions.pin"), S = f("sidebar.actions.unpin"), C = f("sidebar.actions.reorder"), ee = s(v), w = u?.trim().toLowerCase() ?? "", E = (e) => {
+	let { basePath: t, pathname: n, entities: r, sidebar: i, permissions: l, searchQuery: u, tApp: d, t: f, pinnedEntityIds: p = [], onTogglePin: m, onReorderPin: h, collapsedByGroupId: g, onGroupCollapsedChange: _ } = e, v = a(r, i), y = Object.entries(v), b = new Set(p), x = f("sidebar.actions.pin"), S = f("sidebar.actions.unpin"), C = f("sidebar.actions.reorder"), ee = c(v), w = u?.trim().toLowerCase() ?? "", E = (e) => {
 		if (m == null) return null;
 		let t = b.has(e), n = x, r = O;
 		return t && (n = S, r = D), /* @__PURE__ */ P("button", {
@@ -128,7 +128,7 @@ function ie(e) {
 			})
 		});
 	}, j = (e) => {
-		let { entityId: t, groupId: i, groupIcon: s, enableReorder: u } = e, f = r[t];
+		let { entityId: t, groupId: a, groupIcon: c, enableReorder: u } = e, f = r[t];
 		if (f == null) return null;
 		let p = {
 			kind: "entity",
@@ -137,30 +137,30 @@ function ie(e) {
 		if (f.kind === "tool" && (p = {
 			kind: "tool",
 			id: t
-		}), c?.isItemVisible?.(p, l) === !1) return null;
+		}), i?.isItemVisible?.(p, l) === !1) return null;
 		if (f.kind === "tool") {
-			let e = o(f.label, d);
+			let e = s(f.label, d);
 			return w !== "" && !e.toLowerCase().includes(w) ? null : {
 				id: `tool-${t}`,
 				data: {
 					kind: "tool",
 					id: t,
-					groupId: i
+					groupId: a
 				},
 				label: e,
 				href: f.routes.list,
-				icon: V(s, /* @__PURE__ */ P(A, {
+				icon: V(c, /* @__PURE__ */ P(A, {
 					width: 18,
 					height: 18,
 					"aria-hidden": "true"
 				})),
-				isActive: a(n, f.routes.list),
+				isActive: o(n, f.routes.list),
 				ariaLabel: e,
 				actionSlot: E(t)
 			};
 		}
 		if (!f.hasList) return null;
-		let m = o(f.label, d);
+		let m = s(f.label, d);
 		if (w !== "" && !m.toLowerCase().includes(w)) return null;
 		let g, _, v, y, b = !1;
 		u === !0 && h != null && (b = !0, g = /* @__PURE__ */ P(T, {
@@ -185,16 +185,16 @@ function ie(e) {
 			data: {
 				kind: "entity",
 				id: t,
-				groupId: i
+				groupId: a
 			},
 			label: m,
 			href: f.routes.list,
-			icon: V(s, /* @__PURE__ */ P(A, {
+			icon: V(c, /* @__PURE__ */ P(A, {
 				width: 18,
 				height: 18,
 				"aria-hidden": "true"
 			})),
-			isActive: a(n, f.routes.list),
+			isActive: o(n, f.routes.list),
 			ariaLabel: m,
 			actionSlot: E(t),
 			dragHandleSlot: g,
@@ -222,16 +222,16 @@ function ie(e) {
 			collapsible: !1
 		});
 	}
-	return y.forEach(([e, r], i) => {
+	return y.forEach(([e, r], a) => {
 		if (r.isVisible != null && !r.isVisible(l)) return;
-		let s = [];
-		if (i === 0 && c?.isItemVisible?.({
+		let c = [];
+		if (a === 0 && i?.isItemVisible?.({
 			kind: "dashboard",
 			id: "dashboard"
 		}, l) !== !1) {
 			let r = f("sidebar.items.dashboard");
 			if (w !== "" && !r.toLowerCase().includes(w)) return;
-			s.push({
+			c.push({
 				id: "dashboard",
 				data: {
 					kind: "dashboard",
@@ -245,7 +245,7 @@ function ie(e) {
 					height: 18,
 					"aria-hidden": "true"
 				})),
-				isActive: a(n, t),
+				isActive: o(n, t),
 				ariaLabel: f("sidebar.items.dashboard")
 			});
 		}
@@ -255,17 +255,17 @@ function ie(e) {
 				groupId: e,
 				groupIcon: r.icon
 			});
-			n != null && s.push(n);
-		}), s.length === 0) return;
+			n != null && c.push(n);
+		}), c.length === 0) return;
 		let u;
-		r.title != null && (u = o(r.title, d));
+		r.title != null && (u = s(r.title, d));
 		let p = g?.[e], m;
 		_ != null && (m = (t) => {
 			_(e, t);
 		}), M.push({
 			id: e,
 			title: u,
-			items: s,
+			items: c,
 			collapsible: !0,
 			defaultCollapsed: !0,
 			isCollapsed: p,
@@ -286,7 +286,7 @@ var H = "txvbqb9ip txvbqbai7 txvbqbu7g", U = "txvbqbwy", W = (e) => {
 	}
 	return null;
 }, G = ({ error: e, onRetry: t }) => {
-	let { t: n } = l(), r = W(e);
+	let { t: n } = r(), i = W(e);
 	return /* @__PURE__ */ P("div", {
 		className: H,
 		role: "alert",
@@ -300,7 +300,7 @@ var H = "txvbqb9ip txvbqbai7 txvbqbu7g", U = "txvbqbwy", W = (e) => {
 				onClick: t,
 				children: n("common.actions.retry")
 			}),
-			children: r
+			children: i
 		})
 	});
 }, K = "txvbqb9ip txvbqbai7 txvbqbaop txvbqbu7g txvbqbjs7", q = "txvbqbjfg", J = "txvbqb9iy txvbqbaop txvbqbc17", Y = "txvbqb9ip txvbqbai7 txvbqbaog txvbqblbg txvbqbjny txvbqb1ry txvbqb1cp txvbqb1qg txvbqbwp txvbqbv45", X = () => /* @__PURE__ */ F("div", {
@@ -343,7 +343,7 @@ var H = "txvbqb9ip txvbqbai7 txvbqbu7g", U = "txvbqbwy", W = (e) => {
 	]
 }), Z = "txvbqb9ip txvbqbai7 txvbqbjs7 txvbqbu7g txvbqbk5y", ae = ({ children: e }) => /* @__PURE__ */ P("div", {
 	className: Z,
-	children: /* @__PURE__ */ P(c, {
+	children: /* @__PURE__ */ P(l, {
 		fallback: ({ error: e, reset: t }) => /* @__PURE__ */ P(G, {
 			error: e,
 			onRetry: t
@@ -365,21 +365,21 @@ var H = "txvbqb9ip txvbqbai7 txvbqbu7g", U = "txvbqbwy", W = (e) => {
 		initials: i,
 		ariaLabel: a.join(" - ")
 	};
-}, $ = ({ children: a, permissions: o, authStatus: s, activeGroupId: c }) => {
-	let { t: f } = v(), { t: h } = l(), { pathname: C } = b(), T = m(y), E = t(), { auth: D, basePath: O, entities: k, sidebar: A } = n(), [j, N] = _(""), [F, I] = _(!1), [L, R] = _(!1), [z, B] = _(null), V = g(() => i(k, A), [k, A]), H = g(() => Object.keys(V), [V]), { pins: U, toggle: W, reorder: G } = ne({ visibleEntityIds: g(() => r(V, k, A, o), [
+}, $ = ({ children: o, permissions: s, authStatus: c, activeGroupId: l }) => {
+	let { t: f } = v(), { t: h } = r(), { pathname: C } = b(), T = m(y), E = t(), { auth: D, basePath: O, entities: k, sidebar: A } = n(), [j, N] = _(""), [F, I] = _(!1), [L, R] = _(!1), [z, B] = _(null), V = g(() => a(k, A), [k, A]), H = g(() => Object.keys(V), [V]), { pins: U, toggle: W, reorder: G } = ne({ visibleEntityIds: g(() => i(V, k, A, s), [
 		k,
 		V,
-		o,
+		s,
 		A
 	]) }), { collapsedByGroupId: K, setCollapsed: q } = re({
 		groupIds: H,
-		activeGroupId: c
+		activeGroupId: l
 	}), J = g(() => ie({
 		basePath: O,
 		pathname: C,
 		entities: k,
 		sidebar: A,
-		permissions: o,
+		permissions: s,
 		searchQuery: j,
 		tApp: f,
 		t: h,
@@ -393,7 +393,7 @@ var H = "txvbqb9ip txvbqbai7 txvbqbu7g", U = "txvbqbwy", W = (e) => {
 		K,
 		k,
 		C,
-		o,
+		s,
 		U,
 		G,
 		q,
@@ -428,7 +428,7 @@ var H = "txvbqb9ip txvbqbai7 txvbqbu7g", U = "txvbqbwy", W = (e) => {
 		L,
 		E,
 		T
-	]), Z = s?.me ?? null, Q = /* @__PURE__ */ P(S, {
+	]), Z = c?.me ?? null, Q = /* @__PURE__ */ P(S, {
 		collapsed: F,
 		viewer: g(() => oe({
 			viewer: Z,
@@ -442,7 +442,7 @@ var H = "txvbqb9ip txvbqbai7 txvbqbu7g", U = "txvbqbwy", W = (e) => {
 		onSignOut: X,
 		isSigningOut: L
 	}), $ = null;
-	return z != null && ($ = /* @__PURE__ */ P(ae, { children: a })), /* @__PURE__ */ P(M, { children: /* @__PURE__ */ P(x, {
+	return z != null && ($ = /* @__PURE__ */ P(ae, { children: o })), /* @__PURE__ */ P(M, { children: /* @__PURE__ */ P(x, {
 		sidebar: {
 			sections: J,
 			header: /* @__PURE__ */ P(ee, { environment: Y }),
@@ -482,4 +482,4 @@ var H = "txvbqb9ip txvbqbai7 txvbqbu7g", U = "txvbqbwy", W = (e) => {
 //#endregion
 export { ce as BackofficeLayoutPage, ce as default };
 
-//# sourceMappingURL=BackofficeLayoutPage-DtFDn_nU.js.map
+//# sourceMappingURL=BackofficeLayoutPage-j3VUX3Tu.js.map