From 989db4dc146dc919427b8788300de058f2532515 Mon Sep 17 00:00:00 2001
From: Matt <matt@Matt-Surface.local>
Date: Mon, 16 Feb 2026 13:58:03 +0100
Subject: [PATCH] Allow AI tagging dialog to close during processing, show
 background progress

- Remove blocking guard on dialog close when tagging is in progress
- Change Cancel button to "Run in Background" during processing
- Add amber border + spinner + progress % on AI Tags button when job runs in background
- Job already runs server-side and sends in-app notification on completion

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/app/(admin)/admin/projects/page.tsx | 23 ++++++++++++++++++-----
 1 file changed, 18 insertions(+), 5 deletions(-)

diff --git a/src/app/(admin)/admin/projects/page.tsx b/src/app/(admin)/admin/projects/page.tsx
index c151e72..66f0550 100644
--- a/src/app/(admin)/admin/projects/page.tsx
+++ b/src/app/(admin)/admin/projects/page.tsx
@@ -366,8 +366,9 @@ export default function ProjectsPage() {
   }
 
   const handleCloseTaggingDialog = () => {
+    setAiTagDialogOpen(false)
+    // Only reset job state if not in progress (preserve polling for background jobs)
     if (!taggingInProgress) {
-      setAiTagDialogOpen(false)
       setActiveTaggingJobId(null)
       setSelectedRoundForTagging('')
       setSelectedProgramForTagging('')
@@ -618,9 +619,22 @@ export default function ProjectsPage() {
           </p>
         </div>
         <div className="flex flex-wrap gap-2">
-          <Button variant="outline" onClick={() => setAiTagDialogOpen(true)}>
-            <Bot className="mr-2 h-4 w-4" />
+          <Button
+            variant="outline"
+            onClick={() => setAiTagDialogOpen(true)}
+            className={taggingInProgress ? 'border-amber-400 bg-amber-50 dark:bg-amber-950/20' : ''}
+          >
+            {taggingInProgress ? (
+              <Loader2 className="mr-2 h-4 w-4 animate-spin text-amber-600" />
+            ) : (
+              <Bot className="mr-2 h-4 w-4" />
+            )}
             AI Tags
+            {taggingInProgress && (
+              <span className="ml-1.5 text-[10px] text-amber-600 font-medium">
+                {taggingProgressPercent}%
+              </span>
+            )}
           </Button>
           <Button variant="outline" asChild>
             <Link href="/admin/projects/pool">
@@ -1833,9 +1847,8 @@ export default function ProjectsPage() {
                 <Button
                   variant="outline"
                   onClick={handleCloseTaggingDialog}
-                  disabled={taggingInProgress}
                 >
-                  Cancel
+                  {taggingInProgress ? 'Run in Background' : 'Cancel'}
                 </Button>
                 <Button
                   onClick={handleStartTagging}