Add persistent predictions dataset, ID-based share links, user feedback buttons

app.py

@@ -1,22 +1,85 @@
 """HuggingFace Space for AI text detection using adaptive-classifier."""
 
-import io
+import json
 import re
 import urllib.parse
 import urllib.request
+from datetime import datetime
 from html.parser import HTMLParser
+from pathlib import Path
+from uuid import uuid4
 
 import gradio as gr
 from PIL import Image, ImageDraw, ImageFont
 from adaptive_classifier import AdaptiveClassifier
+from huggingface_hub import CommitScheduler
 
-# Load model once at startup
+# ---------------------------------------------------------------------------
+# Model
+# ---------------------------------------------------------------------------
 print("Loading model...")
 classifier = AdaptiveClassifier.from_pretrained(
     "adaptive-classifier/ai-detector", use_onnx=False
 )
 print("Model loaded!")
 
+# ---------------------------------------------------------------------------
+# Persistent dataset via CommitScheduler
+# ---------------------------------------------------------------------------
+DATA_DIR = Path("prediction_data")
+DATA_DIR.mkdir(parents=True, exist_ok=True)
+DATA_FILE = DATA_DIR / f"predictions-{uuid4()}.jsonl"
+
+scheduler = CommitScheduler(
+    repo_id="adaptive-classifier/ai-detector-data",
+    repo_type="dataset",
+    folder_path=DATA_DIR,
+    path_in_repo="data",
+    private=True,
+)
+
+# In-memory index for lookups by ID (populated from current session)
+_predictions = {}
+
+
+def save_prediction(pred_id: str, text: str, url: str, label: str, confidence: float):
+    """Save a prediction to the dataset."""
+    record = {
+        "id": pred_id,
+        "text": text,
+        "url": url,
+        "prediction": label,
+        "confidence": confidence,
+        "feedback": None,
+        "timestamp": datetime.now().isoformat(),
+    }
+    _predictions[pred_id] = record
+    with scheduler.lock:
+        with DATA_FILE.open("a") as f:
+            json.dump(record, f)
+            f.write("\n")
+
+
+def save_feedback(pred_id: str, feedback: str):
+    """Save user feedback for a prediction."""
+    record = {
+        "id": pred_id,
+        "feedback": feedback,
+        "timestamp": datetime.now().isoformat(),
+    }
+    with scheduler.lock:
+        with DATA_FILE.open("a") as f:
+            json.dump(record, f)
+            f.write("\n")
+    if pred_id in _predictions:
+        _predictions[pred_id]["feedback"] = feedback
+
+
+# ---------------------------------------------------------------------------
+# Constants
+# ---------------------------------------------------------------------------
+SPACE_URL = "https://adaptive-classifier-ai-detector.hf.space"
+
 HEADERS = {
     "User-Agent": (
         "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) "
@@ -47,252 +110,128 @@ CSS = """
     --glow-blue: rgba(59, 130, 246, 0.15);
 }
 
-/* Global overrides */
 .gradio-container {
     background: var(--bg-deep) !important;
     font-family: 'Outfit', sans-serif !important;
     max-width: 820px !important;
     margin: 0 auto !important;
 }
-
-.main, .contain {
-    background: transparent !important;
-}
-
+.main, .contain { background: transparent !important; }
 footer { display: none !important; }
 
-/* Header */
-.header-block {
-    text-align: center;
-    padding: 2rem 1rem 1rem;
-}
-
+.header-block { text-align: center; padding: 2rem 1rem 1rem; }
 .header-block h1 {
     font-family: 'DM Mono', monospace !important;
-    font-size: 1.6rem !important;
-    font-weight: 500 !important;
-    color: var(--text-primary) !important;
-    letter-spacing: 0.04em;
+    font-size: 1.6rem !important; font-weight: 500 !important;
+    color: var(--text-primary) !important; letter-spacing: 0.04em;
     margin-bottom: 0.4rem !important;
 }
-
 .header-block p {
-    font-size: 0.85rem !important;
-    color: var(--text-secondary) !important;
-    line-height: 1.5 !important;
-    max-width: 560px;
-    margin: 0 auto !important;
+    font-size: 0.85rem !important; color: var(--text-secondary) !important;
+    line-height: 1.5 !important; max-width: 560px; margin: 0 auto !important;
 }
-
 .header-block a {
-    color: var(--accent-cyan) !important;
-    text-decoration: none !important;
+    color: var(--accent-cyan) !important; text-decoration: none !important;
     border-bottom: 1px solid rgba(6, 182, 212, 0.3);
 }
+.header-block a:hover { border-bottom-color: var(--accent-cyan); }
 
-.header-block a:hover {
-    border-bottom-color: var(--accent-cyan);
-}
-
-/* Tabs */
-.tabs {
-    background: transparent !important;
-    border: none !important;
-}
-
+.tabs { background: transparent !important; border: none !important; }
 .tab-nav {
-    background: transparent !important;
-    border: none !important;
-    justify-content: center !important;
-    gap: 0.25rem !important;
+    background: transparent !important; border: none !important;
+    justify-content: center !important; gap: 0.25rem !important;
     padding: 0.5rem 0 !important;
 }
-
 .tab-nav button {
     font-family: 'DM Mono', monospace !important;
-    font-size: 0.8rem !important;
-    font-weight: 400 !important;
-    letter-spacing: 0.06em;
-    text-transform: uppercase;
-    color: var(--text-muted) !important;
-    background: transparent !important;
+    font-size: 0.8rem !important; font-weight: 400 !important;
+    letter-spacing: 0.06em; text-transform: uppercase;
+    color: var(--text-muted) !important; background: transparent !important;
     border: 1px solid var(--border-subtle) !important;
-    border-radius: 6px !important;
-    padding: 0.5rem 1.5rem !important;
+    border-radius: 6px !important; padding: 0.5rem 1.5rem !important;
     transition: all 0.2s ease !important;
 }
-
-.tab-nav button:hover {
-    color: var(--text-secondary) !important;
-    border-color: var(--text-muted) !important;
-}
-
+.tab-nav button:hover { color: var(--text-secondary) !important; border-color: var(--text-muted) !important; }
 .tab-nav button.selected {
     color: var(--accent-cyan) !important;
     background: rgba(6, 182, 212, 0.08) !important;
     border-color: var(--accent-cyan) !important;
 }
+.tabitem { background: transparent !important; border: none !important; padding: 0 !important; min-height: 520px !important; }
 
-.tabitem {
-    background: transparent !important;
-    border: none !important;
-    padding: 0 !important;
-    min-height: 520px !important;
-}
-
-/* Input card */
 .input-card {
-    background: var(--bg-card) !important;
-    border: 1px solid var(--border-subtle) !important;
-    border-radius: 10px !important;
-    padding: 1.25rem !important;
-    margin-top: 0.75rem !important;
+    background: var(--bg-card) !important; border: 1px solid var(--border-subtle) !important;
+    border-radius: 10px !important; padding: 1.25rem !important; margin-top: 0.75rem !important;
 }
 
-/* Textbox overrides */
 textarea, input[type="text"] {
-    font-family: 'DM Mono', monospace !important;
-    font-size: 0.85rem !important;
-    line-height: 1.65 !important;
-    color: var(--text-primary) !important;
-    background: var(--bg-input) !important;
-    border: 1px solid var(--border-subtle) !important;
-    border-radius: 8px !important;
-    padding: 0.85rem 1rem !important;
+    font-family: 'DM Mono', monospace !important; font-size: 0.85rem !important;
+    line-height: 1.65 !important; color: var(--text-primary) !important;
+    background: var(--bg-input) !important; border: 1px solid var(--border-subtle) !important;
+    border-radius: 8px !important; padding: 0.85rem 1rem !important;
     transition: border-color 0.2s ease !important;
 }
-
 textarea:focus, input[type="text"]:focus {
     border-color: var(--accent-blue) !important;
-    box-shadow: 0 0 0 3px var(--glow-blue) !important;
-    outline: none !important;
+    box-shadow: 0 0 0 3px var(--glow-blue) !important; outline: none !important;
 }
-
 label span {
-    font-family: 'DM Mono', monospace !important;
-    font-size: 0.7rem !important;
-    text-transform: uppercase !important;
-    letter-spacing: 0.08em !important;
+    font-family: 'DM Mono', monospace !important; font-size: 0.7rem !important;
+    text-transform: uppercase !important; letter-spacing: 0.08em !important;
     color: var(--text-muted) !important;
 }
 
-/* Button */
 .detect-btn {
-    font-family: 'DM Mono', monospace !important;
-    font-size: 0.8rem !important;
-    font-weight: 500 !important;
-    letter-spacing: 0.06em !important;
+    font-family: 'DM Mono', monospace !important; font-size: 0.8rem !important;
+    font-weight: 500 !important; letter-spacing: 0.06em !important;
     text-transform: uppercase !important;
     background: linear-gradient(135deg, var(--accent-blue), var(--accent-cyan)) !important;
-    color: #fff !important;
-    border: none !important;
-    border-radius: 8px !important;
-    padding: 0.7rem 2rem !important;
-    cursor: pointer !important;
+    color: #fff !important; border: none !important; border-radius: 8px !important;
+    padding: 0.7rem 2rem !important; cursor: pointer !important;
     transition: all 0.25s ease !important;
     box-shadow: 0 2px 12px rgba(59, 130, 246, 0.25) !important;
 }
+.detect-btn:hover { box-shadow: 0 4px 20px rgba(59, 130, 246, 0.4) !important; transform: translateY(-1px) !important; }
 
-.detect-btn:hover {
-    box-shadow: 0 4px 20px rgba(59, 130, 246, 0.4) !important;
-    transform: translateY(-1px) !important;
-}
-
-/* Result label */
 .result-card {
-    background: var(--bg-card) !important;
-    border: 1px solid var(--border-subtle) !important;
-    border-radius: 10px !important;
-    padding: 1.25rem !important;
-    margin-top: 0.5rem !important;
-}
-
-.result-card .output-class {
-    font-family: 'DM Mono', monospace !important;
-}
-
-/* Label component overrides */
-.output-label {
-    background: transparent !important;
-}
-
-.output-label .label-name {
-    font-family: 'DM Mono', monospace !important;
-    font-size: 1.1rem !important;
+    background: var(--bg-card) !important; border: 1px solid var(--border-subtle) !important;
+    border-radius: 10px !important; padding: 1.25rem !important; margin-top: 0.5rem !important;
 }
+.result-card .output-class { font-family: 'DM Mono', monospace !important; }
+.output-label { background: transparent !important; }
+.output-label .label-name { font-family: 'DM Mono', monospace !important; font-size: 1.1rem !important; }
 
-/* Examples section */
 .examples-heading {
-    font-family: 'DM Mono', monospace !important;
-    font-size: 0.7rem !important;
-    text-transform: uppercase !important;
-    letter-spacing: 0.08em !important;
-    color: var(--text-muted) !important;
-    margin-top: 1.25rem !important;
-    margin-bottom: 0.5rem !important;
+    font-family: 'DM Mono', monospace !important; font-size: 0.7rem !important;
+    text-transform: uppercase !important; letter-spacing: 0.08em !important;
+    color: var(--text-muted) !important; margin-top: 1.25rem !important; margin-bottom: 0.5rem !important;
 }
-
-/* Example buttons */
-.gallery {
-    gap: 0.5rem !important;
-}
-
+.gallery { gap: 0.5rem !important; }
 .gallery .gallery-item {
-    background: var(--bg-input) !important;
-    border: 1px solid var(--border-subtle) !important;
-    border-radius: 8px !important;
-    padding: 0.75rem !important;
-    transition: border-color 0.2s ease !important;
+    background: var(--bg-input) !important; border: 1px solid var(--border-subtle) !important;
+    border-radius: 8px !important; padding: 0.75rem !important; transition: border-color 0.2s ease !important;
 }
+.gallery .gallery-item:hover { border-color: var(--text-muted) !important; }
+.preview-box textarea { color: var(--text-secondary) !important; font-size: 0.78rem !important; opacity: 0.85; }
+.gr-group, .gr-block, .gr-box, .gr-panel { background: transparent !important; border: none !important; }
+.gr-padded { padding: 0 !important; }
 
-.gallery .gallery-item:hover {
-    border-color: var(--text-muted) !important;
-}
-
-/* Preview textbox */
-.preview-box textarea {
-    color: var(--text-secondary) !important;
-    font-size: 0.78rem !important;
-    opacity: 0.85;
-}
+.info-strip { text-align: center; padding: 1.25rem 1rem; }
+.info-strip p { font-family: 'DM Mono', monospace !important; font-size: 0.68rem !important; color: var(--text-muted) !important; letter-spacing: 0.03em; }
+.info-strip a { color: var(--text-secondary) !important; text-decoration: none !important; border-bottom: 1px dotted var(--text-muted); }
 
-/* Misc */
-.gr-group, .gr-block, .gr-box, .gr-panel {
-    background: transparent !important;
-    border: none !important;
-}
-
-.gr-padded {
-    padding: 0 !important;
-}
-
-/* Info strip */
-.info-strip {
-    text-align: center;
-    padding: 1.25rem 1rem;
-}
-
-.info-strip p {
-    font-family: 'DM Mono', monospace !important;
-    font-size: 0.68rem !important;
-    color: var(--text-muted) !important;
-    letter-spacing: 0.03em;
-}
+#share-card .image-toolbar, #text-share-card .image-toolbar,
+#share-card .icon-buttons, #text-share-card .icon-buttons,
+#share-card button[aria-label], #text-share-card button[aria-label] { display: none !important; }
 
-.info-strip a {
-    color: var(--text-secondary) !important;
-    text-decoration: none !important;
-    border-bottom: 1px dotted var(--text-muted);
+.feedback-btn {
+    font-family: 'DM Mono', monospace !important; font-size: 0.75rem !important;
+    border-radius: 6px !important; padding: 0.4rem 1rem !important;
+    cursor: pointer !important; transition: all 0.2s ease !important;
 }
-
-/* Hide Gradio image toolbar (download/share/fullscreen) on result cards */
-#share-card .image-toolbar,
-#text-share-card .image-toolbar,
-#share-card .icon-buttons,
-#text-share-card .icon-buttons,
-#share-card button[aria-label],
-#text-share-card button[aria-label] {
-    display: none !important;
+.feedback-msg {
+    font-family: 'DM Mono', monospace !important; font-size: 0.75rem !important;
+    color: var(--accent-cyan) !important; padding: 0.4rem 0 !important;
 }
 """
 
@@ -321,13 +260,13 @@ AI_EXAMPLE = (
 )
 
 
+# ---------------------------------------------------------------------------
+# HTML extraction
+# ---------------------------------------------------------------------------
 class _TextExtractor(HTMLParser):
-    """Simple HTML to text extractor."""
-
     def __init__(self):
         super().__init__()
-        self._parts = []
-        self._skip = False
+        self._parts, self._skip = [], False
         self._skip_tags = {"script", "style", "nav", "header", "footer", "noscript"}
 
     def handle_starttag(self, tag, attrs):
@@ -345,13 +284,10 @@ class _TextExtractor(HTMLParser):
             self._parts.append(data)
 
     def get_text(self):
-        text = " ".join(self._parts)
-        text = re.sub(r"\s+", " ", text).strip()
-        return text
+        return re.sub(r"\s+", " ", " ".join(self._parts)).strip()
 
 
 def fetch_url(url: str) -> str:
-    """Fetch a URL and extract readable text."""
     if not url or not url.strip():
         return ""
     url = url.strip()
@@ -365,128 +301,110 @@ def fetch_url(url: str) -> str:
     return parser.get_text()
 
 
+# ---------------------------------------------------------------------------
+# Result card image
+# ---------------------------------------------------------------------------
+def make_result_card(source: str, label: str, confidence: float) -> Image.Image:
+    W, H = 800, 418
+    bg, card_bg = "#0a0e17", "#1a2234"
+    human_color, ai_color = "#10b981", "#f59e0b"
+    text_color, muted_color = "#e2e8f0", "#8892a6"
+
+    img = Image.new("RGB", (W, H), bg)
+    draw = ImageDraw.Draw(img)
+    try:
+        fl = ImageFont.truetype("/usr/share/fonts/truetype/dejavu/DejaVuSans-Bold.ttf", 32)
+        fm = ImageFont.truetype("/usr/share/fonts/truetype/dejavu/DejaVuSans.ttf", 20)
+        fs = ImageFont.truetype("/usr/share/fonts/truetype/dejavu/DejaVuSans.ttf", 14)
+        fmono = ImageFont.truetype("/usr/share/fonts/truetype/dejavu/DejaVuSansMono.ttf", 16)
+    except OSError:
+        fl = fm = fs = fmono = ImageFont.load_default()
+
+    draw.rounded_rectangle([30, 30, W - 30, H - 30], radius=16, fill=card_bg)
+    draw.text((60, 55), "AI Text Detector", fill=text_color, font=fl)
+
+    is_ai = label.lower() == "ai"
+    rc = ai_color if is_ai else human_color
+    draw.text((60, 120), "Result:", fill=muted_color, font=fm)
+    draw.text((60, 155), "AI-Generated" if is_ai else "Human-Written", fill=rc, font=fl)
+    draw.text((60, 200), f"Confidence: {confidence * 100:.1f}%", fill=text_color, font=fm)
+
+    bx, by, bw, bh = 60, 240, W - 120, 24
+    draw.rounded_rectangle([bx, by, bx + bw, by + bh], radius=12, fill="#0f1729")
+    fw = int(bw * confidence)
+    if fw > 0:
+        draw.rounded_rectangle([bx, by, bx + fw, by + bh], radius=12, fill=rc)
+
+    disp = source[:80] + "..." if len(source) > 80 else source
+    is_url = source.startswith("http") or source.startswith("www")
+    draw.text((60, 285), "URL analyzed:" if is_url else "Text analyzed:", fill=muted_color, font=fs)
+    draw.text((60, 308), disp, fill=text_color, font=fmono)
+    draw.text((60, H - 60), "adaptive-classifier-ai-detector.hf.space", fill=muted_color, font=fs)
+    return img
+
+
+# ---------------------------------------------------------------------------
+# Detection logic
+# ---------------------------------------------------------------------------
 def _error_label(msg: str) -> dict:
-    """Return an error as a valid gr.Label dict (needs numeric values)."""
     return {msg: 1.0}
 
 
-def detect_text(text: str) -> dict:
-    """Classify text as human-written or AI-generated (label only)."""
+def _classify(text: str) -> dict:
     if not text or len(text.strip().split()) < 10:
         return _error_label("Please enter at least a few sentences (~50 words)")
     predictions = classifier.predict(text, k=2)
     return {label: round(score, 4) for label, score in predictions}
 
 
-def detect_text_full(text: str) -> tuple[dict, str, Image.Image | None]:
-    """Classify text and generate share link + card."""
-    result = detect_text(text)
-    if len(result) != 2 or any(k.startswith("Please") for k in result):
-        return result, "", None
-    # Share link with text snippet as param
-    snippet = text.strip()[:200]
-    share_link = f"{SPACE_URL}/?text={urllib.parse.quote(snippet, safe='')}"
-    # Card image
+def detect_text_full(text: str):
+    """Returns (result, share_link, card, pred_id)"""
+    result = _classify(text)
+    if any(k.startswith("Please") for k in result):
+        return result, "", None, ""
     top_label = max(result, key=result.get)
+    pred_id = uuid4().hex[:12]
+    save_prediction(pred_id, text, "", top_label, result[top_label])
+    share_link = f"{SPACE_URL}/?id={pred_id}"
     preview = text.strip()[:80] + ("..." if len(text.strip()) > 80 else "")
     card = make_result_card(preview, top_label, result[top_label])
-    return result, share_link, card
-
-
-SPACE_URL = "https://adaptive-classifier-ai-detector.hf.space"
-
-
-def make_result_card(url: str, label: str, confidence: float) -> Image.Image:
-    """Generate a shareable result card image."""
-    W, H = 800, 418  # Twitter card ratio ~1.91:1
-    bg = "#0a0e17"
-    card_bg = "#1a2234"
-    human_color = "#10b981"
-    ai_color = "#f59e0b"
-    text_color = "#e2e8f0"
-    muted_color = "#8892a6"
-
-    img = Image.new("RGB", (W, H), bg)
-    draw = ImageDraw.Draw(img)
-
-    # Use default font (always available)
-    try:
-        font_large = ImageFont.truetype("/usr/share/fonts/truetype/dejavu/DejaVuSans-Bold.ttf", 32)
-        font_med = ImageFont.truetype("/usr/share/fonts/truetype/dejavu/DejaVuSans.ttf", 20)
-        font_small = ImageFont.truetype("/usr/share/fonts/truetype/dejavu/DejaVuSans.ttf", 14)
-        font_mono = ImageFont.truetype("/usr/share/fonts/truetype/dejavu/DejaVuSansMono.ttf", 16)
-    except OSError:
-        font_large = ImageFont.load_default()
-        font_med = font_large
-        font_small = font_large
-        font_mono = font_large
-
-    # Card background
-    draw.rounded_rectangle([30, 30, W - 30, H - 30], radius=16, fill=card_bg)
-
-    # Title
-    draw.text((60, 55), "AI Text Detector", fill=text_color, font=font_large)
-
-    # Result
-    is_ai = label.lower() == "ai"
-    result_color = ai_color if is_ai else human_color
-    result_text = "AI-Generated" if is_ai else "Human-Written"
-    pct = f"{confidence * 100:.1f}%"
-
-    draw.text((60, 120), "Result:", fill=muted_color, font=font_med)
-    draw.text((60, 155), result_text, fill=result_color, font=font_large)
-    draw.text((60, 200), f"Confidence: {pct}", fill=text_color, font=font_med)
-
-    # Confidence bar
-    bar_x, bar_y, bar_w, bar_h = 60, 240, W - 120, 24
-    draw.rounded_rectangle([bar_x, bar_y, bar_x + bar_w, bar_y + bar_h], radius=12, fill="#0f1729")
-    fill_w = int(bar_w * confidence)
-    if fill_w > 0:
-        draw.rounded_rectangle([bar_x, bar_y, bar_x + fill_w, bar_y + bar_h], radius=12, fill=result_color)
-
-    # Source text/URL
-    display_src = url[:80] + "..." if len(url) > 80 else url
-    is_url = url.startswith("http") or url.startswith("www")
-    src_label = "URL analyzed:" if is_url else "Text analyzed:"
-    draw.text((60, 285), src_label, fill=muted_color, font=font_small)
-    draw.text((60, 308), display_src, fill=text_color, font=font_mono)
-
-    # Footer
-    draw.text((60, H - 60), "adaptive-classifier-ai-detector.hf.space", fill=muted_color, font=font_small)
-
-    return img
+    return result, share_link, card, pred_id
 
 
-def detect_url(url: str) -> tuple[dict, str, str, Image.Image | None]:
-    """Fetch a URL and classify its text content."""
+def detect_url_full(url: str):
+    """Returns (result, preview_text, share_link, card, pred_id)"""
     if not url or not url.strip():
-        return _error_label("Please enter a URL"), "", "", None
+        return _error_label("Please enter a URL"), "", "", None, ""
     try:
         text = fetch_url(url)
     except Exception as e:
-        return _error_label(f"Could not fetch URL: {e}"), "", "", None
-    # Detect JS-only pages that return no usable content
+        return _error_label(f"Could not fetch URL: {e}"), "", "", None, ""
     js_hints = ["javascript is not available", "enable javascript", "javascript is disabled",
                 "please enable js", "requires javascript", "noscript",
                 "if you are not redirected", "please click here"]
     text_lower = text.lower()
-    if any(h in text_lower for h in js_hints) or len(text.split()) < 10:
-        if any(h in text_lower for h in js_hints):
-            return _error_label("This site requires JavaScript to load content (e.g. Twitter/X, SPAs). Try a different URL or paste the text directly."), "", "", None
-        return _error_label("Not enough readable text found at that URL"), text[:500], "", None
+    if any(h in text_lower for h in js_hints):
+        return _error_label("This site requires JavaScript (e.g. Twitter/X). Paste the text directly instead."), "", "", None, ""
+    if len(text.split()) < 10:
+        return _error_label("Not enough readable text found at that URL"), text[:500], "", None, ""
     words = text.split()
     if len(words) > 2000:
         text = " ".join(words[:2000])
-    result = detect_text(text)
-    preview = text[:1500] + ("..." if len(text) > 1500 else "")
-    share_link = f"{SPACE_URL}/?url={urllib.parse.quote(url.strip(), safe='')}"
-    # Generate share card image
+    result = _classify(text)
+    if any(k.startswith("Please") or k.startswith("Not enough") for k in result):
+        return result, text[:500], "", None, ""
     top_label = max(result, key=result.get)
-    card_img = make_result_card(url.strip(), top_label, result[top_label])
-    return result, preview, share_link, card_img
-
+    pred_id = uuid4().hex[:12]
+    save_prediction(pred_id, text, url.strip(), top_label, result[top_label])
+    preview = text[:1500] + ("..." if len(text) > 1500 else "")
+    share_link = f"{SPACE_URL}/?id={pred_id}"
+    card = make_result_card(url.strip(), top_label, result[top_label])
+    return result, preview, share_link, card, pred_id
 
 
+# ---------------------------------------------------------------------------
+# UI
+# ---------------------------------------------------------------------------
 with gr.Blocks(css=CSS, title="AI Text Detector", theme=gr.themes.Base()) as demo:
 
     gr.HTML("""
@@ -502,170 +420,137 @@ with gr.Blocks(css=CSS, title="AI Text Detector", theme=gr.themes.Base()) as dem
     """)
 
     with gr.Tabs() as tabs:
+        # ---- TEXT TAB ----
         with gr.TabItem("Text", id="text-tab"):
             with gr.Group(elem_classes="input-card"):
-                text_input = gr.Textbox(
-                    lines=7,
-                    placeholder="Paste text here to analyze...",
-                    label="Input Text",
-                    show_label=True,
-                )
+                text_input = gr.Textbox(lines=7, placeholder="Paste text here to analyze...", label="Input Text", show_label=True)
                 text_btn = gr.Button("Analyze", variant="primary", elem_classes="detect-btn")
 
             with gr.Group(elem_classes="result-card"):
                 text_output = gr.Label(num_top_classes=2, label="Result")
+                text_pred_id = gr.Textbox(visible=False, elem_id="text-pred-id")
+                # Feedback
+                with gr.Row(visible=False) as text_fb_row:
+                    text_fb_up = gr.Button("Correct", size="sm", elem_classes="feedback-btn")
+                    text_fb_down = gr.Button("Incorrect", size="sm", elem_classes="feedback-btn")
+                text_fb_msg = gr.HTML(visible=False, elem_classes="feedback-msg")
+                # Share
                 text_share_link = gr.Textbox(visible=False, elem_id="text-share-url")
                 with gr.Row(visible=False) as text_share_row:
                     text_copy_link_btn = gr.Button("Copy Link", size="sm", elem_classes="detect-btn")
                     text_copy_img_btn = gr.Button("Copy Image", size="sm", elem_classes="detect-btn")
                     text_dl_img_btn = gr.Button("Download Image", size="sm", elem_classes="detect-btn")
-                text_share_card = gr.Image(
-                    label="Result card",
-                    visible=False,
-                    type="pil",
-                    elem_id="text-share-card",
-                )
+                text_share_card = gr.Image(label="Result card", visible=False, type="pil", elem_id="text-share-card")
 
-            def run_text_detection(text):
-                result, link, card = detect_text_full(text)
-                has_result = bool(link)
+            def run_text(text):
+                result, link, card, pid = detect_text_full(text)
+                has = bool(link)
                 return (
-                    result,
-                    gr.update(value=link, visible=has_result),
-                    gr.update(visible=has_result),
-                    gr.update(value=card, visible=has_result),
+                    result, gr.update(value=pid, visible=False),
+                    gr.update(visible=has), gr.update(visible=False),
+                    gr.update(value=link, visible=has), gr.update(visible=has),
+                    gr.update(value=card, visible=has),
                 )
 
             text_btn.click(
-                fn=run_text_detection,
-                inputs=text_input,
-                outputs=[text_output, text_share_link, text_share_row, text_share_card],
+                fn=run_text, inputs=text_input,
+                outputs=[text_output, text_pred_id, text_fb_row, text_fb_msg, text_share_link, text_share_row, text_share_card],
                 api_name="detect",
             )
 
-            text_copy_link_btn.click(
-                fn=None, inputs=text_share_link, outputs=None,
-                js="(url) => { navigator.clipboard.writeText(url); }",
-            )
-            text_copy_img_btn.click(
-                fn=None, inputs=None, outputs=None,
-                js="""() => {
-                    const img = document.querySelector('#text-share-card img');
-                    if (img) {
-                        const c = document.createElement('canvas');
-                        c.width = img.naturalWidth; c.height = img.naturalHeight;
-                        c.getContext('2d').drawImage(img, 0, 0);
-                        c.toBlob(b => navigator.clipboard.write([new ClipboardItem({'image/png': b})]), 'image/png');
-                    }
-                }""",
-            )
-            text_dl_img_btn.click(
-                fn=None, inputs=None, outputs=None,
-                js="""() => {
-                    const img = document.querySelector('#text-share-card img');
-                    if (img) {
-                        const a = document.createElement('a');
-                        a.href = img.src; a.download = 'ai-detector-result.png';
-                        a.click();
-                    }
-                }""",
-            )
+            def text_fb_positive(pid):
+                if pid:
+                    save_feedback(pid, "correct")
+                return gr.update(visible=False), gr.update(value='<span class="feedback-msg">Thanks for your feedback!</span>', visible=True)
+
+            def text_fb_negative(pid):
+                if pid:
+                    save_feedback(pid, "incorrect")
+                return gr.update(visible=False), gr.update(value='<span class="feedback-msg">Thanks for your feedback!</span>', visible=True)
+
+            text_fb_up.click(fn=text_fb_positive, inputs=text_pred_id, outputs=[text_fb_row, text_fb_msg])
+            text_fb_down.click(fn=text_fb_negative, inputs=text_pred_id, outputs=[text_fb_row, text_fb_msg])
+
+            text_copy_link_btn.click(fn=None, inputs=text_share_link, js="(u) => { navigator.clipboard.writeText(u); }")
+            text_copy_img_btn.click(fn=None, js="""() => {
+                const img = document.querySelector('#text-share-card img');
+                if (img) { const c = document.createElement('canvas'); c.width = img.naturalWidth; c.height = img.naturalHeight;
+                c.getContext('2d').drawImage(img, 0, 0);
+                c.toBlob(b => navigator.clipboard.write([new ClipboardItem({'image/png': b})]), 'image/png'); }
+            }""")
+            text_dl_img_btn.click(fn=None, js="""() => {
+                const img = document.querySelector('#text-share-card img');
+                if (img) { const a = document.createElement('a'); a.href = img.src; a.download = 'ai-detector-result.png'; a.click(); }
+            }""")
 
             gr.HTML('<div class="examples-heading">Try an example</div>')
-            gr.Examples(
-                examples=[[HUMAN_EXAMPLE], [AI_EXAMPLE]],
-                inputs=text_input,
-                label="",
-            )
+            gr.Examples(examples=[[HUMAN_EXAMPLE], [AI_EXAMPLE]], inputs=text_input, label="")
 
+        # ---- URL TAB ----
         with gr.TabItem("URL", id="url-tab"):
             with gr.Group(elem_classes="input-card"):
-                url_input = gr.Textbox(
-                    lines=1,
-                    placeholder="https://example.com/article",
-                    label="Web Page URL",
-                    show_label=True,
-                )
+                url_input = gr.Textbox(lines=1, placeholder="https://example.com/article", label="Web Page URL", show_label=True)
                 url_btn = gr.Button("Fetch & Analyze", variant="primary", elem_classes="detect-btn")
 
             with gr.Group(elem_classes="result-card"):
                 url_output = gr.Label(num_top_classes=2, label="Result")
+                url_pred_id = gr.Textbox(visible=False, elem_id="url-pred-id")
+                # Feedback
+                with gr.Row(visible=False) as url_fb_row:
+                    url_fb_up = gr.Button("Correct", size="sm", elem_classes="feedback-btn")
+                    url_fb_down = gr.Button("Incorrect", size="sm", elem_classes="feedback-btn")
+                url_fb_msg = gr.HTML(visible=False, elem_classes="feedback-msg")
+                # Share
                 share_link = gr.Textbox(visible=False, elem_id="share-url")
                 with gr.Row(visible=False) as share_row:
                     copy_link_btn = gr.Button("Copy Link", size="sm", elem_classes="detect-btn")
                     copy_img_btn = gr.Button("Copy Image", size="sm", elem_classes="detect-btn")
                     dl_img_btn = gr.Button("Download Image", size="sm", elem_classes="detect-btn")
-                share_card = gr.Image(
-                    label="Result card",
-                    visible=False,
-                    type="pil",
-                    elem_id="share-card",
-                )
+                share_card = gr.Image(label="Result card", visible=False, type="pil", elem_id="share-card")
 
             with gr.Group(elem_classes="input-card"):
-                url_preview = gr.Textbox(
-                    label="Extracted Text",
-                    lines=5,
-                    interactive=False,
-                    elem_classes="preview-box",
-                )
+                url_preview = gr.Textbox(label="Extracted Text", lines=5, interactive=False, elem_classes="preview-box")
 
-            def run_url_detection(url):
-                result, preview, link, card = detect_url(url)
-                has_result = bool(link)
+            def run_url(url):
+                result, preview, link, card, pid = detect_url_full(url)
+                has = bool(link)
                 return (
-                    result,
-                    gr.update(value=link, visible=has_result),
-                    gr.update(visible=has_result),
-                    gr.update(value=card, visible=has_result),
-                    preview,
+                    result, gr.update(value=pid, visible=False),
+                    gr.update(visible=has), gr.update(visible=False),
+                    gr.update(value=link, visible=has), gr.update(visible=has),
+                    gr.update(value=card, visible=has), preview,
                 )
 
             url_btn.click(
-                fn=run_url_detection,
-                inputs=url_input,
-                outputs=[url_output, share_link, share_row, share_card, url_preview],
+                fn=run_url, inputs=url_input,
+                outputs=[url_output, url_pred_id, url_fb_row, url_fb_msg, share_link, share_row, share_card, url_preview],
                 api_name="detect_url",
             )
 
-            # Copy link to clipboard via JS
-            copy_link_btn.click(
-                fn=None,
-                inputs=share_link,
-                outputs=None,
-                js="(url) => { navigator.clipboard.writeText(url); }",
-            )
-
-            # Copy image to clipboard via JS
-            copy_img_btn.click(
-                fn=None,
-                inputs=None,
-                outputs=None,
-                js="""() => {
-                    const img = document.querySelector('#share-card img');
-                    if (img) {
-                        const canvas = document.createElement('canvas');
-                        canvas.width = img.naturalWidth;
-                        canvas.height = img.naturalHeight;
-                        canvas.getContext('2d').drawImage(img, 0, 0);
-                        canvas.toBlob(blob => {
-                            navigator.clipboard.write([new ClipboardItem({'image/png': blob})]);
-                        }, 'image/png');
-                    }
-                }""",
-            )
-
-            dl_img_btn.click(
-                fn=None, inputs=None, outputs=None,
-                js="""() => {
-                    const img = document.querySelector('#share-card img');
-                    if (img) {
-                        const a = document.createElement('a');
-                        a.href = img.src; a.download = 'ai-detector-result.png';
-                        a.click();
-                    }
-                }""",
-            )
+            def url_fb_positive(pid):
+                if pid:
+                    save_feedback(pid, "correct")
+                return gr.update(visible=False), gr.update(value='<span class="feedback-msg">Thanks for your feedback!</span>', visible=True)
+
+            def url_fb_negative(pid):
+                if pid:
+                    save_feedback(pid, "incorrect")
+                return gr.update(visible=False), gr.update(value='<span class="feedback-msg">Thanks for your feedback!</span>', visible=True)
+
+            url_fb_up.click(fn=url_fb_positive, inputs=url_pred_id, outputs=[url_fb_row, url_fb_msg])
+            url_fb_down.click(fn=url_fb_negative, inputs=url_pred_id, outputs=[url_fb_row, url_fb_msg])
+
+            copy_link_btn.click(fn=None, inputs=share_link, js="(u) => { navigator.clipboard.writeText(u); }")
+            copy_img_btn.click(fn=None, js="""() => {
+                const img = document.querySelector('#share-card img');
+                if (img) { const c = document.createElement('canvas'); c.width = img.naturalWidth; c.height = img.naturalHeight;
+                c.getContext('2d').drawImage(img, 0, 0);
+                c.toBlob(b => navigator.clipboard.write([new ClipboardItem({'image/png': b})]), 'image/png'); }
+            }""")
+            dl_img_btn.click(fn=None, js="""() => {
+                const img = document.querySelector('#share-card img');
+                if (img) { const a = document.createElement('a'); a.href = img.src; a.download = 'ai-detector-result.png'; a.click(); }
+            }""")
 
             gr.HTML('<div class="examples-heading">Try an example</div>')
             gr.Examples(
@@ -673,11 +558,9 @@ with gr.Blocks(css=CSS, title="AI Text Detector", theme=gr.themes.Base()) as dem
                     ["https://en.wikipedia.org/wiki/Constitution_of_the_United_States"],
                     ["https://garryslist.org/posts/richmond-just-voted-to-reinstate-their-flock-cameras-after-crime-spiked"],
                 ],
-                inputs=url_input,
-                label="",
+                inputs=url_input, label="",
             )
 
-
     gr.HTML("""
     <div class="info-strip">
         <p>
@@ -690,44 +573,69 @@ with gr.Blocks(css=CSS, title="AI Text Detector", theme=gr.themes.Base()) as dem
     </div>
     """)
 
+    # Handle ?id= and ?url= share links on page load
     def _on_load(request: gr.Request):
-        text_param = request.query_params.get("text", "")
+        pred_id = request.query_params.get("id", "")
         url_param = request.query_params.get("url", "")
-        # Default: no changes
-        no_change = (
-            gr.update(), "", {}, gr.update(visible=False), gr.update(visible=False), gr.update(visible=False),
-            "", {}, gr.update(visible=False), gr.update(visible=False), gr.update(visible=False), "",
-        )
-        if text_param:
-            result, link, card = detect_text_full(text_param)
-            has = bool(link)
-            return (
-                gr.update(selected="text-tab"),
-                text_param, result,
-                gr.update(value=link, visible=has), gr.update(visible=has), gr.update(value=card, visible=has),
-                "", {}, gr.update(visible=False), gr.update(visible=False), gr.update(visible=False), "",
-            )
+
+        # Defaults for all outputs (13 total)
+        d = gr.update()
+        n = ""
+        hide = gr.update(visible=False)
+        empty = {}
+        defaults = (d, n, empty, hide, hide, hide, n, hide, hide, n, empty, hide, hide, hide, hide, hide, n)
+
+        if pred_id and pred_id in _predictions:
+            rec = _predictions[pred_id]
+            result = {rec["prediction"]: rec["confidence"]}
+            other = "human" if rec["prediction"] == "ai" else "ai"
+            result[other] = round(1.0 - rec["confidence"], 4)
+            source = rec["url"] or rec["text"][:80] + "..."
+            card = make_result_card(source, rec["prediction"], rec["confidence"])
+            link = f"{SPACE_URL}/?id={pred_id}"
+            if rec["url"]:
+                return (
+                    gr.update(selected="url-tab"),
+                    n, empty, hide, hide, hide, n, hide, hide,
+                    rec["url"], result, gr.update(value=pred_id, visible=False),
+                    gr.update(visible=True), hide,
+                    gr.update(value=link, visible=True), gr.update(visible=True),
+                    gr.update(value=card, visible=True), rec["text"][:1500],
+                )
+            else:
+                return (
+                    gr.update(selected="text-tab"),
+                    rec["text"], result, gr.update(value=pred_id, visible=False),
+                    gr.update(visible=True), hide,
+                    gr.update(value=link, visible=True), gr.update(visible=True),
+                    gr.update(value=card, visible=True),
+                    n, empty, hide, hide, hide, hide, hide, hide, n,
+                )
+
         if url_param:
-            result, preview, link, card = detect_url(url_param)
+            result, preview, link, card, pid = detect_url_full(url_param)
             has = bool(link)
             return (
                 gr.update(selected="url-tab"),
-                "", {}, gr.update(visible=False), gr.update(visible=False), gr.update(visible=False),
-                url_param, result,
-                gr.update(value=link, visible=has), gr.update(visible=has), gr.update(value=card, visible=has),
-                preview,
+                n, empty, hide, hide, hide, n, hide, hide,
+                url_param, result, gr.update(value=pid, visible=False),
+                gr.update(visible=has), hide,
+                gr.update(value=link, visible=has), gr.update(visible=has),
+                gr.update(value=card, visible=has), preview,
             )
-        return no_change
+
+        return defaults
 
     demo.load(
-        fn=_on_load,
-        inputs=None,
+        fn=_on_load, inputs=None,
         outputs=[
             tabs,
-            # text tab outputs
-            text_input, text_output, text_share_link, text_share_row, text_share_card,
-            # url tab outputs
-            url_input, url_output, share_link, share_row, share_card, url_preview,
+            # text tab
+            text_input, text_output, text_pred_id, text_fb_row, text_fb_msg,
+            text_share_link, text_share_row, text_share_card,
+            # url tab
+            url_input, url_output, url_pred_id, url_fb_row, url_fb_msg,
+            share_link, share_row, share_card, url_preview,
         ],
     )