fix: fix README cleanup bypasses the queue runs inline in the HTTP request

client/src/components/repos/RepoCard.jsx

@@ -1,4 +1,4 @@
-import React, { useState } from "react";
+import React, { useEffect, useMemo, useRef, useState } from "react";
 import { motion, useReducedMotion } from "framer-motion";
 import {
   GitBranch,
@@ -10,13 +10,42 @@ import {
   Loader,
 } from "lucide-react";
 import { toast } from "sonner";
+import { useQuery } from "convex/react";
 import { api, ENDPOINTS } from "@/lib/api";
-import {
-  startCleanupProgressToast,
-  completeCleanupProgressToast,
-} from "@/lib/cleanupProgressToast";
+import { convexApi } from "@/lib/convexApi";
 import { usePostHog } from "@posthog/react";
 
+// The worker's terminal messages, matched so the toast can settle instead of
+// guessing on a timer. Kept in sync with cleanupHandler in git.worker.js.
+const CLEANUP_SUCCESS_PREFIX = "✓ README committed";
+const CLEANUP_FAILURE_PREFIX = "✗ README cleanup failed";
+const CLEANUP_TOAST_DURATION_MS = 5000;
+
+const cleanupToastId = (logId) => `cleanup-progress-${logId}`;
+
+// liveUpdate fires Convex mutations without awaiting them, so the terminal
+// message is not guaranteed to be the newest — scan instead of trusting the
+// tail. Returns null while there is nothing to show yet.
+const readCleanupOutcome = (messages) => {
+  if (!messages?.length) return null;
+
+  for (let i = messages.length - 1; i >= 0; i -= 1) {
+    const { message } = messages[i];
+    if (message.startsWith(CLEANUP_SUCCESS_PREFIX)) {
+      return { settled: true, succeeded: true, message };
+    }
+    if (message.startsWith(CLEANUP_FAILURE_PREFIX)) {
+      return { settled: true, succeeded: false, message };
+    }
+  }
+
+  return {
+    settled: false,
+    succeeded: false,
+    message: messages[messages.length - 1].message,
+  };
+};
+
 const RepoCard = ({
   repo,
   showToggle = true,
@@ -30,7 +59,23 @@ const RepoCard = ({
   const posthog = usePostHog();
   const [isActive, setIsActive] = useState(repo.activated);
   const [loading, setLoading] = useState(false);
-  const [isCleaningUp, setIsCleaningUp] = useState(false);
+  const [isEnqueueingCleanup, setIsEnqueueingCleanup] = useState(false);
+  const [cleanupLogId, setCleanupLogId] = useState(null);
+  const settledCleanupRef = useRef(null);
+  const cleanupMessages = useQuery(
+    convexApi.logs.getLogMessages,
+    cleanupLogId ? { logId: cleanupLogId } : "skip",
+  );
+
+  // Progress is derived from the worker's log stream rather than mirrored into
+  // state, so the button stays spinning until the job actually reports back.
+  const cleanupOutcome = useMemo(
+    () => readCleanupOutcome(cleanupMessages),
+    [cleanupMessages],
+  );
+  const isCleaningUp =
+    isEnqueueingCleanup || (Boolean(cleanupLogId) && !cleanupOutcome?.settled);
+
   const ownerLabel =
     repo.owner || repo.full_name?.split("/")?.[0] || "Repository";
   const branchLabel = repo.default_branch || "main";
@@ -77,31 +122,90 @@ const RepoCard = ({
     }
   };
 
+  // Cleanup runs on a queue, so the request only enqueues it. The toast is
+  // driven by the worker's own log messages, keyed by the logId in the 202.
+  useEffect(() => {
+    if (!cleanupLogId || !cleanupOutcome) return;
+
+    const toastId = cleanupToastId(cleanupLogId);
+
+    if (!cleanupOutcome.settled) {
+      toast.loading(cleanupOutcome.message, { id: toastId });
+      return;
+    }
+
+    // Terminal messages never change again, but a remount would replay them.
+    if (settledCleanupRef.current === cleanupLogId) return;
+    settledCleanupRef.current = cleanupLogId;
+
+    // A loading toast has no duration, and sonner keeps whatever the toast was
+    // created with when an update reuses the id — pass one so it can close.
+    if (cleanupOutcome.succeeded) {
+      toast.success("Your README is now clean and tidy", {
+        id: toastId,
+        duration: CLEANUP_TOAST_DURATION_MS,
+      });
+      posthog?.capture("readme_cleanup_completed", {
+        repo_name: repo.name,
+        repo_full_name: repo.full_name,
+      });
+      return;
+    }
+
+    const reason = cleanupOutcome.message
+      .slice(CLEANUP_FAILURE_PREFIX.length)
+      .replace(/^:\s*/, "");
+    toast.error(reason || "Failed to clean up your README", {
+      id: toastId,
+      duration: CLEANUP_TOAST_DURATION_MS,
+    });
+    posthog?.capture("readme_cleanup_failed", {
+      repo_name: repo.name,
+      repo_full_name: repo.full_name,
+    });
+  }, [cleanupLogId, cleanupOutcome, posthog, repo.name, repo.full_name]);
+
+  // A loading toast never auto-dismisses, so one left without an updater hangs
+  // on screen forever. Drop it if this card stops watching the job — unmounted,
+  // or superseded by a newer cleanup — unless it already settled.
+  useEffect(() => {
+    if (!cleanupLogId) return undefined;
+
+    return () => {
+      if (settledCleanupRef.current !== cleanupLogId) {
+        toast.dismiss(cleanupToastId(cleanupLogId));
+      }
+    };
+  }, [cleanupLogId]);
+
   const handleCleanUp = async (e) => {
     e.stopPropagation();
     if (isCleaningUp) return;
 
-    setIsCleaningUp(true);
-    const progress = startCleanupProgressToast();
+    setIsEnqueueingCleanup(true);
 
     try {
-      await api.post(ENDPOINTS.CLEAN_UP_README, { repoId: repo.id });
-      completeCleanupProgressToast(progress, {
-        success: true,
-        message: "Your README is now clean and tidy",
+      const res = await api.post(ENDPOINTS.CLEAN_UP_README, {
+        repoId: repo.id,
       });
-      posthog?.capture("readme_cleanup_completed", {
+      if (res.status !== 202 || !res.data?.logId) {
+        throw new Error("Cleanup could not be queued");
+      }
+
+      posthog?.capture("readme_cleanup_started", {
         repo_name: repo.name,
         repo_full_name: repo.full_name,
       });
-    } catch (error) {
-      completeCleanupProgressToast(progress, {
-        success: false,
-        message:
-          error.response?.data?.message || "Failed to clean up your README",
+      toast.loading("Queued README cleanup", {
+        id: cleanupToastId(res.data.logId),
       });
+      setCleanupLogId(res.data.logId);
+    } catch (error) {
+      toast.error(
+        error.response?.data?.message || "Failed to clean up your README",
+      );
     } finally {
-      setIsCleaningUp(false);
+      setIsEnqueueingCleanup(false);
     }
   };
 

server/src/controllers/github.controller.js

@@ -2,7 +2,7 @@ import User from "../schema/user.schema.js";
 import { decrypt } from "./oauthcontroller.js";
 import ActiveRepo from "../schema/activeRepo.js";
 import crypto from "node:crypto";
-import { readmeQueue } from "../utils/git.worker.js";
+import { cleanUpQueue, readmeQueue } from "../utils/git.worker.js";
 import UserLogModel from "../schema/userLog.schema.js";
 import {
   GITHUB_API_BASE,
@@ -12,8 +12,6 @@ import {
 } from "../utils/githubApiClient.js";
 import { RedisConnection } from "bullmq";
 import { redis } from "../utils/redis.js";
-import { commitFile, getFileContent } from "../services/github.service.js";
-import { cleanReadmeWithAI } from "../services/readmeCleanup.service.js";
 import { liveUpdate } from "../services/convex.service.js";
 
 export function verifyGithubSignature(req) {
@@ -579,8 +577,9 @@ export const fetchAdminUsers = async (req, res) => {
 };
 
 export const cleanUpReadme = async (req, res) => {
-  let userLog = null;
-  let sharedLogId = null;
+  // Minted here, not in the worker, so the 202 can hand the client a log id to
+  // subscribe to and so a retry reuses the same log row.
+  const sharedLogId = crypto.randomUUID();
 
   try {
     console.log("[cleanUpReadme] Started");
@@ -609,109 +608,37 @@ export const cleanUpReadme = async (req, res) => {
       return res.status(404).json({ message: "GitHub access token not found" });
     }
 
-    const accessToken = decrypt(user.githubAccessToken);
-
-    console.log("[cleanUpReadme] Fetching README.md");
-    const readmeFile = await getFileContent(
-      accessToken,
-      activeRepo.repoOwner,
-      activeRepo.repoName,
-      "README.md",
-      activeRepo.defaultBranch,
-    );
-    if (!readmeFile?.content?.trim()) {
-      console.log("[cleanUpReadme] README.md not found");
-      return res
-        .status(404)
-        .json({ message: "README.md not found in repository" });
-    }
-
-    console.log("[cleanUpReadme] README fetched");
-    sharedLogId = crypto.randomUUID();
-    userLog = await UserLogModel.create({
-      logId: sharedLogId,
-      userId,
-      repoName: activeRepo.repoName,
-      repoOwner: activeRepo.repoOwner,
-      action: "README_CLEANUP_STARTED",
-      status: "ongoing",
-    });
-    await redis.del("admin_analytics");
-
-    liveUpdate(
-      sharedLogId,
-      `Starting README cleanup for ${activeRepo.repoOwner}/${activeRepo.repoName}`,
-    );
-    console.log("[cleanUpReadme] Running AI cleanup");
-    liveUpdate(sharedLogId, "Fetched existing README.md");
-    liveUpdate(sharedLogId, "Cleaning README content with AI");
-    const cleanedReadme = await cleanReadmeWithAI(readmeFile.content, (msg) =>
-      liveUpdate(sharedLogId, msg),
-    );
-    console.log("[cleanUpReadme] AI cleanup complete");
-    liveUpdate(sharedLogId, `Cleanup complete (${cleanedReadme.length} chars)`);
-
-    console.log("[cleanUpReadme] Committing README");
-    liveUpdate(sharedLogId, "Committing cleaned README to GitHub");
-    const commitResult = await commitFile(
-      accessToken,
-      activeRepo.repoOwner,
-      activeRepo.repoName,
-      "README.md",
-      cleanedReadme,
-      "chore: cleanup README [skip ci]",
-      activeRepo.defaultBranch,
-      readmeFile.sha,
-    );
-
-    console.log("[cleanUpReadme] README committed:", commitResult.commit.sha);
-    liveUpdate(
-      sharedLogId,
-      `✓ README committed: ${commitResult.commit.sha.slice(0, 7)}`,
-    );
-    await UserLogModel.findByIdAndUpdate(
-      userLog._id,
+    await cleanUpQueue.add(
+      "cleanup-queue",
       {
-        action: "README_CLEANUP_SUCCESS",
-        status: "success",
-        commitId: commitResult.commit.sha,
+        userId,
+        repoName: activeRepo.repoName,
+        repoOwner: activeRepo.repoOwner,
+        defaultBranch: activeRepo.defaultBranch,
+        // Ciphertext only — the job payload sits in Redis for the lifetime of
+        // the job, so the worker does the decrypting.
+        encryptedAccessToken: {
+          iv: user.githubAccessToken.iv,
+          content: user.githubAccessToken.content,
+          tag: user.githubAccessToken.tag,
+        },
+        sharedLogId,
       },
       {
-        new: true,
-        runValidators: true,
+        attempts: 3,
+        backoff: { type: "exponential", delay: 5000 },
       },
     );
-    await redis.del("admin_analytics");
 
-    return res.status(200).json({
-      message: "Readme cleaned up successfully",
-      commitSha: commitResult.commit.sha,
+    return res.status(202).json({
+      message: "Readme cleanup initiated",
+      logId: sharedLogId,
     });
   } catch (error) {
     console.error("[cleanUpReadme] Failed:", error.message);
     liveUpdate(sharedLogId, `✗ Failed: ${error.message}`);
-
-    if (userLog) {
-      try {
-        await UserLogModel.findByIdAndUpdate(
-          userLog._id,
-          {
-            action: "README_CLEANUP_FAILED",
-            status: "failed",
-          },
-          {
-            new: true,
-            runValidators: true,
-          },
-        );
-        await redis.del("admin_analytics");
-      } catch (logError) {
-        console.error(
-          "[cleanUpReadme] Failed to update Mongo log:",
-          logError.message,
-        );
-      }
-    }
-    return res.status(500).json({ message: "Error cleaning up readme" });
+    return res
+      .status(500)
+      .json({ message: "Error cleaning up readme", logId: sharedLogId });
   }
 };