diff --git a/superset-frontend/spec/javascripts/components/Menu_spec.jsx b/superset-frontend/spec/javascripts/components/Menu_spec.jsx index 5033675a64849..ff6cdb1c1237a 100644 --- 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 index a41bc926aee1b..23da0305231f8 100644 --- 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({ ); } + +// 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
; +} diff --git a/superset-frontend/src/views/App.tsx b/superset-frontend/src/views/App.tsx index 96b46729f7165..dff494c1c9423 100644 --- 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 = () => (