diff --git a/sites/dev/lib/load-navigation.mjs b/sites/dev/hooks/use-navigation.mjs
similarity index 96%
rename from sites/dev/lib/load-navigation.mjs
rename to sites/dev/hooks/use-navigation.mjs
index b2be2f3fdba..f93f500f787 100644
--- a/sites/dev/lib/load-navigation.mjs
+++ b/sites/dev/hooks/use-navigation.mjs
@@ -34,7 +34,7 @@ const createSections = () => {
   return orderBy(sections, 'o')
 }
 
-export const loadNavigation = (path = []) => {
+export const useNavigation = (path = []) => {
   // Creat crumbs array
   const crumbs = createCrumbs(path)
   const sections = createSections()
diff --git a/sites/shared/hooks/use-app.mjs b/sites/shared/hooks/use-app.mjs
index ca57c3948a9..d9d2ca10986 100644
--- a/sites/shared/hooks/use-app.mjs
+++ b/sites/shared/hooks/use-app.mjs
@@ -1,7 +1,7 @@
-import { loadNavigation } from 'site/lib/load-navigation.mjs'
 // Hooks
 import { useState, useEffect } from 'react'
 import { useBugsnag } from 'shared/hooks/use-bugsnag.mjs'
+import { useNavigation } from 'site/hooks/use-navigation.mjs'
 // Dependencies
 import get from 'lodash.get'
 import set from 'lodash.set'
@@ -25,13 +25,14 @@ export function useApp(props = {}) {
   if (!path) throw 'You MUST pass a page.path prop to the useApp hook'
 
   const reportError = useBugsnag(props?.bugsnag)
+  const navState = useNavigation(path)
 
   // React state
   const [state, setState] = useState(() => ({ ...defaultState, ...loadState }))
 
   useEffect(() => {
     // Force update of navigation info (nav, title, crumbs) on each page change
-    if (path) setState({ ...state, ...loadNavigation(path) })
+    if (path) setState({ ...state, ...navState })
   }, [path, state.slug, state.title])
 
   /*