-
[OPIK-6069] [FE] Animate refresh buttons (shared RefreshButton) (#6529)
frostbyte_neo 发布于
2026-04-29 14:46:00 +00:00 - [OPIK-6069] [FE] Animate refresh button on Logs page
Refresh on the Logs tabs (Traces/Spans + Threads) gave no visible feedback,
especially when the new request returned identical data. Spin the RotateCw
icon while fetching and use onAnimationIteration to guarantee at least one
full rotation per click; disable the button for the duration of the spin.Co-Authored-By: Claude Opus 4.7 noreply@anthropic.com
- [OPIK-6069] [FE] Extract RefreshButton and reuse across v2 pages
Extracted the refresh-with-spin pattern into a single shared
RefreshButton component (icon spin + minimum-one-cycle latch +
disabled-while-fetching). Replaced ad-hoc copies on the v2 Logs,
TraceLogsSidebar, AutomationLogs, OptimizationLogs, OptimizationTrials,
Optimizations and Experiments/Datasets pages so every refresh button
gives consistent feedback.Co-Authored-By: Claude Opus 4.7 noreply@anthropic.com
- [OPIK-6069] [FE] Wrap spin animation and add fallback in RefreshButton
Address review feedback on RefreshButton:
- Move animate-spin onto a span wrapper instead of the lucide
- Add a setTimeout fallback so the button can't stay disabled if
animationiteration never fires.
Co-Authored-By: Claude Opus 4.7 noreply@anthropic.com
- [OPIK-6069] [FE] Drop unnecessary setTimeout fallback in RefreshButton
animate-spin reliably fires animationiteration every 1s while the class
is on the element, so the backstop wasn't needed.Co-Authored-By: Claude Opus 4.7 noreply@anthropic.com
- [OPIK-6069] [FE] Drop span wrapper in RefreshButton
animate-spin works fine on the lucide
existing pattern in the codebase). Removing the wrapper restores the
Button's [&>svg]:size-* selectors, so callers that pass icon-lg or
icon get the right icon size without the component hardcoding it.Co-Authored-By: Claude Opus 4.7 noreply@anthropic.com
Co-authored-by: Claude Opus 4.7 noreply@anthropic.com
下载附件