From 3389671c8697f47a425948216ce2e84a05f8ee9e Mon Sep 17 00:00:00 2001
From: shimmyshimmer <michaelhan2050@gmail.com>
Date: Mon, 15 Jun 2026 03:10:11 -0700
Subject: [PATCH] Studio: use the shared spinner for loading toasts

The loading toast used a different spinner from the model download toast,
so 'Unloading model' and 'Downloading model' looked inconsistent. Switch
the sonner loading icon to the app-wide Spinner so they match.
---
 studio/frontend/src/components/ui/sonner.tsx | 11 +++--------
 1 file changed, 3 insertions(+), 8 deletions(-)

diff --git a/studio/frontend/src/components/ui/sonner.tsx b/studio/frontend/src/components/ui/sonner.tsx
index 9859190d2c..faaa075fa2 100644
--- a/studio/frontend/src/components/ui/sonner.tsx
+++ b/studio/frontend/src/components/ui/sonner.tsx
@@ -5,10 +5,10 @@ import {
   Alert02Icon,
   CheckmarkCircle02Icon,
   InformationCircleIcon,
-  Loading03Icon,
   MultiplicationSignCircleIcon,
 } from "@hugeicons/core-free-icons";
 import { HugeiconsIcon } from "@hugeicons/react";
+import { Spinner } from "@/components/ui/spinner";
 import { useTheme } from "next-themes";
 import { Toaster as Sonner, type ToasterProps } from "sonner";
 
@@ -51,13 +51,8 @@ const Toaster = ({ ...props }: ToasterProps) => {
             className="size-4"
           />
         ),
-        loading: (
-          <HugeiconsIcon
-            icon={Loading03Icon}
-            strokeWidth={2}
-            className="size-4 animate-spin"
-          />
-        ),
+        // App-wide arc spinner so loading toasts match the "Downloading model" toast.
+        loading: <Spinner className="size-4 text-muted-foreground" />,
       }}
       style={
         {