Description

In animated-tabs.tsx, a requestAnimationFrame is called inside a useEffect but the frame ID is never stored or cancelled in cleanup. If the component unmounts before the frame fires, updateActiveIndicator runs on an unmounted component.

File to change

• surfsense_web/components/ui/animated-tabs.tsx (lines 308-310)

Current code

useEffect(() => {
  requestAnimationFrame(updateActiveIndicator);
}, [updateActiveIndicator]);

What to do

useEffect(() => {
  const id = requestAnimationFrame(updateActiveIndicator);
  return () => cancelAnimationFrame(id);
}, [updateActiveIndicator]);

Acceptance criteria

• requestAnimationFrame is cancelled on cleanup
• Tab indicator still animates correctly when switching tabs