@strapi/content-manager 0.0.0-experimental.c23f51fc41b3ef5de081f427d07e87af93cdcb2c → 0.0.0-experimental.c2b08ee20b017fc174cccf35c56c39438b0237b0

package/dist/admin/pages/EditView/components/FormInputs/Relations/RelationModal.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"RelationModal.mjs","sources":["../../../../../../../admin/src/pages/EditView/components/FormInputs/Relations/RelationModal.tsx"],"sourcesContent":["import * as React from 'react';\n\nimport {\n  ConfirmDialog,\n  DescriptionComponentRenderer,\n  Form as FormContext,\n  useRBAC,\n  useStrapiApp,\n  createContext,\n  useForm,\n  useQueryParams,\n} from '@strapi/admin/strapi-admin';\nimport {\n  Box,\n  Dialog,\n  EmptyStateLayout,\n  Flex,\n  IconButton,\n  Loader,\n  Modal,\n  Typography,\n  TextButton,\n} from '@strapi/design-system';\nimport { ArrowLeft, ArrowsOut, WarningCircle } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { useLocation, useNavigate } from 'react-router-dom';\nimport { styled } from 'styled-components';\n\nimport { COLLECTION_TYPES, SINGLE_TYPES } from '../../../../../constants/collections';\nimport { PERMISSIONS } from '../../../../../constants/plugin';\nimport { buildValidParams } from '../../../../../exports';\nimport { DocumentRBAC } from '../../../../../features/DocumentRBAC';\nimport { useDoc, useDocument, type UseDocument } from '../../../../../hooks/useDocument';\nimport { type DocumentMeta } from '../../../../../hooks/useDocumentContext';\nimport { useDocumentLayout } from '../../../../../hooks/useDocumentLayout';\nimport { useLazyGetDocumentQuery } from '../../../../../services/documents';\nimport { createYupSchema } from '../../../../../utils/validation';\nimport { DocumentActionButton } from '../../../components/DocumentActions';\nimport { DocumentStatus } from '../../DocumentStatus';\nimport { FormLayout } from '../../FormLayout';\nimport { ComponentProvider } from '../ComponentContext';\n\nimport type { ContentManagerPlugin, DocumentActionProps } from '../../../../../content-manager';\n\nexport function getCollectionType(url: string) {\n  const regex = new RegExp(`(${COLLECTION_TYPES}|${SINGLE_TYPES})`);\n  const match = url.match(regex);\n  return match ? match[1] : undefined;\n}\n\nconst StyledModalContent = styled(Modal.Content)`\n  width: 90%;\n  max-width: 100%;\n  height: 90%;\n  max-height: 100%;\n`;\n\nconst getFullPageUrl = (currentDocumentMeta: DocumentMeta): string => {\n  const isSingleType = currentDocumentMeta.collectionType === SINGLE_TYPES;\n  const queryParams = currentDocumentMeta.params?.locale\n    ? `?plugins[i18n][locale]=${currentDocumentMeta.params.locale}`\n    : '';\n\n  return `/content-manager/${currentDocumentMeta.collectionType}/${currentDocumentMeta.model}${isSingleType ? '' : '/' + currentDocumentMeta.documentId}${queryParams}`;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * RelationModalRenderer\n * -----------------------------------------------------------------------------------------------*/\n\ninterface State {\n  documentHistory: DocumentMeta[];\n  confirmDialogIntent:\n    | null // No dialog\n    | 'close' // Close the modal\n    | 'back' // Go back one document in the modal's history\n    | 'navigate' // Open the document in the edit view instead of in the modal\n    | DocumentMeta; // Open a specific document in the modal\n  isModalOpen: boolean;\n  hasUnsavedChanges: boolean;\n  fieldToConnect?: string;\n  fieldToConnectUID?: string;\n}\n\ntype Action =\n  | {\n      type: 'GO_TO_RELATION';\n      payload: {\n        document: DocumentMeta;\n        shouldBypassConfirmation: boolean;\n        fieldToConnect?: string;\n        fieldToConnectUID?: string;\n      };\n    }\n  | {\n      type: 'GO_BACK';\n      payload: { shouldBypassConfirmation: boolean };\n    }\n  | {\n      type: 'GO_FULL_PAGE';\n    }\n  | {\n      type: 'GO_TO_CREATED_RELATION';\n      payload: {\n        document: DocumentMeta;\n        shouldBypassConfirmation: boolean;\n        fieldToConnect?: string;\n        fieldToConnectUID?: string;\n      };\n    }\n  | {\n      type: 'CANCEL_CONFIRM_DIALOG';\n    }\n  | {\n      type: 'CLOSE_MODAL';\n      payload: { shouldBypassConfirmation: boolean };\n    }\n  | {\n      type: 'SET_HAS_UNSAVED_CHANGES';\n      payload: { hasUnsavedChanges: boolean };\n    };\n\nfunction reducer(state: State, action: Action): State {\n  switch (action.type) {\n    case 'GO_TO_RELATION':\n      if (state.hasUnsavedChanges && !action.payload.shouldBypassConfirmation) {\n        return {\n          ...state,\n          confirmDialogIntent: action.payload.document,\n          fieldToConnect: action.payload.fieldToConnect,\n          fieldToConnectUID: action.payload.fieldToConnectUID,\n        };\n      }\n\n      const lastItemDocumentHistory = state.documentHistory.at(-1);\n      const hasToResetDocumentHistory =\n        lastItemDocumentHistory && !lastItemDocumentHistory.documentId;\n      return {\n        ...state,\n        // Reset document history if the last item has documentId undefined\n        documentHistory: hasToResetDocumentHistory\n          ? [action.payload.document]\n          : [...state.documentHistory, action.payload.document],\n        confirmDialogIntent: null,\n        isModalOpen: true,\n        fieldToConnect: hasToResetDocumentHistory ? undefined : action.payload.fieldToConnect,\n        fieldToConnectUID: hasToResetDocumentHistory ? undefined : action.payload.fieldToConnectUID,\n      };\n    case 'GO_BACK':\n      if (state.hasUnsavedChanges && !action.payload.shouldBypassConfirmation) {\n        return { ...state, confirmDialogIntent: 'back' };\n      }\n\n      return {\n        ...state,\n        documentHistory: state.documentHistory.slice(0, -1),\n        confirmDialogIntent: null,\n      };\n    case 'GO_FULL_PAGE':\n      if (state.hasUnsavedChanges) {\n        return { ...state, confirmDialogIntent: 'navigate' };\n      }\n\n      return {\n        ...state,\n        documentHistory: [],\n        hasUnsavedChanges: false,\n        isModalOpen: false,\n        confirmDialogIntent: null,\n      };\n    case 'GO_TO_CREATED_RELATION':\n      return {\n        ...state,\n        // Reset document history if the last item has documentId undefined\n        documentHistory: state.documentHistory\n          ? [...state.documentHistory.slice(0, -1), action.payload.document]\n          : [action.payload.document],\n        confirmDialogIntent: null,\n        isModalOpen: true,\n        fieldToConnect: undefined,\n        fieldToConnectUID: undefined,\n      };\n    case 'CANCEL_CONFIRM_DIALOG':\n      return {\n        ...state,\n        confirmDialogIntent: null,\n      };\n    case 'CLOSE_MODAL':\n      if (state.hasUnsavedChanges && !action.payload.shouldBypassConfirmation) {\n        return { ...state, confirmDialogIntent: 'close' };\n      }\n\n      return {\n        ...state,\n        documentHistory: [],\n        confirmDialogIntent: null,\n        hasUnsavedChanges: false,\n        isModalOpen: false,\n      };\n    case 'SET_HAS_UNSAVED_CHANGES':\n      return {\n        ...state,\n        hasUnsavedChanges: action.payload.hasUnsavedChanges,\n      };\n    default:\n      return state;\n  }\n}\n\ninterface RelationModalContextValue {\n  state: State;\n  dispatch: React.Dispatch<Action>;\n  rootDocumentMeta: DocumentMeta;\n  currentDocumentMeta: DocumentMeta;\n  currentDocument: ReturnType<UseDocument>;\n  onPreview?: () => void;\n  isCreating: boolean;\n}\n\nconst [RelationModalProvider, useRelationModal] =\n  createContext<RelationModalContextValue>('RelationModal');\n\nfunction isRenderProp(\n  children: RelationModalRendererProps['children']\n): children is (props: { dispatch: (action: Action) => void }) => React.ReactNode {\n  return typeof children === 'function';\n}\n\ntype RelationModalRendererProps =\n  // Is editing\n  | {\n      relation: DocumentMeta;\n      children: React.ReactNode;\n    }\n  // Is creating\n  | {\n      relation?: never;\n      children: (props: { dispatch: (action: Action) => void }) => React.ReactNode;\n    };\n\nconst RootRelationRenderer = (props: RelationModalRendererProps) => {\n  const { children } = props;\n\n  const [state, dispatch] = React.useReducer(reducer, {\n    documentHistory: [],\n    confirmDialogIntent: null,\n    isModalOpen: false,\n    hasUnsavedChanges: false,\n    fieldToConnect: undefined,\n  });\n\n  const rootDocument = useDoc();\n  const [{ query }] = useQueryParams();\n  const params = React.useMemo(() => buildValidParams(query ?? {}), [query]);\n\n  const rootDocumentMeta: DocumentMeta = {\n    documentId: rootDocument.document?.documentId || '',\n    model: rootDocument.model,\n    collectionType: rootDocument.collectionType,\n    params,\n  };\n\n  const currentDocumentMeta = state.documentHistory.at(-1) ?? rootDocumentMeta;\n  const currentDocument = useDocument(currentDocumentMeta);\n  // TODO: check if we can remove the single type check\n  const isSingleType = currentDocumentMeta.collectionType === SINGLE_TYPES;\n  const isCreating = !currentDocumentMeta.documentId && !isSingleType;\n  /**\n   * There is no parent relation, so the relation modal doesn't exist. Create it and set up all the\n   * pieces that will be used by potential child relations: the context, header, form, and footer.\n   */\n  return (\n    <RelationModalProvider\n      state={state}\n      dispatch={dispatch}\n      rootDocumentMeta={rootDocumentMeta}\n      currentDocumentMeta={currentDocumentMeta}\n      currentDocument={currentDocument}\n      isCreating={isCreating}\n    >\n      <RelationModal>\n        {isRenderProp(children)\n          ? children({ dispatch })\n          : props.relation && (\n              <RelationModalTrigger relation={props.relation}>{children}</RelationModalTrigger>\n            )}\n      </RelationModal>\n    </RelationModalProvider>\n  );\n};\n\nconst NestedRelationRenderer = (props: RelationModalRendererProps) => {\n  const { children } = props;\n  const dispatch = useRelationModal('NestedRelation', (state) => state.dispatch);\n\n  return isRenderProp(children)\n    ? children({ dispatch })\n    : props.relation && (\n        <RelationModalTrigger relation={props.relation}>{children}</RelationModalTrigger>\n      ); /* This is the trigger that will be rendered in the parent relation */\n};\n\n/**\n * Component responsible for rendering its children wrapped in a modal, form and context if needed\n */\nconst RelationModalRenderer = (props: RelationModalRendererProps) => {\n  // We're in a nested relation if the relation modal context is not undefined\n  const isNested = useRelationModal('RelationContextWrapper', (state) => state != undefined, false);\n\n  return isNested ? <NestedRelationRenderer {...props} /> : <RootRelationRenderer {...props} />;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * RelationModal\n * -----------------------------------------------------------------------------------------------*/\nconst generateCreateUrl = (currentDocumentMeta: DocumentMeta) => {\n  return `/content-manager/${currentDocumentMeta.collectionType}/${currentDocumentMeta.model}/create${\n    currentDocumentMeta.params?.locale\n      ? `?plugins[i18n][locale]=${currentDocumentMeta.params.locale}`\n      : ''\n  }`;\n};\n\nconst RelationModal = ({ children }: { children: React.ReactNode }) => {\n  const { formatMessage } = useIntl();\n  const navigate = useNavigate();\n  const state = useRelationModal('RelationModalForm', (state) => state.state);\n  const dispatch = useRelationModal('RelationModalForm', (state) => state.dispatch);\n  const currentDocumentMeta = useRelationModal(\n    'RelationModalForm',\n    (state) => state.currentDocumentMeta\n  );\n  const currentDocument = useRelationModal('RelationModalForm', (state) => state.currentDocument);\n  const isCreating = useRelationModal('RelationModalForm', (state) => state.isCreating);\n\n  /*\n   * We must wrap the modal window with Component Provider with reset values\n   * to avoid inheriting id and uid from the root document and having weird\n   * behaviors with simple relationships..\n   */\n  return (\n    <ComponentProvider id={undefined} level={-1} uid={undefined} type={undefined}>\n      <Modal.Root\n        open={state.isModalOpen}\n        onOpenChange={(open) => {\n          if (!open) {\n            dispatch({\n              type: 'CLOSE_MODAL',\n              payload: { shouldBypassConfirmation: false },\n            });\n          }\n        }}\n      >\n        {children}\n        <StyledModalContent>\n          <Modal.Header gap={2}>\n            <Flex justifyContent=\"space-between\" alignItems=\"center\" width=\"100%\">\n              <Flex gap={2}>\n                <IconButton\n                  withTooltip={false}\n                  label={formatMessage({ id: 'global.back', defaultMessage: 'Back' })}\n                  variant=\"ghost\"\n                  disabled={state.documentHistory.length < 2}\n                  onClick={() => {\n                    dispatch({\n                      type: 'GO_BACK',\n                      payload: { shouldBypassConfirmation: false },\n                    });\n                  }}\n                  marginRight={1}\n                >\n                  <ArrowLeft />\n                </IconButton>\n                <Typography tag=\"span\" fontWeight={600}>\n                  {isCreating\n                    ? formatMessage({\n                        id: 'content-manager.relation.create',\n                        defaultMessage: 'Create a relation',\n                      })\n                    : formatMessage({\n                        id: 'content-manager.components.RelationInputModal.modal-title',\n                        defaultMessage: 'Edit a relation',\n                      })}\n                </Typography>\n              </Flex>\n              <IconButton\n                onClick={() => {\n                  dispatch({\n                    type: 'GO_FULL_PAGE',\n                  });\n                  if (!state.hasUnsavedChanges) {\n                    if (isCreating) {\n                      navigate(generateCreateUrl(currentDocumentMeta));\n                    } else {\n                      navigate(getFullPageUrl(currentDocumentMeta));\n                    }\n                  }\n                }}\n                variant=\"tertiary\"\n                label={formatMessage({\n                  id: 'content-manager.components.RelationInputModal.button-fullpage',\n                  defaultMessage: 'Go to entry',\n                })}\n              >\n                <ArrowsOut />\n              </IconButton>\n            </Flex>\n          </Modal.Header>\n          <Modal.Body>\n            <FormContext\n              method={isCreating ? 'POST' : 'PUT'}\n              initialValues={currentDocument.getInitialFormValues(isCreating)}\n              validate={(values: Record<string, unknown>, options: Record<string, string>) => {\n                const yupSchema = createYupSchema(\n                  currentDocument.schema?.attributes,\n                  currentDocument.components,\n                  {\n                    status: currentDocument.document?.status,\n                    ...options,\n                  }\n                );\n\n                return yupSchema.validate(values, { abortEarly: false });\n              }}\n            >\n              <RelationModalBody />\n            </FormContext>\n          </Modal.Body>\n        </StyledModalContent>\n      </Modal.Root>\n    </ComponentProvider>\n  );\n};\n/**\n * All the main content (not header and footer) of the relation modal, plus the confirmation dialog.\n * Will be wrapped in a Modal.Body by the RelationModal component.\n * Cannot be moved directly inside RelationModal because it needs access to the context via hooks.\n */\nconst RelationModalBody = () => {\n  const navigate = useNavigate();\n  const { pathname, search } = useLocation();\n  const { formatMessage } = useIntl();\n\n  const [triggerRefetchDocument] = useLazyGetDocumentQuery();\n\n  const state = useRelationModal('RelationModalForm', (state) => state.state);\n  const dispatch = useRelationModal('RelationModalForm', (state) => state.dispatch);\n  const rootDocumentMeta = useRelationModal('RelationModalForm', (state) => state.rootDocumentMeta);\n  const currentDocumentMeta = useRelationModal(\n    'RelationModalForm',\n    (state) => state.currentDocumentMeta\n  );\n  const isCreating = useRelationModal('RelationModalForm', (state) => state.isCreating);\n\n  /**\n   * One-way sync the modified state from the form to the modal state.\n   * It is needed because we need to consume state from the form context in order to lift it up\n   * into the modal context. It is not possible otherwise because the modal needs the form state,\n   * but it must be a parent of the form.\n   */\n  const modified = useForm('FormWatcher', (state) => state.modified);\n  const isSubmitting = useForm('FormWatcher', (state) => state.isSubmitting);\n  const hasUnsavedChanges = modified && !isSubmitting;\n  React.useEffect(() => {\n    dispatch({ type: 'SET_HAS_UNSAVED_CHANGES', payload: { hasUnsavedChanges } });\n  }, [hasUnsavedChanges, dispatch]);\n\n  const handleCloseModal = (shouldBypassConfirmation: boolean) => {\n    dispatch({ type: 'CLOSE_MODAL', payload: { shouldBypassConfirmation } });\n\n    if (shouldBypassConfirmation || !state.hasUnsavedChanges) {\n      // TODO: check if we can avoid this by relying on RTK invalidatesTags.\n      // If so we can delete this function and dispatch the events directly\n      triggerRefetchDocument(\n        // TODO check if params should be removed (as they were before)\n        rootDocumentMeta,\n        // Favor the cache\n        true\n      );\n    }\n  };\n\n  const handleRedirection = () => {\n    const editViewUrl = `${pathname}${search}`;\n    const fullPageUrl = getFullPageUrl(currentDocumentMeta);\n    const isRootDocumentUrl = editViewUrl.includes(fullPageUrl);\n\n    if (isRootDocumentUrl) {\n      handleCloseModal(true);\n    } else {\n      if (isCreating) {\n        navigate(generateCreateUrl(currentDocumentMeta));\n      } else {\n        navigate(fullPageUrl);\n      }\n    }\n  };\n\n  const handleConfirm = () => {\n    if (state.confirmDialogIntent === null) {\n      return;\n    }\n    if (state.confirmDialogIntent === 'navigate') {\n      handleRedirection();\n    } else if (state.confirmDialogIntent === 'back') {\n      dispatch({ type: 'GO_BACK', payload: { shouldBypassConfirmation: true } });\n    } else if (state.confirmDialogIntent === 'close') {\n      handleCloseModal(true);\n    } else if ('documentId' in state.confirmDialogIntent) {\n      dispatch({\n        type: 'GO_TO_RELATION',\n        payload: { document: state.confirmDialogIntent, shouldBypassConfirmation: true },\n      });\n    }\n  };\n\n  return (\n    <>\n      <RelationModalForm />\n      <Dialog.Root open={state.confirmDialogIntent != null}>\n        <ConfirmDialog\n          onConfirm={() => handleConfirm()}\n          onCancel={() => dispatch({ type: 'CANCEL_CONFIRM_DIALOG' })}\n          variant=\"danger\"\n        >\n          {formatMessage({\n            id: 'content-manager.components.RelationInputModal.confirmation-message',\n            defaultMessage:\n              'Some changes were not saved. Are you sure you want to close this relation? All changes that were not saved will be lost.',\n          })}\n        </ConfirmDialog>\n      </Dialog.Root>\n    </>\n  );\n};\n\nconst RelationModalTrigger = ({\n  children,\n  relation,\n}: {\n  children: React.ReactNode;\n  relation: DocumentMeta;\n}) => {\n  const dispatch = useRelationModal('ModalTrigger', (state) => state.dispatch);\n\n  return (\n    <StyledTextButton\n      onClick={() => {\n        dispatch({\n          type: 'GO_TO_RELATION',\n          payload: { document: relation, shouldBypassConfirmation: false },\n        });\n      }}\n    >\n      {children}\n    </StyledTextButton>\n  );\n};\n\nconst StyledTextButton = styled(TextButton)`\n  max-width: 100%;\n  & > span {\n    font-size: ${({ theme }) => theme.fontSizes[2]};\n    width: inherit;\n    overflow: hidden;\n    white-space: nowrap;\n    text-overflow: ellipsis;\n  }\n`;\n\n/**\n * The mini edit view for a relation that is displayed inside a modal.\n * It's complete with its header, document actions and form layout.\n */\nconst RelationModalForm = () => {\n  const { formatMessage } = useIntl();\n\n  const currentDocumentMeta = useRelationModal(\n    'RelationModalForm',\n    (state) => state.currentDocumentMeta\n  );\n  const isCreating = useRelationModal('RelationModalForm', (state) => state.isCreating);\n  const currentDocument = useRelationModal('RelationModalForm', (state) => state.currentDocument);\n  const documentLayoutResponse = useDocumentLayout(currentDocumentMeta.model);\n  const plugins = useStrapiApp('RelationModalForm', (state) => state.plugins);\n\n  const initialValues = isCreating\n    ? currentDocument.getInitialFormValues(isCreating)\n    : currentDocument.getInitialFormValues();\n\n  const {\n    permissions = [],\n    isLoading: isLoadingPermissions,\n    error,\n  } = useRBAC(\n    PERMISSIONS.map((action) => ({\n      action,\n      subject: currentDocumentMeta.model,\n    }))\n  );\n\n  const isLoading =\n    isLoadingPermissions || documentLayoutResponse.isLoading || currentDocument.isLoading;\n\n  if (isLoading && !currentDocument.document?.documentId) {\n    return (\n      <Loader small>\n        {formatMessage({\n          id: 'content-manager.ListViewTable.relation-loading',\n          defaultMessage: 'Relations are loading',\n        })}\n      </Loader>\n    );\n  }\n\n  if (\n    error ||\n    !currentDocumentMeta.model ||\n    documentLayoutResponse.error ||\n    (!isCreating && !currentDocument.document) ||\n    (!isCreating && !currentDocument.meta) ||\n    !currentDocument.schema ||\n    !initialValues\n  ) {\n    return (\n      <Flex alignItems=\"center\" height=\"100%\" justifyContent=\"center\">\n        <EmptyStateLayout\n          icon={<WarningCircle width=\"16rem\" />}\n          content={formatMessage({\n            id: 'anErrorOccurred',\n            defaultMessage: 'Whoops! Something went wrong. Please, try again.',\n          })}\n        />\n      </Flex>\n    );\n  }\n\n  const documentTitle = currentDocument.getTitle(documentLayoutResponse.edit.settings.mainField);\n  const hasDraftAndPublished = currentDocument.schema?.options?.draftAndPublish ?? false;\n\n  const props = {\n    activeTab: 'draft',\n    collectionType: currentDocumentMeta.collectionType,\n    model: currentDocumentMeta.model,\n    documentId: currentDocumentMeta.documentId,\n    document: currentDocument.document,\n    meta: currentDocument.meta,\n  } satisfies DocumentActionProps;\n\n  return (\n    <DocumentRBAC permissions={permissions} model={currentDocumentMeta.model}>\n      <Flex alignItems=\"flex-start\" direction=\"column\" gap={2}>\n        <Flex width=\"100%\" justifyContent=\"space-between\" gap={2}>\n          <Typography tag=\"h2\" variant=\"alpha\">\n            {documentTitle}\n          </Typography>\n          <Flex gap={2}>\n            <DescriptionComponentRenderer\n              props={props}\n              descriptions={(\n                plugins['content-manager'].apis as ContentManagerPlugin['config']['apis']\n              ).getDocumentActions('relation-modal')}\n            >\n              {(actions) => {\n                const filteredActions = actions.filter((action) => {\n                  return [action.position].flat().includes('relation-modal');\n                });\n                const [primaryAction, secondaryAction] = filteredActions;\n\n                if (!primaryAction && !secondaryAction) return null;\n\n                // Both actions are available when draft and publish enabled\n                if (primaryAction && secondaryAction) {\n                  return (\n                    <>\n                      {/* Save */}\n                      <DocumentActionButton\n                        {...secondaryAction}\n                        variant={secondaryAction.variant || 'secondary'}\n                      />\n                      {/* Publish */}\n                      <DocumentActionButton\n                        {...primaryAction}\n                        variant={primaryAction.variant || 'default'}\n                      />\n                    </>\n                  );\n                }\n\n                // Otherwise we just have the save action\n                return (\n                  <DocumentActionButton\n                    {...primaryAction}\n                    variant={primaryAction.variant || 'secondary'}\n                  />\n                );\n              }}\n            </DescriptionComponentRenderer>\n          </Flex>\n        </Flex>\n        {hasDraftAndPublished ? (\n          <Box>\n            <DocumentStatus status={currentDocument.document?.status} />\n          </Box>\n        ) : null}\n      </Flex>\n\n      <Flex flex={1} overflow=\"auto\" alignItems=\"stretch\" paddingTop={7}>\n        <Box overflow=\"auto\" flex={1}>\n          <FormLayout\n            layout={documentLayoutResponse.edit.layout}\n            document={currentDocument}\n            hasBackground={false}\n          />\n        </Box>\n      </Flex>\n    </DocumentRBAC>\n  );\n};\n\nexport { reducer, RelationModalRenderer, useRelationModal };\nexport type { State, Action };\n"],"names":["getCollectionType","url","regex","RegExp","COLLECTION_TYPES","SINGLE_TYPES","match","undefined","StyledModalContent","styled","Modal","Content","getFullPageUrl","currentDocumentMeta","isSingleType","collectionType","queryParams","params","locale","model","documentId","reducer","state","action","type","hasUnsavedChanges","payload","shouldBypassConfirmation","confirmDialogIntent","document","fieldToConnect","fieldToConnectUID","lastItemDocumentHistory","documentHistory","at","hasToResetDocumentHistory","isModalOpen","slice","RelationModalProvider","useRelationModal","createContext","isRenderProp","children","RootRelationRenderer","props","dispatch","React","useReducer","rootDocument","useDoc","query","useQueryParams","useMemo","buildValidParams","rootDocumentMeta","currentDocument","useDocument","isCreating","_jsx","RelationModal","relation","RelationModalTrigger","NestedRelationRenderer","RelationModalRenderer","isNested","generateCreateUrl","formatMessage","useIntl","navigate","useNavigate","ComponentProvider","id","level","uid","_jsxs","Root","open","onOpenChange","Header","gap","Flex","justifyContent","alignItems","width","IconButton","withTooltip","label","defaultMessage","variant","disabled","length","onClick","marginRight","ArrowLeft","Typography","tag","fontWeight","ArrowsOut","Body","FormContext","method","initialValues","getInitialFormValues","validate","values","options","yupSchema","createYupSchema","schema","attributes","components","status","abortEarly","RelationModalBody","pathname","search","useLocation","triggerRefetchDocument","useLazyGetDocumentQuery","modified","useForm","isSubmitting","useEffect","handleCloseModal","handleRedirection","editViewUrl","fullPageUrl","isRootDocumentUrl","includes","handleConfirm","_Fragment","RelationModalForm","Dialog","ConfirmDialog","onConfirm","onCancel","StyledTextButton","TextButton","theme","fontSizes","documentLayoutResponse","useDocumentLayout","plugins","useStrapiApp","permissions","isLoading","isLoadingPermissions","error","useRBAC","PERMISSIONS","map","subject","Loader","small","meta","height","EmptyStateLayout","icon","WarningCircle","content","documentTitle","getTitle","edit","settings","mainField","hasDraftAndPublished","draftAndPublish","activeTab","DocumentRBAC","direction","DescriptionComponentRenderer","descriptions","apis","getDocumentActions","actions","filteredActions","filter","position","flat","primaryAction","secondaryAction","DocumentActionButton","Box","DocumentStatus","flex","overflow","paddingTop","FormLayout","layout","hasBackground"],"mappings":"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"}

package/dist/admin/pages/EditView/components/FormInputs/{Relations.js → Relations/Relations.js}

@@ -9,20 +9,22 @@ var fractionalIndexing = require('fractional-indexing');
 var pipe = require('lodash/fp/pipe');
 var reactDndHtml5Backend = require('react-dnd-html5-backend');
 var reactIntl = require('react-intl');
-var reactRouterDom = require('react-router-dom');
 var reactWindow = require('react-window');
 var styledComponents = require('styled-components');
-var collections = require('../../../../constants/collections.js');
-var dragAndDrop = require('../../../../constants/dragAndDrop.js');
-var useDebounce = require('../../../../hooks/useDebounce.js');
-var useDocument = require('../../../../hooks/useDocument.js');
-var useDragAndDrop = require('../../../../hooks/useDragAndDrop.js');
-var relations = require('../../../../services/relations.js');
-var api = require('../../../../utils/api.js');
-var relations$1 = require('../../../../utils/relations.js');
-var translations = require('../../../../utils/translations.js');
-var DocumentStatus = require('../DocumentStatus.js');
-var ComponentContext = require('./ComponentContext.js');
+var collections = require('../../../../../constants/collections.js');
+var dragAndDrop = require('../../../../../constants/dragAndDrop.js');
+var plugin = require('../../../../../constants/plugin.js');
+var DocumentRBAC = require('../../../../../features/DocumentRBAC.js');
+var useDebounce = require('../../../../../hooks/useDebounce.js');
+var useDocument = require('../../../../../hooks/useDocument.js');
+var useDocumentContext = require('../../../../../hooks/useDocumentContext.js');
+var useDragAndDrop = require('../../../../../hooks/useDragAndDrop.js');
+var relations = require('../../../../../services/relations.js');
+var relations$1 = require('../../../../../utils/relations.js');
+var translations = require('../../../../../utils/translations.js');
+var DocumentStatus = require('../../DocumentStatus.js');
+var ComponentContext = require('../ComponentContext.js');
+var RelationModal = require('./RelationModal.js');
 
 function _interopNamespaceDefault(e) {
   var n = Object.create(null);
@@ -96,12 +98,11 @@ const ONE_WAY_RELATIONS = [
  * At present we do not expose this to plugin developers, however, they are able to overwrite it themselves should
  * they wish to do so.
  */ const RelationsField = /*#__PURE__*/ React__namespace.forwardRef(({ disabled, label, ...props }, ref)=>{
+    const { currentDocument, currentDocumentMeta } = useDocumentContext.useDocumentContext('RelationsField');
     const [currentPage, setCurrentPage] = React__namespace.useState(1);
-    const { document, model: documentModel } = useDocument.useDoc();
-    const documentId = document?.documentId;
+    // Use the documentId from the actual document, not the params (meta)
+    const documentId = currentDocument.document?.documentId;
     const { formatMessage } = reactIntl.useIntl();
-    const [{ query }] = strapiAdmin.useQueryParams();
-    const params = api.buildValidParams(query);
     const isMorph = props.attribute.relation.toLowerCase().includes('morph');
     const isDisabled = isMorph || disabled;
     const { componentId, componentUID } = ComponentContext.useComponent('RelationsField', ({ uid, id })=>({
@@ -114,30 +115,38 @@ const ONE_WAY_RELATIONS = [
     }, [
         isSubmitting
     ]);
+    const component = componentUID && currentDocument.components[componentUID];
     /**
      * We'll always have a documentId in a created entry, so we look for a componentId first.
      * Same with `uid` and `documentModel`.
-     */ const id = componentId ? componentId.toString() : documentId;
-    const model = componentUID ?? documentModel;
+     * The componentId is empty when adding a new component in a repeatable. Let it be null to skip isRelatedToCurrentDocument
+     */ const model = component ? component.uid : currentDocumentMeta.model;
+    const id = component ? componentId?.toString() : documentId;
     /**
      * The `name` prop is a complete path to the field, e.g. `field1.field2.field3`.
      * Where the above example would a nested field within two components, however
      * we only require the field on the component not the complete path since we query
      * individual components. Therefore we split the string and take the last item.
      */ const [targetField] = props.name.split('.').slice(-1);
+    const schemaAttributes = component ? component.attributes ?? {} : currentDocument.schema?.attributes ?? {};
+    /**
+     * Confirm the target field is related to the current document.
+     * Since relations can exist in a modal on top of the root document,
+     * we need to ensure we are fetching relations for the correct document (root document vs related document),
+     */ const isRelatedToCurrentDocument = Object.values(schemaAttributes).filter((attribute)=>attribute.type === 'relation' && 'target' in attribute && 'target' in props.attribute && attribute.target === props.attribute.target).length > 0;
     const { data, isLoading, isFetching } = relations.useGetRelationsQuery({
         model,
         targetField,
         // below we don't run the query if there is no id.
-        id: id,
+        id,
         params: {
-            ...params,
+            ...currentDocumentMeta.params,
             pageSize: RELATIONS_TO_DISPLAY,
             page: currentPage
         }
     }, {
         refetchOnMountOrArgChange: true,
-        skip: !id,
+        skip: !id || !isRelatedToCurrentDocument,
         selectFromResult: (result)=>{
             return {
                 ...result,
@@ -203,7 +212,8 @@ const ONE_WAY_RELATIONS = [
             apiData: {
                 id: relation.id,
                 documentId: relation.documentId,
-                locale: relation.locale
+                locale: relation.locale,
+                isTemporary: true
             },
             status: relation.status,
             /**
@@ -246,10 +256,11 @@ const ONE_WAY_RELATIONS = [
                     /*#__PURE__*/ jsxRuntime.jsx(RelationsInput, {
                         disabled: isDisabled,
                         // NOTE: we should not default to using the documentId if the component is being created (componentUID is undefined)
-                        id: componentUID ? componentId ? `${componentId}` : '' : documentId,
+                        id: componentUID && component ? componentId ? `${componentId}` : '' : documentId,
                         label: `${label} ${relationsCount > 0 ? `(${relationsCount})` : ''}`,
                         model: model,
                         onChange: handleConnect,
+                        isRelatedToCurrentDocument: isRelatedToCurrentDocument,
                         ...props
                     }),
                     'pagination' in data && data.pagination && data.pagination.pageCount > data.pagination.page ? /*#__PURE__*/ jsxRuntime.jsx(designSystem.TextButton, {
@@ -272,7 +283,10 @@ const ONE_WAY_RELATIONS = [
                 disabled: isDisabled,
                 name: props.name,
                 isLoading: isFetchingMoreRelations,
-                relationType: props.attribute.relation
+                relationType: props.attribute.relation,
+                // @ts-expect-error – targetModel does exist on the attribute. But it's not typed.
+                targetModel: props.attribute.targetModel,
+                mainField: props.mainField
             })
         ]
     });
@@ -315,16 +329,14 @@ const ONE_WAY_RELATIONS = [
 /**
  * @description Contains all the logic for the combobox that can search
  * for relations and then add them to the field's connect array.
- */ const RelationsInput = ({ hint, id, model, label, labelAction, name, mainField, placeholder, required, unique: _unique, 'aria-label': _ariaLabel, onChange, ...props })=>{
-    const [textValue, setTextValue] = React__namespace.useState('');
+ */ const RelationsInput = ({ hint, id, model, label, labelAction, name, mainField, placeholder, required, unique: _unique, 'aria-label': _ariaLabel, onChange, isRelatedToCurrentDocument, ...props })=>{
     const [searchParams, setSearchParams] = React__namespace.useState({
         _q: '',
         page: 1
     });
     const { toggleNotification } = strapiAdmin.useNotification();
-    const [{ query }] = strapiAdmin.useQueryParams();
+    const { currentDocumentMeta } = useDocumentContext.useDocumentContext('RelationsInput');
     const { formatMessage } = reactIntl.useIntl();
-    const fieldRef = strapiAdmin.useFocusInputField(name);
     const field = strapiAdmin.useField(name);
     const searchParamsDebounced = useDebounce.useDebounce(searchParams, 300);
     const [searchForTrigger, { data, isLoading }] = relations.useLazySearchRelationsQuery();
@@ -340,11 +352,13 @@ const ONE_WAY_RELATIONS = [
      * we only require the field on the component not the complete path since we query
      * individual components. Therefore we split the string and take the last item.
      */ const [targetField] = name.split('.').slice(-1);
+        // Return early if there is no relation to the document
+        if (!isRelatedToCurrentDocument) return;
         searchForTrigger({
             model,
             targetField,
             params: {
-                ...api.buildValidParams(query),
+                ...currentDocumentMeta.params,
                 id: id ?? '',
                 pageSize: 10,
                 idsToInclude: field.value?.disconnect?.map((rel)=>rel.id.toString()) ?? [],
@@ -358,17 +372,11 @@ const ONE_WAY_RELATIONS = [
         id,
         model,
         name,
-        query,
         searchForTrigger,
-        searchParamsDebounced
+        searchParamsDebounced,
+        isRelatedToCurrentDocument,
+        currentDocumentMeta.params
     ]);
-    const handleSearch = async (search)=>{
-        setSearchParams((s)=>({
-                ...s,
-                _q: search,
-                page: 1
-            }));
-    };
     const hasNextPage = data?.pagination ? data.pagination.page < data.pagination.pageCount : false;
     const options = data?.results ?? [];
     const handleChange = (relationId)=>{
@@ -396,6 +404,74 @@ const ONE_WAY_RELATIONS = [
      *
      */ onChange(relation);
     };
+    const relation = {
+        collectionType: collections.COLLECTION_TYPES,
+        // @ts-expect-error – targetModel does exist on the attribute. But it's not typed.
+        model: props.attribute.targetModel,
+        documentId: '',
+        params: currentDocumentMeta.params
+    };
+    const { permissions = [], isLoading: isLoadingPermissions, error } = strapiAdmin.useRBAC(plugin.PERMISSIONS.map((action)=>({
+            action,
+            subject: relation.model
+        })));
+    if (error) {
+        return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Flex, {
+            alignItems: "center",
+            height: "100%",
+            justifyContent: "center",
+            children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.EmptyStateLayout, {
+                icon: /*#__PURE__*/ jsxRuntime.jsx(Icons.WarningCircle, {
+                    width: "16rem"
+                }),
+                content: formatMessage({
+                    id: 'anErrorOccurred',
+                    defaultMessage: 'Whoops! Something went wrong. Please, try again.'
+                })
+            })
+        });
+    }
+    return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Field.Root, {
+        error: field.error,
+        hint: hint,
+        name: name,
+        required: required,
+        children: [
+            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Label, {
+                action: labelAction,
+                children: label
+            }),
+            /*#__PURE__*/ jsxRuntime.jsx(DocumentRBAC.DocumentRBAC, {
+                permissions: permissions,
+                model: relation.model,
+                children: /*#__PURE__*/ jsxRuntime.jsx(RelationModalWithContext, {
+                    relation: relation,
+                    name: name,
+                    placeholder: placeholder,
+                    hasNextPage: hasNextPage,
+                    isLoadingPermissions: isLoadingPermissions,
+                    isLoadingSearchRelations: isLoading,
+                    handleChange: handleChange,
+                    setSearchParams: setSearchParams,
+                    data: data,
+                    mainField: mainField,
+                    fieldValue: field.value,
+                    ...props
+                })
+            }),
+            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Error, {}),
+            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Hint, {})
+        ]
+    });
+};
+const RelationModalWithContext = ({ relation, name, placeholder, hasNextPage, isLoadingSearchRelations, isLoadingPermissions, handleChange, mainField, setSearchParams, fieldValue, data, ...props })=>{
+    const [textValue, setTextValue] = React__namespace.useState('');
+    const { formatMessage } = reactIntl.useIntl();
+    const canCreate = DocumentRBAC.useDocumentRBAC('RelationModalWrapper', (state)=>state.canCreate);
+    const fieldRef = strapiAdmin.useFocusInputField(name);
+    const { componentUID } = ComponentContext.useComponent('RelationsField', ({ uid })=>({
+            componentUID: uid
+        }));
     const handleLoadMore = ()=>{
         if (!data || !data.pagination) {
             return;
@@ -406,31 +482,55 @@ const ONE_WAY_RELATIONS = [
                 }));
         }
     };
+    const options = data?.results ?? [];
     React__namespace.useLayoutEffect(()=>{
         setTextValue('');
     }, [
-        field.value
+        fieldValue
     ]);
-    return /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Field.Root, {
-        error: field.error,
-        hint: hint,
-        name: name,
-        required: required,
-        children: [
-            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Label, {
-                action: labelAction,
-                children: label
-            }),
-            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Combobox, {
+    const handleSearch = async (search)=>{
+        setSearchParams((s)=>({
+                ...s,
+                _q: search,
+                page: 1
+            }));
+    };
+    return /*#__PURE__*/ jsxRuntime.jsx(RelationModal.RelationModalRenderer, {
+        children: ({ dispatch })=>/*#__PURE__*/ jsxRuntime.jsx(designSystem.Combobox, {
                 ref: fieldRef,
+                creatable: "visible",
+                creatableDisabled: !canCreate,
+                createMessage: ()=>formatMessage({
+                        id: translations.getTranslation('relation.create'),
+                        defaultMessage: 'Create a relation'
+                    }),
+                onCreateOption: ()=>{
+                    if (canCreate) {
+                        dispatch({
+                            type: 'GO_TO_RELATION',
+                            payload: {
+                                document: relation,
+                                shouldBypassConfirmation: false,
+                                fieldToConnect: name,
+                                fieldToConnectUID: componentUID
+                            }
+                        });
+                    }
+                },
+                creatableStartIcon: /*#__PURE__*/ jsxRuntime.jsx(Icons.Plus, {
+                    fill: "neutral500"
+                }),
                 name: name,
-                autocomplete: "list",
+                autocomplete: {
+                    type: 'list',
+                    filter: 'contains'
+                },
                 placeholder: placeholder || formatMessage({
                     id: translations.getTranslation('relation.add'),
                     defaultMessage: 'Add relation'
                 }),
                 hasMoreItems: hasNextPage,
-                loading: isLoading,
+                loading: isLoadingSearchRelations || isLoadingPermissions,
                 onOpenChange: ()=>{
                     handleSearch(textValue ?? '');
                 },
@@ -452,7 +552,7 @@ const ONE_WAY_RELATIONS = [
                     handleSearch(event.currentTarget.value);
                 },
                 ...props,
-                children: options.map((opt)=>{
+                children: options?.map((opt)=>{
                     const textValue = relations$1.getRelationLabel(opt, mainField);
                     return /*#__PURE__*/ jsxRuntime.jsx(designSystem.ComboboxOption, {
                         value: opt.id.toString(),
@@ -461,9 +561,17 @@ const ONE_WAY_RELATIONS = [
                             gap: 2,
                             justifyContent: "space-between",
                             children: [
-                                /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                                    ellipsis: true,
-                                    children: textValue
+                                /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
+                                    gap: 2,
+                                    children: [
+                                        /*#__PURE__*/ jsxRuntime.jsx(Icons.Link, {
+                                            fill: "neutral500"
+                                        }),
+                                        /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
+                                            ellipsis: true,
+                                            children: textValue
+                                        })
+                                    ]
                                 }),
                                 opt.status ? /*#__PURE__*/ jsxRuntime.jsx(DocumentStatus.DocumentStatus, {
                                     status: opt.status
@@ -472,17 +580,14 @@ const ONE_WAY_RELATIONS = [
                         })
                     }, opt.id);
                 })
-            }),
-            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Error, {}),
-            /*#__PURE__*/ jsxRuntime.jsx(designSystem.Field.Hint, {})
-        ]
+            })
     });
 };
 /* -------------------------------------------------------------------------------------------------
  * RelationsList
  * -----------------------------------------------------------------------------------------------*/ const RELATION_ITEM_HEIGHT = 50;
 const RELATION_GUTTER = 4;
-const RelationsList = ({ data, serverData, disabled, name, isLoading, relationType })=>{
+const RelationsList = ({ data, serverData, disabled, name, isLoading, relationType, targetModel, mainField })=>{
     const ariaDescriptionId = React__namespace.useId();
     const { formatMessage } = reactIntl.useIntl();
     const listRef = React__namespace.useRef(null);
@@ -566,8 +671,9 @@ const RelationsList = ({ data, serverData, disabled, name, isLoading, relationTy
                     ...{
                         apiData: {
                             id: relation.id,
-                            documentId: relation.documentId,
-                            locale: relation.locale,
+                            documentId: relation.documentId ?? relation.apiData?.documentId ?? '',
+                            locale: relation.locale || relation.apiData?.locale,
+                            isTemporary: relation.apiData?.isTemporary,
                             position
                         }
                     }
@@ -646,7 +752,9 @@ const RelationsList = ({ data, serverData, disabled, name, isLoading, relationTy
                     handleMoveItem,
                     name,
                     handleDisconnect,
-                    relations: data
+                    relations: data,
+                    targetModel,
+                    mainField
                 },
                 itemKey: (index)=>data[index].id,
                 innerElementType: "ol",
@@ -687,9 +795,26 @@ const ShadowBox = styledComponents.styled(designSystem.Box)`
   }
 `;
 const ListItem = ({ data, index, style })=>{
-    const { ariaDescribedBy, canDrag = false, disabled = false, handleCancel, handleDisconnect, handleDropItem, handleGrabItem, handleMoveItem, name, relations } = data;
+    const { ariaDescribedBy, canDrag = false, disabled = false, handleCancel, handleDisconnect, handleDropItem, handleGrabItem, handleMoveItem, name, relations, targetModel, mainField } = data;
+    const { currentDocumentMeta } = useDocumentContext.useDocumentContext('RelationsField');
     const { formatMessage } = reactIntl.useIntl();
-    const { href, id, label, status } = relations[index];
+    const { href, id, label: originalLabel, status: originalStatus, documentId, apiData, locale } = relations[index];
+    /**
+   * The code above attempts to retrieve the updated value of a relation that has not yet been saved.
+   * This is necessary when a relation modal is opened, and the mainField or its status is updated.
+   * These changes need to be reflected in the initial relation field.
+   */ const collectionType = RelationModal.getCollectionType(href);
+    const isTemporary = apiData?.isTemporary ?? false;
+    const { document } = useDocument.useDocument({
+        collectionType,
+        model: targetModel,
+        documentId: documentId ?? apiData?.documentId,
+        params: currentDocumentMeta.params
+    }, {
+        skip: !isTemporary
+    });
+    const label = isTemporary && document ? relations$1.getRelationLabel(document, mainField) : originalLabel;
+    const status = isTemporary && document ? document?.status : originalStatus;
     const [{ handlerId, isDragging, handleKeyDown }, relationRef, dropRef, dragRef, dragPreviewRef] = useDragAndDrop.useDragAndDrop(canDrag && !disabled, {
         type: `${dragAndDrop.ItemTypes.RELATION}_${name}`,
         index,
@@ -711,6 +836,21 @@ const ListItem = ({ data, index, style })=>{
     }, [
         dragPreviewRef
     ]);
+    const safeDocumentId = documentId ?? apiData?.documentId;
+    const safeLocale = locale ?? apiData?.locale ?? null;
+    const documentMeta = React__namespace.useMemo(()=>({
+            documentId: safeDocumentId,
+            model: targetModel,
+            collectionType: RelationModal.getCollectionType(href),
+            params: {
+                locale: safeLocale
+            }
+        }), [
+        safeDocumentId,
+        href,
+        safeLocale,
+        targetModel
+    ]);
     return /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
         style: style,
         tag: "li",
@@ -749,25 +889,17 @@ const ListItem = ({ data, index, style })=>{
                         /*#__PURE__*/ jsxRuntime.jsxs(designSystem.Flex, {
                             width: "100%",
                             minWidth: 0,
+                            gap: 4,
                             justifyContent: "space-between",
                             children: [
                                 /*#__PURE__*/ jsxRuntime.jsx(designSystem.Box, {
+                                    flex: 1,
                                     minWidth: 0,
                                     paddingTop: 1,
                                     paddingBottom: 1,
-                                    paddingRight: 4,
-                                    children: /*#__PURE__*/ jsxRuntime.jsx(designSystem.Tooltip, {
-                                        description: label,
-                                        children: href ? /*#__PURE__*/ jsxRuntime.jsx(LinkEllipsis, {
-                                            tag: reactRouterDom.NavLink,
-                                            to: href,
-                                            isExternal: false,
-                                            children: label
-                                        }) : /*#__PURE__*/ jsxRuntime.jsx(designSystem.Typography, {
-                                            textColor: disabled ? 'neutral600' : 'primary600',
-                                            ellipsis: true,
-                                            children: label
-                                        })
+                                    children: /*#__PURE__*/ jsxRuntime.jsx(RelationModal.RelationModalRenderer, {
+                                        relation: documentMeta,
+                                        children: label
                                     })
                                 }),
                                 status ? /*#__PURE__*/ jsxRuntime.jsx(DocumentStatus.DocumentStatus, {