simono41/phanpy
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix title not working when not logged in

Browse source 
Welcome page's useTitle overridden other page's useTitle
This commit is contained in:
Lim Chee Aun 2023-02-25 10:03:34 +08:00
parent be83ca7358
commit 9e867c7af5
2 changed files with 6 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
src/pages/welcome.jsx
View file

@ -6,7 +6,7 @@ import states from '../utils/states';
import useTitle from '../utils/useTitle'; import useTitle from '../utils/useTitle';
function Welcome() { function Welcome() {
useTitle(); useTitle(null, ['/', '/welcome']);
return ( return (
<main id="welcome"> <main id="welcome">
<h1> <h1>

9
src/utils/useTitle.js
View file

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