@@ -14,40 +14,6 @@ async function call(path: string): Promise<{ ok: boolean; error?: string }> {
   }
 }
 
-// Poll lx_article for a new row in status='ready' created after `since`.
-// Returns the article id or null on timeout. Scoped to the current
-// project's lx_site via projectId so users with multiple projects don't
-// poll the wrong site when the picker cookie has drifted.
-//
-// Window is generous (5 min): the worker's "30-60s" ballpark is a best
-// case — LLM + sitemap + embeddings can push it past 2 min, and a short
-// window meant the dashboard would give up before the article landed.
-async function waitForNewArticle(
-  projectId: string,
-  since: Date,
-  signal: AbortSignal,
-  maxMs = 300_000,
-): Promise<string | null> {
-  const start = Date.now();
-  while (Date.now() - start < maxMs) {
-    if (signal.aborted) return null;
-    try {
-      const res = await fetch(
-        `/api/lx/articles/latest?projectId=${encodeURIComponent(projectId)}&since=${encodeURIComponent(since.toISOString())}`,
-        { cache: "no-store", signal },
-      );
-      if (res.status === 200) {
-        const json = (await res.json()) as { ok?: boolean; article?: { id: string } };
-        if (json.ok && json.article?.id) return json.article.id;
-      }
-    } catch {
-      // transient — keep polling
-    }
-    await new Promise((r) => setTimeout(r, 2000));
-  }
-  return null;
-}
-
 export function DashboardActions({
   paused,
   projectId,
@@ -79,39 +45,26 @@ export function DashboardActions({
 
   async function generateArticleNow() {
     setBusy("article");
-    setNotice("Generating… this can take 1–3 minutes.");
+    setNotice(null);
     setError(null);
-    const since = new Date();
     const r = await call(
       `/api/lx/articles/generate?projectId=${encodeURIComponent(projectId)}`,
     );
+    setBusy(null);
     if (!r.ok) {
-      setBusy(null);
-      setNotice(null);
       setError(r.error ?? "Could not queue article.");
       return;
     }
-    const controller = new AbortController();
-    const articleId = await waitForNewArticle(
-      projectId,
-      since,
-      controller.signal,
+    // Don't poll from the client — the amber Previews section above
+    // owns the in-flight state via the page's lx_keyword query, and
+    // AutoblogAutoRefresh re-fetches every few seconds while anything
+    // is generating. We just kick the first refresh so the worker's
+    // 'generating' claim shows up immediately instead of after the
+    // next interval tick.
+    setNotice(
+      "Queued — the preview will appear in the section above when it's ready (1–3 minutes).",
     );
-    setBusy(null);
-    if (articleId) {
-      // Stay on the dashboard so the new preview link appears at the
-      // top with the rest of the queue. Redirecting away was confusing
-      // when users wanted to compare multiple previews; the link in the
-      // amber "Previews waiting on Publish" section goes to the same
-      // place when they're ready to review.
-      setNotice("Preview ready — see the section at the top.");
-      router.refresh();
-    } else {
-      setNotice(
-        "Still generating. Refresh this page in a minute to see the preview at the top.",
-      );
-      router.refresh();
-    }
+    router.refresh();
   }
 
   function togglePause() {
 
@@ -0,0 +1,24 @@
+"use client";
+
+import { useEffect } from "react";
+import { useRouter } from "next/navigation";
+
+// Periodically calls router.refresh() while `active` is true so the
+// autoblog dashboard can transition from "1 generating" → "preview ready"
+// without the user manually reloading. The parent decides when this is
+// active (passes `inFlightCount > 0`); the component stops cleanly when
+// that flips to false.
+//
+// 8s cadence balances responsiveness against server load — generation
+// itself takes 1–3 min, so polling much faster than this is wasted.
+const REFRESH_INTERVAL_MS = 8000;
+
+export function AutoblogAutoRefresh({ active }: { active: boolean }) {
+  const router = useRouter();
+  useEffect(() => {
+    if (!active) return;
+    const id = setInterval(() => router.refresh(), REFRESH_INTERVAL_MS);
+    return () => clearInterval(id);
+  }, [active, router]);
+  return null;
+}
@@ -6,6 +6,7 @@ import { DashboardActions } from "./actions";
 import { Countdown } from "./countdown";
 import { checkAutoblogReadiness, readinessLabel } from "@/lib/lx/readiness";
 import { DeleteAutoblogButton } from "./delete-autoblog-button";
+import { AutoblogAutoRefresh } from "./auto-refresh";
 
 export const metadata = { title: "Autoblog" };
 
@@ -89,6 +90,7 @@ export default async function AutoblogDashboardPage({
     { data: upcoming },
     { data: recent },
     { data: previews },
+    { data: inFlight },
   ] = await Promise.all([
     supabase
       .from("lx_keyword")
@@ -128,7 +130,20 @@ export default async function AutoblogDashboardPage({
       .eq("status", "ready")
       .order("created_at", { ascending: false })
       .limit(10),
+    // Keywords actively being turned into articles. The autoblog worker
+    // sets status='generating' the moment it claims a keyword and only
+    // flips it off ('published' on success, 'failed' on error) once
+    // generation resolves. Surfacing this count lets the page show a
+    // live in-flight indicator instead of looking identical pre- and
+    // post-click.
+    supabase
+      .from("lx_keyword")
+      .select("id, keyword")
+      .eq("site_id", site.id)
+      .eq("status", "generating")
+      .order("scheduled_for", { ascending: true }),
   ]);
+  const inFlightCount = (inFlight ?? []).length;
 
   const readiness = await readinessPromise;
 
@@ -193,14 +208,20 @@ export default async function AutoblogDashboardPage({
       )}
 
       {/* Generated articles awaiting Publish — always visible so the
-         user has a known destination after clicking Generate. Renders an
-         empty-state when nothing's in 'ready' yet, keeping the section
-         predictable on the page. */}
+         user has a known destination after clicking Generate. Shows three
+         distinct states so the page is the source of truth post-click
+         instead of relying on a client-side poller: in-flight (keyword
+         claimed by worker), previews ready, or empty. AutoblogAutoRefresh
+         re-fetches on an interval while anything is in flight so the page
+         transitions to "ready" without a manual reload. */}
+      <AutoblogAutoRefresh active={inFlightCount > 0} />
       <section className="rounded border border-amber-500/40 bg-amber-500/5 p-4">
         <h2 className="text-sm font-bold text-amber-600 dark:text-amber-400">
           {(previews ?? []).length > 0
             ? `⚠ ${previews!.length} preview${previews!.length === 1 ? "" : "s"} waiting on Publish`
-            : "Previews waiting on Publish"}
+            : inFlightCount > 0
+              ? `⏳ ${inFlightCount} generating now`
+              : "Previews waiting on Publish"}
         </h2>
         {(previews ?? []).length > 0 ? (
           <>
@@ -223,12 +244,36 @@ export default async function AutoblogDashboardPage({
                 </li>
               ))}
             </ul>
+            {inFlightCount > 0 && (
+              <p className="mt-3 text-xs text-[var(--color-muted)]">
+                Plus {inFlightCount} more generating — this page will refresh
+                when {inFlightCount === 1 ? "it lands" : "they land"}.
+              </p>
+            )}
+          </>
+        ) : inFlightCount > 0 ? (
+          <>
+            <p className="mt-1 text-xs text-[var(--color-muted)]">
+              Generation takes 1–3 minutes (LLM + image + embeddings). This
+              page is auto-refreshing — the preview link will appear here
+              the moment it's ready.
+            </p>
+            <ul className="mt-3 space-y-1 text-sm">
+              {(inFlight ?? []).map((k: any) => (
+                <li key={k.id} className="text-[var(--color-muted)]">
+                  <span className="font-medium text-[var(--foreground)]">
+                    {k.keyword}
+                  </span>{" "}
+                  <span className="badge badge-warn ml-1">generating</span>
+                </li>
+              ))}
+            </ul>
           </>
         ) : (
           <p className="mt-1 text-xs text-[var(--color-muted)]">
             No previews yet. Click <em>Generate article now</em> below to
-            produce one — it'll appear here in ~60–90 seconds, then you can
-            review and publish.
+            produce one — it usually takes 1–3 minutes. The preview will
+            appear here automatically when it's ready.
           </p>
         )}
       </section>