@strapi/admin 4.20.5 → 5.0.0-alpha.1

package/dist/_chunks/EditViewPage-ed0-10GO.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"EditViewPage-ed0-10GO.js","sources":["../../admin/src/content-manager/pages/EditView/components/FormLayout.tsx","../../admin/src/content-manager/pages/EditView/EditViewPage.tsx"],"sourcesContent":["import { Box, Flex, Grid, GridItem } from '@strapi/design-system';\n\nimport { EditLayout } from '../../../hooks/useDocumentLayout';\n\nimport { InputRenderer } from './InputRenderer';\n\ninterface FormLayoutProps extends Pick<EditLayout, 'layout'> {}\n\nconst FormLayout = ({ layout }: FormLayoutProps) => {\n  return (\n    <Flex direction=\"column\" alignItems=\"stretch\" gap={6}>\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          return (\n            <Grid key={field.name} gap={4}>\n              <GridItem col={12} s={12} xs={12}>\n                <InputRenderer {...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                        <InputRenderer {...field} />\n                      </GridItem>\n                    );\n                  })}\n                </Grid>\n              ))}\n            </Flex>\n          </Box>\n        );\n      })}\n    </Flex>\n  );\n};\n\nexport { FormLayout, FormLayoutProps };\n","import * as React from 'react';\n\nimport {\n  Grid,\n  GridItem,\n  Main,\n  SetSelectedTabIndexHandler,\n  Tab,\n  TabGroup,\n  TabPanel,\n  TabPanels,\n  Tabs,\n} from '@strapi/design-system';\nimport { useNotification, useQueryParams } from '@strapi/helper-plugin';\nimport { Helmet } from 'react-helmet';\nimport { useIntl } from 'react-intl';\nimport { useLocation, useParams } from 'react-router-dom';\nimport styled from 'styled-components';\n\nimport { Blocker, Form, FormHelpers } from '../../../components/Form';\nimport { Page } from '../../../components/PageHelpers';\nimport { useOnce } from '../../../hooks/useOnce';\nimport { SINGLE_TYPES } from '../../constants/collections';\nimport { DocumentRBAC, useDocumentRBAC } from '../../features/DocumentRBAC';\nimport { type UseDocument, useDoc } from '../../hooks/useDocument';\nimport { useDocumentLayout } from '../../hooks/useDocumentLayout';\nimport { useLazyComponents } from '../../hooks/useLazyComponents';\nimport { useSyncRbac } from '../../hooks/useSyncRbac';\nimport { getTranslation } from '../../utils/translations';\nimport { createYupSchema } from '../../utils/validation';\n\nimport { FormLayout } from './components/FormLayout';\nimport { Header } from './components/Header';\nimport { Panels } from './components/Panels';\nimport { transformDocument } from './utils/data';\nimport { createDefaultForm } from './utils/forms';\n\n/* -------------------------------------------------------------------------------------------------\n * EditViewPage\n * -----------------------------------------------------------------------------------------------*/\n\nconst EditViewPage = () => {\n  const location = useLocation();\n  const [\n    {\n      query: { status },\n    },\n    setQuery,\n  ] = useQueryParams<{ status: 'draft' | 'published' }>();\n  const { formatMessage } = useIntl();\n  const toggleNotification = useNotification();\n  const tabApi = React.useRef<{\n    _handlers: {\n      setSelectedTabIndex: SetSelectedTabIndexHandler;\n    };\n  }>(null);\n\n  const {\n    document,\n    meta,\n    isLoading: isLoadingDocument,\n    schema,\n    components,\n    collectionType,\n    id,\n    model,\n  } = useDoc();\n\n  const hasDraftAndPublished = schema?.options?.draftAndPublish ?? false;\n\n  React.useEffect(() => {\n    if (tabApi.current && hasDraftAndPublished) {\n      tabApi.current._handlers.setSelectedTabIndex(!status || status === 'draft' ? 0 : 1);\n    }\n  }, [hasDraftAndPublished, status]);\n\n  useOnce(() => {\n    /**\n     * We only ever want to fire the notification once otherwise\n     * whenever the app re-renders it'll pop up regardless of\n     * what we do because the state comes from react-router-dom\n     */\n    if (location?.state && 'error' in location.state) {\n      toggleNotification({\n        type: 'warning',\n        message: location.state.error,\n        timeout: 5000,\n      });\n    }\n  });\n\n  const isLoadingActionsRBAC = useDocumentRBAC('EditViewPage', (state) => state.isLoading);\n\n  const isSingleType = collectionType === SINGLE_TYPES;\n\n  /**\n   * single-types don't current have an id, but because they're a singleton\n   * we can simply use the update operation to continuously update the same\n   * document with varying params.\n   */\n  const isCreatingDocument = !id && !isSingleType;\n\n  const {\n    isLoading: isLoadingLayout,\n    edit: {\n      layout,\n      settings: { mainField },\n    },\n  } = useDocumentLayout(model);\n\n  const { isLazyLoading } = useLazyComponents([]);\n\n  const isLoading = isLoadingActionsRBAC || isLoadingDocument || isLoadingLayout || isLazyLoading;\n\n  /**\n   * Here we prepare the form for editing, we need to:\n   * - remove prohibited fields from the document (passwords | ADD YOURS WHEN THERES A NEW ONE)\n   * - swap out count objects on relations for empty arrays\n   * - set __temp_key__ on array objects for drag & drop\n   *\n   * We also prepare the form for new documents, so we need to:\n   * - set default values on fields\n   */\n  const initialValues = React.useMemo(() => {\n    if ((!document && !isCreatingDocument && !isSingleType) || !schema) {\n      return undefined;\n    }\n\n    /**\n     * Check that we have an ID so we know the\n     * document has been created in some way.\n     */\n    const form = document?.id ? document : createDefaultForm(schema, components);\n\n    return transformDocument(schema, components)(form);\n  }, [document, isCreatingDocument, isSingleType, schema, components]);\n\n  if (isLoading && !document?.documentId) {\n    return <Page.Loading />;\n  }\n\n  if (!initialValues) {\n    return <Page.Error />;\n  }\n\n  const handleTabChange = (index: number, { resetForm }: Pick<FormHelpers, 'resetForm'>) => {\n    if (index === 0) {\n      setQuery({ status: 'draft' }, 'push', true);\n    } else {\n      setQuery({ status: 'published' }, 'push', true);\n      // We reset the form to the published version to avoid errors like – https://strapi-inc.atlassian.net/browse/CONTENT-2284\n      resetForm();\n    }\n  };\n\n  /**\n   * We look to see what the mainField is from the configuration,\n   * if it's an id we don't use it because it's a uuid format and\n   * not very user friendly. Instead in that case, we simply write \"Untitled\".\n   */\n  const documentTitle =\n    mainField !== 'id' && document?.[mainField] ? document[mainField] : 'Untitled';\n\n  return (\n    <Main paddingLeft={10} paddingRight={10}>\n      <Helmet title={`${documentTitle} | Strapi`} />\n      <Form\n        disabled={hasDraftAndPublished && status === 'published'}\n        initialValues={initialValues}\n        method={isCreatingDocument ? 'POST' : 'PUT'}\n        validationSchema={createYupSchema(schema?.attributes, components)}\n      >\n        {({ resetForm }) => (\n          <>\n            <Header\n              isCreating={isCreatingDocument}\n              status={hasDraftAndPublished ? getDocumentStatus(document, meta) : undefined}\n              title={documentTitle}\n            />\n            <TabGroup\n              ref={tabApi}\n              variant=\"simple\"\n              label={formatMessage({\n                id: getTranslation('containers.edit.tabs.label'),\n                defaultMessage: 'Document status',\n              })}\n              initialSelectedTabIndex={hasDraftAndPublished && status === 'published' ? 1 : 0}\n              onTabChange={(index) => {\n                // TODO: remove this hack when the tabs in the DS are implemented well and we can actually use callbacks.\n                handleTabChange(index, { resetForm });\n              }}\n            >\n              {hasDraftAndPublished ? (\n                <Tabs>\n                  <StatusTab>\n                    {formatMessage({\n                      id: getTranslation('containers.edit.tabs.draft'),\n                      defaultMessage: 'draft',\n                    })}\n                  </StatusTab>\n                  <StatusTab disabled={!meta || meta.availableStatus.length === 0}>\n                    {formatMessage({\n                      id: getTranslation('containers.edit.tabs.published'),\n                      defaultMessage: 'published',\n                    })}\n                  </StatusTab>\n                </Tabs>\n              ) : null}\n              <Grid paddingTop={8} gap={4}>\n                <GridItem col={9} s={12}>\n                  <TabPanels>\n                    <TabPanel>\n                      <FormLayout layout={layout} />\n                    </TabPanel>\n                    <TabPanel>\n                      <FormLayout layout={layout} />\n                    </TabPanel>\n                  </TabPanels>\n                </GridItem>\n                <GridItem col={3} s={12}>\n                  <Panels />\n                </GridItem>\n              </Grid>\n            </TabGroup>\n            <Blocker />\n          </>\n        )}\n      </Form>\n    </Main>\n  );\n};\n\nconst StatusTab = styled(Tab)`\n  text-transform: uppercase;\n`;\n\n/**\n * @internal\n * @description Returns the status of the document where it's latest state takes priority,\n * this typically will be \"published\" unless a user has edited their draft in which we should\n * display \"modified\".\n */\nconst getDocumentStatus = (\n  document: ReturnType<UseDocument>['document'],\n  meta: ReturnType<UseDocument>['meta']\n): 'draft' | 'published' | 'modified' => {\n  const docStatus = document?.status;\n  const statuses = meta?.availableStatus ?? [];\n\n  /**\n   * Creating an entry\n   */\n  if (!docStatus) {\n    return 'draft';\n  }\n\n  /**\n   * We're viewing a draft, but the document could have a published version\n   */\n  if (docStatus === 'draft' && statuses.find((doc) => doc.publishedAt !== null)) {\n    return 'published';\n  }\n\n  return docStatus;\n};\n\n/* -------------------------------------------------------------------------------------------------\n * ProtectedEditViewPage\n * -----------------------------------------------------------------------------------------------*/\n\nconst ProtectedEditViewPage = () => {\n  const { slug } = useParams<{\n    slug: string;\n  }>();\n  const [{ query }] = useQueryParams();\n  const { permissions = [], isLoading, isError } = useSyncRbac(slug ?? '', query, 'editView');\n\n  if (isLoading) {\n    return <Page.Loading />;\n  }\n\n  if ((!isLoading && isError) || !slug) {\n    return <Page.Error />;\n  }\n\n  return (\n    <Page.Protect permissions={permissions}>\n      {({ permissions }) => (\n        <DocumentRBAC permissions={permissions}>\n          <EditViewPage />\n        </DocumentRBAC>\n      )}\n    </Page.Protect>\n  );\n};\n\nexport { EditViewPage, ProtectedEditViewPage };\n"],"names":["jsx","Flex","index","Grid","GridItem","InputRenderer","Box","useLocation","useQueryParams","useIntl","useNotification","React","useDoc","useOnce","useDocumentRBAC","SINGLE_TYPES","useDocumentLayout","useLazyComponents","createDefaultForm","transformDocument","Page","jsxs","Main","Helmet","Form","createYupSchema","Fragment","Header","TabGroup","getTranslation","Tabs","TabPanels","TabPanel","Panels","Blocker","styled","Tab","useParams","useSyncRbac","permissions","DocumentRBAC"],"mappings":"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"}