From 24623d52e81eb7830b70cadb1cc45d642d5683ec Mon Sep 17 00:00:00 2001
From: Ettore Di Giacinto <mudler@localai.io>
Date: Thu, 18 Jun 2026 10:25:55 +0000
Subject: [PATCH] refactor(ui): route boot fallback through the LoadingSpinner
 primitive

Assisted-by: Claude:claude-opus-4-8 [Claude Code]
Signed-off-by: Ettore Di Giacinto <mudler@localai.io>
---
 core/http/react-ui/src/components/LoadingSpinner.jsx | 8 ++++++--
 core/http/react-ui/src/main.jsx                      | 5 +++--
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/core/http/react-ui/src/components/LoadingSpinner.jsx b/core/http/react-ui/src/components/LoadingSpinner.jsx
index b1c1b46a2..5a1df8d51 100644
--- a/core/http/react-ui/src/components/LoadingSpinner.jsx
+++ b/core/http/react-ui/src/components/LoadingSpinner.jsx
@@ -1,7 +1,11 @@
 export default function LoadingSpinner({ size = 'md', className = '' }) {
-  const sizeClass = size === 'sm' ? 'spinner-sm' : size === 'lg' ? 'spinner-lg' : 'spinner-md'
+  const sizeClass =
+    size === 'sm' ? 'spinner-sm'
+    : size === 'lg' ? 'spinner-lg'
+    : size === 'boot' ? 'spinner-lg'
+    : 'spinner-md'
   return (
-    <div className={`spinner ${sizeClass} ${className}`}>
+    <div className={`spinner ${sizeClass} ${className}`} role="status" aria-label="Loading">
       <div className="spinner-ring" />
     </div>
   )
diff --git a/core/http/react-ui/src/main.jsx b/core/http/react-ui/src/main.jsx
index b98fe0009..427494d43 100644
--- a/core/http/react-ui/src/main.jsx
+++ b/core/http/react-ui/src/main.jsx
@@ -14,11 +14,12 @@ import '@fontsource-variable/fraunces'
 import './index.css'
 import './theme.css'
 import './App.css'
+import LoadingSpinner from './components/LoadingSpinner'
 
 function BootFallback() {
   return (
-    <div className="app-boot-spinner" role="status" aria-label="Loading">
-      <div className="app-boot-spinner-dot" />
+    <div className="app-boot-spinner">
+      <LoadingSpinner size="boot" />
     </div>
   )
 }