fix(Navigation): use application basename to react to APP_NAVIGATION …

…event (#205)
RedHatInsights · Apr 11, 2022 · 22b8091 · 22b8091
1 parent 0e1ef00
commit 22b8091
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 12 deletions.
diff --git a/src/App.js b/src/App.js
@@ -19,7 +19,7 @@ import MessageState from './Components/MessageState/MessageState';
 import messages from './Messages';
 import getStore from './Store';
 
-const App = ({ useLogger }) => {
+const App = ({ useLogger, basename }) => {
   const intl = useIntl();
   const history = useHistory();
   const [isAuthenticated, setIsAuthenticated] = useState(false);
@@ -34,12 +34,16 @@ const App = ({ useLogger }) => {
       setIsLoading(false);
     });
     insights.chrome.identifyApp('ocp-advisor');
-    const unregister = insights.chrome.on('APP_NAVIGATION', (event) =>
-      history.push(`/${event.navId}`)
-    );
+    const unregister = insights.chrome.on('APP_NAVIGATION', (event) => {
+      const targetUrl = event.domEvent?.href
+        ?.replace(basename, '/')
+        .replace(/^\/\//, '/');
+      if (typeof targetUrl === 'string') {
+        history.push(targetUrl);
+      }
+    });
     return () => unregister();
   }, []);
-
   return (
     <ErrorBoundary>
       {isLoading ? (
@@ -67,6 +71,7 @@ const App = ({ useLogger }) => {
 
 App.propTypes = {
   useLogger: PropTypes.bool,
+  basename: PropTypes.string.isRequired,
 };
 
 App.defaultProps = {

diff --git a/src/AppEntry.js b/src/AppEntry.js
@@ -7,13 +7,16 @@ import { getBaseName } from '@redhat-cloud-services/frontend-components-utilitie
 import App from './App';
 import { Intl } from './Utilities/intlHelper';
 
-const AppEntry = ({ useLogger }) => (
-  <Intl>
-    <Router basename={getBaseName(window.location.pathname, 3)}>
-      <App useLogger={useLogger} />
-    </Router>
-  </Intl>
-);
+const AppEntry = ({ useLogger }) => {
+  const basename = getBaseName(window.location.pathname, 3);
+  return (
+    <Intl>
+      <Router basename={basename}>
+        <App useLogger={useLogger} basename={basename.replace('/beta/', '/')} />
+      </Router>
+    </Intl>
+  );
+};
 
 AppEntry.propTypes = {
   useLogger: PropTypes.bool,