From 64ffe0057fcd8c08e0a751594cbb9449337c77be Mon Sep 17 00:00:00 2001 From: Martin Marosi Date: Fri, 22 Nov 2024 09:54:45 +0100 Subject: [PATCH] Use generated navigation files. --- src/utils/fetchNavigationFiles.ts | 8 +++- src/utils/useNavigation.ts | 63 ++++++++++++++++++++----------- 2 files changed, 48 insertions(+), 23 deletions(-) diff --git a/src/utils/fetchNavigationFiles.ts b/src/utils/fetchNavigationFiles.ts index a570b1aec..3f40389f5 100644 --- a/src/utils/fetchNavigationFiles.ts +++ b/src/utils/fetchNavigationFiles.ts @@ -2,7 +2,7 @@ import axios from 'axios'; import { BundleNavigation, NavItem, Navigation } from '../@types/types'; import { Required } from 'utility-types'; import { itLessBundles, requiredBundles } from '../components/AppFilter/useAppFilter'; -import { ITLess, getChromeStaticPathname } from './common'; +import { GENERATED_SEARCH_FLAG, ITLess, getChromeStaticPathname } from './common'; export function isBundleNavigation(item: unknown): item is BundleNavigation { return typeof item !== 'undefined'; @@ -38,6 +38,12 @@ const filesCache: { }; const fetchNavigationFiles = async () => { + if (localStorage.getItem(GENERATED_SEARCH_FLAG) === 'true') { + // aggregate data call + const { data: aggregateData } = await axios.get('/api/chrome-service/v1/static/bundles-generated.json'); + const bundleNavigation = aggregateData.filter(isBundleNavigation); + return bundleNavigation; + } const bundles = ITLess() ? itLessBundles : requiredBundles; if (filesCache.ready && filesCache.expires > Date.now()) { return filesCache.data; diff --git a/src/utils/useNavigation.ts b/src/utils/useNavigation.ts index 463343670..72843969b 100644 --- a/src/utils/useNavigation.ts +++ b/src/utils/useNavigation.ts @@ -2,13 +2,14 @@ import axios from 'axios'; import { useAtomValue, useSetAtom } from 'jotai'; import { useContext, useEffect, useRef, useState } from 'react'; import { useLocation, useNavigate } from 'react-router-dom'; -import { BLOCK_CLEAR_GATEWAY_ERROR, getChromeStaticPathname } from './common'; +import { BLOCK_CLEAR_GATEWAY_ERROR, GENERATED_SEARCH_FLAG, getChromeStaticPathname } from './common'; import { evaluateVisibility } from './isNavItemVisible'; import { QuickStartContext } from '@patternfly/quickstarts'; import { useFlagsStatus } from '@unleash/proxy-client-react'; import { BundleNavigation, NavItem, Navigation } from '../@types/types'; import { clearGatewayErrorAtom } from '../state/atoms/gatewayErrorAtom'; import { navigationAtom, setNavigationSegmentAtom } from '../state/atoms/navigationAtom'; +import fetchNavigationFiles from './fetchNavigationFiles'; function cleanNavItemsHref(navItem: NavItem) { const result = { ...navItem }; @@ -100,11 +101,48 @@ const useNavigation = () => { }); }; + async function handleNavigationResponse(data: BundleNavigation) { + let observer: MutationObserver | undefined; + if (observer && typeof observer.disconnect === 'function') { + observer.disconnect(); + } + + try { + const navItems = await Promise.all(data.navItems.map(cleanNavItemsHref).map(evaluateVisibility)); + const schema: any = { + ...data, + navItems, + }; + observer = registerLocationObserver(pathname, schema); + observer.observe(document.querySelector('body')!, { + childList: true, + subtree: true, + }); + } catch (error) { + // Hide nav if an error was encountered. Can happen for non-existing navigation files. + setNoNav(true); + } + } + useEffect(() => { let observer: MutationObserver | undefined; // reset no nav flag setNoNav(false); - if (currentNamespace && (flagsReady || flagsError)) { + if (localStorage.getItem(GENERATED_SEARCH_FLAG) === 'true' && currentNamespace && (flagsReady || flagsError)) { + fetchNavigationFiles() + .then((bundles) => { + const bundle = bundles.find((b) => b.id === currentNamespace); + if (!bundle) { + setNoNav(true); + return; + } + + return handleNavigationResponse(bundle); + }) + .catch(() => { + setNoNav(true); + }); + } else if (currentNamespace && (flagsReady || flagsError)) { axios .get(`${getChromeStaticPathname('navigation')}/${currentNamespace}-navigation.json`) // fallback static CSC for EE env @@ -112,26 +150,7 @@ const useNavigation = () => { return axios.get(`/config/chrome/${currentNamespace}-navigation.json?ts=${Date.now()}`); }) .then(async (response) => { - if (observer && typeof observer.disconnect === 'function') { - observer.disconnect(); - } - - const data = response.data; - try { - const navItems = await Promise.all(data.navItems.map(cleanNavItemsHref).map(evaluateVisibility)); - const schema = { - ...data, - navItems, - }; - observer = registerLocationObserver(pathname, schema); - observer.observe(document.querySelector('body')!, { - childList: true, - subtree: true, - }); - } catch (error) { - // Hide nav if an error was encountered. Can happen for non-existing navigation files. - setNoNav(true); - } + return handleNavigationResponse(response.data); }) .catch(() => { setNoNav(true);