fix: move menu reorg logic from crud app into Menu component (apache#…

…10717)
ofekisr · Oct 5, 2020 · a4da719 · a4da719
1 parent 140688b
commit a4da719
Show file tree

Hide file tree

Showing 3 changed files with 65 additions and 58 deletions.
diff --git a/superset-frontend/spec/javascripts/components/Menu_spec.jsx b/superset-frontend/spec/javascripts/components/Menu_spec.jsx
@@ -22,7 +22,7 @@ import { Nav, MenuItem } from 'react-bootstrap';
 import NavDropdown from 'src/components/NavDropdown';
 import { supersetTheme, ThemeProvider } from '@superset-ui/style';
 
-import Menu from 'src/components/Menu/Menu';
+import { Menu } from 'src/components/Menu/Menu';
 
 const defaultProps = {
   data: {

diff --git a/superset-frontend/src/components/Menu/Menu.tsx b/superset-frontend/src/components/Menu/Menu.tsx
@@ -21,7 +21,10 @@ import { t } from '@superset-ui/translation';
 import { Nav, Navbar, NavItem, MenuItem } from 'react-bootstrap';
 import NavDropdown from 'src/components/NavDropdown';
 import styled from '@superset-ui/style';
-import MenuObject, { MenuObjectProps } from './MenuObject';
+import MenuObject, {
+  MenuObjectProps,
+  MenuObjectChildProps,
+} from './MenuObject';
 import NewMenu from './NewMenu';
 import UserMenu from './UserMenu';
 import LanguagePicker, { Languages } from './LanguagePicker';
@@ -128,7 +131,7 @@ const StyledHeader = styled.header`
   }
 `;
 
-export default function Menu({
+export function Menu({
   data: { menu, brand, navbar_right: navbarRight, settings },
 }: MenuProps) {
   // Flatten settings
@@ -254,3 +257,62 @@ export default function Menu({
     </StyledHeader>
   );
 }
+
+// transform the menu data to reorganize components
+export default function MenuWrapper({ data }: MenuProps) {
+  const newMenuData = {
+    ...data,
+  };
+  // Menu items that should go into settings dropdown
+  const settingsMenus = {
+    Security: true,
+    Manage: true,
+  };
+
+  // Menu items that should be ignored
+  const ignore = {
+    'Import Dashboards': true,
+  };
+
+  // Cycle through menu.menu to build out cleanedMenu and settings
+  const cleanedMenu: MenuObjectProps[] = [];
+  const settings: MenuObjectProps[] = [];
+
+  newMenuData.menu.forEach((item: any) => {
+    if (!item) {
+      return;
+    }
+
+    const children: (MenuObjectProps | string)[] = [];
+    const newItem = {
+      ...item,
+    };
+
+    // Filter childs
+    if (item.childs) {
+      item.childs.forEach((child: MenuObjectChildProps | string) => {
+        if (typeof child === 'string') {
+          children.push(child);
+        } else if (
+          (child as MenuObjectChildProps).label &&
+          !ignore.hasOwnProperty(child.label)
+        ) {
+          children.push(child);
+        }
+      });
+
+      newItem.childs = children;
+    }
+
+    if (!settingsMenus.hasOwnProperty(item.name)) {
+      cleanedMenu.push(newItem);
+    } else {
+      settings.push(newItem);
+    }
+  });
+
+  newMenuData.menu = cleanedMenu;
+  newMenuData.settings = settings;
+
+  return <Menu data={newMenuData} />;
+}
diff --git a/superset-frontend/src/views/App.tsx b/superset-frontend/src/views/App.tsx
@@ -39,10 +39,6 @@ import setupApp from '../setup/setupApp';
 import setupPlugins from '../setup/setupPlugins';
 import Welcome from './CRUD/welcome/Welcome';
 import ToastPresenter from '../messageToasts/containers/ToastPresenter';
-import {
-  MenuObjectProps,
-  MenuObjectChildProps,
-} from '../components/Menu/MenuObject';
 
 setupApp();
 setupPlugins();
@@ -62,57 +58,6 @@ const store = createStore(
   compose(applyMiddleware(thunk), initEnhancer(false)),
 );
 
-// Menu items that should go into settings dropdown
-const settingsMenus = {
-  Security: true,
-  Manage: true,
-};
-
-// Menu items that should be ignored
-const ignore = {
-  'Import Dashboards': true,
-};
-
-// Cycle through menu.menu to build out cleanedMenu and settings
-const cleanedMenu: object[] = [];
-const settings: object[] = [];
-
-menu.menu.forEach((item: any) => {
-  if (!item) {
-    return;
-  }
-
-  const children: (MenuObjectProps | string)[] = [];
-  const newItem = {
-    ...item,
-  };
-
-  // Filter childs
-  if (item.childs) {
-    item.childs.forEach((child: MenuObjectChildProps | string) => {
-      if (typeof child === 'string') {
-        children.push(child);
-      } else if (
-        (child as MenuObjectChildProps).label &&
-        !ignore.hasOwnProperty(child.label)
-      ) {
-        children.push(child);
-      }
-    });
-
-    newItem.childs = children;
-  }
-
-  if (!settingsMenus.hasOwnProperty(item.name)) {
-    cleanedMenu.push(newItem);
-  } else {
-    settings.push(newItem);
-  }
-});
-
-menu.menu = cleanedMenu;
-menu.settings = settings;
-
 const App = () => (
   <Provider store={store}>
     <ThemeProvider theme={supersetTheme}>