feat: implement automated ingestion pipeline with state persistence and add database maintenance utilities

backend/clean_all.py

@@ -0,0 +1,27 @@
+import asyncio
+from src.database import engine
+from sqlalchemy import text
+from src.config import get_settings
+from qdrant_client import QdrantClient
+from qdrant_client.models import Distance, VectorParams
+
+async def main():
+    async with engine.begin() as conn:
+        print('Wiping Postgres...')
+        await conn.execute(text('DROP SCHEMA public CASCADE'))
+        await conn.execute(text('CREATE SCHEMA public'))
+        print('Postgres wiped.')
+
+    import qdrant_client
+    settings = get_settings()
+    try:
+        q = QdrantClient(url=settings.qdrant_url, api_key=settings.qdrant_api_key)
+        q.delete_collection(settings.collection_name)
+        q.create_collection(settings.collection_name, vectors_config=VectorParams(size=384, distance=Distance.COSINE))
+        print('Qdrant wiped and recreated.')
+    except Exception as e:
+        print('Qdrant error:', e)
+
+if __name__ == '__main__':
+    asyncio.run(main())
+

backend/clean_db.py

@@ -0,0 +1,44 @@
+import asyncio
+from src.database import engine
+from sqlalchemy import text
+from src.config import get_settings
+from qdrant_client import QdrantClient
+from qdrant_client.models import Distance, VectorParams, PayloadSchemaType
+
+async def main():
+    async with engine.begin() as conn:
+        print('Wiping Postgres data natively...')
+        await conn.execute(text('DROP SCHEMA public CASCADE'))
+        await conn.execute(text('CREATE SCHEMA public'))
+        print('Postgres schema wiped.')
+
+    import qdrant_client
+    settings = get_settings()
+    try:
+        q = QdrantClient(url=settings.qdrant_url, api_key=settings.qdrant_api_key)
+        q.delete_collection(settings.collection_name)
+        q.create_collection(settings.collection_name, vectors_config=VectorParams(size=384, distance=Distance.COSINE))
+        
+        # Reinject indices required natively by the pipeline
+        q.create_payload_index(
+            collection_name=settings.collection_name,
+            field_name="session_id",
+            field_schema=PayloadSchemaType.KEYWORD
+        )
+        q.create_payload_index(
+            collection_name=settings.collection_name,
+            field_name="years_of_experience",
+            field_schema=PayloadSchemaType.FLOAT
+        )
+        print('Qdrant collection wiped and re-indexed.')
+    except Exception as e:
+        print('Qdrant error:', e)
+
+    print("\n------------------------------")
+    print("Database is completely purged but empty.")
+    print("WARNING: You MUST now run the following command to rebuild the tables:")
+    print("         alembic upgrade head")
+    print("------------------------------")
+
+if __name__ == '__main__':
+    asyncio.run(main())

backend/fix_qdrant.py

@@ -0,0 +1,17 @@
+
+from qdrant_client import QdrantClient
+from src.config import get_settings
+
+settings = get_settings()
+q = QdrantClient(url=settings.qdrant_url, api_key=settings.qdrant_api_key)
+
+try:
+    q.create_payload_index(
+        collection_name=settings.collection_name,
+        field_name='session_id',
+        field_schema='keyword'
+    )
+    print('Payload index created successfully!')
+except Exception as e:
+    print('Error creating payload index:', e)
+

backend/fix_qdrant2.py

@@ -0,0 +1,18 @@
+
+from qdrant_client import QdrantClient
+from qdrant_client.models import PayloadSchemaType
+from src.config import get_settings
+
+settings = get_settings()
+q = QdrantClient(url=settings.qdrant_url, api_key=settings.qdrant_api_key)
+
+try:
+    q.create_payload_index(
+        collection_name=settings.collection_name,
+        field_name='years_of_experience',
+        field_schema=PayloadSchemaType.FLOAT
+    )
+    print('Payload index for years_of_experience created successfully!')
+except Exception as e:
+    print('Error creating payload index:', e)
+

backend/fix_qdrant_yoe.py

@@ -0,0 +1,17 @@
+
+from qdrant_client import QdrantClient
+from src.config import get_settings
+
+settings = get_settings()
+q = QdrantClient(url=settings.qdrant_url, api_key=settings.qdrant_api_key)
+
+try:
+    q.create_payload_index(
+        collection_name=settings.collection_name,
+        field_name='years_of_experience',
+        field_schema='integer'
+    )
+    print('Years of Experience index created successfully!')
+except Exception as e:
+    print('Error creating YOE index:', e)
+

backend/src/matching/stage1.py

@@ -32,7 +32,7 @@ async def stage1_retrieve(
     db: AsyncSession,
     qdrant: QdrantClient,
     session_id: str | None = None,
-    top_k: int = 200,
+    top_k: int = 500,
     weights: dict | None = None,
 ) -> list[dict[str, Any]]:
     settings = get_settings()
@@ -111,4 +111,4 @@ async def stage1_retrieve(
         })
 
     scored.sort(key=lambda x: x["stage1_score"], reverse=True)
-    return scored[:50]
+    return scored[:250]

backend/src/routers/candidates.py

@@ -73,10 +73,14 @@ async def upload_candidates(
 @router.get("/status/{task_id}", response_model=TaskStatusResponse)
 async def task_status(task_id: str):
     result = celery_app.AsyncResult(task_id)
+    res_data = result.result if result.ready() else None
+    if isinstance(res_data, Exception):
+        res_data = str(res_data)
+        
     return TaskStatusResponse(
         task_id=task_id,
         status=result.status,
-        result=result.result if result.ready() else None,
+        result=res_data,
     )
 
 

backend/src/routers/matching.py

@@ -241,6 +241,24 @@ async def rerank_results(
     )
 
 
+@router.post("/{jd_id}/candidates/{candidate_id}/explain")
+async def trigger_explanation(
+    jd_id: uuid.UUID,
+    candidate_id: uuid.UUID,
+    session_id: uuid.UUID | None = Query(None),
+    db: AsyncSession = Depends(get_db),
+):
+    q = select(MatchResult).where(MatchResult.jd_id == jd_id, MatchResult.candidate_id == candidate_id)
+    if session_id:
+        q = q.where(MatchResult.session_id == session_id)
+    mr_result = await db.execute(q)
+    mr = mr_result.scalar_one_or_none()
+    if not mr:
+        raise HTTPException(status_code=404, detail="Match result not found")
+        
+    generate_top_explanations.delay([str(mr.id)])
+    return {"status": "queued"}
+
 @router.get("/{jd_id}/{candidate_id}", response_model=CandidateDetailResponse)
 async def get_candidate_detail(
     jd_id: uuid.UUID,

frontend/src/app/globals.css

@@ -45,22 +45,61 @@ body {
 
 input[type="range"] {
   -webkit-appearance: none;
-  height: 4px;
+  appearance: none;
+  width: 100%;
+  height: 6px;
+  background: var(--color-border-strong);
   border-radius: 99px;
-  background: var(--color-surface-2);
   outline: none;
   cursor: pointer;
+  margin: 10px 0;
 }
+
+input[type="range"]::-webkit-slider-runnable-track {
+  width: 100%;
+  height: 6px;
+  cursor: pointer;
+  background: transparent;
+  border-radius: 99px;
+}
+
 input[type="range"]::-webkit-slider-thumb {
-  -webkit-appearance: none;
+  height: 16px;
   width: 16px;
+  border-radius: 50%;
+  background: var(--thumb-color, var(--color-brand));
+  cursor: pointer;
+  -webkit-appearance: none;
+  margin-top: -5px; /* Centers thumb on the track */
+  box-shadow: 0 0 10px rgba(0,0,0,0.5), 0 0 0 2px var(--color-surface);
+  transition: transform 0.1s ease-in-out, box-shadow 0.1s ease-in-out;
+}
+
+input[type="range"]:focus::-webkit-slider-thumb {
+  box-shadow: 0 0 0 3px var(--color-brand-glow), 0 0 10px rgba(0,0,0,0.5);
+}
+
+input[type="range"]::-moz-range-track {
+  width: 100%;
+  height: 6px;
+  cursor: pointer;
+  background: var(--color-border-strong);
+  border-radius: 99px;
+}
+
+input[type="range"]::-moz-range-thumb {
   height: 16px;
+  width: 16px;
   border-radius: 50%;
-  background: var(--color-brand);
-  box-shadow: 0 0 8px var(--color-brand-glow);
-  transition: transform 0.15s;
+  background: var(--thumb-color, var(--color-brand));
+  cursor: pointer;
+  border: none;
+  box-shadow: 0 0 10px rgba(0,0,0,0.5), 0 0 0 2px var(--color-surface);
+}
+
+input[type="range"]::-webkit-slider-thumb:active {
+  transform: scale(1.2);
 }
-input[type="range"]::-webkit-slider-thumb:hover { transform: scale(1.25); }
 
 @keyframes spin { to { transform: rotate(360deg); } }
 @keyframes slide-up { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

frontend/src/app/jds/[id]/candidates/[cid]/page.tsx

@@ -65,6 +65,28 @@ export default function CandidateDetailPage() {
   const [detail, setDetail] = useState<CandidateDetail | null>(null);
   const [loading, setLoading] = useState(true);
   const [error, setError] = useState<string | null>(null);
+  const [generating, setGenerating] = useState(false);
+
+  const handleGenerateLLM = async () => {
+    try {
+      setGenerating(true);
+      await api.triggerExplanation(jdId, candidateId, sessionId);
+      
+      const interval = setInterval(async () => {
+        const d = await api.getCandidateDetail(jdId, candidateId, sessionId).catch(() => null);
+        if (d && d.explanation) {
+          setDetail(d);
+          clearInterval(interval);
+          setGenerating(false);
+        }
+      }, 3500);
+      
+      setTimeout(() => { clearInterval(interval); setGenerating(false); }, 60000);
+    } catch (e) {
+      console.error(e);
+      setGenerating(false);
+    }
+  };
 
   const loadDetail = useCallback(async () => {
     try {
@@ -161,9 +183,16 @@ export default function CandidateDetailPage() {
             </div>
           ) : (
             <div className="bg-[var(--color-card)] border border-[var(--color-border)] rounded-2xl p-6 flex flex-col items-center justify-center py-8 text-[var(--color-muted)]">
-               <div className="mb-3"><SkipForward className="w-8 h-8 text-[var(--color-border-strong)]" /></div>
-               <div className="font-semibold mb-1 text-[var(--color-text)]">LLM Generation Skipped</div>
-               <div className="text-xs text-center">This candidate lies outside the Top-20 ranking slice. Deep-dive generation was intentionally skipped to conserve pipeline latency.</div>
+              <div className="mb-3"><SkipForward className="w-8 h-8 text-[var(--color-border-strong)]" /></div>
+              <div className="font-semibold mb-1 text-[var(--color-text)]">LLM Generation Skipped</div>
+              <div className="text-xs text-center mb-4">This candidate lies outside the Top-20 ranking slice. Deep-dive generation was intentionally skipped to conserve pipeline latency.</div>
+              <button 
+                onClick={handleGenerateLLM} 
+                disabled={generating} 
+                className="px-4 py-2 bg-[var(--color-brand)] text-white text-xs font-bold rounded-lg hover:bg-[var(--color-brand-light)] transition disabled:opacity-50"
+              >
+                {generating ? "Generating via Groq..." : "Generate LLM Analysis"}
+              </button>
             </div>
           )}
 

frontend/src/app/jds/[id]/page.tsx

@@ -32,21 +32,29 @@ export default function JDDetailPage() {
   const loadData = useCallback(async () => {
     const [jdData, sessionList] = await Promise.all([api.getJD(jdId), api.listSessions().catch(() => [])]);
     setJD(jdData);
-    if (jdData && jdData.custom_weights && Object.keys(jdData.custom_weights).length > 0) {
-      setWeights(jdData.custom_weights as typeof DEFAULT_WEIGHTS);
-    } else {
-      setWeights(DEFAULT_WEIGHTS);
-    }
     setSessions(sessionList as SessionInfo[]);
-    if (preselectedSession || sessionList.length === 1) {
-      const sid = preselectedSession || (sessionList as SessionInfo[])[0]?.id;
-      if (sid) {
-        setSelectedSession(sid);
-        api.getMatchResults(jdId, sid).then(r => {
-           setMatch(r);
-           setBaseResults(r.results);
-        }).catch(() => {});
+    
+    let sid = preselectedSession || (sessionList as SessionInfo[])[0]?.id;
+    let initialW = jdData?.custom_weights && Object.keys(jdData.custom_weights).length > 0 
+      ? (jdData.custom_weights as typeof DEFAULT_WEIGHTS) 
+      : DEFAULT_WEIGHTS;
+
+    if (sid) {
+      setSelectedSession(sid);
+      if (typeof window !== "undefined") {
+        const stored = localStorage.getItem(`coderound_w_${jdId}_${sid}`);
+        if (stored) {
+            try { initialW = JSON.parse(stored); } catch (e) {}
+        }
       }
+      setWeights(initialW);
+
+      api.getMatchResults(jdId, sid).then(r => {
+         setMatch(r);
+         setBaseResults(r.results);
+      }).catch(() => {});
+    } else {
+      setWeights(initialW);
     }
     setLoading(false);
   }, [jdId, preselectedSession]);
@@ -67,6 +75,10 @@ export default function JDDetailPage() {
     const nw = { ...weights, [key]: val };
     setWeights(nw);
 
+    if (selectedSession && typeof window !== "undefined") {
+      localStorage.setItem(`coderound_w_${jdId}_${selectedSession}`, JSON.stringify(nw));
+    }
+
     // Instance 0ms Array sorting natively!
     if (baseResults && match) {
       const totalW = Object.values(nw).reduce((a, b) => a + b, 0);
@@ -246,7 +258,8 @@ export default function JDDetailPage() {
                   <input
                     id={`weight-${key}`}
                     type="range" min={0} max={1} step={0.01} value={val}
-                    style={{ width: "100%", accentColor: SCORE_COLORS[i % SCORE_COLORS.length] }}
+                    style={{ "--thumb-color": SCORE_COLORS[i % SCORE_COLORS.length] } as any}
+                    className="cursor-pointer"
                     onChange={(e) => handleWeightChange(key, parseFloat(e.target.value))}
                   />
                 </div>

frontend/src/app/layout.tsx

@@ -17,15 +17,6 @@ export default function RootLayout({ children }: { children: React.ReactNode })
               ⚡ TalentPulse
             </Link>
             <div className="flex items-center gap-1">
-              <Link href="/" className="px-3 py-1.5 rounded-lg text-sm text-[var(--color-muted)] hover:text-[var(--color-text)] hover:bg-[var(--color-card)] transition-all">
-                Dashboard
-              </Link>
-              <Link href="/sessions" className="px-3 py-1.5 rounded-lg text-sm text-[var(--color-muted)] hover:text-[var(--color-text)] hover:bg-[var(--color-card)] transition-all">
-                Sessions
-              </Link>
-              <Link href="/jds" className="px-3 py-1.5 rounded-lg text-sm text-[var(--color-muted)] hover:text-[var(--color-text)] hover:bg-[var(--color-card)] transition-all">
-                Job Descriptions
-              </Link>
               <Link href="/pipeline" className="ml-2 px-3 py-1.5 rounded-lg text-sm font-semibold text-[var(--color-brand-light)] bg-[var(--color-brand-dim)] border border-[var(--color-brand-glow)] hover:bg-[var(--color-brand)] hover:text-white transition-all">
                 ⚡ Auto Pipeline
               </Link>

frontend/src/app/page.tsx

@@ -1,159 +1,5 @@
-"use client";
-import { useState, useEffect, useCallback } from "react";
-import Link from "next/link";
-import { api, type SessionInfo, type JD } from "../lib/api";
+import { redirect } from 'next/navigation';
 
-export default function HomePage() {
-  const [sessions, setSessions] = useState<SessionInfo[]>([]);
-  const [jds, setJDs] = useState<JD[]>([]);
-  const [totalCandidates, setTotalCandidates] = useState<number | null>(null);
-  const [loading, setLoading] = useState(true);
-
-  const loadData = useCallback(async () => {
-    const [s, j, c] = await Promise.all([
-      api.listSessions().catch(() => []),
-      api.listJDs().catch(() => []),
-      api.candidateCount().catch(() => ({ count: 0 })),
-    ]);
-    setSessions(s as SessionInfo[]);
-    setJDs(j as JD[]);
-    setTotalCandidates((c as { count: number }).count);
-    setLoading(false);
-  }, []);
-
-  useEffect(() => { loadData(); }, [loadData]);
-
-  const qualityColor = (q: string) =>
-    q === "good" ? "text-green-400 bg-green-400/10 border-green-400/20"
-    : q === "fair" ? "text-yellow-400 bg-yellow-400/10 border-yellow-400/20"
-    : "text-red-400 bg-red-400/10 border-red-400/20";
-
-  return (
-    <div className="max-w-7xl mx-auto px-6 py-12">
-      <div className="text-center mb-14">
-        <div className="inline-flex items-center gap-2 px-4 py-1.5 rounded-full bg-[var(--color-brand-dim)] border border-[var(--color-brand-glow)] text-[var(--color-brand-light)] text-sm font-medium mb-5">
-          ⚡ AI-Powered Recruiting Pipeline
-        </div>
-        <h1 className="text-5xl font-extrabold tracking-tight mb-4 leading-none">
-          Match the{" "}
-          <span className="bg-gradient-to-r from-[var(--color-brand-light)] via-purple-400 to-sky-400 bg-clip-text text-transparent">
-            right talent
-          </span>
-          <br />at any scale
-        </h1>
-        <p className="text-[var(--color-muted)] text-lg max-w-xl mx-auto mb-8">
-          Upload candidate sessions, post JDs, and get AI-ranked matches with LLM explanations in seconds.
-        </p>
-          <Link href="/pipeline" className="px-8 py-4 rounded-xl bg-[var(--color-brand)] text-white font-bold tracking-wide text-sm shadow-xl shadow-[var(--color-brand-glow)] hover:brightness-110 transition-all hover:-translate-y-0.5">
-            🚀 Run Continuous Monolithic Pipeline
-          </Link>
-      </div>
-
-      <div className="grid grid-cols-3 gap-5 mb-12">
-        {[
-          { val: totalCandidates !== null ? totalCandidates.toLocaleString() : "—", label: "Candidates Indexed", color: "from-[var(--color-brand-light)] to-purple-400" },
-          { val: sessions.length, label: "Active Sessions", color: "from-green-400 to-emerald-300" },
-          { val: jds.length, label: "Job Descriptions", color: "from-amber-400 to-yellow-300" },
-        ].map(({ val, label, color }) => (
-          <div key={label} className="bg-[var(--color-card)] border border-[var(--color-border)] rounded-2xl p-6">
-            <div className={`text-3xl font-bold tracking-tight bg-gradient-to-r ${color} bg-clip-text text-transparent mb-1`}>{val}</div>
-            <div className="text-sm text-[var(--color-muted)]">{label}</div>
-          </div>
-        ))}
-      </div>
-
-      <div className="grid grid-cols-2 gap-8">
-        <div>
-          <div className="flex items-center justify-between mb-4">
-            <h2 className="text-lg font-semibold">Recent Sessions</h2>
-            <Link href="/sessions" className="text-sm text-[var(--color-brand-light)] hover:underline">View all →</Link>
-          </div>
-          {loading ? (
-            <div className="space-y-3">{[1, 2, 3].map((i) => <div key={i} className="h-16 rounded-xl animate-shimmer" />)}</div>
-          ) : sessions.length === 0 ? (
-            <div className="bg-[var(--color-card)] border border-dashed border-[var(--color-border-strong)] rounded-2xl p-10 text-center">
-              <div className="text-3xl mb-3">📁</div>
-              <div className="font-medium mb-1">No sessions yet</div>
-              <div className="text-sm text-[var(--color-muted)] mb-4">Upload candidates to a named session to get started</div>
-              <Link href="/sessions/new" className="text-sm text-[var(--color-brand-light)] hover:underline">Create your first session →</Link>
-            </div>
-          ) : (
-            <div className="space-y-3">
-              {sessions.slice(0, 5).map((s) => (
-                <Link key={s.id} href={`/sessions/${s.id}`}
-                  className="flex items-center gap-4 p-4 bg-[var(--color-card)] border border-[var(--color-border)] rounded-xl hover:border-[var(--color-brand)] hover:shadow-[0_0_20px_var(--color-brand-dim)] transition-all group">
-                  <div className="w-10 h-10 rounded-xl bg-[var(--color-brand-dim)] border border-[var(--color-brand-glow)] flex items-center justify-center text-lg flex-shrink-0">📁</div>
-                  <div className="flex-1 min-w-0">
-                    <div className="font-medium truncate">{s.name}</div>
-                    <div className="text-xs text-[var(--color-muted)]">{s.candidate_count.toLocaleString()} candidates</div>
-                  </div>
-                  <span className="text-[var(--color-dimmer)] group-hover:text-[var(--color-brand-light)] transition-colors">→</span>
-                </Link>
-              ))}
-            </div>
-          )}
-        </div>
-
-        <div>
-          <div className="flex items-center justify-between mb-4">
-            <h2 className="text-lg font-semibold">Recent Job Descriptions</h2>
-            <Link href="/jds" className="text-sm text-[var(--color-brand-light)] hover:underline">View all →</Link>
-          </div>
-          {loading ? (
-            <div className="space-y-3">{[1, 2, 3].map((i) => <div key={i} className="h-16 rounded-xl animate-shimmer" />)}</div>
-          ) : jds.length === 0 ? (
-            <div className="bg-[var(--color-card)] border border-dashed border-[var(--color-border-strong)] rounded-2xl p-10 text-center">
-              <div className="text-3xl mb-3">📋</div>
-              <div className="font-medium mb-1">No JDs yet</div>
-              <div className="text-sm text-[var(--color-muted)] mb-4">Post a job description to start matching candidates</div>
-              <Link href="/jds/new" className="text-sm text-[var(--color-brand-light)] hover:underline">Create your first JD →</Link>
-            </div>
-          ) : (
-            <div className="space-y-3">
-              {jds.slice(0, 5).map((jd) => (
-                <Link key={jd.id} href={`/jds/${jd.id}`}
-                  className="flex items-center gap-4 p-4 bg-[var(--color-card)] border border-[var(--color-border)] rounded-xl hover:border-[var(--color-brand)] hover:shadow-[0_0_20px_var(--color-brand-dim)] transition-all group">
-                  <div className="w-10 h-10 rounded-xl bg-purple-500/10 border border-purple-500/20 flex items-center justify-center text-lg flex-shrink-0">📋</div>
-                  <div className="flex-1 min-w-0">
-                    <div className="font-medium truncate">{jd.title}</div>
-                    <div className="text-xs text-[var(--color-muted)] flex gap-2">
-                      {jd.engineer_type && <span>{jd.engineer_type}</span>}
-                      {jd.min_yoe && <span>{jd.min_yoe}+ yrs</span>}
-                    </div>
-                  </div>
-                  <div className="flex items-center gap-2 flex-shrink-0">
-                    {jd.jd_quality?.overall && (
-                      <span className={`text-xs px-2 py-0.5 rounded-full border ${qualityColor(jd.jd_quality.overall)}`}>
-                        {jd.jd_quality.overall}
-                      </span>
-                    )}
-                    <span className="text-[var(--color-dimmer)] group-hover:text-[var(--color-brand-light)] transition-colors">→</span>
-                  </div>
-                </Link>
-              ))}
-            </div>
-          )}
-        </div>
-      </div>
-
-      <div className="mt-14 bg-gradient-to-br from-[var(--color-brand-dim)] to-purple-900/10 border border-[var(--color-brand-glow)] rounded-2xl p-8">
-        <h3 className="text-lg font-semibold mb-3">🛠 How it works</h3>
-        <div className="grid grid-cols-4 gap-4">
-          {[
-            { icon: "📁", step: "1", title: "Create a Session", desc: "Upload your candidate CSV/JSON to a named batch" },
-            { icon: "📋", step: "2", title: "Post a JD", desc: "Paste a job description — auto-parsed for skills & YOE" },
-            { icon: "⚡", step: "3", title: "Run Match", desc: "Stage 1 ANN search + Stage 2 cross-encoder reranking" },
-            { icon: "🤖", step: "4", title: "Get Explanations", desc: "LLM explains fit + gaps for every top candidate" },
-          ].map(({ icon, step, title, desc }) => (
-            <div key={step} className="text-center">
-              <div className="text-2xl mb-2">{icon}</div>
-              <div className="text-xs text-[var(--color-brand-light)] font-bold mb-1">STEP {step}</div>
-              <div className="font-semibold text-sm mb-1">{title}</div>
-              <div className="text-xs text-[var(--color-muted)]">{desc}</div>
-            </div>
-          ))}
-        </div>
-      </div>
-    </div>
-  );
+export default function Home() {
+  redirect('/pipeline');
 }

frontend/src/app/pipeline/page.tsx

@@ -66,7 +66,10 @@ export default function PipelinePage() {
       localStorage.setItem("talentpulse_pipeline", JSON.stringify(state));
       if (!timerRef.current && state.startTime) {
         timerRef.current = setInterval(() => {
-          setState(s => ({ ...s, elapsedTime: Math.floor((Date.now() - (s.startTime || Date.now())) / 1000) }));
+          setState(s => {
+             if (s.status === "idle" || s.status === "complete") return s;
+             return { ...s, elapsedTime: Math.floor((Date.now() - (s.startTime || Date.now())) / 1000) };
+          });
         }, 1000);
       }
     } else {
@@ -78,9 +81,17 @@ export default function PipelinePage() {
          localStorage.removeItem("talentpulse_pipeline");
       }
     }
-    return () => { if (timerRef.current) clearInterval(timerRef.current); };
   }, [state.status, state.startTime]);
 
+  useEffect(() => {
+    return () => {
+      if (timerRef.current) {
+        clearInterval(timerRef.current);
+        timerRef.current = null;
+      }
+    };
+  }, []);
+
   const updateState = (update: Partial<PipelineState>) => {
     setState(s => {
       const ns = { ...s, ...update };

frontend/src/app/sessions/[id]/page.tsx

@@ -43,9 +43,17 @@ export default function SessionDetailPage({ params }: { params: Promise<{ id: st
       // If a JD is selected, load its match info automatically
       if (initialJdId) {
         const jdInfo = (jList as JD[]).find(x => x.id === initialJdId);
-        if (jdInfo && jdInfo.custom_weights && Object.keys(jdInfo.custom_weights).length > 0) {
-          setWeights(jdInfo.custom_weights as typeof DEFAULT_WEIGHTS);
+        let initialW = jdInfo?.custom_weights && Object.keys(jdInfo.custom_weights).length > 0
+          ? (jdInfo.custom_weights as typeof DEFAULT_WEIGHTS)
+          : DEFAULT_WEIGHTS;
+
+        if (typeof window !== "undefined") {
+            const stored = localStorage.getItem(`coderound_w_${initialJdId}_${sessionId}`);
+            if (stored) {
+                try { initialW = JSON.parse(stored); } catch (e) {}
+            }
         }
+        setWeights(initialW);
         
         try {
            const r = await api.getMatchResults(initialJdId, sessionId);
@@ -261,9 +269,15 @@ export default function SessionDetailPage({ params }: { params: Promise<{ id: st
                           </div>
                           <input
                             type="range" min={0} max={1} step={0.01} value={val}
-                            style={{ accentColor: SCORE_COLORS[i % SCORE_COLORS.length] }}
-                            className="w-full h-1.5 focus:outline-none"
-                            onChange={(e) => handleWeightChange(key, parseFloat(e.target.value))}
+                            style={{ "--thumb-color": SCORE_COLORS[i % SCORE_COLORS.length] } as any}
+                            className="cursor-pointer"
+                            onChange={(e) => {
+                               const nw = { ...weights, [key]: parseFloat(e.target.value) };
+                               if (selectedJD && typeof window !== "undefined") {
+                                 localStorage.setItem(`coderound_w_${selectedJD}_${sessionId}`, JSON.stringify(nw));
+                               }
+                               handleWeightChange(key, parseFloat(e.target.value));
+                            }}
                           />
                         </div>
                       ))}

frontend/src/app/sessions/page.tsx

@@ -0,0 +1,106 @@
+"use client";
+import { useEffect, useState, useCallback } from "react";
+import Link from "next/link";
+import { Users, Calendar, LayoutDashboard, Copy, CheckCircle2 } from "lucide-react";
+import { api, type SessionInfo } from "../../lib/api";
+
+export default function SessionsListPage() {
+  const [sessions, setSessions] = useState<SessionInfo[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const [copiedId, setCopiedId] = useState<string | null>(null);
+
+  const loadSessions = useCallback(async () => {
+    try {
+      setLoading(true);
+      const data = await api.listSessions();
+      setSessions(data);
+    } catch (e: any) {
+      setError(e.message);
+    } finally {
+      setLoading(false);
+    }
+  }, []);
+
+  useEffect(() => { loadSessions(); }, [loadSessions]);
+
+  const handleCopy = (e: React.MouseEvent, id: string) => {
+    e.preventDefault();
+    navigator.clipboard.writeText(id);
+    setCopiedId(id);
+    setTimeout(() => setCopiedId(null), 2000);
+  };
+
+  if (loading) return (
+    <div className="flex flex-col items-center justify-center min-h-[60vh] gap-4">
+      <div className="w-12 h-12 border-2 border-[var(--color-brand)] border-t-transparent rounded-full animate-spin" />
+      <div>
+        <div className="font-semibold text-center mb-1">Loading Data Pools...</div>
+        <div className="text-sm text-[var(--color-muted)] text-center">Fetching available pipeline sessions</div>
+      </div>
+    </div>
+  );
+
+  if (error) return <div className="p-8 text-[var(--color-danger)] text-center font-semibold">Error: {error}</div>;
+
+  return (
+    <div className="max-w-7xl mx-auto px-6 py-10">
+      <div className="flex items-center justify-between mb-8">
+        <div>
+          <h1 className="text-3xl font-bold tracking-tight mb-2">Ingestion Sessions</h1>
+          <p className="text-[var(--color-muted)]">Select an ingestion pool below to interact with its associated candidate vectors.</p>
+        </div>
+        <Link href="/pipeline" className="flex items-center gap-2 px-4 py-2.5 bg-[var(--color-surface-2)] border border-[var(--color-border-strong)] hover:border-[var(--color-brand-light)] hover:bg-[var(--color-brand-dim)] transition-all rounded-xl text-sm font-semibold">
+           <LayoutDashboard className="w-4 h-4" /> Run New Pipeline
+        </Link>
+      </div>
+
+      {sessions.length === 0 ? (
+        <div className="bg-[var(--color-card)] border border-[var(--color-border)] rounded-2xl p-10 text-center flex flex-col items-center justify-center">
+            <LayoutDashboard className="w-12 h-12 text-[var(--color-border-strong)] mb-4" />
+            <div className="text-lg font-bold mb-1">No Sessions Found</div>
+            <div className="text-sm text-[var(--color-muted)] mb-6">There are currently no active candidate data pools available.</div>
+            <Link href="/pipeline" className="px-6 py-2.5 bg-[var(--color-brand)] text-white text-sm font-bold rounded-xl hover:bg-[var(--color-brand-light)] transition">
+                Create First Session
+            </Link>
+        </div>
+      ) : (
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+          {sessions.map((s) => (
+            <Link key={s.id} href={`/sessions/${s.id}`} className="bg-[var(--color-card)] border border-[var(--color-border)] rounded-2xl p-6 hover:shadow-lg hover:border-[var(--color-brand-light)] transition-all group block">
+                <div className="flex justify-between items-start mb-4">
+                  <div className="bg-[var(--color-surface-2)] text-[var(--color-brand-light)] px-3 py-1.5 rounded-lg text-xs font-bold border border-[var(--color-border-strong)] flex items-center gap-2 tracking-wide uppercase">
+                    <LayoutDashboard className="w-3.5 h-3.5" /> Pool
+                  </div>
+                  <div className={`px-2.5 py-1 rounded-full text-[10px] font-bold uppercase tracking-wider ${s.status === "processing" ? "bg-yellow-500/10 text-yellow-500 border border-yellow-500/20 animate-pulse" : s.status === "failed" ? "bg-red-500/10 text-red-500 border border-red-500/20" : "bg-green-500/10 text-green-400 border border-green-500/20"}`}>
+                    {s.status}
+                  </div>
+                </div>
+                
+                <h2 className="text-xl font-bold mb-2 text-[var(--color-text)] group-hover:text-[var(--color-brand-light)] transition-colors">{s.name}</h2>
+                <p className="text-sm text-[var(--color-muted)] mb-6 line-clamp-2">{s.description || "No description provided."}</p>
+                
+                <div className="flex items-center gap-4 text-xs font-semibold text-[var(--color-dimmer)] pt-4 border-t border-[var(--color-border)]/50">
+                    <span className="flex items-center gap-1.5 text-[var(--color-text)]">
+                       <Users className="w-4 h-4 opacity-70 text-[var(--color-brand)]" />
+                       {s.candidate_count} Candidates
+                    </span>
+                    <span className="flex items-center gap-1.5">
+                       <Calendar className="w-4 h-4 opacity-70" />
+                       {new Date(s.created_at).toLocaleDateString()}
+                    </span>
+                </div>
+                
+                <div className="mt-4 pt-4 border-t border-[var(--color-border)]/50 flex justify-between items-center gap-3">
+                   <div className="text-[10px] font-mono text-[var(--color-dimmer)] truncate flex-1">{s.id}</div>
+                   <button onClick={(e) => handleCopy(e, s.id)} className="p-1.5 rounded hover:bg-[var(--color-surface-2)] text-[var(--color-muted)] hover:text-[var(--color-text)] transition-colors">
+                      {copiedId === s.id ? <CheckCircle2 className="w-3.5 h-3.5 text-green-400" /> : <Copy className="w-3.5 h-3.5" />}
+                   </button>
+                </div>
+            </Link>
+          ))}
+        </div>
+      )}
+    </div>
+  );
+}

frontend/src/lib/api.ts

@@ -161,6 +161,13 @@ export const api = {
     return request<CandidateDetail>(url);
   },
 
+  triggerExplanation: (jdId: string, candidateId: string, sessionId?: string) => {
+    const url = sessionId
+      ? `/api/match/${jdId}/candidates/${candidateId}/explain?session_id=${sessionId}`
+      : `/api/match/${jdId}/candidates/${candidateId}/explain`;
+    return request<{ status: string }>(url, { method: "POST" });
+  },
+
   rerank: (jdId: string, weights: Record<string, number>, sessionId?: string) => {
     const url = sessionId
       ? `/api/match/${jdId}/rerank?session_id=${sessionId}`