Spaces:
Running
Running
Fix eval-flag-dialog infinite effect loop on open
Browse filesThe `storeBump++` inside the effect read + wrote the same state, making
it a tracked dependency that re-fired the effect — exceeding Svelte's
update depth and freezing the page so the dialog Close button couldn't
fire. Wrap the body in untrack() so only `open` is observed.
src/lib/components/eval-flag-dialog.svelte
CHANGED
|
@@ -17,6 +17,7 @@
|
|
| 17 |
import ClipboardIcon from 'phosphor-svelte/lib/ClipboardIcon';
|
| 18 |
import TrashIcon from 'phosphor-svelte/lib/TrashIcon';
|
| 19 |
import { toast } from 'svelte-sonner';
|
|
|
|
| 20 |
|
| 21 |
interface Props {
|
| 22 |
open?: boolean;
|
|
@@ -33,13 +34,19 @@
|
|
| 33 |
// Bumped to refresh the counts when the user copies/clears or saves a flag.
|
| 34 |
let storeBump = $state(0);
|
| 35 |
|
|
|
|
|
|
|
|
|
|
| 36 |
$effect(() => {
|
| 37 |
-
|
| 38 |
-
|
| 39 |
-
|
| 40 |
-
|
| 41 |
-
|
| 42 |
-
|
|
|
|
|
|
|
|
|
|
| 43 |
});
|
| 44 |
|
| 45 |
const flagsCount = $derived.by(() => {
|
|
|
|
| 17 |
import ClipboardIcon from 'phosphor-svelte/lib/ClipboardIcon';
|
| 18 |
import TrashIcon from 'phosphor-svelte/lib/TrashIcon';
|
| 19 |
import { toast } from 'svelte-sonner';
|
| 20 |
+
import { untrack } from 'svelte';
|
| 21 |
|
| 22 |
interface Props {
|
| 23 |
open?: boolean;
|
|
|
|
| 34 |
// Bumped to refresh the counts when the user copies/clears or saves a flag.
|
| 35 |
let storeBump = $state(0);
|
| 36 |
|
| 37 |
+
// Watch only `open`; everything inside is untracked so writes (especially
|
| 38 |
+
// `storeBump++` which is a read+write) don't make the effect re-trigger
|
| 39 |
+
// itself into an infinite loop.
|
| 40 |
$effect(() => {
|
| 41 |
+
const isOpen = open;
|
| 42 |
+
untrack(() => {
|
| 43 |
+
if (!isOpen) {
|
| 44 |
+
reason = null;
|
| 45 |
+
note = '';
|
| 46 |
+
} else {
|
| 47 |
+
storeBump++;
|
| 48 |
+
}
|
| 49 |
+
});
|
| 50 |
});
|
| 51 |
|
| 52 |
const flagsCount = $derived.by(() => {
|