mirror of
https://github.com/cheeaun/phanpy.git
synced 2025-03-10 16:08:52 +01:00
Prevent useTitle from rerendering
This commit is contained in:
parent
650af38a28
commit
a60ad33b47
1 changed files with 25 additions and 20 deletions
|
@ -1,14 +1,14 @@
|
||||||
import { useEffect } from 'preact/hooks';
|
import { useEffect } from 'preact/hooks';
|
||||||
import { matchPath } from 'react-router-dom';
|
import { matchPath } from 'react-router-dom';
|
||||||
import { useSnapshot } from 'valtio';
|
import { subscribeKey } from 'valtio/utils';
|
||||||
|
|
||||||
import states from './states';
|
import states from './states';
|
||||||
|
|
||||||
const { VITE_CLIENT_NAME: CLIENT_NAME } = import.meta.env;
|
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);
|
function setTitle() {
|
||||||
const { currentLocation } = snapStates;
|
const { currentLocation } = states;
|
||||||
const hasPaths = Array.isArray(path);
|
const hasPaths = Array.isArray(path);
|
||||||
let paths = hasPaths ? path : [];
|
let paths = hasPaths ? path : [];
|
||||||
// Workaround for matchPath not working for optional path segments
|
// Workaround for matchPath not working for optional path segments
|
||||||
|
@ -23,9 +23,14 @@ export default function useTitle(title, path) {
|
||||||
} else if (path) {
|
} else if (path) {
|
||||||
matched = matchPath(path, currentLocation);
|
matched = matchPath(path, currentLocation);
|
||||||
}
|
}
|
||||||
console.debug({ paths, matched, currentLocation });
|
console.log('setTitle', { title, path, currentLocation, paths, matched });
|
||||||
useEffect(() => {
|
if (matched) {
|
||||||
if (!matched) return;
|
|
||||||
document.title = title ? `${title} / ${CLIENT_NAME}` : CLIENT_NAME;
|
document.title = title ? `${title} / ${CLIENT_NAME}` : CLIENT_NAME;
|
||||||
}, [title, matched]);
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
setTitle();
|
||||||
|
return subscribeKey(states, 'currentLocation', setTitle);
|
||||||
|
}, [title, path]);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue