Merge pull request #460 from dolittle/page-navigation

Page navigation
dolittle · Aug 28, 2023 · 1044048 · 1044048
2 parents 94180fe + da7477e
commit 1044048
Show file tree

Hide file tree

Showing 14 changed files with 18 additions and 27 deletions.
diff --git a/Source/DesignSystem/molecules/NavigationBar/NavigationBar.tsx b/Source/DesignSystem/molecules/NavigationBar/NavigationBar.tsx
@@ -89,7 +89,7 @@ export const NavigationBar = ({ logo, primaryNavigationItems, secondaryNavigatio
                 </Box>
 
                 <Box sx={{ ...styles.hideOnMobile, flexGrow: 1, alignItems: 'center', gap: 3 }}>
-                    {logo && <Icon icon={logo} sx={{ mr: 2 }} />}
+                    {logo && <IconButton tooltipText='Home' icon={logo} href='/' sx={{ mr: 2 }} />}
                     {primaryNavigationItems}
                 </Box>
 

diff --git a/Source/SelfService/Web/applications/backupsScreen.tsx b/Source/SelfService/Web/applications/backupsScreen.tsx
@@ -61,7 +61,7 @@ export const BackupsScreen = () => {
     }
 
     return (
-        <WorkSpaceLayoutWithSidePanel pageTitle='Backups' sidePanelMode='applications'>
+        <WorkSpaceLayoutWithSidePanel pageTitle='Backups | Applications' sidePanelMode='applications'>
             <Routes>
                 <Route path='overview' element={<BackupsList data={backupLinksForEnvironment} application={application} />} />
                 <Route path='list' element={<BackupsListView application={application} environment={currentEnvironment} />} />

diff --git a/Source/SelfService/Web/applications/containerRegistryScreen.tsx b/Source/SelfService/Web/applications/containerRegistryScreen.tsx
@@ -50,7 +50,7 @@ export const ContainerRegistryScreen = withRouteApplicationState(({ routeApplica
     }
 
     return (
-        <WorkSpaceLayoutWithSidePanel pageTitle='Container Registry' sidePanelMode='applications'>
+        <WorkSpaceLayoutWithSidePanel pageTitle='Container Registry | Applications' sidePanelMode='applications'>
             <Routes>
                 <Route path='/overview/*' element={<RegistryContainer application={application} />} />
                 <Route path='*' element={<RouteNotFound redirectUrl={'overview'} auto={true} />} />

diff --git a/Source/SelfService/Web/applications/logsScreen.tsx b/Source/SelfService/Web/applications/logsScreen.tsx
@@ -88,7 +88,7 @@ export const LogsScreen = withRouteApplicationState(({ routeApplicationParams })
     }
 
     return (
-        <WorkSpaceLayoutWithSidePanel pageTitle='Logs' sidePanelMode='applications'>
+        <WorkSpaceLayoutWithSidePanel pageTitle='Logs | Applications' sidePanelMode='applications'>
             <Typography variant='h1' sx={{ my: 3 }}>Logs</Typography>
 
             <Box sx={{ minWidth: 640, mt: 3 }}>

diff --git a/Source/SelfService/Web/applications/m3connectorScreen.tsx b/Source/SelfService/Web/applications/m3connectorScreen.tsx
@@ -46,7 +46,7 @@ export const M3ConnectorScreen = () => {
     }
 
     return (
-        <WorkSpaceLayoutWithSidePanel pageTitle='M3 connector' sidePanelMode='applications'>
+        <WorkSpaceLayoutWithSidePanel pageTitle='M3 Connector | Applications' sidePanelMode='applications'>
             <Routes>
                 <Route path='/*' element={<Container application={application} />} />
             </Routes>

diff --git a/...erviceDetails/configurationFilesSection/environmentSection/environmentVariableSection.tsx b/...erviceDetails/configurationFilesSection/environmentSection/environmentVariableSection.tsx
@@ -20,9 +20,6 @@ import { envVariableColumns } from './tableColumns';
 
 const styles = {
     buttonWrapper: {
-        display: 'flex',
-        flexDirection: { xs: 'column', xl: 'row' },
-        alignItems: 'start',
         mb: 1.5,
         button: {
             'mr': 2.5,

diff --git a/Source/SelfService/Web/applications/microservicesScreen.tsx b/Source/SelfService/Web/applications/microservicesScreen.tsx
@@ -68,7 +68,7 @@ export const MicroservicesScreen = withRouteApplicationState(({ routeApplication
     }
 
     return (
-        <WorkSpaceLayoutWithSidePanel pageTitle='Microservices' sidePanelMode='applications'>
+        <WorkSpaceLayoutWithSidePanel pageTitle='Microservices | Applications' sidePanelMode='applications'>
             <Routes>
                 <Route path='/overview' element={<Microservice application={application} />} />
                 <Route path='/create' element={<MicroserviceNewScreen application={application} />} />

diff --git a/Source/SelfService/Web/applications/setupScreen.tsx b/Source/SelfService/Web/applications/setupScreen.tsx
@@ -53,7 +53,7 @@ export const SetupScreen = withRouteApplicationState(({ routeApplicationParams }
     }
 
     return (
-        <WorkSpaceLayoutWithSidePanel pageTitle='Setup' sidePanelMode='applications'>
+        <WorkSpaceLayoutWithSidePanel pageTitle='Setup | Applications' sidePanelMode='applications'>
             <Routes>
                 <Route path='/*' element={<SetupContainerScreen application={application} />} />
             </Routes>

diff --git a/Source/SelfService/Web/assets/favicons/favicon-32x32.png b/Source/SelfService/Web/assets/favicons/favicon-32x32.png
diff --git a/Source/SelfService/Web/components/layout/workSpaceLayoutLinks.tsx b/Source/SelfService/Web/components/layout/workSpaceLayoutLinks.tsx
@@ -26,7 +26,7 @@ const PrimaryNavigation = () => {
         },
         {
             label: 'applications',
-            selected: location.pathname.includes('/microservices'),
+            selected: location.pathname.includes('/application/'),
             overrides: {
                 component: Link,
                 to: `/microservices/application/${currentApplicationId}/overview`,
@@ -66,6 +66,7 @@ const SecondaryNavigation = () => {
             overrides: {
                 component: 'a',
                 href: '/.auth/cookies/logout',
+                onClick: () => localStorage.clear(),
             },
         },
     ];
@@ -74,11 +75,12 @@ const SecondaryNavigation = () => {
         // Put before log out link if there is more than one customer.
         secondaryNavigationItems.splice(secondaryNavigationItems.length - 1, 0, {
             id: 'change-organization',
-            label: 'Change Organization',
+            label: 'Change Customer',
             icon: 'SupervisedUserCircleRounded',
             overrides: {
                 component: 'a',
                 href: '/.auth/cookies/initiate',
+                onClick: () => localStorage.clear(),
             },
         });
     }

diff --git a/.../Web/assets/favicons/apple-touch-icon.png → Source/SelfService/Web/favicon.png b/.../Web/assets/favicons/apple-touch-icon.png → Source/SelfService/Web/favicon.png
diff --git a/Source/SelfService/Web/index.ejs b/Source/SelfService/Web/index.ejs
@@ -3,19 +3,17 @@
 <html lang="en">
     <head>
         <meta charset="utf-8" />
+        <meta name="theme-color" content="#1D2025">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+
         <title>
             <%- htmlWebpackPlugin.options.metadata.title %>
         </title>
 
         <base href="<%- htmlWebpackPlugin.options.metadata.baseUrl %>">
-        <link rel="icon" href="assets/favicons/favicon.svg">
-        <link rel=”mask-icon” href=”assets/favicons/safary-mask-icon.svg” color="#ff6f33">
-        <link rel="apple-touch-icon" href="assets/favicons/apple-touch-icon.png">
-        <link rel="icon" href="favicon.ico">
 
-        <meta name="theme-color" content="#1D2025">
-
-        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <link rel="apple-touch-icon" href="favicon.png">
+        <link rel="icon" href="favicon.ico">
     </head>
 
     <body style="background-color: #0F1014">

diff --git a/Source/SelfService/Web/integrations/index.tsx b/Source/SelfService/Web/integrations/index.tsx
@@ -40,7 +40,7 @@ export const IntegrationsIndex = () => {
     if (isLoading) return null;
 
     return (
-        <WorkSpaceLayoutWithSidePanel pageTitle='Integrations'>
+        <WorkSpaceLayoutWithSidePanel pageTitle='Connections | Integrations'>
             {/* Temporary replacement for breadcrumbs */}
             <Box sx={{ minHeight: 16 }} />
             <QueryClientProvider client={queryClient}>

diff --git a/Source/SelfService/Web/webpack.config.ts b/Source/SelfService/Web/webpack.config.ts
@@ -140,16 +140,10 @@ function webpack(env: Args, argv: Args) {
             new CopyPlugin({
                 patterns: [
                     {
-                        from: './assets/favicons/apple-touch-icon.png',
-                        to: './assets/favicons/',
-                    },
-                    {
-                        from: './assets/favicons/favicon-32x32.png',
-                        to: './assets/favicons/',
+                        from: 'favicon.png',
                     },
                     {
                         from: 'favicon.ico',
-                        to: './',
                     },
                 ],
             }),