Navi fixes #4020

Author: kkartunov

src/shared/actions/contentful.js

@@ -180,7 +180,18 @@ async function getMenuDone(menuProps) {
                 sI2.subMenu = await Promise.all(_.map(
                   cR2.fields.childRoutes,
                   cR3 => service.getEntry(cR3.sys.id).then(
-                    c3 => menuItemBuilder(urlTarget(url2, cR2), c3),
+                    async (c3) => {
+                      const sI3 = menuItemBuilder(url2, c3);
+                      if (c3.fields.childRoutes) {
+                        sI3.subMenu = await Promise.all(_.map(
+                          c3.fields.childRoutes,
+                          cR4 => service.getEntry(cR4.sys.id).then(
+                            c4 => menuItemBuilder(urlTarget(url2, c3), c4),
+                          ),
+                        ));
+                      }
+                      return sI3;
+                    },
                   ),
                 ));
               }

src/shared/components/Contentful/Menu/index.jsx

@@ -244,7 +244,7 @@ export default function ContentfulMenu(props) {
       render={(menuData) => {
         const { fields } = Object.values(menuData.entries.items)[0];
         if (!fields) return null;
-        if (fields.theme === 'General') {
+        if (fields.theme === 'General - light' || fields.theme === 'General - dark') {
           // New navi style menu
           // we deligate to special custom component and lib
           return (

src/shared/containers/Contentful/MenuLoader/index.jsx

@@ -68,7 +68,7 @@ class MenuLoaderContainer extends React.Component {
 
   render() {
     const {
-      menu, auth, loading, menuLogo,
+      menu, auth, loading, menuLogo, fields,
     } = this.props;
     const { openMore, path, activeLevel1Id } = this.state;
     if (loading) {
@@ -78,8 +78,12 @@ class MenuLoaderContainer extends React.Component {
       // eslint-disable-next-line global-require
       const { TopNav, LoginNav } = require('navigation-component');
       const logoToUse = !_.isEmpty(menuLogo) ? <img src={menuLogo.fields.file.url} alt="menu logo" /> : <Logo />;
-      const comboMenu = _.clone(config.HEADER_MENU);
-      comboMenu[1].subMenu = _.clone(menu[0].subMenu);
+      const menuTheme = fields.theme.split('- ');
+      const comboMenu = _.flatten(_.map(menu, menuItem => menuItem.subMenu));
+      // This is a hack fix that should be removed when possible!
+      // Its orifing is in the https://github.com/topcoder-platform/navigation-component module
+      // which breaks if there is NOT an menu item with id = `community`
+      comboMenu[0].id = 'community';
       let normalizedProfile = auth.profile && _.clone(auth.profile);
       if (auth.profile) {
         normalizedProfile.photoURL = (_.has(auth.profile, 'photoURL') && auth.profile.photoURL !== null)
@@ -106,7 +110,7 @@ class MenuLoaderContainer extends React.Component {
               />
             )}
             logo={logoToUse}
-            theme={config.HEADER_MENU_THEME}
+            theme={menuTheme[1]}
             currentLevel1Id={activeLevel1Id}
             onChangeLevel1Id={this.handleChangeLevel1Id}
             path={path}

src/shared/utils/contentful.js

@@ -95,11 +95,13 @@ export function menuItemBuilder(baseUrl, item) {
       return {
         title: item.fields.naviMenuLinkText || item.fields.name,
         href: target(baseUrl, item),
+        id: item.sys.id,
       };
     case 'navigationMenuItem':
       return {
         title: item.fields.linkText || item.fields.name,
         href: target(baseUrl, item),
+        id: item.sys.id,
       };
     default: return {};
   }