feat(routerContext): sw-1089 enhance page titles (#1091)

* routerContext, exposed bundleTitle through useChrome
RedHatInsights · Apr 6, 2023 · 1d05b6d · 1d05b6d
1 parent a3a7d9b
commit 1d05b6d
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 4 deletions.
diff --git a/config/jest.setupTests.js b/config/jest.setupTests.js
@@ -99,6 +99,7 @@ global.window.insights = {
           })
         )
     },
+    getBundleData: Function.prototype,
     getUserPermissions: () => [],
     hideGlobalFilter: Function.prototype,
     identifyApp: Function.prototype,

diff --git a/src/components/router/__tests__/__snapshots__/routerContext.test.js.snap b/src/components/router/__tests__/__snapshots__/routerContext.test.js.snap
@@ -44,6 +44,7 @@ exports[`RouterContext should apply a hook for useRouteDetail: document title 1`
 [
   [
     "t(curiosity-view.title, {"appName":"Subscriptions","context":"RHEL"}) - Subscriptions",
+    true,
   ],
 ]
 `;

diff --git a/src/components/router/routerContext.js b/src/components/router/routerContext.js
@@ -102,7 +102,8 @@ const useRouteDetail = ({
   useChrome: useAliasChrome = useChrome,
   useSelector: useAliasSelector = storeHooks.reactRedux.useSelectors
 } = {}) => {
-  const { updateDocumentTitle = helpers.noop } = useAliasChrome();
+  const { getBundleData = helpers.noop, updateDocumentTitle = helpers.noop } = useAliasChrome();
+  const bundleData = getBundleData();
   const [productPath] = useAliasSelector([({ view }) => view?.product?.config]);
   const [detail, setDetail] = useState({});
 
@@ -112,12 +113,13 @@ const useRouteDetail = ({
         pathName: productPath
       });
 
-      // Set document title
+      // Set document title, remove pre-baked suffix
       updateDocumentTitle(
         `${t(`curiosity-view.title`, {
           appName: helpers.UI_DISPLAY_NAME,
           context: firstMatch?.productGroup
-        })} - ${helpers.UI_DISPLAY_NAME}`
+        })} - ${helpers.UI_DISPLAY_NAME}${(bundleData?.bundleTitle && ` | ${bundleData?.bundleTitle}`) || ''}`,
+        true
       );
 
       // Set route detail
@@ -132,7 +134,7 @@ const useRouteDetail = ({
         productPath
       });
     }
-  }, [detail?._passed, productPath, t, updateDocumentTitle]);
+  }, [bundleData?.bundleTitle, detail?._passed, productPath, t, updateDocumentTitle]);
 
   return detail;
 };

diff --git a/src/index.js b/src/index.js
@@ -23,6 +23,7 @@ window.insights = {
           });
         })
     },
+    getBundleData: () => ({ bundleId: 'insights', bundleTitle: 'Red Hat Insights' }),
     getUserPermissions: () => [],
     hideGlobalFilter: Function.prototype,
     identifyApp: Function.prototype,