Skip to content

Fix/consolidate spinner components#13901

Open
Prithvi1994 wants to merge 2 commits intoOpenHands:mainfrom
Prithvi1994:fix/consolidate-spinner-components
Open

Fix/consolidate spinner components#13901
Prithvi1994 wants to merge 2 commits intoOpenHands:mainfrom
Prithvi1994:fix/consolidate-spinner-components

Conversation

@Prithvi1994
Copy link
Copy Markdown

@Prithvi1994 Prithvi1994 commented Apr 13, 2026

Summary

Consolidates 12 different spinner/loading implementations across the frontend into a single reusable Spinner component.

Problem

The frontend had 12 different spinner implementations using:

  • Custom CSS box-shadow animations (loader.tsx)
  • SVG with animate-spin (loading-spinner.tsx)
  • Lucide LoaderCircle icons (agent-loading.tsx, conversation-loading.tsx)
  • @heroui/react Spinner (branch/repo loading states, microagent)
  • Border-based CSS animations (skills, hooks, dropdown, diff-viewer)

This created:

  • Maintenance burden: Changes to loading behavior require updates in multiple places
  • Inconsistent UX: Different spinners have different sizes, colors, and animations
  • Code duplication: Similar logic repeated across components

Solution

Created a unified Spinner component at src/components/shared/spinner.tsx supporting:

  • 5 configurable sizes: xs (h-3), sm (h-4), md (h-6), lg (h-8), xl (h-16)
  • Optional label text
  • Consistent Tailwind-based styling (animate-spin rounded-full border-2 border-t-transparent border-primary)
  • className and testId passthrough

Migrated all 12 consumers to use the new component.

Files Changed

  • Created: frontend/src/components/shared/spinner.tsx
  • Modified: 13 files across shared, features, and UI directories

TypeScript

All type checks pass with no new errors.

Fixes #12550

…not\n\nThe `binaryornot` library uses byte-frequency heuristics to detect binary\nfiles. These heuristics incorrectly classify valid UTF-8 text files that\ncontain dense CJK (Chinese/Japanese/Korean) characters as binary, causing\n`OHEditor.view()` and `read()` to return `ERROR_BINARY_FILE` for perfectly\nreadable markdown and source files.\n\nFix: attempt a UTF-8 decode of the raw bytes before consulting `is_binary()`.\nIf the file decodes cleanly as UTF-8, it is definitively text regardless of\nwhat binaryornot reports. Only fall through to `is_binary()` when the UTF-8\ndecode raises `UnicodeDecodeError` (i.e. the file is genuinely not UTF-8 text).\n\nAffected call sites:\n- `openhands/runtime/action_execution_server.py` — `read()` method\n- `openhands/runtime/impl/cli/cli_runtime.py` — `read()` and `edit()` methods\n\nFixes OpenHands#13517\n
…component

Replaces 12 different spinner implementations with a single reusable
Spinner component supporting configurable sizes (xs, md, lg, xl) and
optional label text.

Fixes OpenHands#12550
@Prithvi1994 Prithvi1994 force-pushed the fix/consolidate-spinner-components branch from b3eafd7 to a60081c Compare April 13, 2026 06:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Consolidate multiple loading spinner implementations into single reusable component

1 participant