add: appliance model to page title

greenbone · Oct 2, 2024 · 546254c · 546254c
1 parent 6301c72
commit 546254c
Show file tree

Hide file tree

Showing 6 changed files with 157 additions and 48 deletions.
diff --git a/index.html b/index.html
@@ -1,8 +1,8 @@
 <!doctype html>
-<html>
+<html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" href="/img/favicon.png" type="image/png"/>
+    <link rel="icon" href="/img/favicon.png" type="image/png" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Greenbone Security Assistant</title>
     <script type="text/javascript" src="/config.js"></script>
@@ -11,5 +11,24 @@
     <div id="app"></div>
     <div id="portals"></div>
     <script type="module" src="/src/index.jsx"></script>
+    <script>
+      window.addEventListener('DOMContentLoaded', () => {
+        try {
+          const vendorLabel = config.vendorLabel;
+
+          const match = vendorLabel.match(/gsm-(\w+)_label\.svg/);
+          if (match) {
+            let labelPart = match[1];
+            if (isNaN(labelPart)) {
+              labelPart = labelPart.toUpperCase();
+            }
+            const pageTitle = `Greenbone - ${labelPart}`;
+            document.title = pageTitle;
+          } else {
+            document.title = 'Greenbone Security Assistant';
+          }
+        } catch (error) {}
+      });
+    </script>
   </body>
 </html>
diff --git a/src/web/components/layout/__tests__/__snapshots__/pagetitle.jsx.snap b/src/web/components/layout/__tests__/__snapshots__/pagetitle.jsx.snap
diff --git a/src/web/components/layout/__tests__/pagetitle.jsx b/src/web/components/layout/__tests__/pagetitle.jsx
@@ -3,27 +3,31 @@
  * SPDX-License-Identifier: AGPL-3.0-or-later
  */
 
-
 import {describe, test, expect} from '@gsa/testing';
 
 import PageTitle from 'web/components/layout/pagetitle';
 
-import {render} from 'web/utils/testing';
+import {rendererWith} from 'web/utils/testing';
 
-describe('PageTitle tests', () => {
-  test('should render', () => {
-    const {element} = render(<PageTitle />);
-    expect(element).toMatchSnapshot();
-  });
+const gmp = {
+  settings: {
+    vendorLabel: 'someVendorLabel',
+  },
+};
 
+describe('PageTitle tests', () => {
   test('Should render default title', () => {
+    const {render} = rendererWith({gmp});
+
     const defaultTitle = 'Greenbone Security Assistant';
     render(<PageTitle />);
 
     expect(global.window.document.title).toBe(defaultTitle);
   });
 
   test('Should render custom title', () => {
+    const {render} = rendererWith({gmp});
+
     const title = 'foo';
     const defaultTitle = 'Greenbone Security Assistant';
     render(<PageTitle title={title} />);
@@ -32,6 +36,8 @@ describe('PageTitle tests', () => {
   });
 
   test('should update value', () => {
+    const {render} = rendererWith({gmp});
+
     const title1 = 'foo';
     const title2 = 'bar';
     const defaultTitle = 'Greenbone Security Assistant';
@@ -43,4 +49,16 @@ describe('PageTitle tests', () => {
 
     expect(global.window.document.title).toBe(defaultTitle + ' - ' + title2);
   });
+  test('should render appliance model title', () => {
+    const {render} = rendererWith({
+      gmp: {
+        settings: {
+          vendorLabel: 'gsm-150_label.svg',
+        },
+      },
+    });
+    render(<PageTitle />);
+
+    expect(global.window.document.title).toBe('Greenbone - 150');
+  });
 });
diff --git a/src/web/components/layout/pagetitle.jsx b/src/web/components/layout/pagetitle.jsx
@@ -6,10 +6,15 @@
 import {useEffect} from 'react';
 import {isDefined} from 'gmp/utils/identity';
 import PropTypes from 'web/utils/proptypes';
-
-const defaultTitle = 'Greenbone Security Assistant';
+import useGmp from 'web/hooks/useGmp';
+import {applianceTitle} from 'web/utils/applianceData';
 
 const PageTitle = ({title}) => {
+  const gmp = useGmp();
+  const vendorLabel = gmp?.settings?.vendorLabel || 'defaultVendorLabel';
+  const defaultTitle =
+    applianceTitle[vendorLabel] || 'Greenbone Security Assistant';
+
   useEffect(() => {
     if (isDefined(title)) {
       document.title = defaultTitle + ' - ' + title;
@@ -20,7 +25,8 @@ const PageTitle = ({title}) => {
     return () => {
       document.title = defaultTitle;
     };
-  }, [title]);
+  }, [defaultTitle, title]);
+
   return null;
 };
 

diff --git a/src/web/components/structure/getLogo.jsx b/src/web/components/structure/getLogo.jsx
@@ -4,42 +4,11 @@
  */
 
 import PropTypes from 'web/utils/proptypes';
-import {
-  Enterprise150,
-  Enterprise400,
-  Enterprise450,
-  Enterprise600,
-  Enterprise650,
-  Enterprise5400,
-  Enterprise6500,
-  EnterpriseCeno,
-  EnterpriseDeca,
-  EnterpriseExa,
-  EnterprisePeta,
-  EnterpriseTera,
-} from 'web/components/icon/GreenboneApplianceLogo';
 
-const APPLIANCE_MODELS = {
-  'gsm-150_label.svg': Enterprise150,
-  'gsm-400_label.svg': Enterprise400,
-  'gsm-400r2_label.svg': Enterprise400,
-  'gsm-450_label.svg': Enterprise450,
-  'gsm-450r2_label.svg': Enterprise450,
-  'gsm-600_label.svg': Enterprise600,
-  'gsm-600r2_label.svg': Enterprise600,
-  'gsm-650_label.svg': Enterprise650,
-  'gsm-650r2_label.svg': Enterprise650,
-  'gsm-5400_label.svg': Enterprise5400,
-  'gsm-6500_label.svg': Enterprise6500,
-  'gsm-ceno_label.svg': EnterpriseCeno,
-  'gsm-deca_label.svg': EnterpriseDeca,
-  'gsm-exa_label.svg': EnterpriseExa,
-  'gsm-peta_label.svg': EnterprisePeta,
-  'gsm-tera_label.svg': EnterpriseTera,
-};
+import {applianceComponent} from 'web/utils/applianceData';
 
 const getLogo = model => {
-  const Component = APPLIANCE_MODELS[model];
+  const Component = applianceComponent[model];
   return Component ? <Component /> : undefined;
 };
 

diff --git a/src/web/utils/applianceData.js b/src/web/utils/applianceData.js
@@ -0,0 +1,100 @@
+/* SPDX-FileCopyrightText: 2024 Greenbone AG
+ *
+ * SPDX-License-Identifier: AGPL-3.0-or-later
+ */
+
+import {
+  Enterprise150,
+  Enterprise400,
+  Enterprise450,
+  Enterprise600,
+  Enterprise650,
+  Enterprise5400,
+  Enterprise6500,
+  EnterpriseCeno,
+  EnterpriseDeca,
+  EnterpriseExa,
+  EnterprisePeta,
+  EnterpriseTera,
+} from 'web/components/icon/GreenboneApplianceLogo';
+
+const APPLIANCE_DATA = {
+  'gsm-150_label.svg': {
+    title: 'Greenbone - 150',
+    component: Enterprise150,
+  },
+  'gsm-400_label.svg': {
+    title: 'Greenbone - 400',
+    component: Enterprise400,
+  },
+  'gsm-400r2_label.svg': {
+    title: 'Greenbone - 400',
+    component: Enterprise400,
+  },
+  'gsm-450_label.svg': {
+    title: 'Greenbone - 450',
+    component: Enterprise450,
+  },
+  'gsm-450r2_label.svg': {
+    title: 'Greenbone - 450',
+    component: Enterprise450,
+  },
+  'gsm-600_label.svg': {
+    title: 'Greenbone - 600',
+    component: Enterprise600,
+  },
+  'gsm-600r2_label.svg': {
+    title: 'Greenbone - 600',
+    component: Enterprise600,
+  },
+  'gsm-650_label.svg': {
+    title: 'Greenbone - 650',
+    component: Enterprise650,
+  },
+  'gsm-650r2_label.svg': {
+    title: 'Greenbone - 650',
+    component: Enterprise650,
+  },
+  'gsm-5400_label.svg': {
+    title: 'Greenbone - 5400',
+    component: Enterprise5400,
+  },
+  'gsm-6500_label.svg': {
+    title: 'Greenbone - 6500',
+    component: Enterprise6500,
+  },
+  'gsm-ceno_label.svg': {
+    title: 'Greenbone - CENO',
+    component: EnterpriseCeno,
+  },
+  'gsm-deca_label.svg': {
+    title: 'Greenbone - DECA',
+    component: EnterpriseDeca,
+  },
+  'gsm-exa_label.svg': {
+    title: 'Greenbone - EXA',
+    component: EnterpriseExa,
+  },
+  'gsm-peta_label.svg': {
+    title: 'Greenbone - PETA',
+    component: EnterprisePeta,
+  },
+  'gsm-tera_label.svg': {
+    title: 'Greenbone - TERA',
+    component: EnterpriseTera,
+  },
+};
+
+export const applianceTitle = Object.fromEntries(
+  Object.entries(APPLIANCE_DATA).map(([vendorLabel, {title}]) => [
+    vendorLabel,
+    title,
+  ]),
+);
+
+export const applianceComponent = Object.fromEntries(
+  Object.entries(APPLIANCE_DATA).map(([vendorLabel, {component}]) => [
+    vendorLabel,
+    component,
+  ]),
+);