From 13eef9671ca6423a54ea50eaa6ccf70cf8ccc29b Mon Sep 17 00:00:00 2001 From: soupette Date: Wed, 16 Jun 2021 11:08:40 +0200 Subject: [PATCH] Update general section link shape Signed-off-by: soupette --- .../lib/fixtures/store/index.js | 20 ++++++++---------- .../components/LeftMenu/compos/Link/index.js | 21 +++++++++++-------- .../LeftMenu/compos/LinksSection/index.js | 15 ++----------- .../admin/src/components/LeftMenu/index.js | 6 +----- .../admin/src/components/LeftMenu/reducer.js | 20 ++++++------------ .../LeftMenu/utils/getGeneralLinks.js | 4 +--- .../utils/tests/getGeneralLinks.test.js | 20 +++++++++--------- .../core/admin/admin/src/core/apis/Plugin.js | 2 +- 8 files changed, 42 insertions(+), 66 deletions(-) diff --git a/packages/admin-test-utils/lib/fixtures/store/index.js b/packages/admin-test-utils/lib/fixtures/store/index.js index ec53695d79..9afd206ac4 100644 --- a/packages/admin-test-utils/lib/fixtures/store/index.js +++ b/packages/admin-test-utils/lib/fixtures/store/index.js @@ -9,39 +9,37 @@ const reducers = { generalSectionLinks: [ { icon: 'list', - label: { + intlLabel: { id: 'app.components.LeftMenuLinkContainer.listPlugins', defaultMessage: 'Plugins', }, - destination: '/list-plugins', - isDisplayed: false, + to: '/list-plugins', permissions: [ { action: 'admin::marketplace.read', subject: null }, { action: 'admin::marketplace.plugins.install', subject: null }, { action: 'admin::marketplace.plugins.uninstall', subject: null }, ], - notificationsCount: 0, }, { icon: 'shopping-basket', - label: { + intlLabel: { id: 'app.components.LeftMenuLinkContainer.installNewPlugin', defaultMessage: 'Marketplace', }, - destination: '/marketplace', - isDisplayed: false, + to: '/marketplace', permissions: [ { action: 'admin::marketplace.read', subject: null }, { action: 'admin::marketplace.plugins.install', subject: null }, { action: 'admin::marketplace.plugins.uninstall', subject: null }, ], - notificationsCount: 0, }, { icon: 'cog', - label: { id: 'app.components.LeftMenuLinkContainer.settings', defaultMessage: 'Settings' }, - isDisplayed: true, - destination: '/settings', + intlLabel: { + id: 'app.components.LeftMenuLinkContainer.settings', + defaultMessage: 'Settings', + }, + to: '/settings', // Permissions of this link are retrieved in the init phase // using the settings menu permissions: [], diff --git a/packages/core/admin/admin/src/components/LeftMenu/compos/Link/index.js b/packages/core/admin/admin/src/components/LeftMenu/compos/Link/index.js index d50b5dc006..c96695082d 100644 --- a/packages/core/admin/admin/src/components/LeftMenu/compos/Link/index.js +++ b/packages/core/admin/admin/src/components/LeftMenu/compos/Link/index.js @@ -12,26 +12,29 @@ import Link from './Link'; import LeftMenuIcon from './LeftMenuIcon'; import NotificationCount from './NotificationCount'; -const LeftMenuLink = ({ destination, iconName, label, notificationsCount }) => { +const LeftMenuLink = ({ to, icon, intlLabel, notificationsCount }) => { return ( - - + + {/* TODO change with new DS */} - {message => {message}} + + {message => {message}} + {notificationsCount > 0 && } ); }; LeftMenuLink.propTypes = { - destination: PropTypes.string.isRequired, - iconName: PropTypes.string, - label: PropTypes.object.isRequired, - notificationsCount: PropTypes.number.isRequired, + to: PropTypes.string.isRequired, + icon: PropTypes.string, + intlLabel: PropTypes.object.isRequired, + notificationsCount: PropTypes.number, }; LeftMenuLink.defaultProps = { - iconName: 'circle', + icon: 'circle', + notificationsCount: 0, }; export default LeftMenuLink; diff --git a/packages/core/admin/admin/src/components/LeftMenu/compos/LinksSection/index.js b/packages/core/admin/admin/src/components/LeftMenu/compos/LinksSection/index.js index ac47532b86..836cebb0ba 100644 --- a/packages/core/admin/admin/src/components/LeftMenu/compos/LinksSection/index.js +++ b/packages/core/admin/admin/src/components/LeftMenu/compos/LinksSection/index.js @@ -3,20 +3,12 @@ import PropTypes from 'prop-types'; import LeftMenuLink from '../Link'; import LeftMenuListLink from './LeftMenuListLink'; -const LeftMenuLinksSection = ({ location, links }) => { +const LeftMenuLinksSection = ({ links }) => { return ( <> {links.map(link => ( - + ))} @@ -24,9 +16,6 @@ const LeftMenuLinksSection = ({ location, links }) => { }; LeftMenuLinksSection.propTypes = { - location: PropTypes.shape({ - pathname: PropTypes.string, - }).isRequired, links: PropTypes.arrayOf(PropTypes.object).isRequired, }; diff --git a/packages/core/admin/admin/src/components/LeftMenu/index.js b/packages/core/admin/admin/src/components/LeftMenu/index.js index 50cb12a256..7824f10deb 100644 --- a/packages/core/admin/admin/src/components/LeftMenu/index.js +++ b/packages/core/admin/admin/src/components/LeftMenu/index.js @@ -1,13 +1,10 @@ import React, { memo } from 'react'; import PropTypes from 'prop-types'; import { FormattedMessage } from 'react-intl'; -import { useLocation } from 'react-router-dom'; import { Footer, Header, LinksContainer, LinksSection, SectionTitle } from './compos'; import Wrapper from './Wrapper'; const LeftMenu = ({ generalSectionLinks, pluginsSectionLinks }) => { - const location = useLocation(); - return (
@@ -22,7 +19,6 @@ const LeftMenu = ({ generalSectionLinks, pluginsSectionLinks }) => { @@ -36,7 +32,7 @@ const LeftMenu = ({ generalSectionLinks, pluginsSectionLinks }) => { defaultMessage="General" /> - + )} diff --git a/packages/core/admin/admin/src/components/LeftMenu/reducer.js b/packages/core/admin/admin/src/components/LeftMenu/reducer.js index 9e603a93dc..9050c9f481 100644 --- a/packages/core/admin/admin/src/components/LeftMenu/reducer.js +++ b/packages/core/admin/admin/src/components/LeftMenu/reducer.js @@ -7,37 +7,29 @@ const initialState = { generalSectionLinks: [ { icon: 'list', - label: { + intlLabel: { id: 'app.components.LeftMenuLinkContainer.listPlugins', defaultMessage: 'Plugins', }, - destination: '/list-plugins', - // TODO - isDisplayed: false, + to: '/list-plugins', permissions: adminPermissions.marketplace.main, - notificationsCount: 0, }, { icon: 'shopping-basket', - label: { + intlLabel: { id: 'app.components.LeftMenuLinkContainer.installNewPlugin', defaultMessage: 'Marketplace', }, - destination: '/marketplace', - // TODO - isDisplayed: false, + to: '/marketplace', permissions: adminPermissions.marketplace.main, - notificationsCount: 0, }, { icon: 'cog', - label: { + intlLabel: { id: 'app.components.LeftMenuLinkContainer.settings', defaultMessage: 'Settings', }, - // TODO - isDisplayed: true, - destination: '/settings', + to: '/settings', // Permissions of this link are retrieved in the init phase // using the settings menu permissions: [], diff --git a/packages/core/admin/admin/src/components/LeftMenu/utils/getGeneralLinks.js b/packages/core/admin/admin/src/components/LeftMenu/utils/getGeneralLinks.js index a0f7aa29d7..6da9c0a12e 100644 --- a/packages/core/admin/admin/src/components/LeftMenu/utils/getGeneralLinks.js +++ b/packages/core/admin/admin/src/components/LeftMenu/utils/getGeneralLinks.js @@ -9,9 +9,7 @@ const getGeneralLinks = async (permissions, generalSectionRawLinks, shouldUpdate (_, index) => generalSectionLinksPermissions[index] ); - const settingsLinkIndex = authorizedGeneralSectionLinks.findIndex( - obj => obj.destination === '/settings' - ); + const settingsLinkIndex = authorizedGeneralSectionLinks.findIndex(obj => obj.to === '/settings'); if (settingsLinkIndex === -1) { return []; diff --git a/packages/core/admin/admin/src/components/LeftMenu/utils/tests/getGeneralLinks.test.js b/packages/core/admin/admin/src/components/LeftMenu/utils/tests/getGeneralLinks.test.js index f5f390e514..97db43ae4b 100644 --- a/packages/core/admin/admin/src/components/LeftMenu/utils/tests/getGeneralLinks.test.js +++ b/packages/core/admin/admin/src/components/LeftMenu/utils/tests/getGeneralLinks.test.js @@ -60,7 +60,7 @@ describe('getGeneralLinks', () => { { icon: 'list', label: 'app.components.LeftMenuLinkContainer.listPlugins', - destination: '/list-plugins', + to: '/list-plugins', isDisplayed: false, permissions: [ { @@ -81,7 +81,7 @@ describe('getGeneralLinks', () => { { icon: 'shopping-basket', label: 'app.components.LeftMenuLinkContainer.installNewPlugin', - destination: '/marketplace', + to: '/marketplace', isDisplayed: false, permissions: [ { @@ -103,7 +103,7 @@ describe('getGeneralLinks', () => { icon: 'cog', label: 'app.components.LeftMenuLinkContainer.settings', isDisplayed: true, - destination: '/settings', + to: '/settings', permissions: [], notificationsCount: 0, }, @@ -113,7 +113,7 @@ describe('getGeneralLinks', () => { { icon: 'list', label: 'app.components.LeftMenuLinkContainer.listPlugins', - destination: '/list-plugins', + to: '/list-plugins', isDisplayed: false, permissions: [ { @@ -134,7 +134,7 @@ describe('getGeneralLinks', () => { { icon: 'shopping-basket', label: 'app.components.LeftMenuLinkContainer.installNewPlugin', - destination: '/marketplace', + to: '/marketplace', isDisplayed: false, permissions: [ { @@ -156,7 +156,7 @@ describe('getGeneralLinks', () => { icon: 'cog', label: 'app.components.LeftMenuLinkContainer.settings', isDisplayed: true, - destination: '/settings', + to: '/settings', permissions: [], notificationsCount: 0, }, @@ -166,7 +166,7 @@ describe('getGeneralLinks', () => { expect(actual).toEqual(expected); }); - it('resolves an empty array when the destination (/settings) is not in the authorized links', async () => { + it('resolves an empty array when the to (/settings) is not in the authorized links', async () => { hasPermissions.mockImplementation(() => Promise.resolve(false)); const permissions = [ @@ -222,7 +222,7 @@ describe('getGeneralLinks', () => { { icon: 'list', label: 'app.components.LeftMenuLinkContainer.listPlugins', - destination: '/list-plugins', + to: '/list-plugins', isDisplayed: false, permissions: [], notificationsCount: 0, @@ -230,7 +230,7 @@ describe('getGeneralLinks', () => { { icon: 'shopping-basket', label: 'app.components.LeftMenuLinkContainer.installNewPlugin', - destination: '/marketplace', + to: '/marketplace', isDisplayed: false, permissions: [], notificationsCount: 0, @@ -239,7 +239,7 @@ describe('getGeneralLinks', () => { icon: 'cog', label: 'app.components.LeftMenuLinkContainer.settings', isDisplayed: false, - destination: '/settings', + to: '/settings', permissions: [], notificationsCount: 0, }, diff --git a/packages/core/admin/admin/src/core/apis/Plugin.js b/packages/core/admin/admin/src/core/apis/Plugin.js index 9e5e991b64..bd86efda9a 100644 --- a/packages/core/admin/admin/src/core/apis/Plugin.js +++ b/packages/core/admin/admin/src/core/apis/Plugin.js @@ -9,7 +9,7 @@ class Plugin { this.isRequired = pluginConf.isRequired; this.mainComponent = pluginConf.mainComponent || null; // TODO - this.menu = pluginConf.menu || null; + // this.menu = pluginConf.menu || null; this.name = pluginConf.name; this.pluginId = pluginConf.id; this.pluginLogo = pluginConf.pluginLogo;