Add production mode to ctb

packages/strapi-plugin-content-manager/admin/src/components/CustomTable/Row.js

@@ -31,7 +31,7 @@ const getDisplayedValue = (type, value, name) => {
     case 'time':
     case 'datetime':
     case 'timestamp': {
-      if (value === null) {
+      if (value == null) {
         return '-';
       }
 

packages/strapi-plugin-content-type-builder/admin/src/components/ComponentSelect/MultipleMenuList.js

@@ -88,7 +88,7 @@ const MultipleMenuList = ({
               <div style={{ marginTop: 3 }}>
                 <CheckboxWrapper>
                   <Label
-                    htmlFor="overrideReactSelectBehaviour"
+                    htmlFor="overrideReactSelectBehavior"
                     onClick={() => {
                       handleChangeCategory({ target });
                     }}

packages/strapi-plugin-content-type-builder/admin/src/components/ComponentSelect/Value.js

@@ -35,7 +35,7 @@ const Value = ({ children, ...props }) => {
   const message =
     valueLength > '0'
       ? getTrad('components.componentSelect.value-components')
-      : getTrad('components.componentSelect.value-components');
+      : getTrad('components.componentSelect.value-component');
 
   return (
     <SingleValue {...props}>

packages/strapi-plugin-content-type-builder/admin/src/components/ComponentSelect/index.js

@@ -20,8 +20,7 @@ const ComponentSelect = ({
   // Create a ref in order to access the StateManager
   // So we can close the menu after clicking on a menu item
   // This allows us to get rid of the menuIsOpen state management
-  // So we let the lib taking care of it
+  // So we let the custom components taking care of it
-  // It's not the best practice but it is efficient
   const ref = useRef();
   const handleChange = (inputValue, actionMeta) => {
     const { action } = actionMeta;
@@ -54,7 +53,6 @@ const ComponentSelect = ({
       value={{ label: value, value }}
       options={[]}
       ref={ref}
-      // menuIsOpen
       refState={ref}
       components={{
         MenuList: MenuListCompo,

packages/strapi-plugin-content-type-builder/admin/src/containers/DataManagerProvider/index.js

@@ -37,7 +37,7 @@ import getTrad from '../../utils/getTrad';
 const DataManagerProvider = ({ allIcons, children }) => {
   const [reducerState, dispatch] = useReducer(reducer, initialState, init);
   const [infoModals, toggleInfoModal] = useState({ cancel: false });
-  const { updatePlugin } = useGlobalContext();
+  const { currentEnvironment, updatePlugin } = useGlobalContext();
   const {
     components,
     contentTypes,
@@ -54,6 +54,8 @@ const DataManagerProvider = ({ allIcons, children }) => {
   const componentMatch = useRouteMatch(
     `/plugins/${pluginId}/component-categories/:categoryUid/:componentUid`
   );
+  const isInDevelopmentMode = currentEnvironment === 'development';
+
   const isInContentTypeView = contentTypeMatch !== null;
   const firstKeyToMainSchema = isInContentTypeView
     ? 'contentType'
@@ -424,8 +426,6 @@ const DataManagerProvider = ({ allIcons, children }) => {
     });
   };
 
-  console.log({ modifiedData });
-
   return (
     <DataManagerContext.Provider
       value={{
@@ -449,6 +449,7 @@ const DataManagerProvider = ({ allIcons, children }) => {
         deleteCategory,
         deleteData,
         editCategory,
+        isInDevelopmentMode,
         initialData,
         isInContentTypeView,
         modifiedData,
@@ -467,22 +468,26 @@ const DataManagerProvider = ({ allIcons, children }) => {
       ) : (
         <>
           {children}
-          <FormModal />
+          {isInDevelopmentMode && (
-          <PopUpWarning
+            <>
-            isOpen={infoModals.cancel}
+              <FormModal />
-            toggleModal={toggleModalCancel}
+              <PopUpWarning
-            content={{
+                isOpen={infoModals.cancel}
-              message: getTrad(
+                toggleModal={toggleModalCancel}
-                `popUpWarning.bodyMessage.cancel-modifications${
+                content={{
-                  didModifiedComponents ? '.with-components' : ''
+                  message: getTrad(
-                }`
+                    `popUpWarning.bodyMessage.cancel-modifications${
-              ),
+                      didModifiedComponents ? '.with-components' : ''
-            }}
+                    }`
-            popUpWarningType="danger"
+                  ),
-            onConfirm={() => {
+                }}
-              cancelChanges();
+                popUpWarningType="danger"
-            }}
+                onConfirm={() => {
-          />
+                  cancelChanges();
+                }}
+              />
+            </>
+          )}
         </>
       )}
     </DataManagerContext.Provider>

packages/strapi-plugin-content-type-builder/admin/src/containers/LeftMenu/index.js

@@ -27,18 +27,17 @@ function LeftMenu({ wait }) {
     components,
     componentsGroupedByCategory,
     contentTypes,
+    isInDevelopmentMode,
     sortedContentTypesList,
   } = useDataManager();
-  const { currentEnvironment, formatMessage } = useGlobalContext();
+  const { formatMessage } = useGlobalContext();
   const { push } = useHistory();
 
-  const isProduction = currentEnvironment === 'production';
-
   const componentsData = sortBy(
     Object.keys(componentsGroupedByCategory).map(category => ({
       name: category,
       title: category,
-      isEditable: true,
+      isEditable: isInDevelopmentMode,
       onClickEdit: (e, data) => {
         e.stopPropagation();
         const search = makeSearch({
@@ -95,16 +94,17 @@ function LeftMenu({ wait }) {
         id: `${pluginId}.menu.section.models.name.`,
       },
       searchable: true,
-      customLink: {
+      customLink: isInDevelopmentMode
-        Component: CustomLink,
+        ? {
-        componentProps: {
+            Component: CustomLink,
-          disabled: isProduction,
+            componentProps: {
-          id: `${pluginId}.button.model.create`,
+              id: `${pluginId}.button.model.create`,
-          onClick: () => {
+              onClick: () => {
-            handleClickOpenModal('contentType');
+                handleClickOpenModal('contentType');
-          },
+              },
-        },
+            },
-      },
+          }
+        : null,
       links: sortedContentTypesList,
     },
     {
@@ -113,16 +113,17 @@ function LeftMenu({ wait }) {
         id: `${pluginId}.menu.section.components.name.`,
       },
       searchable: true,
-      customLink: {
+      customLink: isInDevelopmentMode
-        Component: CustomLink,
+        ? {
-        componentProps: {
+            Component: CustomLink,
-          disabled: isProduction,
+            componentProps: {
-          id: `${pluginId}.button.component.create`,
+              id: `${pluginId}.button.component.create`,
-          onClick: () => {
+              onClick: () => {
-            handleClickOpenModal('component');
+                handleClickOpenModal('component');
-          },
+              },
-        },
+            },
-      },
+          }
+        : null,
       links: componentsData,
     },
   ];

packages/strapi-plugin-content-type-builder/admin/src/containers/TempListView/index.js

@@ -37,6 +37,7 @@ const ListPage = () => {
     isInContentTypeView,
     // removeAttribute,
     // removeComponentFromDynamicZone,
+    isInDevelopmentMode,
     submitData,
     toggleModalCancel,
   } = useDataManager();
@@ -168,26 +169,28 @@ const ListPage = () => {
   const label = get(modifiedData, [firstMainDataPath, 'schema', 'name'], '');
 
   const headerProps = {
-    actions: getActions(),
+    actions: isInDevelopmentMode ? getActions() : [],
     title: {
       label,
-      cta: {
+      cta: isInDevelopmentMode
-        icon: 'pencil-alt',
+        ? {
-        onClick: async () => {
+            icon: 'pencil-alt',
-          await wait();
+            onClick: async () => {
+              await wait();
 
-          push({
+              push({
-            search: makeSearch({
+                search: makeSearch({
-              modalType: firstMainDataPath,
+                  modalType: firstMainDataPath,
-              actionType: 'edit',
+                  actionType: 'edit',
-              settingType: 'base',
+                  settingType: 'base',
-              forTarget: firstMainDataPath,
+                  forTarget: firstMainDataPath,
-              targetUid,
+                  targetUid,
-              headerDisplayName: label,
+                  headerDisplayName: label,
-            }),
+                }),
-          });
+              });
-        },
+            },
-      },
+          }
+        : null,
     },
     content: getDescription(),
   };
@@ -210,7 +213,7 @@ const ListPage = () => {
     onClick: () => handleClickAddAttributeMainData(),
   };
 
-  const listActions = [{ ...addButtonProps }];
+  const listActions = isInDevelopmentMode ? [{ ...addButtonProps }] : [];
 
   const convertDataToArray = () => {
     return Object.keys(attributes).map((key, index) => {