streaming scan: verdict renders before SHAP, honest timing labels

app.py

@@ -163,6 +163,10 @@ body{background:var(--bg)!important}
 
 /* ── SHAP ── */
 .sh{display:flex;flex-direction:column;gap:.42rem}
+.sh-spin{width:13px;height:13px;border:2px solid var(--line2);border-top-color:var(--brand);
+  border-radius:50%;animation:shspin .7s linear infinite;display:inline-block;margin-right:.5rem;
+  vertical-align:-2px}
+@keyframes shspin{to{transform:rotate(360deg)}}
 .sh-row{display:flex;align-items:center;gap:.7rem}
 .sh-w{width:120px;text-align:right;font-size:.74rem;font-weight:600;color:var(--muted);
   white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@@ -319,7 +323,24 @@ def _explain(message):
 
 
 # ── renderers ────────────────────────────────────────────────────────────────
-def h_verdict(r, msg="", ms=None):
+SHAP_PENDING = (
+    '<div class="card"><div class="card-t">Why this verdict · SHAP word impact</div>'
+    '<div class="row"><span class="sh-spin"></span> Computing word attribution…</div>'
+    '<div class="rows" style="margin-top:.8rem">'
+    '<div class="sh-row"><div class="sh-w" style="color:var(--faint)">…</div>'
+    '<div class="sh-t"><div class="sh-b" style="left:50%;width:6%;background:var(--brand);opacity:.35"></div></div>'
+    '<div class="sh-v"></div></div>'
+    '<div class="sh-row"><div class="sh-w" style="color:var(--faint)">…</div>'
+    '<div class="sh-t"><div class="sh-b" style="left:50%;width:4%;background:var(--brand);opacity:.25"></div></div>'
+    '<div class="sh-v"></div></div>'
+    '<div class="sh-row"><div class="sh-w" style="color:var(--faint)">…</div>'
+    '<div class="sh-t"><div class="sh-b" style="left:50%;width:5%;background:var(--brand);opacity:.2"></div></div>'
+    '<div class="sh-v"></div></div>'
+    '</div></div>'
+)
+
+
+def h_verdict(r, msg="", ms=None, neural_ms=None):
     p = round(max(0.0, min(1.0, r.get("confidence", 0))) * 100)
     k, colour, lvl, icon = risk(r.get("confidence", 0), r.get("risk_level", ""))
     label = r.get("label", "ham")
@@ -329,13 +350,24 @@ def h_verdict(r, msg="", ms=None):
     out.append(f'<div class="v-ic ic-{k}">{icon}</div>')
     out.append(f'<div><div class="v-title">{title}</div><div class="v-sub">'
                f'{lvl} · detected as <b>{label}</b> · {esc(r.get("language","?"))}'
-               + (f' · {ms} ms' if ms else "") + "</div></div>")
+               "</div></div>")
     out.append(f'<div class="v-score"><b>{p}</b><i>%</i></div></div>')
     out.append(f'<div class="meter"><div class="meter-f" style="width:{p}%;background:{colour}"></div>'
                f'<div class="meter-t" style="left:55%"></div></div>')
     out.append('<div class="meter-s"><span>0% · ham</span><span>decision threshold 55%</span>'
                '<span>100% · scam</span></div>')
 
+    # Timing is honest about which stage it reflects: while streaming, `neural_ms`
+    # equals `ms`, so we only claim a verdict timing — never a "total".
+    if ms and neural_ms and neural_ms == ms:
+        out.append(f'<div class="meter-s" style="margin-top:.3rem">'
+                   f'<span>verdict {ms} ms on GPU</span>'
+                   f'<span>attribution computing…</span></div>')
+    elif ms:
+        out.append(f'<div class="meter-s" style="margin-top:.3rem">'
+                   f'<span>verdict {neural_ms} ms</span>'
+                   f'<span>total {ms} ms on GPU</span></div>')
+
     if r.get("green_channel"):
         out.append(f'<div class="alert alert-g" style="margin-top:1rem">'
                    f'<b>🛡 Green Channel cleared</b> — {esc(r.get("green_reason",""))}</div>')
@@ -414,26 +446,55 @@ def h_warn(r):
 #  Handlers
 # ─────────────────────────────────────────────────────────────────────────────
 @spaces.GPU
-def scan(message):
+def scan(message, progress=gr.Progress()):
+    """
+    Streaming scan: yields the verdict as soon as the neural pass finishes, then
+    yields again once SHAP attribution lands.
+
+    Judging flow wants the verdict fast (~1-2s) but also wants the word-level
+    attribution on screen. Blocking on SHAP hides the verdict behind the slowest
+    step, so this is a generator rather than a single return.
+    """
     if not message or not message.strip():
-        return ('<div class="card"><div class="row">Type or paste a message to analyse it.</div></div>',
-                "", "", "")
+        yield ('<div class="card"><div class="row">Type or paste a message to analyse it.</div></div>',
+               "", "", "")
+        return
+
     t0 = time.perf_counter()
     r = _run(message)
-    ms = int((time.perf_counter() - t0) * 1000)
+    neural_ms = int((time.perf_counter() - t0) * 1000)
+
+    # First yield: verdict + signals, SHAP panel still loading.
+    # Pass neural_ms as BOTH args so h_verdict knows SHAP has not run yet.
+    yield (h_verdict(r, message, neural_ms, neural_ms),
+           h_signals(r),
+           SHAP_PENDING,
+           h_warn(r))
+
+    progress(0.5, desc="Generating word-level attribution…")
     ex = _explain(message)
-    return h_verdict(r, message, ms), h_signals(r), h_shap(r, ex), h_warn(r)
+    total_ms = int((time.perf_counter() - t0) * 1000)
+
+    # Second yield: SHAP resolved, timing folded into the verdict card.
+    yield (h_verdict(r, message, total_ms, neural_ms),
+           h_signals(r),
+           h_shap(r, ex),
+           h_warn(r))
 
 
 @spaces.GPU
-def mob_detail(which, custom=""):
-    """Single seeded-message analysis. Kept on GPU for a responsive detail view."""
+def mob_detail(which, custom="", progress=gr.Progress()):
+    """Single seeded-message analysis — same streaming treatment as the scanner."""
     i = SEED_LABELS.index(which) if which in SEED_LABELS else 0
     msg = custom.strip() or SEED_SMS[i]["b"]
+    head = f'<div class="card"><div class="card-t">Analysis · {esc(SEED_SMS[i]["n"])}</div></div>'
     r = _run(msg)
+
+    yield head + h_verdict(r, msg) + h_signals(r) + SHAP_PENDING + h_warn(r)
+
+    progress(0.5, desc="Generating word-level attribution…")
     ex = _explain(msg)
-    return (f'<div class="card"><div class="card-t">Analysis · {esc(SEED_SMS[i]["n"])}</div></div>'
-            + h_verdict(r, msg) + h_signals(r) + h_shap(r, ex) + h_warn(r))
+    yield head + h_verdict(r, msg) + h_signals(r) + h_shap(r, ex) + h_warn(r)
 
 
 def mob_scan_all(progress=gr.Progress()):
@@ -559,7 +620,7 @@ with gr.Blocks(title="ScamShield — Smishing Detector") as demo:
 
             for e in (btn.click, inp.submit):
                 e(fn=scan, inputs=inp, outputs=[verdict, signals, shap, warn],
-                  api_name="scan", show_progress="hidden")
+                  api_name="scan", show_progress="minimal")
 
         with gr.TabItem("Mobile app"):
             with gr.Row():