From 3d25d6d2fe8ca21da15d15f6e278380d136caadd Mon Sep 17 00:00:00 2001 From: Austin Pinkerton Date: Mon, 10 Jul 2023 16:11:07 -0400 Subject: [PATCH 1/2] allow 'fake' services to be favorited --- src/hooks/useAllServices.ts | 2 ++ src/hooks/useFavoritedServices.ts | 31 +++++++++++++++++++++++++++---- 2 files changed, 29 insertions(+), 4 deletions(-) diff --git a/src/hooks/useAllServices.ts b/src/hooks/useAllServices.ts index 49377d3f0..f8266df6c 100644 --- a/src/hooks/useAllServices.ts +++ b/src/hooks/useAllServices.ts @@ -270,8 +270,10 @@ const useAllServices = () => { servicesLinks, error, ready, + availableSections, filterValue, setFilterValue, + findNavItems, }; }; diff --git a/src/hooks/useFavoritedServices.ts b/src/hooks/useFavoritedServices.ts index 9b245f666..52281d36b 100644 --- a/src/hooks/useFavoritedServices.ts +++ b/src/hooks/useFavoritedServices.ts @@ -2,13 +2,15 @@ import { ServiceTileProps } from '../components/FavoriteServices/ServiceTile'; import useAllServices from './useAllServices'; import { useEffect, useMemo, useState } from 'react'; import fetchNavigationFiles, { extractNavItemGroups } from '../utils/fetchNavigationFiles'; -import { Navigation } from '../@types/types'; +import { NavItem, Navigation } from '../@types/types'; import { findNavLeafPath } from '../utils/common'; import useFavoritePagesWrapper from './useFavoritePagesWrapper'; +import { AllServicesGroup } from '../components/AllServices/allServicesLinks'; const useFavoritedServices = () => { const { favoritePages } = useFavoritePagesWrapper(); - const { allLinks } = useAllServices(); + const { allLinks, availableSections } = useAllServices(); + const [fakeBundle, setFakeBundle] = useState(undefined); const [bundles, setBundles] = useState([]); useEffect(() => { @@ -18,11 +20,32 @@ const useFavoritedServices = () => { console.error('Unable to fetch favorite services', error); }); }, []); + + useEffect(() => { + if (availableSections.length !== 0 && !fakeBundle) { + const navItems = availableSections + .reduce((acc, curr) => { + const fakeLink = curr.links.filter((link) => (link as AllServicesGroup).isGroup !== true); + return [...acc, fakeLink as NavItem]; + }, []) + .flat(); + setFakeBundle({ + navItems: navItems, + } as Navigation); + } + }, [availableSections, fakeBundle]); + const linksWithFragments = useMemo(() => { + // push items with unique hrefs from our fake bundle for leaf creation + fakeBundle?.navItems.forEach((item) => { + if (!allLinks.some((link) => link.href === item.href)) { + allLinks.push(item); + } + }); return allLinks.map((link) => { let linkLeaf: ReturnType | undefined; // use every to exit early if match was found - bundles.every((bundle) => { + [...bundles, fakeBundle || []].every((bundle) => { const leaf = findNavLeafPath(extractNavItemGroups(bundle), (item) => item?.href === link.href); if (leaf.activeItem) { linkLeaf = leaf; @@ -35,7 +58,7 @@ const useFavoritedServices = () => { linkLeaf, }; }); - }, [allLinks, bundles]); + }, [allLinks, bundles, fakeBundle]); // extract human friendly data from the all services data set const favoriteServices = favoritePages.reduce((acc, curr) => { From 4800929540bc654da7856bd0b2ece4008b9663c8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Martin=20Maro=C5=A1i?= Date: Wed, 12 Jul 2023 13:41:13 +0200 Subject: [PATCH 2/2] Move fake bundle computation to memo out of effect. --- src/hooks/useFavoritedServices.ts | 34 +++++++++++++++---------------- 1 file changed, 17 insertions(+), 17 deletions(-) diff --git a/src/hooks/useFavoritedServices.ts b/src/hooks/useFavoritedServices.ts index 52281d36b..d8f1e1158 100644 --- a/src/hooks/useFavoritedServices.ts +++ b/src/hooks/useFavoritedServices.ts @@ -5,14 +5,28 @@ import fetchNavigationFiles, { extractNavItemGroups } from '../utils/fetchNaviga import { NavItem, Navigation } from '../@types/types'; import { findNavLeafPath } from '../utils/common'; import useFavoritePagesWrapper from './useFavoritePagesWrapper'; -import { AllServicesGroup } from '../components/AllServices/allServicesLinks'; +import { isAllServicesLink } from '../components/AllServices/allServicesLinks'; const useFavoritedServices = () => { const { favoritePages } = useFavoritePagesWrapper(); const { allLinks, availableSections } = useAllServices(); - const [fakeBundle, setFakeBundle] = useState(undefined); const [bundles, setBundles] = useState([]); + const fakeBundle: NavItem[] = useMemo(() => { + // escape early if we have no services + if (availableSections.length === 0) { + return []; + } + + // map services links to nav links + return availableSections.reduce((acc, curr) => { + const fakeNavItems: NavItem[] = curr.links.filter(isAllServicesLink); + // no need to recreate the reduce array + acc.push(...fakeNavItems); + return acc; + }, []); + }, [availableSections]); + useEffect(() => { fetchNavigationFiles() .then((data) => setBundles(data as Navigation[])) @@ -21,23 +35,9 @@ const useFavoritedServices = () => { }); }, []); - useEffect(() => { - if (availableSections.length !== 0 && !fakeBundle) { - const navItems = availableSections - .reduce((acc, curr) => { - const fakeLink = curr.links.filter((link) => (link as AllServicesGroup).isGroup !== true); - return [...acc, fakeLink as NavItem]; - }, []) - .flat(); - setFakeBundle({ - navItems: navItems, - } as Navigation); - } - }, [availableSections, fakeBundle]); - const linksWithFragments = useMemo(() => { // push items with unique hrefs from our fake bundle for leaf creation - fakeBundle?.navItems.forEach((item) => { + fakeBundle.forEach((item) => { if (!allLinks.some((link) => link.href === item.href)) { allLinks.push(item); }