diff --git a/packages/freesewing.dev/hooks/useApp.js b/packages/freesewing.dev/hooks/useApp.js index bcafd687b2f..84175405a49 100644 --- a/packages/freesewing.dev/hooks/useApp.js +++ b/packages/freesewing.dev/hooks/useApp.js @@ -1,6 +1,10 @@ import { useState } from 'react' // Stores state in local storage import useLocalStorage from 'shared/hooks/useLocalStorage.js' +// Translation +import { en } from '@freesewing/i18n' +// Prebuild navigation +import prebuildNavigation from 'site/prebuild/navigation.js' function useApp(full = true) { @@ -9,37 +13,62 @@ function useApp(full = true) { ? window.matchMedia(`(prefers-color-scheme: dark`).matches : null - // React State - const [primaryMenu, setPrimaryMenu] = useState(false) - // Persistent state const [account, setAccount] = useLocalStorage('account', { username: false }) const [theme, setTheme] = useLocalStorage('theme', prefersDarkMode ? 'dark' : 'light') const [language, setLanguage] = useLocalStorage('language', 'en') + // React State + const [primaryMenu, setPrimaryMenu] = useState(false) + const [navigation, setNavigation] = useState(prebuildNavigation[language]) + // State methods const togglePrimaryMenu = () => setPrimaryMenu(!primaryMenu) const openPrimaryMenu = () => setPrimaryMenu(true) const closePrimaryMenu = () => setPrimaryMenu(false) + /* + * Translation method + * + * Note that freesewing.dev is only available in English + * however we use certain shared code/components between + * freesewing.dev and freesewing.org, so we still need + * a translation method + */ + const t = (key=false, vals=false) => { + if (!key) return '' + if (!en.strings[key]) return key + let val = en.strings[key] + if (vals) { + for (const [search, replace] of Object.entries(vals)) { + val = val.replace(/search/g, replace) + } + } + + return val + } + return { // Static vars site: 'dev', // State + language, + navigation, primaryMenu, theme, - language, // State setters + setLanguage, + setNavigation, setPrimaryMenu, setTheme, - setLanguage, // State handlers togglePrimaryMenu, + } } diff --git a/packages/freesewing.dev/pages/index.js b/packages/freesewing.dev/pages/index.js index d7403a778e7..ea67ba88bd2 100644 --- a/packages/freesewing.dev/pages/index.js +++ b/packages/freesewing.dev/pages/index.js @@ -6,6 +6,7 @@ export default (props) => { const app = useApp() return ( +
{JSON.stringify(Object.keys(app.navigation.reference), null, 2)}