@strapi/content-type-builder 5.13.0-beta.1 → 5.13.1

package/dist/admin/components/ContentTypeBuilderNav/ContentTypeBuilderNav.mjs

@@ -1,285 +1,102 @@
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { useState, useEffect, Fragment } from 'react';
-import { SubNav, ConfirmDialog } from '@strapi/admin/strapi-admin';
-import { Menu, Divider, Flex, Button, VisuallyHidden, Typography, TextInput, IconButton, Box, Dialog } from '@strapi/design-system';
-import { ArrowClockwise, More, Cross, Search } from '@strapi/icons';
+import { Fragment } from 'react';
+import { SubNavLink, SubNav, SubNavHeader, SubNavSections, SubNavSection, SubNavLinkSection, Box, TextButton } from '@strapi/design-system';
+import { Plus } from '@strapi/icons';
+import upperFirst from 'lodash/upperFirst';
 import { useIntl } from 'react-intl';
+import { NavLink } from 'react-router-dom';
 import { styled } from 'styled-components';
 import { getTrad } from '../../utils/getTrad.mjs';
-import { useDataManager } from '../DataManager/useDataManager.mjs';
-import { Status } from '../Status.mjs';
 import { useContentTypeBuilderMenu } from './useContentTypeBuilderMenu.mjs';
 
-const ArrowCounterClockwise = styled(ArrowClockwise)`
-  transform: scaleX(-1);
-`;
-const DiscardAllMenuItem = styled(Menu.Item)`
-  color: ${({ theme })=>theme.colors.danger600};
-
-  &:hover {
-    background: ${({ theme, disabled })=>!disabled && theme.colors.danger100};
+const SubNavLinkCustom = styled(SubNavLink)`
+  div {
+    width: inherit;
+    span:nth-child(2) {
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      width: inherit;
+    }
   }
 `;
 const ContentTypeBuilderNav = ()=>{
     const { menu, search } = useContentTypeBuilderMenu();
-    const { saveSchema, isModified, history, isInDevelopmentMode } = useDataManager();
     const { formatMessage } = useIntl();
-    const [menuIsOpen, setMenuIsOpen] = useState(false);
-    const [discardConfirmationModalIsOpen, setDiscardConfirmationModalIsOpen] = useState(false);
-    useEffect(()=>{
-        if (!isInDevelopmentMode) {
-            return;
-        }
-        const onKeyDown = (e)=>{
-            if (e.ctrlKey || e.metaKey) {
-                if (e.key === 'Enter') {
-                    if (isModified) {
-                        e.preventDefault();
-                        saveSchema();
-                    }
-                } else if (e.key === 'z' && !e.shiftKey) {
-                    e.preventDefault(); // Prevent browser default undo (e.g., in input fields)
-                    history.undo();
-                } else if (e.key === 'y' || e.shiftKey && e.key === 'z' || e.key === 'Z') {
-                    e.preventDefault(); // Prevent browser default redo (e.g., in input fields)
-                    history.redo();
-                }
-            }
-        };
-        document.addEventListener('keydown', onKeyDown);
-        return ()=>{
-            document.removeEventListener('keydown', onKeyDown);
-        };
-    });
-    const discardHandler = ()=>{
-        setDiscardConfirmationModalIsOpen(true);
-    };
-    const discardChanges = ()=>{
-        setMenuIsOpen(false);
-        setDiscardConfirmationModalIsOpen(false);
-        history.discardAllChanges();
-    };
-    const undoHandler = ()=>{
-        history.undo();
-    };
-    const redoHandler = ()=>{
-        history.redo();
-    };
     const pluginName = formatMessage({
         id: getTrad('plugin.name'),
         defaultMessage: 'Content-Type Builder'
     });
-    return /*#__PURE__*/ jsxs(SubNav.Main, {
+    return /*#__PURE__*/ jsxs(SubNav, {
         "aria-label": pluginName,
         children: [
-            /*#__PURE__*/ jsx(SubNav.Header, {
-                label: pluginName
-            }),
-            /*#__PURE__*/ jsx(Divider, {
-                background: "neutral150"
+            /*#__PURE__*/ jsx(SubNavHeader, {
+                searchable: true,
+                value: search.value,
+                onClear: ()=>search.clear(),
+                onChange: (e)=>search.onChange(e.target.value),
+                label: pluginName,
+                searchLabel: formatMessage({
+                    id: 'global.search',
+                    defaultMessage: 'Search'
+                })
             }),
-            /*#__PURE__*/ jsxs(Flex, {
-                padding: 5,
-                gap: 3,
-                direction: 'column',
-                alignItems: 'stretch',
-                children: [
-                    /*#__PURE__*/ jsxs(Flex, {
-                        gap: 2,
+            /*#__PURE__*/ jsx(SubNavSections, {
+                children: menu.map((section)=>/*#__PURE__*/ jsxs(Fragment, {
                         children: [
-                            /*#__PURE__*/ jsx(Button, {
-                                flex: 1,
-                                onClick: (e)=>{
-                                    e.preventDefault();
-                                    saveSchema();
-                                },
-                                type: "submit",
-                                disabled: !isModified || !isInDevelopmentMode,
-                                fullWidth: true,
-                                size: "S",
-                                children: formatMessage({
-                                    id: 'global.save',
-                                    defaultMessage: 'Save'
+                            /*#__PURE__*/ jsx(SubNavSection, {
+                                label: formatMessage({
+                                    id: section.title.id,
+                                    defaultMessage: section.title.defaultMessage
+                                }),
+                                collapsable: true,
+                                badgeLabel: section.linksCount.toString(),
+                                children: section.links.map((link)=>{
+                                    if (link.links) {
+                                        return /*#__PURE__*/ jsx(SubNavLinkSection, {
+                                            label: upperFirst(link.title),
+                                            children: link.links.map((subLink)=>/*#__PURE__*/ jsx(SubNavLink, {
+                                                    tag: NavLink,
+                                                    to: subLink.to,
+                                                    active: subLink.active,
+                                                    isSubSectionChild: true,
+                                                    children: upperFirst(formatMessage({
+                                                        id: subLink.name,
+                                                        defaultMessage: subLink.title
+                                                    }))
+                                                }, subLink.name))
+                                        }, link.name);
+                                    }
+                                    return /*#__PURE__*/ jsx(SubNavLinkCustom, {
+                                        tag: NavLink,
+                                        to: link.to,
+                                        active: link.active,
+                                        width: "100%",
+                                        children: upperFirst(formatMessage({
+                                            id: link.name,
+                                            defaultMessage: link.title
+                                        }))
+                                    }, link.name);
                                 })
                             }),
-                            /*#__PURE__*/ jsxs(Menu.Root, {
-                                open: menuIsOpen,
-                                onOpenChange: setMenuIsOpen,
-                                children: [
-                                    /*#__PURE__*/ jsxs(Menu.Trigger, {
-                                        size: "S",
-                                        endIcon: null,
-                                        paddingTop: "4px",
-                                        paddingLeft: "7px",
-                                        paddingRight: "7px",
-                                        variant: "tertiary",
-                                        children: [
-                                            /*#__PURE__*/ jsx(More, {
-                                                fill: "neutral500",
-                                                "aria-hidden": true,
-                                                focusable: false
-                                            }),
-                                            /*#__PURE__*/ jsx(VisuallyHidden, {
-                                                tag: "span",
-                                                children: formatMessage({
-                                                    id: 'global.more.actions',
-                                                    defaultMessage: 'More actions'
-                                                })
-                                            })
-                                        ]
+                            section.customLink && /*#__PURE__*/ jsx(Box, {
+                                paddingLeft: 7,
+                                children: /*#__PURE__*/ jsx(TextButton, {
+                                    onClick: section.customLink.onClick,
+                                    startIcon: /*#__PURE__*/ jsx(Plus, {
+                                        width: "0.8rem",
+                                        height: "0.8rem"
                                     }),
-                                    /*#__PURE__*/ jsxs(Menu.Content, {
-                                        zIndex: 1,
-                                        children: [
-                                            /*#__PURE__*/ jsx(Menu.Item, {
-                                                disabled: !history.canUndo || !isInDevelopmentMode,
-                                                onSelect: undoHandler,
-                                                children: /*#__PURE__*/ jsxs(Flex, {
-                                                    gap: 2,
-                                                    children: [
-                                                        /*#__PURE__*/ jsx(ArrowCounterClockwise, {
-                                                            fill: "neutral500"
-                                                        }),
-                                                        /*#__PURE__*/ jsx(Typography, {
-                                                            children: "Undo last change"
-                                                        })
-                                                    ]
-                                                })
-                                            }),
-                                            /*#__PURE__*/ jsx(Menu.Item, {
-                                                disabled: !history.canRedo || !isInDevelopmentMode,
-                                                onSelect: redoHandler,
-                                                children: /*#__PURE__*/ jsx(Typography, {
-                                                    children: /*#__PURE__*/ jsxs(Flex, {
-                                                        gap: 2,
-                                                        children: [
-                                                            /*#__PURE__*/ jsx(ArrowClockwise, {
-                                                                fill: "neutral500"
-                                                            }),
-                                                            /*#__PURE__*/ jsx(Typography, {
-                                                                children: "Redo last change"
-                                                            })
-                                                        ]
-                                                    })
-                                                })
-                                            }),
-                                            /*#__PURE__*/ jsx(Menu.Separator, {}),
-                                            /*#__PURE__*/ jsx(DiscardAllMenuItem, {
-                                                disabled: !history.canDiscardAll || !isInDevelopmentMode,
-                                                onSelect: discardHandler,
-                                                children: /*#__PURE__*/ jsxs(Flex, {
-                                                    gap: 2,
-                                                    children: [
-                                                        /*#__PURE__*/ jsx(Cross, {}),
-                                                        /*#__PURE__*/ jsx(Typography, {
-                                                            children: "Discard all changes"
-                                                        })
-                                                    ]
-                                                })
-                                            })
-                                        ]
+                                    marginTop: 2,
+                                    cursor: "pointer",
+                                    children: formatMessage({
+                                        id: section.customLink.id,
+                                        defaultMessage: section.customLink.defaultMessage
                                     })
-                                ]
+                                })
                             })
                         ]
-                    }),
-                    /*#__PURE__*/ jsx(TextInput, {
-                        startAction: /*#__PURE__*/ jsx(Search, {
-                            fill: "neutral500"
-                        }),
-                        value: search.value,
-                        onChange: (e)=>search.onChange(e.target.value),
-                        "aria-label": "Search",
-                        placeholder: formatMessage({
-                            id: getTrad('search.placeholder'),
-                            defaultMessage: 'Search'
-                        }),
-                        endAction: /*#__PURE__*/ jsx(IconButton, {
-                            onClick: (e)=>{
-                                e.stopPropagation();
-                                e.preventDefault();
-                                search.onChange('');
-                            },
-                            label: "clear",
-                            variant: "ghost",
-                            type: "button",
-                            style: {
-                                padding: 0
-                            },
-                            children: /*#__PURE__*/ jsx(Cross, {})
-                        }),
-                        size: "S"
-                    })
-                ]
-            }),
-            /*#__PURE__*/ jsx(SubNav.Sections, {
-                children: menu.map((section)=>/*#__PURE__*/ jsx(Fragment, {
-                        children: /*#__PURE__*/ jsx(SubNav.Section, {
-                            label: formatMessage({
-                                id: section.title.id,
-                                defaultMessage: section.title.defaultMessage
-                            }),
-                            link: section.customLink && {
-                                label: formatMessage({
-                                    id: section.customLink?.id,
-                                    defaultMessage: section.customLink?.defaultMessage
-                                }),
-                                onClik: section.customLink?.onClick
-                            },
-                            children: section.links.map((link)=>{
-                                const linkLabel = formatMessage({
-                                    id: link.name,
-                                    defaultMessage: link.title
-                                });
-                                if ('links' in link) {
-                                    return /*#__PURE__*/ jsx(SubNav.SubSection, {
-                                        label: link.title,
-                                        children: link.links.map((subLink)=>{
-                                            const label = formatMessage({
-                                                id: subLink.name,
-                                                defaultMessage: subLink.title
-                                            });
-                                            return /*#__PURE__*/ jsx(SubNav.Link, {
-                                                to: subLink.to,
-                                                label: label,
-                                                endAction: /*#__PURE__*/ jsx(Box, {
-                                                    tag: "span",
-                                                    textAlign: "center",
-                                                    width: '24px',
-                                                    children: /*#__PURE__*/ jsx(Status, {
-                                                        status: subLink.status
-                                                    })
-                                                })
-                                            }, subLink.name);
-                                        })
-                                    }, link.name);
-                                }
-                                return /*#__PURE__*/ jsx(SubNav.Link, {
-                                    to: link.to,
-                                    label: linkLabel,
-                                    endAction: /*#__PURE__*/ jsx(Box, {
-                                        tag: "span",
-                                        textAlign: "center",
-                                        width: '24px',
-                                        children: /*#__PURE__*/ jsx(Status, {
-                                            status: link.status
-                                        })
-                                    })
-                                }, link.name);
-                            })
-                        })
                     }, section.name))
-            }),
-            /*#__PURE__*/ jsx(Dialog.Root, {
-                open: discardConfirmationModalIsOpen,
-                onOpenChange: setDiscardConfirmationModalIsOpen,
-                children: /*#__PURE__*/ jsx(ConfirmDialog, {
-                    onConfirm: discardChanges,
-                    children: formatMessage({
-                        id: getTrad('popUpWarning.discardAll.message'),
-                        defaultMessage: 'Are you sure you want to discard all changes?'
-                    })
-                })
             })
         ]
     });

package/dist/admin/components/ContentTypeBuilderNav/ContentTypeBuilderNav.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"ContentTypeBuilderNav.mjs","sources":["../../../../admin/src/components/ContentTypeBuilderNav/ContentTypeBuilderNav.tsx"],"sourcesContent":["import { Fragment, useState, useEffect } from 'react';\n\nimport { ConfirmDialog, SubNav } from '@strapi/admin/strapi-admin';\nimport {\n  Box,\n  TextInput,\n  Button,\n  Flex,\n  Typography,\n  Divider,\n  Menu,\n  VisuallyHidden,\n  Dialog,\n  IconButton,\n} from '@strapi/design-system';\nimport { ArrowClockwise, Cross, More, Search } from '@strapi/icons';\nimport { useIntl } from 'react-intl';\nimport { styled } from 'styled-components';\n\nimport { getTrad } from '../../utils/getTrad';\nimport { useDataManager } from '../DataManager/useDataManager';\nimport { Status } from '../Status';\n\nimport { useContentTypeBuilderMenu } from './useContentTypeBuilderMenu';\n\nconst ArrowCounterClockwise = styled(ArrowClockwise)`\n  transform: scaleX(-1);\n`;\n\nconst DiscardAllMenuItem = styled(Menu.Item)`\n  color: ${({ theme }) => theme.colors.danger600};\n\n  &:hover {\n    background: ${({ theme, disabled }) => !disabled && theme.colors.danger100};\n  }\n`;\n\nexport const ContentTypeBuilderNav = () => {\n  const { menu, search } = useContentTypeBuilderMenu();\n  const { saveSchema, isModified, history, isInDevelopmentMode } = useDataManager();\n\n  const { formatMessage } = useIntl();\n\n  const [menuIsOpen, setMenuIsOpen] = useState(false);\n  const [discardConfirmationModalIsOpen, setDiscardConfirmationModalIsOpen] = useState(false);\n\n  useEffect(() => {\n    if (!isInDevelopmentMode) {\n      return;\n    }\n\n    const onKeyDown = (e: KeyboardEvent) => {\n      if (e.ctrlKey || e.metaKey) {\n        if (e.key === 'Enter') {\n          if (isModified) {\n            e.preventDefault();\n            saveSchema();\n          }\n        } else if (e.key === 'z' && !e.shiftKey) {\n          e.preventDefault(); // Prevent browser default undo (e.g., in input fields)\n          history.undo();\n        } else if (e.key === 'y' || (e.shiftKey && e.key === 'z') || e.key === 'Z') {\n          e.preventDefault(); // Prevent browser default redo (e.g., in input fields)\n          history.redo();\n        }\n      }\n    };\n\n    document.addEventListener('keydown', onKeyDown);\n\n    return () => {\n      document.removeEventListener('keydown', onKeyDown);\n    };\n  });\n\n  const discardHandler = () => {\n    setDiscardConfirmationModalIsOpen(true);\n  };\n\n  const discardChanges = () => {\n    setMenuIsOpen(false);\n    setDiscardConfirmationModalIsOpen(false);\n    history.discardAllChanges();\n  };\n\n  const undoHandler = () => {\n    history.undo();\n  };\n\n  const redoHandler = () => {\n    history.redo();\n  };\n\n  const pluginName = formatMessage({\n    id: getTrad('plugin.name'),\n    defaultMessage: 'Content-Type Builder',\n  });\n\n  return (\n    <SubNav.Main aria-label={pluginName}>\n      <SubNav.Header label={pluginName} />\n      <Divider background=\"neutral150\" />\n      <Flex padding={5} gap={3} direction={'column'} alignItems={'stretch'}>\n        <Flex gap={2}>\n          <Button\n            flex={1}\n            onClick={(e) => {\n              e.preventDefault();\n              saveSchema();\n            }}\n            type=\"submit\"\n            disabled={!isModified || !isInDevelopmentMode}\n            fullWidth\n            size=\"S\"\n          >\n            {formatMessage({\n              id: 'global.save',\n              defaultMessage: 'Save',\n            })}\n          </Button>\n          <Menu.Root open={menuIsOpen} onOpenChange={setMenuIsOpen}>\n            <Menu.Trigger\n              size=\"S\"\n              endIcon={null}\n              paddingTop=\"4px\"\n              paddingLeft=\"7px\"\n              paddingRight=\"7px\"\n              variant=\"tertiary\"\n            >\n              <More fill=\"neutral500\" aria-hidden focusable={false} />\n              <VisuallyHidden tag=\"span\">\n                {formatMessage({\n                  id: 'global.more.actions',\n                  defaultMessage: 'More actions',\n                })}\n              </VisuallyHidden>\n            </Menu.Trigger>\n            <Menu.Content zIndex={1}>\n              <Menu.Item disabled={!history.canUndo || !isInDevelopmentMode} onSelect={undoHandler}>\n                <Flex gap={2}>\n                  <ArrowCounterClockwise fill=\"neutral500\" />\n                  <Typography>Undo last change</Typography>\n                </Flex>\n              </Menu.Item>\n              <Menu.Item disabled={!history.canRedo || !isInDevelopmentMode} onSelect={redoHandler}>\n                <Typography>\n                  <Flex gap={2}>\n                    <ArrowClockwise fill=\"neutral500\" />\n                    <Typography>Redo last change</Typography>\n                  </Flex>\n                </Typography>\n              </Menu.Item>\n              <Menu.Separator />\n              <DiscardAllMenuItem\n                disabled={!history.canDiscardAll || !isInDevelopmentMode}\n                onSelect={discardHandler}\n              >\n                <Flex gap={2}>\n                  <Cross />\n                  <Typography>Discard all changes</Typography>\n                </Flex>\n              </DiscardAllMenuItem>\n            </Menu.Content>\n          </Menu.Root>\n        </Flex>\n\n        <TextInput\n          startAction={<Search fill=\"neutral500\" />}\n          value={search.value}\n          onChange={(e) => search.onChange(e.target.value)}\n          aria-label=\"Search\"\n          placeholder={formatMessage({\n            id: getTrad('search.placeholder'),\n            defaultMessage: 'Search',\n          })}\n          endAction={\n            <IconButton\n              onClick={(e) => {\n                e.stopPropagation();\n                e.preventDefault();\n                search.onChange('');\n              }}\n              label=\"clear\"\n              variant=\"ghost\"\n              type=\"button\"\n              style={{ padding: 0 }}\n            >\n              <Cross />\n            </IconButton>\n          }\n          size=\"S\"\n        />\n      </Flex>\n      <SubNav.Sections>\n        {menu.map((section) => (\n          <Fragment key={section.name}>\n            <SubNav.Section\n              label={formatMessage({\n                id: section.title.id,\n                defaultMessage: section.title.defaultMessage,\n              })}\n              link={\n                section.customLink && {\n                  label: formatMessage({\n                    id: section.customLink?.id,\n                    defaultMessage: section.customLink?.defaultMessage,\n                  }),\n                  onClik: section.customLink?.onClick,\n                }\n              }\n            >\n              {section.links.map((link) => {\n                const linkLabel = formatMessage({ id: link.name, defaultMessage: link.title });\n\n                if ('links' in link) {\n                  return (\n                    <SubNav.SubSection key={link.name} label={link.title}>\n                      {link.links.map((subLink) => {\n                        const label = formatMessage({\n                          id: subLink.name,\n                          defaultMessage: subLink.title,\n                        });\n\n                        return (\n                          <SubNav.Link\n                            to={subLink.to}\n                            key={subLink.name}\n                            label={label}\n                            endAction={\n                              <Box tag=\"span\" textAlign=\"center\" width={'24px'}>\n                                <Status status={subLink.status} />\n                              </Box>\n                            }\n                          />\n                        );\n                      })}\n                    </SubNav.SubSection>\n                  );\n                }\n\n                return (\n                  <SubNav.Link\n                    to={link.to}\n                    key={link.name}\n                    label={linkLabel}\n                    endAction={\n                      <Box tag=\"span\" textAlign=\"center\" width={'24px'}>\n                        <Status status={link.status} />\n                      </Box>\n                    }\n                  />\n                );\n              })}\n            </SubNav.Section>\n          </Fragment>\n        ))}\n      </SubNav.Sections>\n      <Dialog.Root\n        open={discardConfirmationModalIsOpen}\n        onOpenChange={setDiscardConfirmationModalIsOpen}\n      >\n        <ConfirmDialog onConfirm={discardChanges}>\n          {formatMessage({\n            id: getTrad('popUpWarning.discardAll.message'),\n            defaultMessage: 'Are you sure you want to discard all changes?',\n          })}\n        </ConfirmDialog>\n      </Dialog.Root>\n    </SubNav.Main>\n  );\n};\n"],"names":["ArrowCounterClockwise","styled","ArrowClockwise","DiscardAllMenuItem","Menu","Item","theme","colors","danger600","disabled","danger100","ContentTypeBuilderNav","menu","search","useContentTypeBuilderMenu","saveSchema","isModified","history","isInDevelopmentMode","useDataManager","formatMessage","useIntl","menuIsOpen","setMenuIsOpen","useState","discardConfirmationModalIsOpen","setDiscardConfirmationModalIsOpen","useEffect","onKeyDown","e","ctrlKey","metaKey","key","preventDefault","shiftKey","undo","redo","document","addEventListener","removeEventListener","discardHandler","discardChanges","discardAllChanges","undoHandler","redoHandler","pluginName","id","getTrad","defaultMessage","_jsxs","SubNav","Main","aria-label","_jsx","Header","label","Divider","background","Flex","padding","gap","direction","alignItems","Button","flex","onClick","type","fullWidth","size","Root","open","onOpenChange","Trigger","endIcon","paddingTop","paddingLeft","paddingRight","variant","More","fill","aria-hidden","focusable","VisuallyHidden","tag","Content","zIndex","canUndo","onSelect","Typography","canRedo","Separator","canDiscardAll","Cross","TextInput","startAction","Search","value","onChange","target","placeholder","endAction","IconButton","stopPropagation","style","Sections","map","section","Fragment","Section","title","link","customLink","onClik","links","linkLabel","name","SubSection","subLink","Link","to","Box","textAlign","width","Status","status","Dialog","ConfirmDialog","onConfirm"],"mappings":"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"}
+{"version":3,"file":"ContentTypeBuilderNav.mjs","sources":["../../../../admin/src/components/ContentTypeBuilderNav/ContentTypeBuilderNav.tsx"],"sourcesContent":["import { Fragment } from 'react';\n\nimport {\n  Box,\n  TextButton,\n  SubNav,\n  SubNavHeader,\n  SubNavLink,\n  SubNavLinkSection,\n  SubNavSection,\n  SubNavSections,\n} from '@strapi/design-system';\nimport { Plus } from '@strapi/icons';\nimport upperFirst from 'lodash/upperFirst';\nimport { useIntl } from 'react-intl';\nimport { NavLink } from 'react-router-dom';\nimport { styled } from 'styled-components';\n\nimport { getTrad } from '../../utils/getTrad';\n\nimport { useContentTypeBuilderMenu } from './useContentTypeBuilderMenu';\n\nconst SubNavLinkCustom = styled(SubNavLink)`\n  div {\n    width: inherit;\n    span:nth-child(2) {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      width: inherit;\n    }\n  }\n`;\n\nexport const ContentTypeBuilderNav = () => {\n  const { menu, search } = useContentTypeBuilderMenu();\n  const { formatMessage } = useIntl();\n\n  const pluginName = formatMessage({\n    id: getTrad('plugin.name'),\n    defaultMessage: 'Content-Type Builder',\n  });\n\n  return (\n    <SubNav aria-label={pluginName}>\n      <SubNavHeader\n        searchable\n        value={search.value}\n        onClear={() => search.clear()}\n        onChange={(e) => search.onChange(e.target.value)}\n        label={pluginName}\n        searchLabel={formatMessage({\n          id: 'global.search',\n          defaultMessage: 'Search',\n        })}\n      />\n      <SubNavSections>\n        {menu.map((section) => (\n          <Fragment key={section.name}>\n            <SubNavSection\n              label={formatMessage({\n                id: section.title.id,\n                defaultMessage: section.title.defaultMessage,\n              })}\n              collapsable\n              badgeLabel={section.linksCount.toString()}\n            >\n              {section.links.map((link) => {\n                if (link.links) {\n                  return (\n                    <SubNavLinkSection key={link.name} label={upperFirst(link.title)}>\n                      {link.links.map((subLink: any) => (\n                        <SubNavLink\n                          tag={NavLink}\n                          to={subLink.to}\n                          active={subLink.active}\n                          key={subLink.name}\n                          isSubSectionChild\n                        >\n                          {upperFirst(\n                            formatMessage({ id: subLink.name, defaultMessage: subLink.title })\n                          )}\n                        </SubNavLink>\n                      ))}\n                    </SubNavLinkSection>\n                  );\n                }\n\n                return (\n                  <SubNavLinkCustom\n                    tag={NavLink}\n                    to={link.to}\n                    active={link.active}\n                    key={link.name}\n                    width=\"100%\"\n                  >\n                    {upperFirst(formatMessage({ id: link.name, defaultMessage: link.title }))}\n                  </SubNavLinkCustom>\n                );\n              })}\n            </SubNavSection>\n            {section.customLink && (\n              <Box paddingLeft={7}>\n                <TextButton\n                  onClick={section.customLink.onClick}\n                  startIcon={<Plus width=\"0.8rem\" height=\"0.8rem\" />}\n                  marginTop={2}\n                  cursor=\"pointer\"\n                >\n                  {formatMessage({\n                    id: section.customLink.id,\n                    defaultMessage: section.customLink.defaultMessage,\n                  })}\n                </TextButton>\n              </Box>\n            )}\n          </Fragment>\n        ))}\n      </SubNavSections>\n    </SubNav>\n  );\n};\n"],"names":["SubNavLinkCustom","styled","SubNavLink","ContentTypeBuilderNav","menu","search","useContentTypeBuilderMenu","formatMessage","useIntl","pluginName","id","getTrad","defaultMessage","_jsxs","SubNav","aria-label","_jsx","SubNavHeader","searchable","value","onClear","clear","onChange","e","target","label","searchLabel","SubNavSections","map","section","Fragment","SubNavSection","title","collapsable","badgeLabel","linksCount","toString","links","link","SubNavLinkSection","upperFirst","subLink","tag","NavLink","to","active","isSubSectionChild","name","width","customLink","Box","paddingLeft","TextButton","onClick","startIcon","Plus","height","marginTop","cursor"],"mappings":"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"}

package/dist/admin/components/ContentTypeBuilderNav/useContentTypeBuilderMenu.js

@@ -3,18 +3,20 @@
 var React = require('react');
 var strapiAdmin = require('@strapi/admin/strapi-admin');
 var designSystem = require('@strapi/design-system');
-var upperFirst = require('lodash/upperFirst');
+var isEqual = require('lodash/isEqual');
 var reactIntl = require('react-intl');
+var useDataManager = require('../../hooks/useDataManager.js');
+var useFormModalNavigation = require('../../hooks/useFormModalNavigation.js');
 var pluginId = require('../../pluginId.js');
 var getTrad = require('../../utils/getTrad.js');
-var useDataManager = require('../DataManager/useDataManager.js');
-var useFormModalNavigation = require('../FormModalNavigation/useFormModalNavigation.js');
 
 const useContentTypeBuilderMenu = ()=>{
-    const { componentsGroupedByCategory, isInDevelopmentMode, sortedContentTypesList } = useDataManager.useDataManager();
+    const { components, componentsGroupedByCategory, contentTypes, isInDevelopmentMode, sortedContentTypesList, modifiedData, initialData } = useDataManager.useDataManager();
+    const { toggleNotification } = strapiAdmin.useNotification();
+    const { formatMessage } = reactIntl.useIntl();
     const { trackUsage } = strapiAdmin.useTracking();
     const [searchValue, setSearchValue] = React.useState('');
-    const { onOpenModalCreateSchema } = useFormModalNavigation.useFormModalNavigation();
+    const { onOpenModalCreateSchema, onOpenModalEditCategory } = useFormModalNavigation.useFormModalNavigation();
     const { locale } = reactIntl.useIntl();
     const { startsWith } = designSystem.useFilter(locale, {
         sensitivity: 'base'
@@ -22,53 +24,80 @@ const useContentTypeBuilderMenu = ()=>{
     const formatter = designSystem.useCollator(locale, {
         sensitivity: 'base'
     });
+    // TODO: Allow creating mutliple schemas in parallel
+    const canOpenModalCreateCTorComponent = !Object.keys(contentTypes).some((ct)=>contentTypes[ct].isTemporary === true) && !Object.keys(components).some((component)=>components[component].isTemporary === true) && isEqual(modifiedData, initialData);
     const handleClickOpenModalCreateCollectionType = ()=>{
-        trackUsage(`willCreateContentType`);
-        const nextState = {
-            modalType: 'contentType',
-            kind: 'collectionType',
-            actionType: 'create',
-            forTarget: 'contentType'
-        };
-        onOpenModalCreateSchema(nextState);
+        if (canOpenModalCreateCTorComponent) {
+            // TODO: Review tracking with product
+            trackUsage(`willCreateContentType`);
+            const nextState = {
+                modalType: 'contentType',
+                kind: 'collectionType',
+                actionType: 'create',
+                forTarget: 'contentType'
+            };
+            onOpenModalCreateSchema(nextState);
+        } else {
+            toggleNotificationCannotCreateSchema();
+        }
     };
     const handleClickOpenModalCreateSingleType = ()=>{
-        trackUsage(`willCreateSingleType`);
-        const nextState = {
-            modalType: 'contentType',
-            kind: 'singleType',
-            actionType: 'create',
-            forTarget: 'contentType'
-        };
-        onOpenModalCreateSchema(nextState);
+        if (canOpenModalCreateCTorComponent) {
+            trackUsage(`willCreateSingleType`);
+            const nextState = {
+                modalType: 'contentType',
+                kind: 'singleType',
+                actionType: 'create',
+                forTarget: 'contentType'
+            };
+            onOpenModalCreateSchema(nextState);
+        } else {
+            toggleNotificationCannotCreateSchema();
+        }
     };
     const handleClickOpenModalCreateComponent = ()=>{
-        trackUsage('willCreateComponent');
-        const nextState = {
-            modalType: 'component',
-            kind: null,
-            actionType: 'create',
-            forTarget: 'component'
-        };
-        onOpenModalCreateSchema(nextState);
+        if (canOpenModalCreateCTorComponent) {
+            trackUsage('willCreateComponent');
+            const nextState = {
+                modalType: 'component',
+                kind: null,
+                actionType: 'create',
+                forTarget: 'component'
+            };
+            onOpenModalCreateSchema(nextState);
+        } else {
+            toggleNotificationCannotCreateSchema();
+        }
+    };
+    const toggleNotificationCannotCreateSchema = ()=>{
+        toggleNotification({
+            type: 'info',
+            message: formatMessage({
+                id: getTrad.getTrad('notification.info.creating.notSaved'),
+                defaultMessage: 'Please save your work before creating a new collection type or component'
+            })
+        });
     };
     const componentsData = Object.entries(componentsGroupedByCategory).map(([category, components])=>({
             name: category,
-            title: upperFirst(category),
+            title: category,
+            isEditable: isInDevelopmentMode,
+            // TODO: re-add functionality to edit category name
+            onClickEdit (e, data) {
+                e.stopPropagation();
+                if (canOpenModalCreateCTorComponent) {
+                    onOpenModalEditCategory(data.name);
+                } else {
+                    toggleNotificationCannotCreateSchema();
+                }
+            },
             links: components.map((component)=>({
                     name: component.uid,
                     to: `/plugins/${pluginId.pluginId}/component-categories/${category}/${component.uid}`,
-                    title: component.info.displayName,
-                    status: component.status
+                    title: component.schema.displayName
                 })).sort((a, b)=>formatter.compare(a.title, b.title))
         })).sort((a, b)=>formatter.compare(a.title, b.title));
-    const displayedContentTypes = sortedContentTypesList.filter((obj)=>obj.visible).map((info)=>({
-            kind: info.kind,
-            name: info.name,
-            to: info.to,
-            title: info.title,
-            status: info.status
-        }));
+    const displayedContentTypes = sortedContentTypesList.filter((obj)=>obj.visible);
     const data = [
         {
             name: 'models',
@@ -76,11 +105,11 @@ const useContentTypeBuilderMenu = ()=>{
                 id: `${getTrad.getTrad('menu.section.models.name')}`,
                 defaultMessage: 'Collection Types'
             },
-            customLink: isInDevelopmentMode ? {
+            customLink: isInDevelopmentMode && {
                 id: `${getTrad.getTrad('button.model.create')}`,
                 defaultMessage: 'Create new collection type',
                 onClick: handleClickOpenModalCreateCollectionType
-            } : undefined,
+            },
             links: displayedContentTypes.filter((contentType)=>contentType.kind === 'collectionType')
         },
         {
@@ -89,11 +118,11 @@ const useContentTypeBuilderMenu = ()=>{
                 id: `${getTrad.getTrad('menu.section.single-types.name')}`,
                 defaultMessage: 'Single Types'
             },
-            customLink: isInDevelopmentMode ? {
+            customLink: isInDevelopmentMode && {
                 id: `${getTrad.getTrad('button.single-types.create')}`,
                 defaultMessage: 'Create new single type',
                 onClick: handleClickOpenModalCreateSingleType
-            } : undefined,
+            },
             links: displayedContentTypes.filter((singleType)=>singleType.kind === 'singleType')
         },
         {
@@ -102,31 +131,30 @@ const useContentTypeBuilderMenu = ()=>{
                 id: `${getTrad.getTrad('menu.section.components.name')}`,
                 defaultMessage: 'Components'
             },
-            customLink: isInDevelopmentMode ? {
+            customLink: isInDevelopmentMode && {
                 id: `${getTrad.getTrad('button.component.create')}`,
                 defaultMessage: 'Create a new component',
                 onClick: handleClickOpenModalCreateComponent
-            } : undefined,
+            },
             links: componentsData
         }
     ].map((section)=>{
-        const hasChild = section.links.some((l)=>'links' in l && Array.isArray(l.links));
+        const hasChild = section.links.some((l)=>Array.isArray(l.links));
         if (hasChild) {
             let filteredLinksCount = 0;
             return {
                 ...section,
-                links: section.links.reduce((acc, link)=>{
-                    const filteredLinks = 'links' in link ? link.links.filter((link)=>startsWith(link.title, searchValue)) : [];
+                links: section.links.map((link)=>{
+                    const filteredLinks = link.links.filter((link)=>startsWith(link.title, searchValue));
                     if (filteredLinks.length === 0) {
-                        return acc;
+                        return null;
                     }
                     filteredLinksCount += filteredLinks.length;
-                    acc.push({
+                    return {
                         ...link,
                         links: filteredLinks.sort((a, b)=>formatter.compare(a.title, b.title))
-                    });
-                    return acc;
-                }, []),
+                    };
+                }).filter(Boolean),
                 linksCount: filteredLinksCount
             };
         }