fix(settings): move from vert nav to masthead tool (#243)

src/app/AppLayout/AppLayout.tsx

@@ -42,8 +42,8 @@ import { IAppRoute, routes } from '@app/routes';
 import { AboutModal, Button, Nav, NavItem, NavList, Page, PageHeader,
   PageHeaderTools, PageHeaderToolsGroup, PageHeaderToolsItem, PageSidebar,
   SkipToContent, Text, TextContent, TextList, TextListItem } from '@patternfly/react-core';
-import { HelpIcon } from '@patternfly/react-icons';
-import { NavLink, matchPath, useLocation } from 'react-router-dom';
+import { CogIcon, HelpIcon } from '@patternfly/react-icons';
+import { NavLink, matchPath, useHistory, useLocation } from 'react-router-dom';
 import { AuthModal } from './AuthModal';
 import { SslErrorModal} from './SslErrorModal';
 
@@ -53,6 +53,7 @@ interface IAppLayout {
 
 const AppLayout: React.FunctionComponent<IAppLayout> = ({children}) => {
   const context = React.useContext(ServiceContext);
+  const routerHistory = useHistory();
   const logoProps = {
     href: '/',
     target: '_blank'
@@ -105,13 +106,21 @@ const AppLayout: React.FunctionComponent<IAppLayout> = ({children}) => {
   const mobileOnSelect = (selected) => {
     if(isMobileView) setIsNavOpenMobile(false)
   };
+  const handleSettingsButtonClick = () => {
+    routerHistory.push('/settings');
+  };
   const handleAboutModalToggle = () => {
     setAboutModalOpen(!aboutModalOpen);
   };
   const HeaderTools = (<>
     <PageHeaderTools>
       <PageHeaderToolsGroup>
         <PageHeaderToolsItem>
+          <Button
+            onClick={handleSettingsButtonClick}
+            variant='link'
+            icon={<CogIcon color='white 'size='sm' />}
+          />
           <Button
             onClick={handleAboutModalToggle}
             variant='link'

src/app/routes.tsx

@@ -105,7 +105,6 @@ const routes: IAppRoute[] = [
   {
     component: Settings,
     exact: true,
-    label: 'Settings',
     path: '/settings',
     title: 'Settings',
   },