Open
Description
When I using the following hook watch a folder:
function isInterest(e: WatchEventKind) {
// @ts-expect-error: xxx
return e.create | e.modify | e.remove;
}
let oldChangeTime = '';
export function useFolderChanges() {
const [path] = useAppStore(s => [s.path]);
const [count, setCount] = useState(0);
const [handle, setHandle] = useState<UnwatchFn | null>(null);
useEffect(() => {
if (!path || path.length === 0) {
if (handle !== null) {
handle();
setHandle(null);
}
return;
}
if (path === oldChangeTime) {
return;
}
oldChangeTime = path;
(async () => {
debug(`watch ${path}`);
const h = await watch(
path,
e => {
if (isInterest(e.type)) {
setCount(count => {
return count + 1;
});
}
},
{
delayMs: 100,
recursive: true,
},
);
setHandle(s => {
if (s !== null) {
debug('cancel watch');
s();
}
return h;
});
})();
}, [path]);
return count;
}
However, when I refresh webpage. Then memory will leak: