Hasan/Pr 1827 api page 404 (#5608)

* fix: added link items state to nav provider

* fix: removed console from destop menu

* fix: added drop items state to nav provider and removed items variables

* fix: loadable import footer in old layout

* fix: remove unused usememo hook

* fix: reset gatsby browser

* chore: reset gatsby brower js

* empty: 🚀 to redeploy and trigger build

* fix: use effect

* fix: removed commented lines from old layout

src/components/layout/layout.tsx

@@ -1,4 +1,5 @@
 import React, { ReactNode, Ref } from 'react'
+import loadable from '@loadable/component'
 import styled from 'styled-components'
 import { LocationProvider } from './location-context'
 import LayoutOverlay from './layout-overlay'
@@ -13,13 +14,11 @@ import PaymentAgentAffiliateNav from 'features/components/templates/navigation/p
 import BugBountyNav from 'features/components/templates/navigation/bug-bounty-nav'
 import CareerNav from 'features/components/templates/navigation/career-nav'
 import MarketNav from 'features/components/templates/navigation/market-nav'
-import RebrandingFooter from 'features/components/templates/footer'
 import PpcProvider from 'features/contexts/ppc-campaign/ppc.provider'
 import BannerAlert from 'components/custom/_banner-alert'
 import { bannerTypes } from 'common/constants'
 
-// const LoadableFooter = Loadable(() => import('./footer'))
-// const BeSquareFooter = Loadable(() => import('./besquare/footer'))
+const RebrandingFooter = loadable(() => import('features/components/templates/footer'))
 
 type LayoutProps = {
     children: ReactNode

src/features/components/templates/navigation/template/nav-context/index.tsx

@@ -1,4 +1,4 @@
-import React, { ReactNode, useContext, useMemo } from 'react'
+import React, { ReactNode, useContext, useState, useEffect } from 'react'
 import {
     NavItem,
     SmartMultiColumnItems,
@@ -33,25 +33,29 @@ export const isSingleItem = (item: NavItem): item is SmartSingleItem => {
 export const NavProvider = ({ is_menu_open, onCloseMenu, children, items }: NavProviderProps) => {
     const { is_mobile_or_tablet } = useBreakpoints()
     const { is_eu, is_row } = useRegion()
+    const [link_items, setLinkItems] = useState<SmartSingleItem[]>([])
+    const [drop_items, setDropItems] = useState<(SmartSingleColumnItems | SmartMultiColumnItems)[]>(
+        [],
+    )
 
     const visible_items = useVisibleContent({
         content: items,
         config: { is_mobile: is_mobile_or_tablet, is_eu, is_row },
     })
 
-    const { drop_items, link_items } = useMemo(() => {
-        const link_items: SmartSingleItem[] = []
-        const drop_items: (SmartSingleColumnItems | SmartMultiColumnItems)[] = []
-
+    useEffect(() => {
+        const links = []
+        const drops = []
         visible_items.forEach((item) => {
             if (isSingleItem(item)) {
-                link_items.push(item)
+                links.push(item)
             } else {
-                drop_items.push(item)
+                drops.push(item)
             }
         })
-        return { link_items, drop_items }
-    }, [visible_items])
+        setLinkItems(links)
+        setDropItems(drops)
+    }, [visible_items.length])
 
     return (
         <NavContext.Provider value={{ is_menu_open, onCloseMenu, link_items, drop_items }}>