@strapi/admin 4.20.5 → 5.0.0-alpha.0

package/dist/_chunks/Form-sZKjSFQC.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Form-sZKjSFQC.mjs","sources":["../../admin/src/content-manager/components/ConfigurationForm/EditFieldForm.tsx","../../admin/src/content-manager/components/ConfigurationForm/Fields.tsx","../../admin/src/content-manager/components/ConfigurationForm/Form.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {\n  Button,\n  Flex,\n  Grid,\n  GridItem,\n  ModalBody,\n  ModalFooter,\n  ModalHeader,\n  ModalLayout,\n  Typography,\n} from '@strapi/design-system';\nimport { useIntl } from 'react-intl';\nimport * as yup from 'yup';\n\nimport { Form, InputProps, useField } from '../../../components/Form';\nimport { InputRenderer } from '../../../components/FormInputs/Renderer';\nimport { useNotification } from '../../../features/Notifications';\nimport { capitalise } from '../../../utils/strings';\nimport { ATTRIBUTE_TYPES_THAT_CANNOT_BE_MAIN_FIELD } from '../../constants/attributes';\nimport { useGetInitialDataQuery } from '../../services/init';\nimport { getTranslation } from '../../utils/translations';\nimport { FieldTypeIcon } from '../FieldTypeIcon';\n\nimport { TEMP_FIELD_NAME } from './Fields';\n\nimport type { ConfigurationFormData } from './Form';\nimport type { Attribute } from '@strapi/types';\n\n/* -------------------------------------------------------------------------------------------------\n * Constants\n * -----------------------------------------------------------------------------------------------*/\n\nconst FIELD_SCHEMA = yup.object().shape({\n  label: yup.string().required(),\n  description: yup.string(),\n  editable: yup.boolean(),\n  size: yup.number().required(),\n});\n\n/* -------------------------------------------------------------------------------------------------\n * EditFieldForm\n * -----------------------------------------------------------------------------------------------*/\n\ninterface EditFieldFormProps {\n  attribute?: Attribute.Any;\n  name: string;\n  onClose: () => void;\n}\n\nconst EditFieldForm = ({ attribute, name, onClose }: EditFieldFormProps) => {\n  const { formatMessage } = useIntl();\n  const id = React.useId();\n  const { toggleNotification } = useNotification();\n\n  const { value, onChange } =\n    useField<ConfigurationFormData['layout'][number]['children'][number]>(name);\n\n  const { data: mainFieldOptions } = useGetInitialDataQuery(undefined, {\n    selectFromResult: (res) => {\n      if (attribute?.type !== 'relation' || !res.data) {\n        return { data: [] };\n      }\n\n      if ('targetModel' in attribute && typeof attribute.targetModel === 'string') {\n        const targetSchema = res.data.contentTypes.find(\n          (schema) => schema.uid === attribute.targetModel\n        );\n\n        if (targetSchema) {\n          return {\n            data: Object.entries(targetSchema.attributes).reduce<\n              Array<{ label: string; value: string }>\n            >((acc, [key, attribute]) => {\n              /**\n               * Create the list of attributes from the schema as to which can\n               * be our `mainField` and dictate the display name of the schema\n               * we're editing.\n               */\n              if (!ATTRIBUTE_TYPES_THAT_CANNOT_BE_MAIN_FIELD.includes(attribute.type)) {\n                acc.push({\n                  label: key,\n                  value: key,\n                });\n              }\n\n              return acc;\n            }, []),\n          };\n        }\n      }\n\n      return { data: [] };\n    },\n    skip: attribute?.type !== 'relation',\n  });\n\n  if (!value || value.name === TEMP_FIELD_NAME || !attribute) {\n    // This is very unlikely to happen, but it ensures the form is not opened without a value.\n    console.error(\n      \"You've opened a field to edit without it being part of the form, this is likely a bug with Strapi. Please open an issue.\"\n    );\n\n    toggleNotification({\n      message: formatMessage({\n        id: 'content-manager.containers.edit-settings.modal-form.error',\n        defaultMessage: 'An error occurred while trying to open the form.',\n      }),\n      type: 'danger',\n    });\n\n    return null;\n  }\n\n  return (\n    <ModalLayout onClose={onClose} labelledBy={id}>\n      <Form\n        method=\"PUT\"\n        initialValues={value}\n        validationSchema={FIELD_SCHEMA}\n        onSubmit={(data) => {\n          onChange(name, data);\n          onClose();\n        }}\n      >\n        <ModalHeader>\n          <Flex gap={3}>\n            <FieldTypeIcon type={attribute.type} />\n            <Typography fontWeight=\"bold\" textColor=\"neutral800\" as=\"h2\" id={id}>\n              {formatMessage(\n                {\n                  id: 'content-manager.containers.edit-settings.modal-form.label',\n                  defaultMessage: 'Edit {fieldName}',\n                },\n                { fieldName: capitalise(value.name) }\n              )}\n            </Typography>\n          </Flex>\n        </ModalHeader>\n        <ModalBody>\n          <Grid gap={4}>\n            {[\n              {\n                name: 'label',\n                label: formatMessage({\n                  id: getTranslation('containers.edit-settings.modal-form.label'),\n                  defaultMessage: 'Label',\n                }),\n                size: 6,\n                type: 'string' as const,\n              },\n              {\n                name: 'description',\n                label: formatMessage({\n                  id: getTranslation('containers.edit-settings.modal-form.description'),\n                  defaultMessage: 'Description',\n                }),\n                size: 6,\n                type: 'string' as const,\n              },\n              {\n                name: 'placeholder',\n                label: formatMessage({\n                  id: getTranslation('containers.edit-settings.modal-form.placeholder'),\n                  defaultMessage: 'Placeholder',\n                }),\n                size: 6,\n                type: 'string' as const,\n              },\n              {\n                name: 'editable',\n                label: formatMessage({\n                  id: getTranslation('containers.edit-settings.modal-form.editable'),\n                  defaultMessage: 'Editable',\n                }),\n                size: 6,\n                type: 'boolean' as const,\n              },\n              {\n                name: 'mainField',\n                label: formatMessage({\n                  id: getTranslation('containers.edit-settings.modal-form.mainField'),\n                  defaultMessage: 'Entry title',\n                }),\n                hint: formatMessage({\n                  id: getTranslation(\n                    'containers.SettingPage.edit-settings.modal-form.mainField.hint'\n                  ),\n                  defaultMessage: 'Set the displayed field',\n                }),\n                size: 6,\n                options: mainFieldOptions,\n                type: 'enumeration' as const,\n              },\n              {\n                name: 'size',\n                label: formatMessage({\n                  id: getTranslation('containers.ListSettingsView.modal-form.size'),\n                  defaultMessage: 'Size',\n                }),\n                size: 6,\n                options: [\n                  { value: '4', label: '33%' },\n                  { value: '6', label: '50%' },\n                  { value: '8', label: '66%' },\n                  { value: '12', label: '100%' },\n                ],\n                type: 'enumeration' as const,\n              },\n            ]\n              .filter(filterFieldsBasedOnAttributeType(attribute.type))\n              .map(({ size, ...field }) => (\n                <GridItem key={field.name} col={size}>\n                  <InputRenderer {...field} />\n                </GridItem>\n              ))}\n          </Grid>\n        </ModalBody>\n        <ModalFooter\n          startActions={\n            <Button onClick={onClose} variant=\"tertiary\">\n              {formatMessage({ id: 'app.components.Button.cancel', defaultMessage: 'Cancel' })}\n            </Button>\n          }\n          endActions={\n            <Button type=\"submit\">\n              {formatMessage({ id: 'global.finish', defaultMessage: 'Finish' })}\n            </Button>\n          }\n        />\n      </Form>\n    </ModalLayout>\n  );\n};\n\n/**\n * @internal\n * @description not all edit fields have the same editable properties, it depends on the type\n * e.g. a dynamic zone can only change it's label.\n */\nconst filterFieldsBasedOnAttributeType = (type: Attribute.Kind) => (field: InputProps) => {\n  switch (type) {\n    case 'blocks':\n    case 'richtext':\n      return field.name !== 'size' && field.name !== 'mainField';\n    case 'boolean':\n    case 'media':\n      return field.name !== 'placeholder' && field.name !== 'mainField';\n    case 'component':\n    case 'dynamiczone':\n      return field.name === 'label' || field.name === 'editable';\n    case 'json':\n      return field.name !== 'placeholder' && field.name !== 'mainField' && field.name !== 'size';\n    case 'relation':\n      return true;\n    default:\n      return field.name !== 'mainField';\n  }\n};\n\nexport { EditFieldForm };\nexport type { EditFieldFormProps };\n","import * as React from 'react';\n\nimport {\n  Box,\n  Flex,\n  Grid,\n  GridItem,\n  IconButton,\n  Typography,\n  useComposedRefs,\n} from '@strapi/design-system';\nimport { Link, Menu } from '@strapi/design-system/v2';\nimport { Cog, Cross, Drag, Pencil, Plus } from '@strapi/icons';\nimport { generateNKeysBetween as generateNKeysBetweenImpl } from 'fractional-indexing';\nimport { getEmptyImage } from 'react-dnd-html5-backend';\nimport { useIntl } from 'react-intl';\nimport { NavLink } from 'react-router-dom';\nimport styled from 'styled-components';\n\nimport { useField, useForm } from '../../../components/Form';\nimport { ItemTypes } from '../../constants/dragAndDrop';\nimport { type UseDragAndDropOptions, useDragAndDrop } from '../../hooks/useDragAndDrop';\nimport { getTranslation } from '../../utils/translations';\nimport { ComponentIcon } from '../ComponentIcon';\n\nimport { EditFieldForm, EditFieldFormProps } from './EditFieldForm';\n\nimport type { ConfigurationFormData, EditFieldSpacerLayout } from './Form';\nimport type { EditLayout } from '../../hooks/useDocumentLayout';\n\ntype FormField = ConfigurationFormData['layout'][number]['children'][number];\ntype Field = Omit<ConfigurationFormData['layout'][number]['children'][number], '__temp_key__'>;\n\n/* -------------------------------------------------------------------------------------------------\n * Fields\n * -----------------------------------------------------------------------------------------------*/\n\ninterface FieldsProps extends Pick<EditLayout, 'metadatas'>, Pick<FieldProps, 'components'> {\n  attributes: {\n    [key: string]: FieldProps['attribute'];\n  };\n  fieldSizes: Record<string, number>;\n  components: EditLayout['components'];\n}\n\nconst Fields = ({ attributes, fieldSizes, components, metadatas = {} }: FieldsProps) => {\n  const { formatMessage } = useIntl();\n\n  const layout = useForm<ConfigurationFormData['layout']>(\n    'Fields',\n    (state) => state.values.layout ?? []\n  );\n  const onChange = useForm('Fields', (state) => state.onChange);\n  const addFieldRow = useForm('Fields', (state) => state.addFieldRow);\n  const removeFieldRow = useForm('Fields', (state) => state.removeFieldRow);\n\n  const existingFields = layout.map((row) => row.children.map((field) => field.name)).flat();\n\n  /**\n   * Get the fields that are not already in the layout\n   * But also check that they are visible before we give users\n   * the option to display them. e.g. `id` is not visible.\n   */\n  const remainingFields = Object.entries(metadatas).reduce<Field[]>((acc, current) => {\n    const [name, { visible, ...field }] = current;\n\n    if (!existingFields.includes(name) && visible === true) {\n      const type = attributes[name]?.type;\n      const size = type ? fieldSizes[type] : 12;\n\n      acc.push({\n        ...field,\n        label: field.label ?? name,\n        name,\n        size,\n      });\n    }\n\n    return acc;\n  }, []);\n\n  const handleMoveField: FieldProps['onMoveField'] = (\n    [newRowIndex, newFieldIndex],\n    [currentRowIndex, currentFieldIndex]\n  ) => {\n    /**\n     * Because this view has the constraint that the sum of field sizes cannot be greater\n     * than 12, we don't use the form's method to move field rows, instead, we calculate\n     * the new layout and set the entire form.\n     */\n    const newLayout = structuredClone(layout);\n\n    /**\n     * Remove field from the current layout space using splice so we have the item\n     */\n    const [field] = newLayout[currentRowIndex].children.splice(currentFieldIndex, 1);\n\n    if (!field || field.name === TEMP_FIELD_NAME) {\n      return;\n    }\n\n    const newRow = newLayout[newRowIndex].children;\n    const [newFieldKey] = generateNKeysBetween(newRow, 1, currentFieldIndex, newFieldIndex);\n\n    /**\n     * Next we inject the field into it's new row at it's specified index, we then remove the spaces\n     * if they exist and recalculate into potentially two arrays ONLY if the sizing is now over 12,\n     * the row and the rest of the row that couldn't fit.\n     *\n     * for example, if i have a row of `[{size: 4}, {size: 6}]` and i add `{size: 8}` a index 0,\n     * the new array will look like `[{size: 8}, {size: 4}, {size: 6}]` which breaks the limit of 12,\n     * so instead we make two arrays for the new rows `[[{size: 8}, {size: 4}], [{size: 6}]]` which we\n     * then inject at the original row point with spacers included.\n     */\n    newRow.splice(newFieldIndex, 0, { ...field, __temp_key__: newFieldKey });\n\n    if (newLayout[newRowIndex].children.reduce((acc, curr) => acc + curr.size, 0) > 12) {\n      const recalculatedRows = chunkArray(\n        newLayout[newRowIndex].children.filter((field) => field.name !== TEMP_FIELD_NAME)\n      );\n\n      const rowKeys = generateNKeysBetween(\n        newLayout,\n        recalculatedRows.length,\n        currentRowIndex,\n        newRowIndex\n      );\n\n      newLayout.splice(\n        newRowIndex,\n        1,\n        ...recalculatedRows.map((row, index) => ({\n          __temp_key__: rowKeys[index],\n          children: row,\n        }))\n      );\n    }\n\n    /**\n     * Now we remove our spacers from the rows so we can understand what dead rows exist:\n     * - if there's only spacers left\n     * - there's nothing in the row, e.g. a size 12 field left it.\n     * These rows are then filtered out.\n     * After that, we recalculate the spacers for the rows that need them.\n     */\n    const newLayoutWithSpacers = newLayout\n      .map((row) => ({\n        ...row,\n        children: row.children.filter((field) => field.name !== TEMP_FIELD_NAME),\n      }))\n      .filter((row) => row.children.length > 0)\n      .map((row) => {\n        const totalSpaceTaken = row.children.reduce((acc, curr) => acc + curr.size, 0);\n\n        if (totalSpaceTaken < 12) {\n          const [spacerKey] = generateNKeysBetweenImpl(\n            row.children.at(-1)?.__temp_key__,\n            undefined,\n            1\n          );\n\n          return {\n            ...row,\n            children: [\n              ...row.children,\n              {\n                name: TEMP_FIELD_NAME,\n                size: 12 - totalSpaceTaken,\n                __temp_key__: spacerKey,\n              } satisfies EditFieldSpacerLayout,\n            ],\n          };\n        }\n\n        return row;\n      });\n\n    onChange('layout', newLayoutWithSpacers);\n  };\n\n  const handleRemoveField =\n    (rowIndex: number, fieldIndex: number): FieldProps['onRemoveField'] =>\n    () => {\n      if (layout[rowIndex].children.length === 1) {\n        removeFieldRow(`layout`, rowIndex);\n      } else {\n        onChange(`layout.${rowIndex}.children.${fieldIndex}`, undefined);\n      }\n    };\n\n  const handleAddField = (field: Field) => () => {\n    addFieldRow('layout', { children: [field] });\n  };\n\n  return (\n    <Flex paddingTop={6} direction=\"column\" alignItems=\"stretch\" gap={4}>\n      <Flex alignItems=\"flex-start\" direction=\"column\" justifyContent=\"space-between\">\n        <Typography fontWeight=\"bold\">\n          {formatMessage({\n            id: getTranslation('containers.list.displayedFields'),\n            defaultMessage: 'Displayed fields',\n          })}\n        </Typography>\n        <Typography variant=\"pi\" textColor=\"neutral600\">\n          {formatMessage({\n            id: 'containers.SettingPage.editSettings.description',\n            defaultMessage: 'Drag & drop the fields to build the layout',\n          })}\n        </Typography>\n      </Flex>\n      <Box padding={4} hasRadius borderStyle=\"dashed\" borderWidth=\"1px\" borderColor=\"neutral300\">\n        <Flex direction=\"column\" alignItems=\"stretch\" gap={2}>\n          {layout.map((row, rowIndex) => (\n            <Grid gap={2} key={row.__temp_key__}>\n              {row.children.map(({ size, ...field }, fieldIndex) => (\n                <GridItem key={field.name} col={size}>\n                  <Field\n                    attribute={attributes[field.name]}\n                    components={components}\n                    index={[rowIndex, fieldIndex]}\n                    name={`layout.${rowIndex}.children.${fieldIndex}`}\n                    onMoveField={handleMoveField}\n                    onRemoveField={handleRemoveField(rowIndex, fieldIndex)}\n                  />\n                </GridItem>\n              ))}\n            </Grid>\n          ))}\n          <Menu.Root>\n            <Menu.Trigger\n              startIcon={<Plus />}\n              endIcon={null}\n              disabled={remainingFields.length === 0}\n              fullWidth\n              variant=\"secondary\"\n            >\n              {formatMessage({\n                id: getTranslation('containers.SettingPage.add.field'),\n                defaultMessage: 'Insert another field',\n              })}\n            </Menu.Trigger>\n            <Menu.Content>\n              {remainingFields.map((field) => (\n                <Menu.Item key={field.name} onSelect={handleAddField(field)}>\n                  {field.label}\n                </Menu.Item>\n              ))}\n            </Menu.Content>\n          </Menu.Root>\n        </Flex>\n      </Box>\n    </Flex>\n  );\n};\n\n/**\n * @internal\n * @description Small abstraction to solve within an array of fields where you can\n * add a field to the beginning or start, move back and forth what it's index range\n * should be when calculating it's new temp key\n */\nconst generateNKeysBetween = <Field extends { __temp_key__: string }>(\n  field: Field[],\n  count: number,\n  currInd: number,\n  newInd: number\n) => {\n  const startKey = currInd > newInd ? field[newInd - 1]?.__temp_key__ : field[newInd]?.__temp_key__;\n  const endKey = currInd > newInd ? field[newInd]?.__temp_key__ : field[newInd + 1]?.__temp_key__;\n\n  return generateNKeysBetweenImpl(startKey, endKey, count);\n};\n\n/**\n * @internal\n * @description chunks a row of layouts by the max size we allow, 12. It does not add the\n * spacers again, that should be added separately.\n */\nconst chunkArray = (array: FormField[]) => {\n  const result: Array<FormField[]> = [];\n  let temp: FormField[] = [];\n\n  array.reduce((acc, field) => {\n    if (acc + field.size > 12) {\n      result.push(temp);\n      temp = [field];\n      return field.size;\n    } else {\n      temp.push(field);\n      return acc + field.size;\n    }\n  }, 0);\n\n  if (temp.length > 0) {\n    result.push(temp);\n  }\n\n  return result;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Field\n * -----------------------------------------------------------------------------------------------*/\n\ninterface FieldProps extends Pick<EditFieldFormProps, 'name' | 'attribute'> {\n  components: EditLayout['components'];\n  index: [row: number, index: number];\n  onMoveField: UseDragAndDropOptions<number[]>['onMoveItem'];\n  onRemoveField: React.MouseEventHandler<HTMLButtonElement>;\n}\n\nconst TEMP_FIELD_NAME = '_TEMP_';\n\n/**\n * Displays a field in the layout with drag options, also\n * opens a modal  to edit the details of said field.\n */\nconst Field = ({ attribute, components, name, index, onMoveField, onRemoveField }: FieldProps) => {\n  const [isModalOpen, setIsModalOpen] = React.useState(false);\n  const { formatMessage } = useIntl();\n\n  const { value } = useField<FormField>(name);\n\n  const [{ isDragging }, objectRef, dropRef, dragRef, dragPreviewRef] = useDragAndDrop<\n    Array<number>\n  >(true, {\n    dropSensitivity: 'immediate',\n    type: ItemTypes.EDIT_FIELD,\n    item: { index, label: value?.label, name },\n    index,\n    onMoveItem: onMoveField,\n  });\n\n  React.useEffect(() => {\n    dragPreviewRef(getEmptyImage(), { captureDraggingState: false });\n  }, [dragPreviewRef]);\n\n  const composedRefs = useComposedRefs<HTMLSpanElement>(dragRef, objectRef);\n\n  const handleRemoveField: React.MouseEventHandler<HTMLButtonElement> = (e) => {\n    e.stopPropagation();\n    onRemoveField(e);\n  };\n\n  const tempRefs = useComposedRefs<HTMLSpanElement>(dropRef, objectRef);\n\n  if (!value) {\n    return null;\n  }\n\n  if (value.name === TEMP_FIELD_NAME) {\n    return <Flex as=\"span\" height=\"100%\" style={{ opacity: 0 }} ref={tempRefs} />;\n  }\n\n  return (\n    <>\n      <Flex\n        borderColor=\"neutral150\"\n        background=\"neutral100\"\n        hasRadius\n        style={{ opacity: isDragging ? 0.5 : 1 }}\n        ref={dropRef}\n        gap={3}\n        cursor=\"pointer\"\n        onClick={() => {\n          setIsModalOpen(true);\n        }}\n      >\n        <DragButton\n          as=\"span\"\n          aria-label={formatMessage(\n            {\n              id: getTranslation('components.DraggableCard.move.field'),\n              defaultMessage: 'Move {item}',\n            },\n            { item: value.label }\n          )}\n          onClick={(e) => e.stopPropagation()}\n          ref={composedRefs}\n        >\n          <Drag />\n        </DragButton>\n        <Flex direction=\"column\" alignItems=\"flex-start\" grow={1} overflow=\"hidden\">\n          <Flex gap={3} justifyContent=\"space-between\" width=\"100%\">\n            <Typography ellipsis fontWeight=\"bold\">\n              {value.label}\n            </Typography>\n            <Flex>\n              <IconButton\n                borderWidth={0}\n                background=\"transparent\"\n                onClick={(e) => {\n                  e.stopPropagation();\n                  setIsModalOpen(true);\n                }}\n                aria-label={formatMessage(\n                  {\n                    id: getTranslation('components.DraggableCard.edit.field'),\n                    defaultMessage: 'Edit {item}',\n                  },\n                  { item: value.label }\n                )}\n              >\n                <Pencil />\n              </IconButton>\n              <IconButton\n                borderWidth={0}\n                onClick={handleRemoveField}\n                background=\"transparent\"\n                aria-label={formatMessage(\n                  {\n                    id: getTranslation('components.DraggableCard.delete.field'),\n                    defaultMessage: 'Delete {item}',\n                  },\n                  { item: value.label }\n                )}\n              >\n                <Cross />\n              </IconButton>\n            </Flex>\n          </Flex>\n          {attribute?.type === 'component' ? (\n            <Flex\n              paddingTop={3}\n              paddingRight={3}\n              paddingBottom={3}\n              paddingLeft={0}\n              alignItems=\"flex-start\"\n              direction=\"column\"\n              gap={2}\n              width=\"100%\"\n            >\n              <Grid gap={4} width=\"100%\">\n                {components[attribute.component].layout.map((row) =>\n                  row.map(({ size, ...field }) => (\n                    <GridItem key={field.name} col={size}>\n                      <Flex\n                        alignItems=\"center\"\n                        background=\"neutral0\"\n                        paddingTop={2}\n                        paddingBottom={2}\n                        paddingLeft={3}\n                        paddingRight={3}\n                        hasRadius\n                        borderColor=\"neutral200\"\n                      >\n                        <Typography textColor=\"neutral800\">{field.name}</Typography>\n                      </Flex>\n                    </GridItem>\n                  ))\n                )}\n              </Grid>\n              <Link\n                // used to stop the edit form from appearing when we click here.\n                onClick={(e) => e.stopPropagation()}\n                startIcon={<Cog />}\n                as={NavLink}\n                // @ts-expect-error – DS does not infer props from the `as` prop\n                to={`../components/${attribute.component}/configurations/edit`}\n              >\n                {formatMessage({\n                  id: getTranslation('components.FieldItem.linkToComponentLayout'),\n                  defaultMessage: \"Set the component's layout\",\n                })}\n              </Link>\n            </Flex>\n          ) : null}\n          {attribute?.type === 'dynamiczone' ? (\n            <Flex\n              paddingTop={3}\n              paddingRight={3}\n              paddingBottom={3}\n              paddingLeft={0}\n              alignItems=\"flex-start\"\n              gap={2}\n              width=\"100%\"\n            >\n              {attribute?.components.map((uid) => (\n                <ComponentLink\n                  // used to stop the edit form from appearing when we click here.\n                  onClick={(e) => e.stopPropagation()}\n                  key={uid}\n                  to={`../components/${uid}/configurations/edit`}\n                >\n                  <ComponentIcon icon={components[uid].settings.icon} />\n                  <Typography fontSize={1} textColor=\"neutral600\" fontWeight=\"bold\">\n                    {components[uid].settings.displayName}\n                  </Typography>\n                </ComponentLink>\n              ))}\n            </Flex>\n          ) : null}\n        </Flex>\n      </Flex>\n      {isModalOpen && value.name !== TEMP_FIELD_NAME && (\n        <EditFieldForm attribute={attribute} name={name} onClose={() => setIsModalOpen(false)} />\n      )}\n    </>\n  );\n};\n\nconst DragButton = styled(IconButton)`\n  height: unset;\n  align-self: stretch;\n  display: flex;\n  align-items: center;\n  padding: 0 ${({ theme }) => theme.spaces[3]};\n  border-right: 1px solid ${({ theme }) => theme.colors.neutral150};\n  cursor: all-scroll;\n\n  svg {\n    width: ${12 / 16}rem;\n    height: ${12 / 16}rem;\n  }\n`;\n\nconst ComponentLink = styled(NavLink)`\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  gap: ${({ theme }) => theme.spaces[1]};\n  padding: ${(props) => props.theme.spaces[2]};\n  border: 1px solid ${({ theme }) => theme.colors.neutral200};\n  background: ${({ theme }) => theme.colors.neutral0};\n  width: 8.75rem;\n  border-radius: ${({ theme }) => theme.borderRadius};\n  text-decoration: none;\n\n  &:focus,\n  &:hover {\n    ${({ theme }) => `\n      background-color: ${theme.colors.primary100};\n      border-color: ${theme.colors.primary200};\n\n      ${Typography} {\n          color: ${theme.colors.primary600};\n      }\n    `}\n\n    /* > ComponentIcon */\n    > div:first-child {\n      background: ${({ theme }) => theme.colors.primary200};\n      color: ${({ theme }) => theme.colors.primary600};\n\n      svg {\n        path {\n          fill: ${({ theme }) => theme.colors.primary600};\n        }\n      }\n    }\n  }\n`;\n\nexport { Fields, TEMP_FIELD_NAME };\nexport type { FieldsProps };\n","import * as React from 'react';\n\nimport {\n  Button,\n  ContentLayout,\n  Divider,\n  Flex,\n  Grid,\n  GridItem,\n  HeaderLayout,\n  Layout,\n  Main,\n  Typography,\n} from '@strapi/design-system';\nimport { generateNKeysBetween } from 'fractional-indexing';\nimport pipe from 'lodash/fp/pipe';\nimport { useIntl } from 'react-intl';\n\nimport { Form, FormProps, useForm } from '../../../components/Form';\nimport { InputRenderer } from '../../../components/FormInputs/Renderer';\nimport { BackButton } from '../../../features/BackButton';\nimport { capitalise } from '../../../utils/strings';\nimport { ATTRIBUTE_TYPES_THAT_CANNOT_BE_MAIN_FIELD } from '../../constants/attributes';\nimport { getTranslation } from '../../utils/translations';\n\nimport { Fields, FieldsProps, TEMP_FIELD_NAME } from './Fields';\n\nimport type { EditFieldLayout, EditLayout } from '../../hooks/useDocumentLayout';\n\n/* -------------------------------------------------------------------------------------------------\n * ConfigurationForm\n * -----------------------------------------------------------------------------------------------*/\n\ninterface ConfigurationFormProps extends Pick<FieldsProps, 'attributes' | 'fieldSizes'> {\n  layout: EditLayout;\n  onSubmit: FormProps<ConfigurationFormData>['onSubmit'];\n}\n\n/**\n * Every key in EditFieldLayout is turned to optional never and then we overwrite the ones we are using.\n */\n\ntype EditFieldSpacerLayout = {\n  [key in keyof Omit<EditFieldLayout, 'name' | 'size'>]?: never;\n} & {\n  description?: never;\n  editable?: never;\n  name: '_TEMP_';\n  size: number;\n  __temp_key__: string;\n};\n\ninterface ConfigurationFormData extends Pick<EditLayout, 'settings'> {\n  layout: Array<{\n    __temp_key__: string;\n    children: Array<\n      | (Pick<EditFieldLayout, 'label' | 'size' | 'name' | 'placeholder' | 'mainField'> & {\n          description: EditFieldLayout['hint'];\n          editable: EditFieldLayout['disabled'];\n          __temp_key__: string;\n        })\n      | EditFieldSpacerLayout\n    >;\n  }>;\n}\n\nconst ConfigurationForm = ({\n  attributes,\n  fieldSizes,\n  layout: editLayout,\n  onSubmit,\n}: ConfigurationFormProps) => {\n  const { components, settings, layout, metadatas } = editLayout;\n\n  const { formatMessage } = useIntl();\n\n  const initialValues: ConfigurationFormData = React.useMemo(() => {\n    const transformations = pipe(\n      flattenPanels,\n      replaceMainFieldWithNameOnly,\n      extractMetadata,\n      addTmpSpaceToLayout,\n      addTmpKeysToLayout\n    );\n\n    return {\n      layout: transformations(layout),\n      settings,\n    };\n  }, [layout, settings]);\n\n  return (\n    <Layout>\n      <Main>\n        <Form initialValues={initialValues} onSubmit={onSubmit} method=\"PUT\">\n          <Header name={settings.displayName ?? ''} />\n          <ContentLayout>\n            <Flex\n              alignItems=\"stretch\"\n              background=\"neutral0\"\n              direction=\"column\"\n              gap={6}\n              hasRadius\n              shadow=\"tableShadow\"\n              paddingTop={6}\n              paddingBottom={6}\n              paddingLeft={7}\n              paddingRight={7}\n            >\n              <Typography variant=\"delta\" as=\"h2\">\n                {formatMessage({\n                  id: getTranslation('containers.SettingPage.settings'),\n                  defaultMessage: 'Settings',\n                })}\n              </Typography>\n              <Grid>\n                <GridItem col={6} s={12}>\n                  <InputRenderer\n                    type=\"enumeration\"\n                    label={formatMessage({\n                      id: getTranslation('containers.SettingPage.editSettings.entry.title'),\n                      defaultMessage: 'Entry title',\n                    })}\n                    hint={formatMessage({\n                      id: getTranslation(\n                        'containers.SettingPage.editSettings.entry.title.description'\n                      ),\n                      defaultMessage: 'Set the display field of your entry',\n                    })}\n                    name=\"settings.mainField\"\n                    options={Object.entries(attributes).reduce<\n                      Array<{ label: string; value: string }>\n                    >((acc, [key, attribute]) => {\n                      if (!attribute) {\n                        return acc;\n                      }\n\n                      /**\n                       * Create the list of attributes from the schema as to which can\n                       * be our `mainField` and dictate the display name of the schema\n                       * we're editing.\n                       */\n                      if (!ATTRIBUTE_TYPES_THAT_CANNOT_BE_MAIN_FIELD.includes(attribute.type)) {\n                        acc.push({\n                          label: key,\n                          value: key,\n                        });\n                      }\n\n                      return acc;\n                    }, [])}\n                  />\n                </GridItem>\n                <GridItem paddingTop={6} paddingBottom={6} col={12} s={12}>\n                  <Divider />\n                </GridItem>\n                <GridItem col={12} s={12}>\n                  <Typography variant=\"delta\" as=\"h3\">\n                    {formatMessage({\n                      id: getTranslation('containers.SettingPage.view'),\n                      defaultMessage: 'View',\n                    })}\n                  </Typography>\n                </GridItem>\n                <GridItem col={12} s={12}>\n                  <Fields\n                    attributes={attributes}\n                    components={components}\n                    fieldSizes={fieldSizes}\n                    metadatas={metadatas}\n                  />\n                </GridItem>\n              </Grid>\n            </Flex>\n          </ContentLayout>\n        </Form>\n      </Main>\n    </Layout>\n  );\n};\n\n/**\n * @internal\n * @description Panels don't exist in the layout, so we flatten by one.\n */\nconst flattenPanels = (layout: EditLayout['layout']): EditLayout['layout'][number] =>\n  layout.flat(1);\n\n/**\n * @internal\n * @description We don't need the mainField object in the layout, we only need the name.\n */\nconst replaceMainFieldWithNameOnly = (layout: EditLayout['layout'][number]) =>\n  layout.map((row) =>\n    row.map((field) => ({\n      ...field,\n      mainField: field.mainField?.name,\n    }))\n  );\n\n/**\n * @internal\n * @description We extract the metadata values from the field layout, because these are editable by the user.\n */\nconst extractMetadata = (\n  layout: EditLayout['layout'][number]\n): Array<Exclude<ConfigurationFormData['layout'], { name: '_TEMP_' }>[number]['children']> => {\n  return layout.map((row) =>\n    row.map(({ label, disabled, hint, placeholder, size, name, mainField }) => ({\n      label,\n      editable: !disabled,\n      description: hint,\n      mainField,\n      placeholder,\n      size,\n      name,\n      __temp_key__: '',\n    }))\n  );\n};\n\n/**\n * @internal\n * @description Each row of the layout has a max size of 12 (based on bootstrap grid system)\n * So in order to offer a better drop zone we add the _TEMP_ div to complete the remaining substract (12 - existing)\n */\nconst addTmpSpaceToLayout = (\n  layout: ReturnType<typeof extractMetadata>\n): Array<ConfigurationFormData['layout'][number]['children']> => [\n  ...layout.map((row) => {\n    const totalSpaceTaken = row.reduce((acc, field) => acc + field.size, 0);\n\n    if (totalSpaceTaken < 12) {\n      return [\n        ...row,\n        {\n          name: TEMP_FIELD_NAME,\n          size: 12 - totalSpaceTaken,\n          __temp_key__: '',\n        } satisfies EditFieldSpacerLayout,\n      ];\n    }\n\n    return row;\n  }),\n];\n\n/**\n * @internal\n * @description At this point of the transformations we have Field[][], but each row for the form should have a __temp_key__\n * applied. This means we need to change it so `Field` is nested under the children property.\n */\nconst addTmpKeysToLayout = (\n  layout: ReturnType<typeof addTmpSpaceToLayout>\n): ConfigurationFormData['layout'] => {\n  const keys = generateNKeysBetween(undefined, undefined, layout.length);\n\n  return layout.map((row, rowIndex) => {\n    const fieldKeys = generateNKeysBetween(undefined, undefined, row.length);\n\n    return {\n      __temp_key__: keys[rowIndex],\n      children: row.map((field, fieldIndex) => {\n        return {\n          ...field,\n          __temp_key__: fieldKeys[fieldIndex],\n        };\n      }),\n    };\n  });\n};\n\n/* -------------------------------------------------------------------------------------------------\n * Header\n * -----------------------------------------------------------------------------------------------*/\n\ninterface HeaderProps {\n  name: string;\n}\n\nconst Header = ({ name }: HeaderProps) => {\n  const { formatMessage } = useIntl();\n  const modified = useForm('Header', (state) => state.modified);\n  const isSubmitting = useForm('Header', (state) => state.isSubmitting);\n\n  return (\n    <HeaderLayout\n      title={formatMessage(\n        {\n          id: getTranslation('components.SettingsViewWrapper.pluginHeader.title'),\n          defaultMessage: `Configure the view - {name}`,\n        },\n        { name: capitalise(name) }\n      )}\n      subtitle={formatMessage({\n        id: getTranslation('components.SettingsViewWrapper.pluginHeader.description.edit-settings'),\n        defaultMessage: 'Customize how the edit view will look like.',\n      })}\n      navigationAction={<BackButton />}\n      primaryAction={\n        <Button disabled={!modified} loading={isSubmitting} type=\"submit\">\n          {formatMessage({ id: 'global.save', defaultMessage: 'Save' })}\n        </Button>\n      }\n    />\n  );\n};\n\nexport { ConfigurationForm };\nexport type { ConfigurationFormProps, ConfigurationFormData, EditFieldSpacerLayout };\n"],"names":["attribute","field","generateNKeysBetweenImpl","generateNKeysBetween"],"mappings":"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"}

package/dist/_chunks/History-1AF4LH3c.mjs

@@ -0,0 +1,428 @@
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import * as React from "react";
+import { ContentLayout, Flex, Grid, GridItem, Box, Typography, HeaderLayout, Main } from "@strapi/design-system";
+import { useQueryParams } from "@strapi/helper-plugin";
+import { stringify } from "qs";
+import { Helmet } from "react-helmet";
+import { useIntl } from "react-intl";
+import { useParams, NavLink, Link as Link$1, Navigate } from "react-router-dom";
+import { F as Form, bi as COLLECTION_TYPES, g as getDisplayName, bg as RelativeTime, aD as contentManagerApi, D as createContext, P as Page, as as DocumentRBAC, bj as useDocument, am as useDocumentLayout, aE as buildValidParams } from "./index-5ZvCaCyY.mjs";
+import { u as useSyncRbac } from "./useSyncRbac-Kt8Li0Yf.mjs";
+import { I as InputRenderer } from "./InputRenderer-iP1kRki4.mjs";
+import { Link } from "@strapi/design-system/v2";
+import { ArrowLeft } from "@strapi/icons";
+const UNSUPPORTED_TYPES = ["media", "relation"];
+const CustomInputRenderer = (props) => {
+  if (UNSUPPORTED_TYPES.includes(props.type)) {
+    return /* @__PURE__ */ jsxs(Typography, { children: [
+      "TODO: support ",
+      props.type
+    ] });
+  }
+  return /* @__PURE__ */ jsx(InputRenderer, { ...props });
+};
+const VersionContent = () => {
+  const { version, layout } = useHistoryContext("VersionContent", (state) => ({
+    version: state.selectedVersion,
+    layout: state.layout
+  }));
+  return /* @__PURE__ */ jsx(ContentLayout, { children: /* @__PURE__ */ jsx(Form, { disabled: true, method: "PUT", initialValues: version.data, children: /* @__PURE__ */ jsx(Flex, { direction: "column", alignItems: "stretch", gap: 6, position: "relative", children: layout.map((panel, index) => {
+    if (panel.some((row) => row.some((field) => field.type === "dynamiczone"))) {
+      const [row] = panel;
+      const [field] = row;
+      return /* @__PURE__ */ jsx(Grid, { gap: 4, children: /* @__PURE__ */ jsx(GridItem, { col: 12, s: 12, xs: 12, children: /* @__PURE__ */ jsx(CustomInputRenderer, { ...field }) }) }, field.name);
+    }
+    return /* @__PURE__ */ jsx(
+      Box,
+      {
+        hasRadius: true,
+        background: "neutral0",
+        shadow: "tableShadow",
+        paddingLeft: 6,
+        paddingRight: 6,
+        paddingTop: 6,
+        paddingBottom: 6,
+        borderColor: "neutral150",
+        children: /* @__PURE__ */ jsx(Flex, { direction: "column", alignItems: "stretch", gap: 6, children: panel.map((row, gridRowIndex) => /* @__PURE__ */ jsx(Grid, { gap: 4, children: row.map(({ size, ...field }) => {
+          return /* @__PURE__ */ jsx(GridItem, { col: size, s: 12, xs: 12, children: /* @__PURE__ */ jsx(CustomInputRenderer, { ...field }) }, field.name);
+        }) }, gridRowIndex)) })
+      },
+      index
+    );
+  }) }) }) });
+};
+const VersionHeader = ({ headerId }) => {
+  const { formatMessage, formatDate } = useIntl();
+  const { version, mainField, schema } = useHistoryContext("VersionHeader", (state) => ({
+    version: state.selectedVersion,
+    mainField: state.mainField,
+    schema: state.schema
+  }));
+  const [{ query }] = useQueryParams();
+  const { collectionType } = useParams();
+  const mainFieldValue = version.data[mainField];
+  const getBackLink = () => {
+    const pluginsQueryParams = stringify({ plugins: query.plugins }, { encode: false });
+    if (collectionType === COLLECTION_TYPES) {
+      return {
+        pathname: `../${collectionType}/${version.contentType}/${version.relatedDocumentId}`,
+        search: pluginsQueryParams
+      };
+    }
+    return {
+      pathname: `../${collectionType}/${version.contentType}`,
+      search: pluginsQueryParams
+    };
+  };
+  return /* @__PURE__ */ jsx(
+    HeaderLayout,
+    {
+      id: headerId,
+      title: formatDate(new Date(version.createdAt), {
+        year: "numeric",
+        month: "numeric",
+        day: "numeric",
+        hour: "numeric",
+        minute: "numeric"
+      }),
+      subtitle: /* @__PURE__ */ jsx(Typography, { variant: "epsilon", children: formatMessage(
+        {
+          id: "content-manager.history.version.subtitle",
+          defaultMessage: "{hasLocale, select, true {{subtitle}, in {locale}} other {{subtitle}}}"
+        },
+        {
+          hasLocale: Boolean(version.locale),
+          subtitle: `${mainFieldValue || ""} (${schema.info.singularName})`.trim(),
+          locale: version.locale?.name
+        }
+      ) }),
+      navigationAction: /* @__PURE__ */ jsx(
+        Link,
+        {
+          startIcon: /* @__PURE__ */ jsx(ArrowLeft, {}),
+          as: NavLink,
+          to: getBackLink(),
+          children: formatMessage({
+            id: "global.back",
+            defaultMessage: "Back"
+          })
+        }
+      )
+    }
+  );
+};
+const BlueText = (children) => /* @__PURE__ */ jsx(Typography, { textColor: "primary600", children });
+const VersionCard = ({ version, isCurrent }) => {
+  const { formatDate, formatMessage } = useIntl();
+  const [{ query }] = useQueryParams();
+  const statusData = (() => {
+    switch (version.status) {
+      case "draft":
+        return {
+          background: "secondary100",
+          border: "secondary200",
+          text: "secondary700",
+          message: {
+            id: "content-manager.containers.List.draft",
+            defaultMessage: "Draft"
+          }
+        };
+      case "modified":
+        return {
+          background: "alternative100",
+          border: "alternative200",
+          text: "alternative700",
+          message: {
+            // TODO: check the translation key once D&P v5 is done
+            id: "content-manager.containers.List.modified",
+            defaultMessage: "Modified"
+          }
+        };
+      case "published":
+      default:
+        return {
+          background: "success100",
+          border: "success200",
+          text: "success700",
+          message: {
+            id: "content-manager.containers.List.published",
+            defaultMessage: "Published"
+          }
+        };
+    }
+  })();
+  const isActive = query.id === version.id.toString();
+  const author = version.createdBy && getDisplayName(version.createdBy, formatMessage);
+  return /* @__PURE__ */ jsxs(
+    Flex,
+    {
+      direction: "column",
+      alignItems: "flex-start",
+      gap: 3,
+      hasRadius: true,
+      borderWidth: "1px",
+      borderStyle: "solid",
+      borderColor: isActive ? "primary600" : "neutral200",
+      paddingTop: 5,
+      paddingBottom: 5,
+      paddingLeft: 5,
+      paddingRight: 5,
+      as: Link$1,
+      to: `?${stringify({ ...query, id: version.id })}`,
+      style: { textDecoration: "none" },
+      children: [
+        /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: 1, alignItems: "flex-start", children: [
+          /* @__PURE__ */ jsx(Typography, { as: "h3", fontWeight: "semiBold", children: formatDate(version.createdAt, {
+            day: "numeric",
+            month: "numeric",
+            year: "numeric",
+            hour: "2-digit",
+            minute: "2-digit"
+          }) }),
+          /* @__PURE__ */ jsx(Typography, { as: "p", textColor: "neutral600", children: formatMessage(
+            {
+              id: "content-manager.history.sidebar.versionDescription",
+              defaultMessage: "{distanceToNow}{isAnonymous, select, true {} other { by {author}}}{isCurrent, select, true { <b>(current)</b>} other {}}"
+            },
+            {
+              distanceToNow: /* @__PURE__ */ jsx(RelativeTime, { timestamp: new Date(version.createdAt) }),
+              author,
+              isAnonymous: !Boolean(version.createdBy),
+              isCurrent,
+              b: BlueText
+            }
+          ) })
+        ] }),
+        version.status && /* @__PURE__ */ jsx(
+          Box,
+          {
+            background: statusData.background,
+            borderStyle: "solid",
+            borderWidth: "1px",
+            borderColor: statusData.border,
+            hasRadius: true,
+            paddingLeft: "6px",
+            paddingRight: "6px",
+            paddingTop: "2px",
+            paddingBottom: "2px",
+            children: /* @__PURE__ */ jsx(Typography, { variant: "pi", fontWeight: "bold", textColor: statusData.text, children: formatMessage(statusData.message) })
+          }
+        )
+      ]
+    }
+  );
+};
+const PaginationButton = ({ page, children }) => {
+  const [{ query }] = useQueryParams();
+  const { id: _id, ...queryRest } = query;
+  return /* @__PURE__ */ jsx(Link$1, { to: { search: stringify({ ...queryRest, page }) }, style: { textDecoration: "none" }, children: /* @__PURE__ */ jsx(Typography, { variant: "omega", textColor: "primary600", children }) });
+};
+const VersionsList = () => {
+  const { formatMessage } = useIntl();
+  const { versions, page } = useHistoryContext("VersionsList", (state) => ({
+    versions: state.versions,
+    page: state.page
+  }));
+  return /* @__PURE__ */ jsxs(
+    Flex,
+    {
+      shrink: 0,
+      direction: "column",
+      alignItems: "stretch",
+      width: "320px",
+      height: "100vh",
+      background: "neutral0",
+      borderColor: "neutral200",
+      borderWidth: "0 0 0 1px",
+      borderStyle: "solid",
+      as: "aside",
+      children: [
+        /* @__PURE__ */ jsxs(
+          Flex,
+          {
+            direction: "row",
+            justifyContent: "space-between",
+            padding: 4,
+            borderColor: "neutral200",
+            borderWidth: "0 0 1px",
+            borderStyle: "solid",
+            as: "header",
+            children: [
+              /* @__PURE__ */ jsx(Typography, { as: "h2", variant: "omega", fontWeight: "semiBold", children: formatMessage({
+                id: "content-manager.history.sidebar.title",
+                defaultMessage: "Versions"
+              }) }),
+              /* @__PURE__ */ jsx(Box, { background: "neutral150", hasRadius: true, padding: 1, children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", textColor: "neutral600", children: versions.meta.pagination.total }) })
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(Box, { flex: 1, overflow: "auto", children: [
+          versions.meta.pagination.page > 1 && /* @__PURE__ */ jsx(Box, { paddingTop: 4, textAlign: "center", children: /* @__PURE__ */ jsx(PaginationButton, { page: page - 1, children: formatMessage({
+            id: "content-manager.history.sidebar.show-newer",
+            defaultMessage: "Show newer versions"
+          }) }) }),
+          /* @__PURE__ */ jsx(
+            Flex,
+            {
+              direction: "column",
+              gap: 3,
+              paddingTop: 5,
+              paddingBottom: 5,
+              paddingLeft: 4,
+              paddingRight: 4,
+              as: "ul",
+              alignItems: "stretch",
+              children: versions.data.map((version, index) => /* @__PURE__ */ jsx(
+                "li",
+                {
+                  "aria-label": formatMessage({
+                    id: "content-manager.history.sidebar.title.version-card.aria-label",
+                    defaultMessage: "Version card"
+                  }),
+                  children: /* @__PURE__ */ jsx(VersionCard, { version, isCurrent: page === 1 && index === 0 })
+                },
+                version.id
+              ))
+            }
+          ),
+          versions.meta.pagination.page < versions.meta.pagination.pageCount && /* @__PURE__ */ jsx(Box, { paddingBottom: 5, textAlign: "center", children: /* @__PURE__ */ jsx(PaginationButton, { page: page + 1, children: formatMessage({
+            id: "content-manager.history.sidebar.show-older",
+            defaultMessage: "Show older versions"
+          }) }) })
+        ] })
+      ]
+    }
+  );
+};
+const historyVersionsApi = contentManagerApi.injectEndpoints({
+  endpoints: (builder) => ({
+    getHistoryVersions: builder.query({
+      query(params) {
+        return {
+          url: `/content-manager/history-versions`,
+          method: "GET",
+          config: {
+            params
+          }
+        };
+      },
+      providesTags: ["HistoryVersion"]
+    })
+  })
+});
+const { useGetHistoryVersionsQuery } = historyVersionsApi;
+const [HistoryProvider, useHistoryContext] = createContext("HistoryPage");
+const HistoryPage = () => {
+  const headerId = React.useId();
+  const { formatMessage } = useIntl();
+  const {
+    slug,
+    id: documentId,
+    collectionType
+  } = useParams();
+  const { isLoading: isLoadingDocument, schema } = useDocument({
+    collectionType,
+    model: slug
+  });
+  const {
+    isLoading: isLoadingLayout,
+    edit: {
+      layout,
+      settings: { displayName, mainField }
+    }
+  } = useDocumentLayout(slug);
+  const [{ query }] = useQueryParams();
+  const { id: selectedVersionId, ...queryWithoutId } = query;
+  const validQueryParamsWithoutId = buildValidParams(queryWithoutId);
+  const page = validQueryParamsWithoutId.page ? Number(validQueryParamsWithoutId.page) : 1;
+  const versionsResponse = useGetHistoryVersionsQuery(
+    {
+      contentType: slug,
+      ...documentId ? { documentId } : {},
+      // Omit id since it's not needed by the endpoint and caused extra refetches
+      ...validQueryParamsWithoutId
+    },
+    { refetchOnMountOrArgChange: true }
+  );
+  const initialRequestId = React.useRef(versionsResponse.requestId);
+  const isStaleRequest = versionsResponse.requestId === initialRequestId.current;
+  if (!slug || collectionType === COLLECTION_TYPES && !documentId) {
+    return /* @__PURE__ */ jsx(Navigate, { to: "/content-manager" });
+  }
+  if (isLoadingDocument || isLoadingLayout || versionsResponse.isFetching || isStaleRequest) {
+    return /* @__PURE__ */ jsx(Page.Loading, {});
+  }
+  if (!versionsResponse.isError && !versionsResponse.data?.data?.length) {
+    return /* @__PURE__ */ jsx(Page.NoData, {});
+  }
+  if (versionsResponse.data?.data?.length && !selectedVersionId) {
+    return /* @__PURE__ */ jsx(
+      Navigate,
+      {
+        to: { search: stringify({ ...query, id: versionsResponse.data.data[0].id }) },
+        replace: true
+      }
+    );
+  }
+  const selectedVersion = versionsResponse.data?.data?.find(
+    (version) => version.id.toString() === selectedVersionId
+  );
+  if (versionsResponse.isError || !layout || !schema || !selectedVersion || // This should not happen as it's covered by versionsResponse.isError, but we need it for TS
+  versionsResponse.data.error) {
+    return /* @__PURE__ */ jsx(Page.Error, {});
+  }
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      Helmet,
+      {
+        title: formatMessage(
+          {
+            id: "content-manager.history.page-title",
+            defaultMessage: "{contentType} history"
+          },
+          {
+            contentType: displayName
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      HistoryProvider,
+      {
+        contentType: slug,
+        id: documentId,
+        schema,
+        layout,
+        selectedVersion,
+        versions: versionsResponse.data,
+        page,
+        mainField,
+        children: /* @__PURE__ */ jsxs(Flex, { direction: "row", alignItems: "flex-start", children: [
+          /* @__PURE__ */ jsxs(Main, { grow: 1, height: "100vh", overflow: "auto", labelledBy: headerId, children: [
+            /* @__PURE__ */ jsx(VersionHeader, { headerId }),
+            /* @__PURE__ */ jsx(VersionContent, {})
+          ] }),
+          /* @__PURE__ */ jsx(VersionsList, {})
+        ] })
+      }
+    )
+  ] });
+};
+const ProtectedHistoryPage = () => {
+  const { slug } = useParams();
+  const [{ query }] = useQueryParams();
+  const { permissions = [], isLoading, isError } = useSyncRbac(slug ?? "", query, "History");
+  if (isLoading) {
+    return /* @__PURE__ */ jsx(Page.Loading, {});
+  }
+  if (!isLoading && isError || !slug) {
+    return /* @__PURE__ */ jsx(Box, { height: "100vh", children: /* @__PURE__ */ jsx(Page.Error, {}) });
+  }
+  return /* @__PURE__ */ jsx(Box, { height: "100vh", children: /* @__PURE__ */ jsx(Page.Protect, { permissions, children: ({ permissions: permissions2 }) => /* @__PURE__ */ jsx(DocumentRBAC, { permissions: permissions2, children: /* @__PURE__ */ jsx(HistoryPage, {}) }) }) });
+};
+export {
+  HistoryProvider,
+  ProtectedHistoryPage,
+  useHistoryContext
+};
+//# sourceMappingURL=History-1AF4LH3c.mjs.map

package/dist/_chunks/History-1AF4LH3c.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"History-1AF4LH3c.mjs","sources":["../../admin/src/content-manager/history/components/VersionContent.tsx","../../admin/src/content-manager/history/components/VersionHeader.tsx","../../admin/src/content-manager/history/components/VersionsList.tsx","../../admin/src/content-manager/history/services/historyVersion.ts","../../admin/src/content-manager/history/pages/History.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport { Box, ContentLayout, Flex, Grid, GridItem, Typography } from '@strapi/design-system';\n\nimport { Form } from '../../../components/Form';\nimport {\n  InputRenderer,\n  type InputRendererProps,\n} from '../../pages/EditView/components/InputRenderer';\nimport { useHistoryContext } from '../pages/History';\n\n/* -------------------------------------------------------------------------------------------------\n * CustomInputRenderer\n * -----------------------------------------------------------------------------------------------*/\n\n// The renderers for these types will be added in future PRs, they need special handling\nconst UNSUPPORTED_TYPES = ['media', 'relation'];\n\nconst CustomInputRenderer = (props: InputRendererProps) => {\n  if (UNSUPPORTED_TYPES.includes(props.type)) {\n    return <Typography>TODO: support {props.type}</Typography>;\n  }\n\n  return <InputRenderer {...props} />;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * VersionContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst VersionContent = () => {\n  const { version, layout } = useHistoryContext('VersionContent', (state) => ({\n    version: state.selectedVersion,\n    layout: state.layout,\n  }));\n\n  return (\n    <ContentLayout>\n      <Form disabled={true} method=\"PUT\" initialValues={version.data}>\n        <Flex direction=\"column\" alignItems=\"stretch\" gap={6} position=\"relative\">\n          {layout.map((panel, index) => {\n            if (panel.some((row) => row.some((field) => field.type === 'dynamiczone'))) {\n              const [row] = panel;\n              const [field] = row;\n\n              return (\n                <Grid key={field.name} gap={4}>\n                  <GridItem col={12} s={12} xs={12}>\n                    <CustomInputRenderer {...field} />\n                  </GridItem>\n                </Grid>\n              );\n            }\n\n            return (\n              <Box\n                key={index}\n                hasRadius\n                background=\"neutral0\"\n                shadow=\"tableShadow\"\n                paddingLeft={6}\n                paddingRight={6}\n                paddingTop={6}\n                paddingBottom={6}\n                borderColor=\"neutral150\"\n              >\n                <Flex direction=\"column\" alignItems=\"stretch\" gap={6}>\n                  {panel.map((row, gridRowIndex) => (\n                    <Grid key={gridRowIndex} gap={4}>\n                      {row.map(({ size, ...field }) => {\n                        return (\n                          <GridItem col={size} key={field.name} s={12} xs={12}>\n                            <CustomInputRenderer {...field} />\n                          </GridItem>\n                        );\n                      })}\n                    </Grid>\n                  ))}\n                </Flex>\n              </Box>\n            );\n          })}\n        </Flex>\n      </Form>\n    </ContentLayout>\n  );\n};\n\nexport { VersionContent };\n","import * as React from 'react';\n\nimport { HeaderLayout, Typography } from '@strapi/design-system';\nimport { Link } from '@strapi/design-system/v2';\nimport { useQueryParams } from '@strapi/helper-plugin';\nimport { ArrowLeft } from '@strapi/icons';\nimport { stringify } from 'qs';\nimport { useIntl } from 'react-intl';\nimport { NavLink, useParams, type To } from 'react-router-dom';\n\nimport { COLLECTION_TYPES } from '../../constants/collections';\nimport { useHistoryContext } from '../pages/History';\n\ninterface VersionHeaderProps {\n  headerId: string;\n}\n\nexport const VersionHeader = ({ headerId }: VersionHeaderProps) => {\n  const { formatMessage, formatDate } = useIntl();\n  const { version, mainField, schema } = useHistoryContext('VersionHeader', (state) => ({\n    version: state.selectedVersion,\n    mainField: state.mainField,\n    schema: state.schema,\n  }));\n  const [{ query }] = useQueryParams<{\n    plugins?: Record<string, unknown>;\n  }>();\n  const { collectionType } = useParams<{ collectionType: string }>();\n\n  const mainFieldValue = version.data[mainField];\n\n  const getBackLink = (): To => {\n    const pluginsQueryParams = stringify({ plugins: query.plugins }, { encode: false });\n\n    if (collectionType === COLLECTION_TYPES) {\n      return {\n        pathname: `../${collectionType}/${version.contentType}/${version.relatedDocumentId}`,\n        search: pluginsQueryParams,\n      };\n    }\n\n    return {\n      pathname: `../${collectionType}/${version.contentType}`,\n      search: pluginsQueryParams,\n    };\n  };\n\n  return (\n    <HeaderLayout\n      id={headerId}\n      title={formatDate(new Date(version.createdAt), {\n        year: 'numeric',\n        month: 'numeric',\n        day: 'numeric',\n        hour: 'numeric',\n        minute: 'numeric',\n      })}\n      subtitle={\n        <Typography variant=\"epsilon\">\n          {formatMessage(\n            {\n              id: 'content-manager.history.version.subtitle',\n              defaultMessage:\n                '{hasLocale, select, true {{subtitle}, in {locale}} other {{subtitle}}}',\n            },\n            {\n              hasLocale: Boolean(version.locale),\n              subtitle: `${mainFieldValue || ''} (${schema.info.singularName})`.trim(),\n              locale: version.locale?.name,\n            }\n          )}\n        </Typography>\n      }\n      navigationAction={\n        <Link\n          startIcon={<ArrowLeft />}\n          as={NavLink}\n          // @ts-expect-error - types are not inferred correctly through the as prop.\n          to={getBackLink()}\n        >\n          {formatMessage({\n            id: 'global.back',\n            defaultMessage: 'Back',\n          })}\n        </Link>\n      }\n    />\n  );\n};\n","import * as React from 'react';\n\nimport { Box, Flex, Typography, type BoxProps } from '@strapi/design-system';\nimport { useQueryParams } from '@strapi/helper-plugin';\nimport { stringify } from 'qs';\nimport { type MessageDescriptor, useIntl } from 'react-intl';\nimport { Link } from 'react-router-dom';\n\nimport { RelativeTime } from '../../../components/RelativeTime';\nimport { getDisplayName } from '../../../utils/users';\nimport { useHistoryContext } from '../pages/History';\n\nimport type { Contracts } from '@strapi/plugin-content-manager/_internal/shared';\n\n/* -------------------------------------------------------------------------------------------------\n * BlueText\n * -----------------------------------------------------------------------------------------------*/\n\nconst BlueText = (children: React.ReactNode) => (\n  <Typography textColor=\"primary600\">{children}</Typography>\n);\n\n/* -------------------------------------------------------------------------------------------------\n * VersionCard\n * -----------------------------------------------------------------------------------------------*/\n\ninterface StatusData {\n  background: BoxProps['background'];\n  border: BoxProps['borderColor'];\n  text: BoxProps['color'];\n  message: MessageDescriptor;\n}\n\ninterface VersionCardProps {\n  version: Contracts.HistoryVersions.HistoryVersionDataResponse;\n  isCurrent: boolean;\n}\n\nconst VersionCard = ({ version, isCurrent }: VersionCardProps) => {\n  const { formatDate, formatMessage } = useIntl();\n  const [{ query }] = useQueryParams<{ id?: string }>();\n\n  const statusData = ((): StatusData => {\n    switch (version.status) {\n      case 'draft':\n        return {\n          background: 'secondary100',\n          border: 'secondary200',\n          text: 'secondary700',\n          message: {\n            id: 'content-manager.containers.List.draft',\n            defaultMessage: 'Draft',\n          },\n        };\n      case 'modified':\n        return {\n          background: 'alternative100',\n          border: 'alternative200',\n          text: 'alternative700',\n          message: {\n            // TODO: check the translation key once D&P v5 is done\n            id: 'content-manager.containers.List.modified',\n            defaultMessage: 'Modified',\n          },\n        };\n      case 'published':\n      default:\n        return {\n          background: 'success100',\n          border: 'success200',\n          text: 'success700',\n          message: {\n            id: 'content-manager.containers.List.published',\n            defaultMessage: 'Published',\n          },\n        };\n    }\n  })();\n  const isActive = query.id === version.id.toString();\n  const author = version.createdBy && getDisplayName(version.createdBy, formatMessage);\n\n  return (\n    <Flex\n      direction=\"column\"\n      alignItems=\"flex-start\"\n      gap={3}\n      hasRadius\n      borderWidth=\"1px\"\n      borderStyle=\"solid\"\n      borderColor={isActive ? 'primary600' : 'neutral200'}\n      paddingTop={5}\n      paddingBottom={5}\n      paddingLeft={5}\n      paddingRight={5}\n      as={Link}\n      to={`?${stringify({ ...query, id: version.id })}`}\n      style={{ textDecoration: 'none' }}\n    >\n      <Flex direction=\"column\" gap={1} alignItems=\"flex-start\">\n        <Typography as=\"h3\" fontWeight=\"semiBold\">\n          {formatDate(version.createdAt, {\n            day: 'numeric',\n            month: 'numeric',\n            year: 'numeric',\n            hour: '2-digit',\n            minute: '2-digit',\n          })}\n        </Typography>\n        <Typography as=\"p\" textColor=\"neutral600\">\n          {formatMessage(\n            {\n              id: 'content-manager.history.sidebar.versionDescription',\n              defaultMessage:\n                '{distanceToNow}{isAnonymous, select, true {} other { by {author}}}{isCurrent, select, true { <b>(current)</b>} other {}}',\n            },\n            {\n              distanceToNow: <RelativeTime timestamp={new Date(version.createdAt)} />,\n              author,\n              isAnonymous: !Boolean(version.createdBy),\n              isCurrent,\n              b: BlueText,\n            }\n          )}\n        </Typography>\n      </Flex>\n      {version.status && (\n        <Box\n          background={statusData.background}\n          borderStyle=\"solid\"\n          borderWidth=\"1px\"\n          borderColor={statusData.border}\n          hasRadius\n          paddingLeft=\"6px\"\n          paddingRight=\"6px\"\n          paddingTop=\"2px\"\n          paddingBottom=\"2px\"\n        >\n          <Typography variant=\"pi\" fontWeight=\"bold\" textColor={statusData.text}>\n            {formatMessage(statusData.message)}\n          </Typography>\n        </Box>\n      )}\n    </Flex>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * PaginationButton\n * -----------------------------------------------------------------------------------------------*/\n\ninterface PaginationButtonProps {\n  page: number;\n  children: React.ReactNode;\n}\n\nconst PaginationButton = ({ page, children }: PaginationButtonProps) => {\n  const [{ query }] = useQueryParams<{ id?: string }>();\n\n  // Remove the id from the pagination link, so that the history page can redirect\n  // to the id of the first history version in the new page once it's loaded\n  const { id: _id, ...queryRest } = query;\n\n  return (\n    <Link to={{ search: stringify({ ...queryRest, page }) }} style={{ textDecoration: 'none' }}>\n      <Typography variant=\"omega\" textColor=\"primary600\">\n        {children}\n      </Typography>\n    </Link>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * VersionsList\n * -----------------------------------------------------------------------------------------------*/\n\nconst VersionsList = () => {\n  const { formatMessage } = useIntl();\n  const { versions, page } = useHistoryContext('VersionsList', (state) => ({\n    versions: state.versions,\n    page: state.page,\n  }));\n\n  return (\n    <Flex\n      shrink={0}\n      direction=\"column\"\n      alignItems=\"stretch\"\n      width=\"320px\"\n      height=\"100vh\"\n      background=\"neutral0\"\n      borderColor=\"neutral200\"\n      borderWidth=\"0 0 0 1px\"\n      borderStyle=\"solid\"\n      as=\"aside\"\n    >\n      <Flex\n        direction=\"row\"\n        justifyContent=\"space-between\"\n        padding={4}\n        borderColor=\"neutral200\"\n        borderWidth=\"0 0 1px\"\n        borderStyle=\"solid\"\n        as=\"header\"\n      >\n        <Typography as=\"h2\" variant=\"omega\" fontWeight=\"semiBold\">\n          {formatMessage({\n            id: 'content-manager.history.sidebar.title',\n            defaultMessage: 'Versions',\n          })}\n        </Typography>\n        <Box background=\"neutral150\" hasRadius padding={1}>\n          <Typography variant=\"sigma\" textColor=\"neutral600\">\n            {versions.meta.pagination.total}\n          </Typography>\n        </Box>\n      </Flex>\n      <Box flex={1} overflow=\"auto\">\n        {versions.meta.pagination.page > 1 && (\n          <Box paddingTop={4} textAlign=\"center\">\n            <PaginationButton page={page - 1}>\n              {formatMessage({\n                id: 'content-manager.history.sidebar.show-newer',\n                defaultMessage: 'Show newer versions',\n              })}\n            </PaginationButton>\n          </Box>\n        )}\n        <Flex\n          direction=\"column\"\n          gap={3}\n          paddingTop={5}\n          paddingBottom={5}\n          paddingLeft={4}\n          paddingRight={4}\n          as=\"ul\"\n          alignItems=\"stretch\"\n        >\n          {versions.data.map((version, index) => (\n            <li\n              key={version.id}\n              aria-label={formatMessage({\n                id: 'content-manager.history.sidebar.title.version-card.aria-label',\n                defaultMessage: 'Version card',\n              })}\n            >\n              <VersionCard version={version} isCurrent={page === 1 && index === 0} />\n            </li>\n          ))}\n        </Flex>\n        {versions.meta.pagination.page < versions.meta.pagination.pageCount && (\n          <Box paddingBottom={5} textAlign=\"center\">\n            <PaginationButton page={page + 1}>\n              {formatMessage({\n                id: 'content-manager.history.sidebar.show-older',\n                defaultMessage: 'Show older versions',\n              })}\n            </PaginationButton>\n          </Box>\n        )}\n      </Box>\n    </Flex>\n  );\n};\n\nexport { VersionsList };\n","import { Contracts } from '@strapi/plugin-content-manager/_internal/shared';\n\nimport { contentManagerApi } from '../../services/api';\n\nconst historyVersionsApi = contentManagerApi.injectEndpoints({\n  endpoints: (builder) => ({\n    getHistoryVersions: builder.query<\n      Contracts.HistoryVersions.GetHistoryVersions.Response,\n      Contracts.HistoryVersions.GetHistoryVersions.Request['query']\n    >({\n      query(params) {\n        return {\n          url: `/content-manager/history-versions`,\n          method: 'GET',\n          config: {\n            params,\n          },\n        };\n      },\n      providesTags: ['HistoryVersion'],\n    }),\n  }),\n});\n\nconst { useGetHistoryVersionsQuery } = historyVersionsApi;\n\nexport { useGetHistoryVersionsQuery };\n","import * as React from 'react';\n\nimport { Box, Flex, Main } from '@strapi/design-system';\nimport { useQueryParams } from '@strapi/helper-plugin';\nimport { Contracts } from '@strapi/plugin-content-manager/_internal/shared';\nimport { stringify } from 'qs';\nimport { Helmet } from 'react-helmet';\nimport { useIntl } from 'react-intl';\nimport { Navigate, useParams } from 'react-router-dom';\n\nimport { createContext } from '../../../components/Context';\nimport { Page } from '../../../components/PageHelpers';\nimport { COLLECTION_TYPES } from '../../constants/collections';\nimport { DocumentRBAC } from '../../features/DocumentRBAC';\nimport { useDocument } from '../../hooks/useDocument';\nimport { type EditLayout, useDocumentLayout } from '../../hooks/useDocumentLayout';\nimport { useSyncRbac } from '../../hooks/useSyncRbac';\nimport { buildValidParams } from '../../utils/api';\nimport { VersionContent } from '../components/VersionContent';\nimport { VersionHeader } from '../components/VersionHeader';\nimport { VersionsList } from '../components/VersionsList';\nimport { useGetHistoryVersionsQuery } from '../services/historyVersion';\n\nimport type { UID } from '@strapi/types';\n\n/* -------------------------------------------------------------------------------------------------\n * HistoryProvider\n * -----------------------------------------------------------------------------------------------*/\n\ninterface HistoryContextValue {\n  contentType: UID.ContentType;\n  id?: string; // null for single types\n  layout: EditLayout['layout'];\n  selectedVersion: Contracts.HistoryVersions.HistoryVersionDataResponse;\n  // Errors are handled outside of the provider, so we exclude errors from the response type\n  versions: Extract<\n    Contracts.HistoryVersions.GetHistoryVersions.Response,\n    { data: Array<Contracts.HistoryVersions.HistoryVersionDataResponse> }\n  >;\n  page: number;\n  mainField: string;\n  schema: Contracts.ContentTypes.ContentType;\n}\n\nconst [HistoryProvider, useHistoryContext] = createContext<HistoryContextValue>('HistoryPage');\n\n/* -------------------------------------------------------------------------------------------------\n * HistoryPage\n * -----------------------------------------------------------------------------------------------*/\n\nconst HistoryPage = () => {\n  const headerId = React.useId();\n  const { formatMessage } = useIntl();\n  const {\n    slug,\n    id: documentId,\n    collectionType,\n  } = useParams<{\n    collectionType: string;\n    slug: UID.ContentType;\n    id: string;\n  }>();\n\n  const { isLoading: isLoadingDocument, schema } = useDocument({\n    collectionType: collectionType!,\n    model: slug!,\n  });\n\n  const {\n    isLoading: isLoadingLayout,\n    edit: {\n      layout,\n      settings: { displayName, mainField },\n    },\n  } = useDocumentLayout(slug!);\n\n  // Parse state from query params\n  const [{ query }] = useQueryParams<{\n    page?: number;\n    id?: string;\n    plugins?: Record<string, unknown>;\n  }>();\n  const { id: selectedVersionId, ...queryWithoutId } = query;\n  const validQueryParamsWithoutId = buildValidParams(queryWithoutId);\n  const page = validQueryParamsWithoutId.page ? Number(validQueryParamsWithoutId.page) : 1;\n\n  const versionsResponse = useGetHistoryVersionsQuery(\n    {\n      contentType: slug!,\n      ...(documentId ? { documentId } : {}),\n      // Omit id since it's not needed by the endpoint and caused extra refetches\n      ...validQueryParamsWithoutId,\n    },\n    { refetchOnMountOrArgChange: true }\n  );\n\n  /**\n   * When the page is first mounted, if there's already data in the cache, RTK has a fullfilled\n   * status for the first render, right before it triggers a new request. This means the code\n   * briefly reaches the part that redirects to the first history version (if none is set).\n   * But since that data is stale, that means auto-selecting a version that may not be the most\n   * recent. To avoid this, we identify through requestId if the query is stale despite the\n   * fullfilled status, and show the loader in that case.\n   * This means we essentially don't want cache. We always refetch when the page mounts, and\n   * we always show the loader until we have the most recent data. That's fine for this page.\n   */\n  const initialRequestId = React.useRef(versionsResponse.requestId);\n  const isStaleRequest = versionsResponse.requestId === initialRequestId.current;\n\n  /**\n   * Ensure that we have the necessary data to render the page:\n   * - slug for single types\n   * - slug _and_ documentId for collection types\n   */\n  if (!slug || (collectionType === COLLECTION_TYPES && !documentId)) {\n    return <Navigate to=\"/content-manager\" />;\n  }\n\n  if (isLoadingDocument || isLoadingLayout || versionsResponse.isFetching || isStaleRequest) {\n    return <Page.Loading />;\n  }\n\n  // It was a success, handle empty data\n  if (!versionsResponse.isError && !versionsResponse.data?.data?.length) {\n    return <Page.NoData />;\n  }\n\n  // We have data, handle selected version\n  if (versionsResponse.data?.data?.length && !selectedVersionId) {\n    return (\n      <Navigate\n        to={{ search: stringify({ ...query, id: versionsResponse.data.data[0].id }) }}\n        replace\n      />\n    );\n  }\n\n  const selectedVersion = versionsResponse.data?.data?.find(\n    (version) => version.id.toString() === selectedVersionId\n  );\n  if (\n    versionsResponse.isError ||\n    !layout ||\n    !schema ||\n    !selectedVersion ||\n    // This should not happen as it's covered by versionsResponse.isError, but we need it for TS\n    versionsResponse.data.error\n  ) {\n    return <Page.Error />;\n  }\n\n  return (\n    <>\n      <Helmet\n        title={formatMessage(\n          {\n            id: 'content-manager.history.page-title',\n            defaultMessage: '{contentType} history',\n          },\n          {\n            contentType: displayName,\n          }\n        )}\n      />\n      <HistoryProvider\n        contentType={slug}\n        id={documentId}\n        schema={schema}\n        layout={layout}\n        selectedVersion={selectedVersion}\n        versions={versionsResponse.data}\n        page={page}\n        mainField={mainField}\n      >\n        <Flex direction=\"row\" alignItems=\"flex-start\">\n          <Main grow={1} height=\"100vh\" overflow=\"auto\" labelledBy={headerId}>\n            <VersionHeader headerId={headerId} />\n            <VersionContent />\n          </Main>\n          <VersionsList />\n        </Flex>\n      </HistoryProvider>\n    </>\n  );\n};\n\n/* -------------------------------------------------------------------------------------------------\n * ProtectedHistoryPage\n * -----------------------------------------------------------------------------------------------*/\n\nconst ProtectedHistoryPage = () => {\n  const { slug } = useParams<{\n    slug: string;\n  }>();\n  const [{ query }] = useQueryParams();\n  const { permissions = [], isLoading, isError } = useSyncRbac(slug ?? '', query, 'History');\n\n  if (isLoading) {\n    return <Page.Loading />;\n  }\n\n  if ((!isLoading && isError) || !slug) {\n    return (\n      <Box height=\"100vh\">\n        <Page.Error />\n      </Box>\n    );\n  }\n\n  return (\n    <Box height=\"100vh\">\n      <Page.Protect permissions={permissions}>\n        {({ permissions }) => (\n          <DocumentRBAC permissions={permissions}>\n            <HistoryPage />\n          </DocumentRBAC>\n        )}\n      </Page.Protect>\n    </Box>\n  );\n};\n\nexport { ProtectedHistoryPage, HistoryProvider, useHistoryContext };\nexport type { HistoryContextValue };\n"],"names":["Link","permissions"],"mappings":"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"}