chore(webui): remove timeline animation page

The animated t-SNE 'embedding landscape' added no real analytical value and
its cumulative-by-month logic was inherently confusing (ancient drafts
appearing late in the animation). Removed entirely rather than maintained.

Drops the /timeline route, template, nav link, data builder
(get_timeline_animation_data / _compute_timeline_animation_data) and its test.
The Overview mini-timeline and /api/timeline (separate features) are untouched.

src/webui/blueprints/pages.py

@@ -11,7 +11,6 @@ from webui.data import (
     get_draft_detail,
     get_rating_distributions,
     get_timeline_data,
-    get_timeline_animation_data,
     get_ideas_by_type,
     get_top_authors,
     get_org_data,
@@ -127,12 +126,6 @@ def ratings():
     )
 
 
-@pages_bp.route("/timeline")
-def timeline_animation():
-    data = get_timeline_animation_data(db())
-    return render_template("timeline.html", animation=data)
-
-
 @pages_bp.route("/idea-clusters")
 def idea_clusters():
     data = get_idea_clusters(db())

src/webui/data/__init__.py

@@ -69,7 +69,6 @@ from webui.data.analysis import (  # noqa: F401
     get_timeline_data,
     get_similarity_graph,
     get_idea_clusters,
-    get_timeline_animation_data,
     get_monitor_status,
     get_citation_graph,
     get_landscape_tsne,

src/webui/data/analysis.py

@@ -502,81 +502,6 @@ def _compute_idea_clusters(db: Database) -> dict:
         "empty": False,
     }
 
-def get_timeline_animation_data(db: Database) -> dict:
-    """Timeline animation (cached for 5 min)."""
-    return _cached("timeline_animation", lambda: _compute_timeline_animation_data(db))
-
-def _compute_timeline_animation_data(db: Database) -> dict:
-    """Compute t-SNE on all drafts, return points with month info + category_monthly.
-
-    t-SNE is computed once on ALL drafts so coordinates are stable across
-    animation frames.  Each point carries a ``month`` field (YYYY-MM) so the
-    front-end can build cumulative animation frames.
-    """
-
-
-    embeddings = db.all_embeddings()
-    if len(embeddings) < 5:
-        return {"points": [], "months": [], "category_monthly": {}}
-
-    pairs = db.drafts_with_ratings(limit=1000)
-    rating_map = {d.name: r for d, r in pairs}
-    draft_map = {d.name: d for d, _ in pairs}
-
-    # Filter to drafts that have both embeddings and ratings
-    names = [n for n in embeddings if n in rating_map]
-    if len(names) < 5:
-        return {"points": [], "months": [], "category_monthly": {}}
-
-    matrix = np.array([embeddings[n] for n in names])
-
-    try:
-        tsne = TSNE(n_components=2, perplexity=min(30, len(names) - 1),
-                     random_state=42, max_iter=500)
-        coords = tsne.fit_transform(matrix)
-    except Exception:
-        return {"points": [], "months": [], "category_monthly": {}}
-
-    # Build points with month
-    points = []
-    month_set: set[str] = set()
-    category_monthly: dict[str, dict[str, int]] = defaultdict(lambda: defaultdict(int))
-
-    for i, name in enumerate(names):
-        r = rating_map[name]
-        d = draft_map.get(name)
-        month = _extract_month(d.time if d else None)
-        if month == "unknown":
-            continue  # Undated docs (e.g. ISO/ETSI) can't be placed on a temporal animation
-        cat = r.categories[0] if r.categories else "Other"
-        month_set.add(month)
-        category_monthly[month][cat] += 1
-        points.append({
-            "name": name,
-            "title": d.title if d else name,
-            "x": round(float(coords[i, 0]), 3),
-            "y": round(float(coords[i, 1]), 3),
-            "category": cat,
-            "score": round(r.composite_score, 2),
-            "month": month,
-        })
-
-    # Deliver points in chronological order so the front-end's cumulative
-    # filter (p.month <= frame) is append-only.  Otherwise new points get
-    # inserted mid-array and Plotly's index-based frame transition animates
-    # existing markers flying to other drafts' coordinates ("jumping points").
-    points.sort(key=lambda p: (p["month"], p["name"]))
-
-    months = sorted(month_set)
-    # Convert defaultdict to plain dict for JSON
-    cat_monthly_plain = {m: dict(cats) for m, cats in category_monthly.items()}
-
-    return {
-        "points": points,
-        "months": months,
-        "category_monthly": cat_monthly_plain,
-    }
-
 def get_monitor_status(db: Database) -> MonitorStatus:
     """Return monitoring status data for dashboard."""
     runs = db.get_monitor_runs(limit=20)

src/webui/templates/base.html

@@ -156,10 +156,6 @@
                 Blog Drafts
             </a>
             {% endif %}
-            <a href="/timeline" class="sidebar-link flex items-center gap-3 px-5 py-2.5 text-sm text-slate-300 {{ 'active' if active_page == 'timeline' }}">
-                <svg class="w-4 h-4 opacity-60" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>
-                Timeline
-            </a>
             {% if is_admin %}
             <a href="/trends" class="sidebar-link flex items-center gap-3 px-5 py-2.5 text-sm text-slate-300 {{ 'active' if active_page == 'trends' }}">
                 <svg class="w-4 h-4 opacity-60" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 7h8m0 0v8m0-8l-8 8-4-4-6 6"/></svg>

src/webui/templates/timeline.html

@@ -1,263 +0,0 @@
-{% extends "base.html" %}
-{% set active_page = "timeline" %}
-
-{% block title %}Timeline — IETF Draft Analyzer{% endblock %}
-
-{% block extra_head %}<script src="/static/js/plotly.min.js"></script>{% endblock %}
-
-{% block content %}
-<div class="mb-6">
-    <h1 class="text-2xl font-bold text-white">Timeline Animation</h1>
-    <p class="text-slate-400 text-sm mt-1">Watch the AI/agent draft landscape evolve month by month</p>
-</div>
-
-<!-- Stats summary -->
-<div class="grid grid-cols-3 gap-4 mb-6" id="statCards">
-</div>
-
-<!-- Animated t-SNE map -->
-<div class="bg-slate-900 rounded-xl border border-slate-800 p-5 mb-6" id="tsneSection">
-    <h2 class="text-sm font-semibold text-slate-300 mb-1">Animated Embedding Landscape</h2>
-    <p class="text-xs text-slate-500 mb-3">t-SNE projection with cumulative drafts per month. Color = category, size = composite score. Press Play to animate.</p>
-    <div id="monthBadge" class="text-center mb-2">
-        <span class="inline-block bg-slate-800 border border-slate-700 rounded-lg px-4 py-1.5 text-sm font-mono text-blue-400"></span>
-    </div>
-    <div id="tsneAnim" style="height: 560px;"></div>
-</div>
-
-<!-- Stacked area chart -->
-<div class="bg-slate-900 rounded-xl border border-slate-800 p-5 mb-6">
-    <h2 class="text-sm font-semibold text-slate-300 mb-1">Category Submissions Over Time</h2>
-    <p class="text-xs text-slate-500 mb-3">Stacked area chart showing draft submissions by category per month.</p>
-    <div id="stackedArea" style="height: 400px;"></div>
-</div>
-{% endblock %}
-
-{% block extra_scripts %}
-<script>
-const PLOTLY_LAYOUT = {
-    paper_bgcolor: 'transparent', plot_bgcolor: 'rgba(15,23,42,0.5)',
-    font: { color: '#94a3b8', family: 'Inter, system-ui, sans-serif', size: 12 },
-    margin: { t: 20, r: 20, b: 50, l: 50 },
-    xaxis: { gridcolor: '#1e293b', zerolinecolor: '#334155' },
-    yaxis: { gridcolor: '#1e293b', zerolinecolor: '#334155' },
-};
-const CFG = { responsive: true, displayModeBar: false };
-
-const PALETTE = [
-    '#3b82f6', '#ef4444', '#22c55e', '#a855f7', '#f59e0b',
-    '#06b6d4', '#ec4899', '#84cc16', '#f97316', '#8b5cf6',
-    '#14b8a6', '#e11d48', '#64748b', '#eab308', '#6366f1',
-];
-
-const animData = {{ animation | tojson }};
-const points = animData.points;
-const months = animData.months;
-const catMonthly = animData.category_monthly;
-
-const MONTH_NAMES = ['Jan','Feb','Mar','Apr','May','Jun','Jul','Aug','Sep','Oct','Nov','Dec'];
-function fmtMonth(ym) {
-    if (!ym) return ym;
-    let y, m;
-    if (ym.includes('-')) {
-        [y, m] = ym.split('-');
-    } else if (ym.length >= 6) {
-        y = ym.slice(0, 4);
-        m = ym.slice(4, 6);
-    } else {
-        return ym;
-    }
-    const mi = parseInt(m, 10) - 1;
-    return (MONTH_NAMES[mi] || m) + ' ' + y;
-}
-
-if (points.length > 0 && months.length > 0) {
-
-    // --- Stat cards ---
-    const firstMonth = months[0];
-    const lastMonth = months[months.length - 1];
-    const allCats = [...new Set(points.map(p => p.category))];
-    document.getElementById('statCards').innerHTML = `
-        <div class="stat-card rounded-xl border border-slate-800 p-5 relative overflow-hidden">
-            <div class="absolute top-0 left-0 w-full h-1 bg-gradient-to-r from-blue-500 to-blue-400"></div>
-            <div class="text-3xl font-bold text-blue-400">${months.length}</div>
-            <div class="text-xs text-slate-400 mt-1 uppercase tracking-wider">Months Span</div>
-            <div class="text-xs text-slate-500 mt-0.5">${fmtMonth(firstMonth)} – ${fmtMonth(lastMonth)}</div>
-        </div>
-        <div class="stat-card rounded-xl border border-slate-800 p-5 relative overflow-hidden">
-            <div class="absolute top-0 left-0 w-full h-1 bg-gradient-to-r from-emerald-500 to-emerald-400"></div>
-            <div class="text-3xl font-bold text-emerald-400">${points.length}</div>
-            <div class="text-xs text-slate-400 mt-1 uppercase tracking-wider">Total Drafts</div>
-        </div>
-        <div class="stat-card rounded-xl border border-slate-800 p-5 relative overflow-hidden">
-            <div class="absolute top-0 left-0 w-full h-1 bg-gradient-to-r from-purple-500 to-purple-400"></div>
-            <div class="text-3xl font-bold text-purple-400">${allCats.length}</div>
-            <div class="text-xs text-slate-400 mt-1 uppercase tracking-wider">Categories</div>
-        </div>
-    `;
-
-    // --- Build category list sorted by frequency ---
-    const catCounts = {};
-    points.forEach(p => { catCounts[p.category] = (catCounts[p.category] || 0) + 1; });
-    const catList = Object.keys(catCounts).sort((a, b) => catCounts[b] - catCounts[a]);
-    const catColor = {};
-    catList.forEach((c, i) => { catColor[c] = PALETTE[i % PALETTE.length]; });
-
-    // --- Helper: build traces for points up to a given month ---
-    function buildTraces(upToMonth) {
-        const filtered = points.filter(p => p.month <= upToMonth);
-        const groups = {};
-        filtered.forEach(p => {
-            if (!groups[p.category]) groups[p.category] = { x: [], y: [], size: [], text: [], names: [] };
-            groups[p.category].x.push(p.x);
-            groups[p.category].y.push(p.y);
-            groups[p.category].size.push(Math.max(p.score * 4, 6));
-            groups[p.category].text.push(p.title);
-            groups[p.category].names.push(p.name);
-        });
-        return catList.map(cat => {
-            const g = groups[cat] || { x: [], y: [], size: [], text: [], names: [] };
-            return {
-                x: g.x, y: g.y, text: g.text, name: cat,
-                customdata: g.names,
-                mode: 'markers', type: 'scatter',
-                marker: {
-                    size: g.size,
-                    color: catColor[cat],
-                    opacity: 0.8,
-                    line: { width: 0.5, color: 'rgba(255,255,255,0.15)' },
-                },
-                hovertemplate: '<b>%{text}</b><extra>' + cat + '</extra>',
-            };
-        });
-    }
-
-    // --- Build frames ---
-    const frames = months.map(month => {
-        const cumCount = points.filter(p => p.month <= month).length;
-        return {
-            name: month,
-            data: buildTraces(month),
-        };
-    });
-
-    // --- Initial plot: show the FULL landscape (last frame) so the page
-    //     doesn't open on the near-empty earliest month. Play replays from
-    //     the start to animate the build-up. ---
-    const initMonth = months[months.length - 1];
-    const initTraces = buildTraces(initMonth);
-    const initCount = points.length;
-
-    // Slider steps
-    const sliderSteps = months.map(month => ({
-        method: 'animate',
-        label: fmtMonth(month),
-        args: [[month], { frame: { duration: 500, redraw: true }, transition: { duration: 300 }, mode: 'immediate' }],
-    }));
-
-    const layout = {
-        ...PLOTLY_LAYOUT,
-        xaxis: { visible: false, showgrid: false, zeroline: false },
-        yaxis: { visible: false, showgrid: false, zeroline: false },
-        legend: { font: { size: 10, color: '#94a3b8' }, bgcolor: 'transparent' },
-        hovermode: 'closest',
-        margin: { t: 40, r: 20, b: 60, l: 20 },
-        updatemenus: [{
-            type: 'buttons', showactive: false, x: 0.05, y: 1.08,
-            buttons: [
-                {
-                    label: '&#9654; Play',
-                    method: 'animate',
-                    args: [null, { frame: { duration: 500, redraw: true }, transition: { duration: 300 }, fromcurrent: false }]
-                },
-                {
-                    label: '&#9724; Pause',
-                    method: 'animate',
-                    args: [[null], { frame: { duration: 0, redraw: true }, mode: 'immediate' }]
-                }
-            ]
-        }],
-        sliders: [{
-            active: months.length - 1,
-            steps: sliderSteps,
-            x: 0.05, len: 0.9,
-            xanchor: 'left',
-            y: -0.02,
-            yanchor: 'top',
-            pad: { t: 30, b: 10 },
-            currentvalue: { visible: false },
-            transition: { duration: 300 },
-            font: { size: 9, color: '#64748b' },
-            bgcolor: '#1e293b',
-            activebgcolor: '#3b82f6',
-            bordercolor: '#334155',
-            borderwidth: 1,
-            ticklen: 4,
-            tickcolor: '#475569',
-        }],
-    };
-
-    Plotly.newPlot('tsneAnim', initTraces, layout, CFG).then(() => {
-        Plotly.addFrames('tsneAnim', frames);
-    });
-
-    // Update badge on animation frame
-    const badge = document.querySelector('#monthBadge span');
-    badge.textContent = `${fmtMonth(initMonth)} — ${initCount} drafts`;
-
-    document.getElementById('tsneAnim').on('plotly_animatingframe', function(ev) {
-        const month = ev.name;
-        const cumCount = points.filter(p => p.month <= month).length;
-        badge.textContent = `${fmtMonth(month)} — ${cumCount} drafts`;
-    });
-
-    // Click to navigate
-    document.getElementById('tsneAnim').on('plotly_click', function(data) {
-        const pt = data.points[0];
-        if (pt.customdata) {
-            window.location.href = '/drafts/' + pt.customdata;
-        }
-    });
-
-    // --- Stacked area chart ---
-    // Collect all categories across all months
-    const areaCats = {};
-    Object.values(catMonthly).forEach(mc => {
-        Object.keys(mc).forEach(c => { areaCats[c] = true; });
-    });
-    // Sort by total count
-    const areaCatList = Object.keys(areaCats).sort((a, b) => {
-        const totalA = months.reduce((s, m) => s + ((catMonthly[m] || {})[a] || 0), 0);
-        const totalB = months.reduce((s, m) => s + ((catMonthly[m] || {})[b] || 0), 0);
-        return totalB - totalA;
-    });
-
-    const monthLabels = months.map(fmtMonth);
-    const areaTraces = areaCatList.map((cat, i) => ({
-        x: monthLabels,
-        y: months.map(m => (catMonthly[m] || {})[cat] || 0),
-        name: cat,
-        type: 'scatter',
-        mode: 'lines',
-        stackgroup: 'one',
-        line: { width: 0.5, color: catColor[cat] || PALETTE[i % PALETTE.length] },
-        fillcolor: (catColor[cat] || PALETTE[i % PALETTE.length]) + '80',
-        hovertemplate: '%{x}<br>' + cat + ': %{y}<extra></extra>',
-    }));
-
-    Plotly.newPlot('stackedArea', areaTraces, {
-        ...PLOTLY_LAYOUT,
-        xaxis: { ...PLOTLY_LAYOUT.xaxis, title: { text: 'Month', font: { size: 11 } } },
-        yaxis: { ...PLOTLY_LAYOUT.yaxis, title: { text: 'Drafts', font: { size: 11 } } },
-        legend: { font: { size: 10, color: '#94a3b8' }, orientation: 'h', y: -0.25, x: 0.5, xanchor: 'center' },
-        hovermode: 'x unified',
-        margin: { t: 20, r: 20, b: 80, l: 50 },
-    }, CFG);
-
-} else {
-    document.getElementById('tsneSection').innerHTML = '<p class="text-slate-500 text-sm text-center py-20">No timeline animation data available. Run the analysis pipeline first.</p>';
-    document.getElementById('stackedArea').innerHTML = '<p class="text-slate-500 text-sm text-center py-20">No data available.</p>';
-    document.getElementById('statCards').style.display = 'none';
-}
-</script>
-{% endblock %}

tests/test_web.py

@@ -61,11 +61,6 @@ def test_authors_page(client):
     assert resp.status_code == 200
 
 
-def test_timeline_page(client):
-    resp = client.get("/timeline")
-    assert resp.status_code == 200
-
-
 def test_search_page_empty(client):
     resp = client.get("/search")
     assert resp.status_code == 200