diff --git a/src/pages/welcome.jsx b/src/pages/welcome.jsx index 78c74990..99ceed6f 100644 --- a/src/pages/welcome.jsx +++ b/src/pages/welcome.jsx @@ -6,7 +6,7 @@ import states from '../utils/states'; import useTitle from '../utils/useTitle'; function Welcome() { - useTitle(); + useTitle(null, ['/', '/welcome']); return (

diff --git a/src/utils/useTitle.js b/src/utils/useTitle.js index e4a53825..6257b004 100644 --- a/src/utils/useTitle.js +++ b/src/utils/useTitle.js @@ -9,10 +9,11 @@ const { VITE_CLIENT_NAME: CLIENT_NAME } = import.meta.env; export default function useTitle(title, path) { const snapStates = useSnapshot(states); const { currentLocation } = snapStates; - let paths = []; + const hasPaths = Array.isArray(path); + let paths = hasPaths ? path : []; // Workaround for matchPath not working for optional path segments // https://github.com/remix-run/react-router/discussions/9862 - if (/:?\w+\?/.test(path)) { + if (!hasPaths && /:?\w+\?/.test(path)) { paths.push(path.replace(/(:\w+)\?/g, '$1')); paths.push(path.replace(/\/?:\w+\?/g, '')); } @@ -24,7 +25,7 @@ export default function useTitle(title, path) { } console.debug({ paths, matched, currentLocation }); useEffect(() => { - if (path && !matched) return; + if (!matched) return; document.title = title ? `${title} / ${CLIENT_NAME}` : CLIENT_NAME; - }, [title, snapStates.currentLocation]); + }, [title, matched]); }