From 826f18c736822ff1846174d349538092a62c687b Mon Sep 17 00:00:00 2001
From: isaaclombardssw <isaaclombard@ssw.com.au>
Date: Wed, 12 Aug 2026 17:22:51 +1000
Subject: [PATCH] fix: don't let the menu fetch overwrite a host-supplied menu

useMenuItems fired an unconditional fetch on mount, so a host that passed
menuBarItems had its menu replaced by whatever /api/get-megamenu returned.
That endpoint sits behind an in-process cache, a CDN cache and a 4h browser
cache, so SSW.Website could deploy a menu change, serve it correctly in its
HTML, and still show the old menu once hydration finished.

Skip the fetch when the host supplies the menu. Hosts that pass nothing are
unaffected.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
---
 lib/hooks/useMenuItems.ts | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/lib/hooks/useMenuItems.ts b/lib/hooks/useMenuItems.ts
index 0635028..dca9095 100644
--- a/lib/hooks/useMenuItems.ts
+++ b/lib/hooks/useMenuItems.ts
@@ -36,7 +36,15 @@ export const useMenuItems = (
     menuBarItems,
   );
 
+  // A host that passes menuBarItems has already rendered the menu it shipped
+  // with, so fetching would only replace correct data with whatever the API's
+  // caches are still holding. Only hosts that supply nothing need the fetch.
   useEffect(() => {
+    if (menuBarItems) {
+      setMenuItems(menuBarItems);
+      return;
+    }
+
     refreshData()
       .then((data) => {
         setMenuItems(data);
@@ -45,12 +53,6 @@ export const useMenuItems = (
         // eslint-disable-next-line no-console
         console.error(err);
       });
-  }, []);
-
-  useEffect(() => {
-    if (menuBarItems) {
-      setMenuItems(menuBarItems);
-    }
   }, [menuBarItems]);
 
   return { menuItems: menuItems || [] };