Skip to content

Commit 022bfe5

Browse files
authored
fix: startTransition dead loop (#364)
1 parent 0a6f542 commit 022bfe5

File tree

1 file changed

+15
-1
lines changed

1 file changed

+15
-1
lines changed

src/hooks/useNotification.tsx

Lines changed: 15 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -155,12 +155,26 @@ export default function useNotification(
155155
}
156156
});
157157

158+
// https://github.com/ant-design/ant-design/issues/52590
159+
// React `startTransition` will run once `useEffect` but many times `setState`,
160+
// So `setTaskQueue` with filtered array will cause infinite loop.
161+
// We cache the first match queue instead.
162+
let oriTaskQueue: Task[];
163+
let tgtTaskQueue: Task[];
164+
158165
// React 17 will mix order of effect & setState in async
159166
// - open: setState[0]
160167
// - effect[0]
161168
// - open: setState[1]
162169
// - effect setState([]) * here will clean up [0, 1] in React 17
163-
setTaskQueue((oriQueue) => oriQueue.filter((task) => !taskQueue.includes(task)));
170+
setTaskQueue((oriQueue) => {
171+
if (oriTaskQueue !== oriQueue || !tgtTaskQueue) {
172+
oriTaskQueue = oriQueue;
173+
tgtTaskQueue = oriQueue.filter((task) => !taskQueue.includes(task));
174+
}
175+
176+
return tgtTaskQueue;
177+
});
164178
}
165179
}, [taskQueue]);
166180

0 commit comments

Comments
 (0)