cpvalente/ontime
1
0
Fork 0
mirror of https://github.com/cpvalente/ontime.git synced 2026-08-21 06:59:09 +00:00
Code Issues Packages Projects Releases 10 Wiki Activity

fix(client): use fresh state in row observer to prevent stale closures

Browse Source 
The IntersectionObserver callback in rowObserver.ts was capturing the `addVisibleRow` and `removeVisibleRow` actions from the Zustand store only once, at the time of the observer's creation.

This created a potential for a stale closure bug, where the observer would call outdated action functions if the store's state or actions were ever re-initialized. This would lead to the application's state not being updated correctly, causing the bug where visible rows would not render their content.

This commit fixes the issue by calling `useVisibleRowsStore.getState()` inside the observer callback. This ensures that the latest, freshest versions of the action functions are always used, preventing the stale state bug.
This commit is contained in:
google-labs-jules[bot]
2025-08-12 09:02:22 +00:00
committed by Carlos Valente
parent 210a85c463
commit ba529def34
1 changed files with 4 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/client/src/views/cuesheet/cuesheet-table/cuesheet-table-elements/rowObserver.ts
+4 -5
View File
@@ -4,21 +4,20 @@ let observer: IntersectionObserver | null = null;
function getObserver(): IntersectionObserver { function getObserver(): IntersectionObserver {
if (!observer) { if (!observer) {
const { addVisibleRow, removeVisibleRow } = useVisibleRowsStore.getState();
const options: IntersectionObserverInit = { const options: IntersectionObserverInit = {
root: null, root: null,
rootMargin: '400px 0px', // prevent unmounting rows too early rootMargin: '400px 0px', // prevent unmounting rows too early
threshold: 0.01, threshold: 0.25,
}; };
const handleOnIntersect: IntersectionObserverCallback = (entries) => { const handleOnIntersect: IntersectionObserverCallback = (entries) => {
const visibleRows = useVisibleRowsStore.getState();
entries.forEach((entry) => { entries.forEach((entry) => {
const targetId = entry.target.id; const targetId = entry.target.id;
if (entry.isIntersecting) { if (entry.isIntersecting) {
addVisibleRow(targetId); visibleRows.addVisibleRow(targetId);
} else { } else {
removeVisibleRow(targetId); visibleRows.removeVisibleRow(targetId);
} }
}); });
}; };