Move LeftMenu into the components folder

Signed-off-by: soupette <cyril.lpz@gmail.com>

packages/core/admin/admin/src/components/LeftMenu/compos/Header/Wrapper.js

@@ -1,7 +1,7 @@
 import styled from 'styled-components';
 import PropTypes from 'prop-types';
 
-import Logo from '../../../assets/images/logo-strapi.png';
+import Logo from '../../../../assets/images/logo-strapi.png';
 
 const Wrapper = styled.div`
   background-color: #007eff;

packages/core/admin/admin/src/components/LeftMenu/compos/Link/LeftMenuLinkContent.js

@@ -10,7 +10,7 @@ import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 import styled from 'styled-components';
 import { Link, withRouter } from 'react-router-dom';
-import en from '../../../translations/en.json';
+import en from '../../../../translations/en.json';
 import LeftMenuIcon from './LeftMenuIcon';
 import A from './A';
 import NotificationCount from './NotificationCount';

packages/core/admin/admin/src/components/LeftMenu/compos/LinksSection/index.js

@@ -4,8 +4,8 @@ import matchSorter from 'match-sorter';
 import { sortBy } from 'lodash';
 import { FormattedMessage } from 'react-intl';
 
-import LeftMenuLink from '../LeftMenuLink';
-import LeftMenuLinkHeader from '../LeftMenuLinkHeader';
+import LeftMenuLink from '../Link';
+import LeftMenuLinkHeader from '../LinkHeader';
 import LeftMenuListLink from './LeftMenuListLink';
 import EmptyLinksList from './EmptyLinksList';
 import EmptyLinksListWrapper from './EmptyLinksListWrapper';

packages/core/admin/admin/src/components/LeftMenu/compos/Loader/Wrapper.js

@@ -1,6 +1,6 @@
 import styled from 'styled-components';
 
-const LoaderWrapper = styled.div`
+const Wrapper = styled.div`
   position: fixed;
   top: 0;
   right: 0;
@@ -10,4 +10,4 @@ const LoaderWrapper = styled.div`
   background: ${({ theme }) => theme.main.colors.white};
 `;
 
-export default LoaderWrapper;
+export default Wrapper;

packages/core/admin/admin/src/components/LeftMenu/compos/Loader/index.js

@@ -10,16 +10,16 @@ import React from 'react';
 import { createPortal } from 'react-dom';
 import { LoadingIndicatorPage } from '@strapi/helper-plugin';
 import PropTypes from 'prop-types';
-import LoaderWrapper from './LoaderWrapper';
+import Wrapper from './Wrapper';
 
 const MOUNT_NODE = document.getElementById('app') || document.createElement('div');
 
 const Loader = ({ show }) => {
   if (show) {
     return createPortal(
-      <LoaderWrapper>
+      <Wrapper>
         <LoadingIndicatorPage />
-      </LoaderWrapper>,
+      </Wrapper>,
       MOUNT_NODE
     );
   }

packages/core/admin/admin/src/components/LeftMenu/compos/index.js

@@ -0,0 +1,5 @@
+export { default as Footer } from './Footer';
+export { default as Header } from './Header';
+export { default as LinksContainer } from './Links';
+export { default as LinksSection } from './LinksSection';
+export { default as Loader } from './Loader';

packages/core/admin/admin/src/components/LeftMenu/index.js

@@ -1,4 +1,96 @@
-export { default as LeftMenuFooter } from './LeftMenuFooter';
-export { default as LeftMenuHeader } from './LeftMenuHeader';
-export { default as LinksContainer } from './LinksContainer';
-export { default as LeftMenuLinksSection } from './LeftMenuLinkSection';
+import React, { memo, useEffect } from 'react';
+import PropTypes from 'prop-types';
+import { useLocation } from 'react-router-dom';
+// import { LinksSection, LinksContainer } from '../LeftMenuCompos';
+import { Footer, Header, Loader, LinksContainer, LinksSection } from './compos';
+import Wrapper from './Wrapper';
+import useMenuSections from './useMenuSections';
+
+const LeftMenu = ({ shouldUpdateStrapi, version, plugins, setUpdateMenu }) => {
+  const location = useLocation();
+
+  const {
+    state: {
+      isLoading,
+      collectionTypesSectionLinks,
+      singleTypesSectionLinks,
+      generalSectionLinks,
+      pluginsSectionLinks,
+    },
+    toggleLoading,
+    generateMenu,
+  } = useMenuSections(plugins, shouldUpdateStrapi);
+
+  const filteredCollectionTypeLinks = collectionTypesSectionLinks.filter(
+    ({ isDisplayed }) => isDisplayed
+  );
+  const filteredSingleTypeLinks = singleTypesSectionLinks.filter(({ isDisplayed }) => isDisplayed);
+
+  // This effect is really temporary until we create the menu api
+  // We need this because we need to regenerate the links when the settings are being changed
+  // in the content manager configurations list
+  useEffect(() => {
+    setUpdateMenu(() => {
+      toggleLoading();
+      generateMenu();
+    });
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, []);
+
+  return (
+    <Wrapper>
+      <Loader show={isLoading} />
+      <Header />
+      <LinksContainer>
+        {filteredCollectionTypeLinks.length > 0 && (
+          <LinksSection
+            section="collectionType"
+            name="collectionType"
+            links={filteredCollectionTypeLinks}
+            location={location}
+            searchable
+          />
+        )}
+        {filteredSingleTypeLinks.length > 0 && (
+          <LinksSection
+            section="singleType"
+            name="singleType"
+            links={filteredSingleTypeLinks}
+            location={location}
+            searchable
+          />
+        )}
+
+        {pluginsSectionLinks.length > 0 && (
+          <LinksSection
+            section="plugins"
+            name="plugins"
+            links={pluginsSectionLinks}
+            location={location}
+            searchable={false}
+            emptyLinksListMessage="app.components.LeftMenuLinkContainer.noPluginsInstalled"
+          />
+        )}
+        {generalSectionLinks.length > 0 && (
+          <LinksSection
+            section="general"
+            name="general"
+            links={generalSectionLinks}
+            location={location}
+            searchable={false}
+          />
+        )}
+      </LinksContainer>
+      <Footer key="footer" version={version} />
+    </Wrapper>
+  );
+};
+
+LeftMenu.propTypes = {
+  shouldUpdateStrapi: PropTypes.bool.isRequired,
+  version: PropTypes.string.isRequired,
+  plugins: PropTypes.object.isRequired,
+  setUpdateMenu: PropTypes.func.isRequired,
+};
+
+export default memo(LeftMenu);

packages/core/admin/admin/src/containers/Admin/index.js

@@ -26,7 +26,7 @@ import { checkLatestStrapiVersion } from '../../utils';
 import adminPermissions from '../../permissions';
 import Header from '../../components/Header/index';
 import NavTopRightWrapper from '../../components/NavTopRightWrapper';
-import LeftMenu from '../LeftMenu';
+import LeftMenu from '../../components/LeftMenu';
 import InstalledPluginsPage from '../InstalledPluginsPage';
 import HomePage from '../HomePage';
 import MarketplacePage from '../MarketplacePage';

packages/core/admin/admin/src/containers/LeftMenu/index.js

@@ -1,101 +0,0 @@
-import React, { memo, useEffect } from 'react';
-import PropTypes from 'prop-types';
-import { useLocation } from 'react-router-dom';
-import {
-  LeftMenuLinksSection,
-  LeftMenuFooter,
-  LeftMenuHeader,
-  LinksContainer,
-} from '../../components/LeftMenu';
-import Loader from './Loader';
-import Wrapper from './Wrapper';
-import useMenuSections from './useMenuSections';
-
-const LeftMenu = ({ shouldUpdateStrapi, version, plugins, setUpdateMenu }) => {
-  const location = useLocation();
-
-  const {
-    state: {
-      isLoading,
-      collectionTypesSectionLinks,
-      singleTypesSectionLinks,
-      generalSectionLinks,
-      pluginsSectionLinks,
-    },
-    toggleLoading,
-    generateMenu,
-  } = useMenuSections(plugins, shouldUpdateStrapi);
-
-  const filteredCollectionTypeLinks = collectionTypesSectionLinks.filter(
-    ({ isDisplayed }) => isDisplayed
-  );
-  const filteredSingleTypeLinks = singleTypesSectionLinks.filter(({ isDisplayed }) => isDisplayed);
-
-  // This effect is really temporary until we create the menu api
-  // We need this because we need to regenerate the links when the settings are being changed
-  // in the content manager configurations list
-  useEffect(() => {
-    setUpdateMenu(() => {
-      toggleLoading();
-      generateMenu();
-    });
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
-
-  return (
-    <Wrapper>
-      <Loader show={isLoading} />
-      <LeftMenuHeader />
-      <LinksContainer>
-        {filteredCollectionTypeLinks.length > 0 && (
-          <LeftMenuLinksSection
-            section="collectionType"
-            name="collectionType"
-            links={filteredCollectionTypeLinks}
-            location={location}
-            searchable
-          />
-        )}
-        {filteredSingleTypeLinks.length > 0 && (
-          <LeftMenuLinksSection
-            section="singleType"
-            name="singleType"
-            links={filteredSingleTypeLinks}
-            location={location}
-            searchable
-          />
-        )}
-
-        {pluginsSectionLinks.length > 0 && (
-          <LeftMenuLinksSection
-            section="plugins"
-            name="plugins"
-            links={pluginsSectionLinks}
-            location={location}
-            searchable={false}
-            emptyLinksListMessage="app.components.LeftMenuLinkContainer.noPluginsInstalled"
-          />
-        )}
-        {generalSectionLinks.length > 0 && (
-          <LeftMenuLinksSection
-            section="general"
-            name="general"
-            links={generalSectionLinks}
-            location={location}
-            searchable={false}
-          />
-        )}
-      </LinksContainer>
-      <LeftMenuFooter key="footer" version={version} />
-    </Wrapper>
-  );
-};
-
-LeftMenu.propTypes = {
-  shouldUpdateStrapi: PropTypes.bool.isRequired,
-  version: PropTypes.string.isRequired,
-  plugins: PropTypes.object.isRequired,
-  setUpdateMenu: PropTypes.func.isRequired,
-};
-
-export default memo(LeftMenu);

packages/core/admin/admin/src/reducers/index.js

@@ -2,7 +2,7 @@ import globalReducer from '../containers/App/reducer';
 import adminReducer from '../containers/Admin/reducer';
 import languageProviderReducer from '../components/LanguageProvider/reducer';
 import permissionsManagerReducer from '../components/PermissionsManager/reducer';
-import menuReducer from '../containers/LeftMenu/reducer';
+import menuReducer from '../components/LeftMenu/reducer';
 
 // TODO move containers reducers into this folder