Add help menu to main-app-bar

Feature #14149

Arvados-DCO-1.1-Signed-off-by: Michal Klobukowski <michal.klobukowski@contractors.roche.com>

diff --git a/src/views-components/main-app-bar/help-menu.tsx b/src/views-components/main-app-bar/help-menu.tsx
index de3ed3b8e275a8ad11ccc4983c648c8b2b69d9a1..26604228fc21ac9fbfb79ba21a96a8372324655c 100644 (file)
--- a/src/views-components/main-app-bar/help-menu.tsx
+++ b/src/views-components/main-app-bar/help-menu.tsx
@@ -3,7 +3,7 @@
 // SPDX-License-Identifier: AGPL-3.0
 
 import * as React from "react";
-import { MenuItem, Typography } from "@material-ui/core";
+import { MenuItem, Typography, ListSubheader } from "@material-ui/core";
 import { DropdownMenu } from "~/components/dropdown-menu/dropdown-menu";
 import { ImportContactsIcon, HelpIcon } from "~/components/icon/icon";
 import { ArvadosTheme } from '~/common/custom-theme';
@@ -58,15 +58,13 @@ export const HelpMenu = withStyles(styles)(
             icon={<HelpIcon />}
             id="help-menu"
             title="Help">
-            <li className={classes.title}>
-                <Typography variant="body1">Help</Typography>
-            </li>
+            <MenuItem disabled>Help</MenuItem>
             {
                 links.map(link =>
                     <MenuItem key={link.title}>
                         <a href={link.link} target="_blank" className={classes.link}>
-                                <ImportContactsIcon className={classes.icon} />
-                                <Typography variant="body1" className={classes.linkTitle}>{link.title}</Typography>
+                            <ImportContactsIcon className={classes.icon} />
+                            <Typography variant="body1" className={classes.linkTitle}>{link.title}</Typography>
                         </a>
                     </MenuItem>
                 )

diff --git a/src/views-components/main-app-bar/main-app-bar.tsx b/src/views-components/main-app-bar/main-app-bar.tsx
index c25b1105a8f887475bbce1a54b137c0d9f30e78e..6779d4785f035eee05e1ac940d583255517ab8e2 100644 (file)
--- a/src/views-components/main-app-bar/main-app-bar.tsx
+++ b/src/views-components/main-app-bar/main-app-bar.tsx
@@ -63,7 +63,8 @@ export const MainAppBar = withStyles(styles)(
                         xs={3}
                         container
                         alignItems="center"
-                        justify="flex-end">
+                        justify="flex-end"
+                        wrap="nowrap">
                         {props.user
                             ? <>
                                 <NotificationsMenu />