fix: annuler les deux RAFs au cleanup pour éviter la double transition
ci/woodpecker/push/woodpecker Pipeline was successful

Le cleanup n'annulait que raf1. Si raf1 avait déjà tiré avant le cleanup React,
raf2 restait en queue et déclenchait une deuxième transition (l'aller-retour visible
à la fin de chaque frame). Fix : stocker raf2 dans la closure et l'annuler aussi.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
syoul
2026-03-23 22:43:12 +01:00
parent ac2f5bc431
commit bc61527b4e
+5 -3
View File
@@ -114,8 +114,10 @@ export function HeatMap({ transactions }: HeatMapProps) {
update();
// 5. Simultaneously: canvas fades in, overlay fades out → true crossfade
const raf = requestAnimationFrame(() => {
requestAnimationFrame(() => {
// Both RAF ids must be cancelled on cleanup to avoid double-transition
let raf2 = 0;
const raf1 = requestAnimationFrame(() => {
raf2 = requestAnimationFrame(() => {
const DURATION = '0.55s ease-in-out';
canvas.style.transition = `opacity ${DURATION}`;
canvas.style.opacity = '1';
@@ -124,7 +126,7 @@ export function HeatMap({ transactions }: HeatMapProps) {
});
});
return () => cancelAnimationFrame(raf);
return () => { cancelAnimationFrame(raf1); cancelAnimationFrame(raf2); };
}, [transactions]);
return (