From 52278dcb4c5bc5ffe993dddef2becc95b0ed7793 Mon Sep 17 00:00:00 2001
From: Ivy <ivy@acorn.io>
Date: Wed, 27 Nov 2024 12:03:12 -0500
Subject: [PATCH] fix: Minor UX improvement, spinner if publish URL is still in
 progress. (#711)

Update AgentPublishStatus.tsx
---
 ui/admin/app/components/agent/Agent.tsx              | 1 +
 ui/admin/app/components/agent/AgentPublishStatus.tsx | 6 ++++++
 2 files changed, 7 insertions(+)

diff --git a/ui/admin/app/components/agent/Agent.tsx b/ui/admin/app/components/agent/Agent.tsx
index 7d6cfd20..54b6233c 100644
--- a/ui/admin/app/components/agent/Agent.tsx
+++ b/ui/admin/app/components/agent/Agent.tsx
@@ -64,6 +64,7 @@ export function Agent({ className, onRefresh }: AgentProps) {
             <ScrollArea className={cn("h-full", className)}>
                 <AgentPublishStatus
                     agent={agentUpdates}
+                    isUpdating={isUpdating}
                     onChange={partialSetAgent}
                 />
 
diff --git a/ui/admin/app/components/agent/AgentPublishStatus.tsx b/ui/admin/app/components/agent/AgentPublishStatus.tsx
index a6058fd3..40c222f1 100644
--- a/ui/admin/app/components/agent/AgentPublishStatus.tsx
+++ b/ui/admin/app/components/agent/AgentPublishStatus.tsx
@@ -11,14 +11,17 @@ import { TypographySmall } from "~/components/Typography";
 import { Publish } from "~/components/agent/Publish";
 import { Unpublish } from "~/components/agent/Unpublish";
 import { CopyText } from "~/components/composed/CopyText";
+import { LoadingSpinner } from "~/components/ui/LoadingSpinner";
 
 type AgentPublishStatusProps = {
     agent: Agent;
+    isUpdating: boolean;
     onChange: (agent: Partial<Agent>) => void;
 };
 
 export function AgentPublishStatus({
     agent,
+    isUpdating,
     onChange,
 }: AgentPublishStatusProps) {
     const getAssistants = useSWR(
@@ -85,6 +88,9 @@ export function AgentPublishStatus({
             );
         }
 
+        if (isUpdating)
+            return <LoadingSpinner className="m-l-2 text-muted-foreground" />;
+
         if (!agent.aliasAssigned) return <div />;
 
         const agentUrl = ConsumptionUrl(`/${agent.alias}`);