mirror of
https://github.com/supabase/supabase.git
synced 2026-10-10 11:55:05 +03:00
Ali WaseemandDanny White
b41abc81d9
## Problem The AI icon in the new filter bar renders but no longer animates when an AI filter is generating. This regressed after #44906 upgraded `framer-motion` from `^11.0.3` to `^11.18.2`. ## Cause The outer rotation transition in `AiIconAnimation` mixed tween props (`duration`, `ease`) with spring physics (`type: 'spring'`, `stiffness`, `damping`): ```tsx transition={{ duration: 2, repeat: loading ? Infinity : 0, ease: 'circInOut', type: 'spring', stiffness: 60, damping: 10, }} ``` `framer-motion@11.0.3` tolerated this combination and produced a continuous rotation. `11.18.x` resolves it strictly as a physics spring — `duration`/`ease` are dropped, the spring settles at 360°, and `repeat: Infinity` no longer produces a visible continuous spin. The icon ends up looking static. ## Fix Drop the spring config and keep a simple linear repeating tween — the original intent was a continuous rotation loader, not a bouncy settle. ## Test plan - [x] Open a table in the Table Editor, type an AI prompt into the filter bar, submit it, and confirm the icon rotates continuously while the mutation is pending. - [x] Confirm the inner circle's scale pulse is still present and synced. - [x] Confirm no regressions in other usages of `AiIconAnimation` (e.g. AI Assistant). <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **Style** * Refined AI icon animation: continuous rotation during loading, subtle pulsing (scale) while loading, and enhanced hover interactions with gentle rotation and scale. <!-- end of auto-generated comment: release notes by coderabbit.ai --> --------- Co-authored-by: Danny White <3104761+dnywh@users.noreply.github.com>