feat: add knowledge base management and analytics dashboard

backend/api/mcp_clients/rag_client.py

@@ -12,6 +12,7 @@ class RAGClient:
     def __init__(self):
         self.base_url = os.getenv("RAG_MCP_URL")
         self.search_endpoint = f"{self.base_url}/search"
+        self.ingest_endpoint = f"{self.base_url}/ingest"
 
     async def search(self, query: str, tenant_id: str):
         """
@@ -37,3 +38,54 @@ class RAGClient:
         except Exception as e:
             print("RAG Client Error:", e)
             return []
+
+    async def ingest(self, content: str, tenant_id: str):
+        """
+        Sends content to the RAG server for ingestion.
+        """
+
+        try:
+            async with httpx.AsyncClient() as client:
+                response = await client.post(
+                    self.ingest_endpoint,
+                    json={
+                        "tenant_id": tenant_id,
+                        "content": content
+                    }
+                )
+
+            if response.status_code != 200:
+                return {"error": f"HTTP {response.status_code}"}
+
+            data = response.json()
+            return data
+
+        except Exception as e:
+            print("RAG Ingest Error:", e)
+            return {"error": str(e)}
+
+    async def list_documents(self, tenant_id: str, limit: int = 1000, offset: int = 0):
+        """
+        List all documents for a tenant.
+        """
+
+        try:
+            async with httpx.AsyncClient() as client:
+                response = await client.get(
+                    f"{self.base_url}/list",
+                    params={
+                        "tenant_id": tenant_id,
+                        "limit": limit,
+                        "offset": offset
+                    }
+                )
+
+            if response.status_code != 200:
+                return {"documents": [], "total": 0, "limit": limit, "offset": offset}
+
+            data = response.json()
+            return data
+
+        except Exception as e:
+            print("RAG List Error:", e)
+            return {"documents": [], "total": 0, "limit": limit, "offset": offset}

backend/api/routes/analytics.py

@@ -25,7 +25,7 @@ ANALYTICS_DATA = {
 }
 
 
-@router.get("/analytics/overview")
+@router.get("/overview")
 async def analytics_overview(
     x_tenant_id: str = Header(None)
 ):
@@ -47,7 +47,7 @@ async def analytics_overview(
     }
 
 
-@router.get("/analytics/tool-usage")
+@router.get("/tool-usage")
 async def analytics_tool_usage(
     x_tenant_id: str = Header(None)
 ):
@@ -64,7 +64,7 @@ async def analytics_tool_usage(
     }
 
 
-@router.get("/analytics/redflags")
+@router.get("/redflags")
 async def analytics_redflags(
     x_tenant_id: str = Header(None)
 ):
@@ -86,7 +86,7 @@ async def analytics_redflags(
     }
 
 
-@router.get("/analytics/activity")
+@router.get("/activity")
 async def analytics_activity(
     x_tenant_id: str = Header(None)
 ):

backend/api/routes/rag.py

@@ -1,13 +1,22 @@
 from fastapi import APIRouter, Header, HTTPException
+from pydantic import BaseModel
 from api.mcp_clients.rag_client import RAGClient
 
 router = APIRouter()
 rag_client = RAGClient()
 
 
-@router.post("/rag/search")
+class IngestRequest(BaseModel):
+    content: str
+
+
+class SearchRequest(BaseModel):
+    query: str
+
+
+@router.post("/search")
 async def rag_search(
-    query: str,
+    req: SearchRequest,
     x_tenant_id: str = Header(None)
 ):
     """
@@ -18,11 +27,54 @@ async def rag_search(
         raise HTTPException(status_code=400, detail="Missing tenant ID")
 
     try:
-        results = await rag_client.search(query, x_tenant_id)
+        results = await rag_client.search(req.query, x_tenant_id)
         return {
             "tenant_id": x_tenant_id,
-            "query": query,
+            "query": req.query,
             "results": results
         }
     except Exception as e:
         raise HTTPException(status_code=500, detail=str(e))
+
+
+@router.post("/ingest")
+async def rag_ingest(
+    req: IngestRequest,
+    x_tenant_id: str = Header(None)
+):
+    """
+    Ingest content into tenant knowledge base using the RAG MCP server.
+    """
+
+    if not x_tenant_id:
+        raise HTTPException(status_code=400, detail="Missing tenant ID")
+
+    try:
+        result = await rag_client.ingest(req.content, x_tenant_id)
+        return {
+            "tenant_id": x_tenant_id,
+            "status": "ok",
+            **result
+        }
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+
+
+@router.get("/list")
+async def rag_list(
+    limit: int = 1000,
+    offset: int = 0,
+    x_tenant_id: str = Header(None)
+):
+    """
+    List all documents in tenant knowledge base.
+    """
+
+    if not x_tenant_id:
+        raise HTTPException(status_code=400, detail="Missing tenant ID")
+
+    try:
+        result = await rag_client.list_documents(x_tenant_id, limit=limit, offset=offset)
+        return result
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))

backend/mcp_servers/database.py

@@ -173,6 +173,61 @@ def search_vectors(tenant_id: str, vector: list, limit: int = 5) -> List[Dict[st
         return []
 
 
+def list_all_documents(tenant_id: str, limit: int = 1000, offset: int = 0) -> Dict[str, Any]:
+    """
+    List all documents for a tenant with pagination.
+    """
+    try:
+        conn = get_connection()
+        cur = conn.cursor(cursor_factory=psycopg2.extras.DictCursor)
+
+        cur.execute(
+            """
+            SELECT
+                id,
+                chunk_text,
+                created_at
+            FROM documents
+            WHERE tenant_id = %s
+            ORDER BY created_at DESC
+            LIMIT %s OFFSET %s;
+            """,
+            (tenant_id, limit, offset)
+        )
+
+        rows = cur.fetchall()
+
+        # Get total count
+        cur.execute(
+            """
+            SELECT COUNT(*) as total
+            FROM documents
+            WHERE tenant_id = %s;
+            """,
+            (tenant_id,)
+        )
+        total_row = cur.fetchone()
+        total = total_row["total"] if total_row else 0
+
+        cur.close()
+        conn.close()
+
+        results: List[Dict[str, Any]] = []
+        for row in rows:
+            results.append(
+                {
+                    "id": row["id"],
+                    "text": row["chunk_text"],
+                    "created_at": row["created_at"].isoformat() if row["created_at"] else None,
+                }
+            )
+        return {"documents": results, "total": total, "limit": limit, "offset": offset}
+
+    except Exception as e:
+        print("DB LIST ERROR:", e)
+        return {"documents": [], "total": 0, "limit": limit, "offset": offset}
+
+
 # -----------------------------------
 # Supabase Client (for REST operations)
 # -----------------------------------

backend/mcp_servers/main.py

@@ -21,7 +21,7 @@ sys.path.insert(0, os.path.join(parent_dir, "api"))  # For utils
 # --------------------------------------------------------
 
 from embeddings import embed_text
-from database import insert_document_chunks, search_vectors, initialize_database
+from database import insert_document_chunks, search_vectors, list_all_documents, initialize_database
 from utils.text_extractor import extract_text
 
 
@@ -152,6 +152,22 @@ def search(payload: SearchPayload):
         raise HTTPException(status_code=500, detail=str(e))
 
 
+# --------------------------------------------------------
+# List All Documents Route
+# --------------------------------------------------------
+
+@app.get("/list")
+def list_documents(tenant_id: str, limit: int = 1000, offset: int = 0):
+    """
+    List all documents for a tenant with pagination.
+    """
+    try:
+        result = list_all_documents(tenant_id, limit=limit, offset=offset)
+        return result
+    except Exception as e:
+        raise HTTPException(status_code=500, detail=str(e))
+
+
 # --------------------------------------------------------
 # Allow "python main.py" to start server
 # --------------------------------------------------------

backend/workers/analytics_worker.py

@@ -0,0 +1,142 @@
+"""
+backend/workers/analytics_worker.py
+
+Analytics & evaluation background tasks:
+ - compute_daily_metrics: aggregates logs into per-tenant daily metrics
+ - compute_rag_quality: synthetic RAG evaluation (precision@k style)
+ - export_metrics_to_supabase: writes aggregated metrics to a supabase analytics table
+"""
+
+import os
+import logging
+import time
+from typing import Dict, Any, List
+
+try:
+    from backend.workers.celeryconfig import celery_app
+except Exception:
+    celery_app = None
+
+logger = logging.getLogger("analytics_worker")
+logger.setLevel(os.getenv("LOG_LEVEL", "INFO"))
+
+# Placeholder: hook to your logging/event store. Replace with concrete DB queries
+def fetch_raw_logs(since_ts: int = 0) -> List[Dict[str, Any]]:
+    """
+    Fetch raw logs from the event store (Postgres / Supabase table).
+    Here we return dummy data if no DB configured.
+    """
+    # In prod: query your events table for entries after since_ts
+    return [
+        {"tenant_id": "demo", "tool": "rag", "latency_ms": 120, "tokens": 12, "ts": since_ts + 10},
+        {"tenant_id": "demo", "tool": "web", "latency_ms": 70, "tokens": 0, "ts": since_ts + 20},
+        {"tenant_id": "demo", "tool": "llm", "latency_ms": 400, "tokens": 150, "ts": since_ts + 30},
+    ]
+
+
+def aggregate_logs(logs: List[Dict[str, Any]]) -> Dict[str, Dict[str, Any]]:
+    """
+    Simple aggregator by tenant: counts requests, tokens, latency per tool.
+    Returns a dict keyed by tenant_id.
+    """
+    out = {}
+    for e in logs:
+        tid = e.get("tenant_id", "unknown")
+        out.setdefault(tid, {"requests": 0, "tokens": 0, "tools": {}, "total_latency_ms": 0})
+        out[tid]["requests"] += 1
+        out[tid]["tokens"] += e.get("tokens", 0)
+        out[tid]["total_latency_ms"] += e.get("latency_ms", 0)
+        tool = e.get("tool", "unknown")
+        out[tid]["tools"].setdefault(tool, {"count": 0, "latency_ms": 0})
+        out[tid]["tools"][tool]["count"] += 1
+        out[tid]["tools"][tool]["latency_ms"] += e.get("latency_ms", 0)
+    return out
+
+
+def write_metrics_supabase(metrics: Dict[str, Dict[str, Any]]):
+    """
+    Writes aggregated metrics to supabase analytics table. Falls back to logging if supabase not configured.
+    """
+    from backend.workers.ingestion_worker import SUPABASE
+    if SUPABASE is None:
+        logger.info("Supabase not configured; metrics:\n%s", metrics)
+        return {"status": "logged", "metrics_count": len(metrics)}
+
+    table = os.getenv("SUPABASE_ANALYTICS_TABLE", "analytics_daily")
+    rows = []
+    ts = int(time.time())
+    for tenant_id, data in metrics.items():
+        rows.append({
+            "tenant_id": tenant_id,
+            "date": time.strftime("%Y-%m-%d", time.gmtime(ts)),
+            "requests": data["requests"],
+            "tokens": data["tokens"],
+            "total_latency_ms": data["total_latency_ms"],
+            "tools": data["tools"],
+        })
+    try:
+        res = SUPABASE.table(table).upsert(rows).execute()
+        logger.info("Wrote %d metrics rows to supabase table %s", len(rows), table)
+        return {"status": "ok", "count": len(rows), "result": res}
+    except Exception as e:
+        logger.exception("Failed to write metrics to supabase: %s", e)
+        return {"status": "error", "error": str(e)}
+
+
+# Celery decorator
+def task_decorator(func):
+    if celery_app is not None:
+        return celery_app.task(func)
+    else:
+        def wrapper(*args, **kwargs):
+            return func(*args, **kwargs)
+        return wrapper
+
+
+@task_decorator
+def compute_daily_metrics(window_seconds: int = 86400):
+    """
+    Compute daily metrics by fetching raw logs and aggregating.
+    """
+    logger.info("compute_daily_metrics started; window=%s", window_seconds)
+    since_ts = int(time.time()) - window_seconds
+    logs = fetch_raw_logs(since_ts=since_ts)
+    metrics = aggregate_logs(logs)
+    res = write_metrics_supabase(metrics)
+    logger.info("compute_daily_metrics finished; res=%s", res)
+    return res
+
+
+@task_decorator
+def compute_rag_quality(sample_size: int = 20, top_k: int = 3):
+    """
+    Synthetic RAG evaluation:
+     - sample random chunks (or seed queries)
+     - ask the RAG server to search
+     - compute simple precision@k using exact string matching heuristic
+    """
+    logger.info("compute_rag_quality started; sample_size=%d top_k=%d", sample_size, top_k)
+
+    # In production: sample from DB. Here we simulate a simple check using mock data or minimal queries.
+    try:
+        # fake sample
+        sample_queries = ["What is our HR policy?", "What is refund policy?"] * (sample_size // 2)
+        results = []
+        # Try to call rag MCP if available
+        from backend.api.mcp_clients.rag_client import RagClient
+        rag = RagClient()
+        for q in sample_queries:
+            try:
+                r = rag.search({"tenant_id": "demo", "query": q})
+                # r should contain scored results; we use heuristics: check if any item contains a keyword
+                top_texts = [it.get("text", "") for it in r.get("results", [])[:top_k]]
+                success = any("policy" in t.lower() for t in top_texts)
+                results.append({"query": q, "success": success})
+            except Exception:
+                results.append({"query": q, "success": False})
+        precision = sum(1 for r in results if r["success"]) / max(1, len(results))
+        logger.info("compute_rag_quality precision=%.3f", precision)
+        return {"precision_at_k": precision, "sample": len(results)}
+    except Exception as e:
+        logger.exception("compute_rag_quality failed: %s", e)
+        return {"error": str(e)}

backend/workers/celeryconfig.py

@@ -0,0 +1,84 @@
+"""
+backend/workers/celeryconfig.py
+
+Creates and configures the Celery app for the project.
+
+Usage (development):
+    # start a worker:
+    celery -A backend.workers.celeryconfig worker --loglevel=info
+
+    # start beat:
+    celery -A backend.workers.celeryconfig beat --loglevel=info
+
+Notes:
+ - Requires CELERY_BROKER_URL (no default broker is assumed)
+ - Tasks autodiscover from 'backend.workers' package
+ - This file also loads schedule from scheduler.py (SCHEDULE mapping)
+"""
+
+import os
+from celery import Celery
+from celery.schedules import crontab
+import logging
+
+# Basic logging
+logging.basicConfig(level=os.getenv("LOG_LEVEL", "INFO"))
+logger = logging.getLogger("celeryconfig")
+
+BROKER_URL = os.getenv("CELERY_BROKER_URL")
+if not BROKER_URL:
+    raise RuntimeError(
+        "CELERY_BROKER_URL is not set. Configure a broker such as amqp://, redis://, or sqs:// before starting workers."
+    )
+
+RESULT_BACKEND = os.getenv("CELERY_RESULT_BACKEND", BROKER_URL)
+if not RESULT_BACKEND:
+    raise RuntimeError(
+        "CELERY_RESULT_BACKEND is not set. Provide a backend URL or reuse CELERY_BROKER_URL."
+    )
+
+celery_app = Celery(
+    "integrachat_workers",
+    broker=BROKER_URL,
+    backend=RESULT_BACKEND,
+)
+
+# Recommended worker options
+celery_app.conf.update(
+    task_serializer="json",
+    result_serializer="json",
+    accept_content=["json"],
+    task_acks_late=True,
+    worker_prefetch_multiplier=1,
+    worker_max_tasks_per_child=100,
+    broker_pool_limit=10,
+    timezone="UTC",
+    enable_utc=True,
+)
+
+# Auto-discover tasks in the workers package
+celery_app.autodiscover_tasks(["backend.workers"])
+
+# Load schedule from scheduler.SCHEDULE and convert crontab-like entries
+try:
+    from backend.workers.scheduler import SCHEDULE as CUSTOM_SCHEDULE
+    beat_schedule = {}
+    for name, cfg in CUSTOM_SCHEDULE.items():
+        task_name = cfg["task"]
+        schedule_cfg = cfg["schedule"]
+        args = cfg.get("args", ())
+        # Determine schedule type
+        if isinstance(schedule_cfg, dict) and schedule_cfg.get("type") == "crontab":
+            hour = schedule_cfg.get("hour", 0)
+            minute = schedule_cfg.get("minute", 0)
+            beat_schedule[name] = {"task": task_name, "schedule": crontab(minute=minute, hour=hour), "args": args}
+        else:
+            # fallback: expect a timedelta or seconds (for quick dev)
+            beat_schedule[name] = {"task": task_name, "schedule": schedule_cfg, "args": args}
+    celery_app.conf.beat_schedule = beat_schedule
+    logger.info("Loaded Celery beat schedule with %d jobs", len(beat_schedule))
+except Exception as e:
+    logger.exception("Failed to load scheduler.SCHEDULE: %s", e)
+
+# Export celery_app symbol for import by tasks
+__all__ = ["celery_app"]

backend/workers/ingestion_worker.py

@@ -0,0 +1,283 @@
+"""
+backend/workers/ingestion_worker.py
+
+Celery task(s) for document ingestion:
+ - extract_text_from_file: supports PDF, DOCX, TXT, or raw text
+ - chunk_text: simple sentence-based chunker with overlap
+ - embed_chunks: uses Sentence-Transformers (all-MiniLM-L6-v2) if available,
+                 otherwise uses a fallback hash-based vector (deterministic) for dev
+ - write_embeddings_to_supabase: stores chunk metadata and embedding into Supabase/pgvector
+ - ingest_document task: orchestrates the end-to-end flow
+
+Notes:
+ - Expects SUPABASE_URL and SUPABASE_SERVICE_KEY in environment for production.
+ - Uses CELERY broker settings from celeryconfig.py
+"""
+
+import os
+import math
+import time
+import logging
+from typing import List, Dict, Optional
+
+from celery import shared_task
+from pathlib import Path
+
+# Try to import sentence-transformers; fallback to hashlib if not present
+try:
+    from sentence_transformers import SentenceTransformer
+    EMBED_MODEL = SentenceTransformer("all-MiniLM-L6-v2")
+except Exception:
+    EMBED_MODEL = None
+
+# Try to import supabase client. If missing, fallback to using psycopg2/pgconnection if env provided.
+SUPABASE_URL = os.getenv("SUPABASE_URL")
+SUPABASE_SERVICE_KEY = os.getenv("SUPABASE_SERVICE_KEY")
+
+try:
+    from supabase import create_client, Client as SupabaseClient
+    if SUPABASE_URL and SUPABASE_SERVICE_KEY:
+        SUPABASE = create_client(SUPABASE_URL, SUPABASE_SERVICE_KEY)
+    else:
+        SUPABASE = None
+except Exception:
+    SUPABASE = None
+
+# Try to import a robust text extractor lib. Use python-docx + plain open as fallback.
+try:
+    import textract  # optional powerful extractor
+except Exception:
+    textract = None
+
+import hashlib
+import json
+import re
+
+logger = logging.getLogger("ingestion_worker")
+logger.setLevel(os.getenv("LOG_LEVEL", "INFO"))
+
+
+# -----------------------
+# Utilities
+# -----------------------
+def extract_text_from_path(path: str) -> str:
+    """
+    Extract text from a given file path.
+    Supports: .txt, .md, .pdf (via textract if available), .docx (basic fallback)
+    """
+    p = Path(path)
+    if not p.exists():
+        raise FileNotFoundError(f"File not found: {path}")
+
+    suffix = p.suffix.lower()
+    if suffix in [".txt", ".md"]:
+        return p.read_text(encoding="utf-8", errors="ignore")
+
+    if textract is not None:
+        try:
+            raw = textract.process(str(p))
+            return raw.decode("utf-8", errors="ignore")
+        except Exception as e:
+            logger.warning("textract failed, falling back to basic read (%s)", e)
+
+    # basic docx fallback
+    if suffix == ".docx":
+        try:
+            from docx import Document as DocxDocument
+            doc = DocxDocument(str(p))
+            return "\n".join(par.text for par in doc.paragraphs)
+        except Exception:
+            logger.exception("docx extraction failed; returning empty text")
+            return ""
+
+    # last fallback: binary read as text
+    try:
+        return p.read_text(encoding="utf-8", errors="ignore")
+    except Exception:
+        logger.exception("unknown file type and text read failed")
+        return ""
+
+
+def simple_chunk_text(text: str, chunk_size: int = 800, chunk_overlap: int = 100) -> List[str]:
+    """
+    Very simple chunker that splits on sentences up to roughly chunk_size tokens/characters.
+    chunk_size is approximate (characters). Overlap is characters overlapped between chunks.
+    """
+    clean = re.sub(r"\s+", " ", text).strip()
+    if not clean:
+        return []
+
+    chunks = []
+    start = 0
+    n = len(clean)
+    while start < n:
+        end = min(n, start + chunk_size)
+        # try to expand to sentence boundary
+        if end < n:
+            m = clean.rfind(".", start, end)
+            if m != -1 and m - start > chunk_size // 3:
+                end = m + 1
+        chunk = clean[start:end].strip()
+        if chunk:
+            chunks.append(chunk)
+        start = max(end - chunk_overlap, end)
+    return chunks
+
+
+def embed_texts(texts: List[str]) -> List[List[float]]:
+    """
+    Use SentenceTransformer model if available; otherwise use a deterministic hash-based fallback vector.
+    The fallback returns a small vector (e.g. 64-d) computed from sha256 chunks — only for local dev/testing.
+    """
+    if EMBED_MODEL is not None:
+        vectors = EMBED_MODEL.encode(texts, show_progress_bar=False).tolist()
+        return vectors
+
+    # fallback
+    vecs = []
+    for t in texts:
+        h = hashlib.sha256(t.encode("utf-8")).digest()
+        # convert to floats in range [-1,1]
+        vals = []
+        for i in range(0, min(len(h), 64)):
+            vals.append(((h[i] / 255.0) * 2.0) - 1.0)
+        # pad to 64
+        while len(vals) < 64:
+            vals.append(0.0)
+        vecs.append(vals)
+    return vecs
+
+
+def upsert_embeddings_supabase(tenant_id: str, doc_id: str, chunks: List[Dict]):
+    """
+    Upsert chunk records into Supabase table `embeddings` (or 'rag_embeddings').
+
+    Expected schema (example):
+    - id (uuid)
+    - tenant_id (text)
+    - doc_id (text)
+    - chunk_index (int)
+    - chunk_text (text)
+    - metadata (jsonb)
+    - embedding (vector) -> in pgvector column
+    - created_at (timestamp)
+
+    This function attempts to use supabase-py. If not available, logs the JSON for manual insertion.
+    """
+    if SUPABASE is None:
+        logger.warning("Supabase client not configured. Logging chunks for manual insertion.")
+        logger.debug("Chunks sample: %s", json.dumps(chunks[:3], indent=2))
+        return {"status": "logged", "count": len(chunks)}
+
+    table_name = os.getenv("SUPABASE_EMBED_TABLE", "rag_embeddings")
+    # Build rows
+    rows = []
+    ts = int(time.time())
+    for c in chunks:
+        rows.append({
+            "tenant_id": tenant_id,
+            "doc_id": doc_id,
+            "chunk_index": c.get("index"),
+            "chunk_text": c.get("text"),
+            "metadata": c.get("metadata", {}),
+            "embedding": c.get("embedding"),
+            "created_at": time.strftime("%Y-%m-%d %H:%M:%S", time.gmtime(ts)),
+        })
+
+    # Use upsert
+    try:
+        res = SUPABASE.table(table_name).upsert(rows).execute()
+        logger.info("Upserted %d embeddings to Supabase table %s", len(rows), table_name)
+        return {"status": "ok", "count": len(rows), "result": res}
+    except Exception as e:
+        logger.exception("Failed to upsert embeddings to Supabase: %s", e)
+        return {"status": "error", "error": str(e)}
+
+
+# -----------------------
+# Celery task(s)
+# -----------------------
+# We import app lazily to avoid circular imports — celery app is in celeryconfig.py
+try:
+    from backend.workers.celeryconfig import celery_app
+except Exception:
+    # If import fails, create a simple local Celery-like decorator using dummy shared_task
+    celery_app = None
+
+
+def task_decorator(func):
+    if celery_app is not None:
+        return celery_app.task(func)
+    else:
+        # no-op: run synchronously for dev/testing
+        def wrapper(*args, **kwargs):
+            return func(*args, **kwargs)
+        return wrapper
+
+
+@task_decorator
+def ingest_document(tenant_id: str, doc_id: str,
+                    file_path: Optional[str] = None,
+                    raw_text: Optional[str] = None,
+                    source_url: Optional[str] = None,
+                    chunk_size: int = 800,
+                    chunk_overlap: int = 100):
+    """
+    End-to-end ingestion task.
+    - if raw_text provided, use it
+    - otherwise extract from file_path
+    - chunk, embed, and upsert into Supabase
+    Returns a dict with status and counts.
+    """
+    start_ts = time.time()
+    logger.info("ingest_document started: tenant=%s doc_id=%s", tenant_id, doc_id)
+
+    try:
+        if raw_text:
+            text = raw_text
+        elif file_path:
+            text = extract_text_from_path(file_path)
+        elif source_url:
+            # basic fetch for simple pages
+            import requests
+            r = requests.get(source_url, timeout=10)
+            r.raise_for_status()
+            text = re.sub(r"\s+", " ", r.text)
+        else:
+            raise ValueError("Either raw_text, file_path, or source_url must be provided.")
+
+        if not text or text.strip() == "":
+            logger.warning("No text extracted for doc_id=%s", doc_id)
+            return {"status": "empty", "chunks": 0}
+
+        chunks_text = simple_chunk_text(text, chunk_size=chunk_size, chunk_overlap=chunk_overlap)
+        logger.info("Extracted %d chunks for doc=%s", len(chunks_text), doc_id)
+
+        # Prepare chunk metadata
+        chunks = []
+        for i, t in enumerate(chunks_text):
+            chunks.append({"index": i, "text": t, "metadata": {"source_url": source_url}})
+
+        # embed in batches
+        batch_size = 32
+        embeddings = []
+        for i in range(0, len(chunks), batch_size):
+            batch_texts = [c["text"] for c in chunks[i:i+batch_size]]
+            batch_emb = embed_texts(batch_texts)
+            embeddings.extend(batch_emb)
+
+        # attach embeddings
+        for i, c in enumerate(chunks):
+            c["embedding"] = embeddings[i]
+
+        # upsert into supabase
+        res = upsert_embeddings_supabase(tenant_id, doc_id, chunks)
+
+        elapsed = time.time() - start_ts
+        logger.info("ingest_document finished: tenant=%s doc=%s chunks=%d elapsed=%.2fs",
+                    tenant_id, doc_id, len(chunks), elapsed)
+        return {"status": "ok", "chunks": len(chunks), "supabase": res}
+
+    except Exception as exc:
+        logger.exception("ingest_document failed: %s", exc)
+        return {"status": "error", "error": str(exc)}

backend/workers/scheduler.py

@@ -0,0 +1,37 @@
+"""
+backend/workers/scheduler.py
+
+Simple scheduler wiring for Celery beat.
+This file merely defines a schedule mapping that celeryconfig.py/ Celery app can import.
+
+You can use Celery Beat (celery -A backend.workers.celeryconfig beat) or
+run APScheduler to call the task functions if not using Celery beat.
+"""
+
+from datetime import timedelta
+import os
+
+# Recommended schedule configuration for production:
+SCHEDULE = {
+    # run daily metrics every day at midnight UTC
+    "daily-metrics": {
+        "task": "backend.workers.analytics_worker.compute_daily_metrics",
+        "schedule": {"type": "crontab", "hour": 0, "minute": 5},  # small delay after midnight
+    },
+    # run RAG quality checks nightly
+    "rag-quality-nightly": {
+        "task": "backend.workers.analytics_worker.compute_rag_quality",
+        "schedule": {"type": "crontab", "hour": 2, "minute": 30},
+        "args": (20, 3)
+    }
+}
+
+# If you prefer periodic seconds schedule (for local dev),
+# you can expose an alternate schedule via env:
+if os.getenv("LOCAL_CELERY_QUICK", "0") == "1":
+    SCHEDULE = {
+        "daily-metrics": {"task": "backend.workers.analytics_worker.compute_daily_metrics",
+                          "schedule": timedelta(seconds=60)},  # every minute for dev
+        "rag-quality": {"task": "backend.workers.analytics_worker.compute_rag_quality",
+                        "schedule": timedelta(seconds=120)}
+    }

frontend/README.md

@@ -1,36 +1,32 @@
-This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
+## IntegraChat Frontend
 
-## Getting Started
+Next.js 16 / React 19 app that showcases everything wired up in `backend/`.  
+It provides a polished operator console with:
 
-First, run the development server:
+- Hero + feature overview describing the FastAPI + MCP stack
+- Live chat panel that POSTs to `POST /agent/message`
+- Analytics snapshot pulling from `GET /analytics/overview`
+- Knowledge ingestion pipeline summary tied to Celery workers
+
+## Running Locally
 
 ```bash
+cd frontend
+npm install
 npm run dev
-# or
-yarn dev
-# or
-pnpm dev
-# or
-bun dev
 ```
 
-Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
-
-You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
-
-This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
-
-## Learn More
+Visit `http://localhost:3000`.
 
-To learn more about Next.js, take a look at the following resources:
+### API configuration
 
-- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
-- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+The UI calls the FastAPI service through `NEXT_PUBLIC_API_URL` (default `http://localhost:8000`).  
+Update `.env.local` if your backend runs elsewhere:
 
-You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
-
-## Deploy on Vercel
+```
+NEXT_PUBLIC_API_URL=http://localhost:8000
+```
 
-The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
+## Deploy
 
-Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.
+Deploy like any Next.js app (Vercel, Docker, etc.). Ensure the backend endpoints are reachable from the browser and CORS is enabled (already configured in `backend/api/main.py`).

frontend/app/globals.css

@@ -1,8 +1,12 @@
 @import "tailwindcss";
 
 :root {
-  --background: #ffffff;
-  --foreground: #171717;
+  --background: #020617;
+  --foreground: #f8fafc;
+  --card: rgba(12, 17, 32, 0.88);
+  --card-border: rgba(255, 255, 255, 0.08);
+  --accent: #38bdf8;
+  --accent-strong: #0ea5e9;
 }
 
 @theme inline {
@@ -12,15 +16,101 @@
   --font-mono: var(--font-geist-mono);
 }
 
-@media (prefers-color-scheme: dark) {
-  :root {
-    --background: #0a0a0a;
-    --foreground: #ededed;
-  }
-}
-
 body {
-  background: var(--background);
+  min-height: 100vh;
+  margin: 0;
+  background: radial-gradient(
+      circle at top,
+      rgba(14, 165, 233, 0.15),
+      transparent 45%
+    ),
+    radial-gradient(
+      circle at 20% 20%,
+      rgba(59, 130, 246, 0.18),
+      transparent 35%
+    ),
+    var(--background);
   color: var(--foreground);
-  font-family: Arial, Helvetica, sans-serif;
+  font-family: var(--font-geist-sans), system-ui, -apple-system, BlinkMacSystemFont,
+    "Segoe UI", sans-serif;
+  line-height: 1.5;
+}
+
+::selection {
+  background: rgba(14, 165, 233, 0.35);
+  color: #f8fafc;
+}
+
+.gradient-border {
+  position: relative;
+  border-radius: 28px;
+  background: radial-gradient(
+    circle at 10% 20%,
+    rgba(59, 130, 246, 0.35),
+    rgba(15, 23, 42, 0.95)
+  );
+  overflow: hidden;
+}
+
+.gradient-border::before {
+  content: "";
+  position: absolute;
+  inset: 0;
+  padding: 1.5px;
+  border-radius: 30px;
+  background: linear-gradient(120deg, #60a5fa, #22d3ee, #f97316);
+  mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
+  mask-composite: exclude;
+  -webkit-mask: linear-gradient(#fff 0 0) content-box,
+    linear-gradient(#fff 0 0);
+  -webkit-mask-composite: xor;
+  pointer-events: none;
+  opacity: 0.9;
+}
+
+.glass-panel {
+  background: var(--card);
+  border: 1px solid var(--card-border);
+  border-radius: 24px;
+  box-shadow: 0 20px 60px rgba(2, 6, 23, 0.65);
+  backdrop-filter: blur(18px);
+}
+
+.badge {
+  border-radius: 999px;
+  background: rgba(56, 189, 248, 0.12);
+  color: #bae6fd;
+  font-size: 0.85rem;
+  padding: 0.25rem 0.9rem;
+  display: inline-flex;
+  align-items: center;
+  gap: 0.4rem;
+  border: 1px solid rgba(56, 189, 248, 0.4);
+}
+
+.grid-fade {
+  position: absolute;
+  inset: 0;
+  background-image: linear-gradient(
+      rgba(248, 250, 252, 0.04) 1px,
+      transparent 1px
+    ),
+    linear-gradient(90deg, rgba(248, 250, 252, 0.04) 1px, transparent 1px);
+  background-size: 50px 50px;
+  opacity: 0.4;
+  pointer-events: none;
+}
+
+.scrollArea {
+  scrollbar-width: thin;
+  scrollbar-color: rgba(56, 189, 248, 0.6) transparent;
+}
+
+.scrollArea::-webkit-scrollbar {
+  width: 6px;
+}
+
+.scrollArea::-webkit-scrollbar-thumb {
+  background: rgba(56, 189, 248, 0.45);
+  border-radius: 999px;
 }

frontend/app/knowledge-base/page.tsx

@@ -0,0 +1,280 @@
+"use client";
+
+import { useState, useEffect } from "react";
+import Link from "next/link";
+
+type Document = {
+  id: number;
+  text: string;
+  created_at: string | null;
+};
+
+type DocumentListResponse = {
+  documents: Document[];
+  total: number;
+  limit: number;
+  offset: number;
+};
+
+const API_BASE =
+  process.env.NEXT_PUBLIC_API_URL?.replace(/\/$/, "") || "http://localhost:8000";
+
+export default function KnowledgeBasePage() {
+  const [tenantId, setTenantId] = useState("tenant123");
+  const [documents, setDocuments] = useState<Document[]>([]);
+  const [total, setTotal] = useState(0);
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const [searchFilter, setSearchFilter] = useState("");
+  const [filterType, setFilterType] = useState<"all" | "pdf" | "text" | "faq" | "link">("all");
+
+  async function loadDocuments() {
+    setLoading(true);
+    setError(null);
+
+    try {
+      const response = await fetch(
+        `${API_BASE}/rag/list?limit=1000&offset=0`,
+        {
+          headers: {
+            "x-tenant-id": tenantId,
+          },
+        },
+      );
+
+      if (!response.ok) {
+        throw new Error(`Failed to load documents: ${response.status}`);
+      }
+
+      const data: DocumentListResponse = await response.json();
+      setDocuments(data.documents || []);
+      setTotal(data.total || 0);
+    } catch (err) {
+      console.error(err);
+      setError(
+        err instanceof Error
+          ? err.message
+          : "Failed to load knowledge base. Is the RAG MCP server running?",
+      );
+    } finally {
+      setLoading(false);
+    }
+  }
+
+  useEffect(() => {
+    loadDocuments();
+  }, [tenantId]);
+
+  // Filter documents based on search and type
+  const filteredDocuments = documents.filter((doc) => {
+    const matchesSearch =
+      !searchFilter ||
+      doc.text.toLowerCase().includes(searchFilter.toLowerCase());
+    
+    // Simple heuristics for document type detection
+    const textLower = doc.text.toLowerCase();
+    let docType: "pdf" | "text" | "faq" | "link" = "text";
+    
+    if (textLower.includes("http://") || textLower.includes("https://") || textLower.includes("www.")) {
+      docType = "link";
+    } else if (
+      textLower.includes("q:") ||
+      textLower.includes("question:") ||
+      textLower.includes("faq") ||
+      textLower.includes("frequently asked")
+    ) {
+      docType = "faq";
+    } else if (textLower.includes(".pdf") || textLower.includes("pdf document")) {
+      docType = "pdf";
+    }
+
+    const matchesType = filterType === "all" || docType === filterType;
+    return matchesSearch && matchesType;
+  });
+
+  const getDocumentType = (text: string): "pdf" | "text" | "faq" | "link" => {
+    const textLower = text.toLowerCase();
+    if (textLower.includes("http://") || textLower.includes("https://") || textLower.includes("www.")) {
+      return "link";
+    } else if (
+      textLower.includes("q:") ||
+      textLower.includes("question:") ||
+      textLower.includes("faq") ||
+      textLower.includes("frequently asked")
+    ) {
+      return "faq";
+    } else if (textLower.includes(".pdf") || textLower.includes("pdf document")) {
+      return "pdf";
+    }
+    return "text";
+  };
+
+  const getTypeColor = (type: string) => {
+    switch (type) {
+      case "pdf":
+        return "bg-red-500/20 text-red-300 border-red-500/30";
+      case "faq":
+        return "bg-purple-500/20 text-purple-300 border-purple-500/30";
+      case "link":
+        return "bg-blue-500/20 text-blue-300 border-blue-500/30";
+      default:
+        return "bg-slate-500/20 text-slate-300 border-slate-500/30";
+    }
+  };
+
+  return (
+    <main className="mx-auto flex min-h-screen max-w-7xl flex-col gap-8 px-4 pb-16 pt-12 sm:px-6 lg:px-8">
+      {/* Header */}
+      <header className="flex flex-wrap items-center justify-between gap-4 rounded-2xl border border-white/10 bg-white/5 px-6 py-4 text-sm text-slate-100 shadow-lg shadow-slate-950/40">
+        <div className="flex items-center gap-3">
+          <Link
+            href="/"
+            className="inline-flex h-10 w-10 items-center justify-center rounded-2xl bg-gradient-to-br from-sky-400 to-cyan-500 text-slate-950 transition hover:scale-105"
+          >
+            ←
+          </Link>
+          <div>
+            <h1 className="text-xl font-semibold">Knowledge Base Library</h1>
+            <p className="text-xs text-slate-400">
+              All ingested documents, PDFs, FAQs, links, and text content
+            </p>
+          </div>
+        </div>
+        <div className="flex items-center gap-3">
+          <input
+            value={tenantId}
+            onChange={(e) => setTenantId(e.target.value)}
+            placeholder="Tenant ID"
+            className="rounded-full border border-white/15 bg-white/10 px-4 py-1.5 text-sm text-white outline-none focus:border-cyan-300"
+          />
+          <button
+            onClick={loadDocuments}
+            disabled={loading}
+            className="rounded-full bg-gradient-to-r from-sky-400 to-cyan-500 px-5 py-2 text-sm font-semibold text-slate-950 shadow-lg shadow-cyan-500/30 transition hover:-translate-y-0.5 disabled:opacity-60"
+          >
+            {loading ? "Loading…" : "Refresh"}
+          </button>
+        </div>
+      </header>
+
+      {/* Stats & Filters */}
+      <div className="flex flex-wrap items-center justify-between gap-4 rounded-2xl border border-white/10 bg-slate-950/40 p-6">
+        <div className="flex flex-wrap items-center gap-6">
+          <div>
+            <p className="text-xs uppercase tracking-widest text-slate-400">
+              Total Documents
+            </p>
+            <p className="mt-1 text-2xl font-semibold text-white">{total}</p>
+          </div>
+          <div>
+            <p className="text-xs uppercase tracking-widest text-slate-400">
+              Filtered
+            </p>
+            <p className="mt-1 text-2xl font-semibold text-cyan-300">
+              {filteredDocuments.length}
+            </p>
+          </div>
+        </div>
+
+        <div className="flex flex-wrap items-center gap-3">
+          <input
+            type="text"
+            placeholder="Search documents..."
+            value={searchFilter}
+            onChange={(e) => setSearchFilter(e.target.value)}
+            className="rounded-full border border-white/10 bg-white/5 px-4 py-2 text-sm text-white outline-none focus:border-cyan-300"
+          />
+          <div className="flex gap-2">
+            {(["all", "text", "pdf", "faq", "link"] as const).map((type) => (
+              <button
+                key={type}
+                onClick={() => setFilterType(type)}
+                className={`rounded-full px-4 py-2 text-xs font-semibold uppercase tracking-wider transition ${
+                  filterType === type
+                    ? "bg-cyan-500 text-slate-950"
+                    : "bg-white/5 text-slate-300 hover:bg-white/10"
+                }`}
+              >
+                {type}
+              </button>
+            ))}
+          </div>
+        </div>
+      </div>
+
+      {/* Error Message */}
+      {error && (
+        <div className="rounded-2xl border border-red-500/40 bg-red-500/10 px-6 py-4 text-red-200">
+          <p className="font-semibold">Error loading knowledge base</p>
+          <p className="mt-1 text-sm">{error}</p>
+        </div>
+      )}
+
+      {/* Documents Grid */}
+      {loading ? (
+        <div className="flex items-center justify-center py-20">
+          <p className="text-slate-400">Loading documents...</p>
+        </div>
+      ) : filteredDocuments.length === 0 ? (
+        <div className="flex flex-col items-center justify-center rounded-2xl border border-white/10 bg-slate-950/40 py-20">
+          <p className="text-lg font-semibold text-slate-300">
+            No documents found
+          </p>
+          <p className="mt-2 text-sm text-slate-400">
+            {documents.length === 0
+              ? "Start by ingesting some content in the Knowledge Base panel."
+              : "Try adjusting your search or filter criteria."}
+          </p>
+        </div>
+      ) : (
+        <div className="grid gap-4 md:grid-cols-2 lg:grid-cols-3">
+          {filteredDocuments.map((doc) => {
+            const docType = getDocumentType(doc.text);
+            const preview = doc.text.slice(0, 200) + (doc.text.length > 200 ? "..." : "");
+            
+            return (
+              <div
+                key={doc.id}
+                className="group relative rounded-2xl border border-white/10 bg-slate-950/40 p-5 transition hover:border-cyan-500/50 hover:bg-slate-900/60"
+              >
+                <div className="mb-3 flex items-start justify-between gap-2">
+                  <span
+                    className={`rounded-full border px-2.5 py-1 text-xs font-semibold uppercase tracking-wider ${getTypeColor(
+                      docType,
+                    )}`}
+                  >
+                    {docType}
+                  </span>
+                  {doc.created_at && (
+                    <span className="text-xs text-slate-500">
+                      {new Date(doc.created_at).toLocaleDateString()}
+                    </span>
+                  )}
+                </div>
+                <p className="text-sm leading-relaxed text-slate-200 line-clamp-6">
+                  {preview}
+                </p>
+                <div className="mt-4 flex items-center gap-2 text-xs text-slate-400">
+                  <span>ID: {doc.id}</span>
+                  <span>•</span>
+                  <span>{doc.text.length} chars</span>
+                </div>
+              </div>
+            );
+          })}
+        </div>
+      )}
+
+      {/* Footer */}
+      <div className="mt-8 rounded-2xl border border-white/10 bg-white/5 px-6 py-4 text-center text-sm text-slate-400">
+        <p>
+          Knowledge base powered by pgvector + MiniLM embeddings •{" "}
+          <Link href="/" className="text-cyan-300 hover:text-cyan-200">
+            Back to Console
+          </Link>
+        </p>
+      </div>
+    </main>
+  );
+}
+

frontend/app/layout.tsx

@@ -13,8 +13,9 @@ const geistMono = Geist_Mono({
 });
 
 export const metadata: Metadata = {
-  title: "Create Next App",
-  description: "Generated by create next app",
+  title: "IntegraChat | Multi-Agent Governance Console",
+  description:
+    "Operate the IntegraChat MCP stack with live chat, knowledge ingestion, and compliance analytics.",
 };
 
 export default function RootLayout({

frontend/app/page.tsx

@@ -1,65 +1,31 @@
-import Image from "next/image";
+import { AnalyticsPanel } from "@/components/analytics-panel";
+import { ChatPanel } from "@/components/chat-panel";
+import { FeatureGrid } from "@/components/feature-grid";
+import { Footer } from "@/components/footer";
+import { Hero } from "@/components/hero";
+import { KnowledgeBasePanel } from "@/components/knowledge-base-panel";
 
 export default function Home() {
   return (
-    <div className="flex min-h-screen items-center justify-center bg-zinc-50 font-sans dark:bg-black">
-      <main className="flex min-h-screen w-full max-w-3xl flex-col items-center justify-between py-32 px-16 bg-white dark:bg-black sm:items-start">
-        <Image
-          className="dark:invert"
-          src="/next.svg"
-          alt="Next.js logo"
-          width={100}
-          height={20}
-          priority
-        />
-        <div className="flex flex-col items-center gap-6 text-center sm:items-start sm:text-left">
-          <h1 className="max-w-xs text-3xl font-semibold leading-10 tracking-tight text-black dark:text-zinc-50">
-            To get started, edit the page.tsx file.
-          </h1>
-          <p className="max-w-md text-lg leading-8 text-zinc-600 dark:text-zinc-400">
-            Looking for a starting point or more instructions? Head over to{" "}
-            <a
-              href="https://vercel.com/templates?framework=next.js&utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-              className="font-medium text-zinc-950 dark:text-zinc-50"
-            >
-              Templates
-            </a>{" "}
-            or the{" "}
-            <a
-              href="https://nextjs.org/learn?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-              className="font-medium text-zinc-950 dark:text-zinc-50"
-            >
-              Learning
-            </a>{" "}
-            center.
-          </p>
+    <main className="mx-auto flex min-h-screen max-w-6xl flex-col gap-10 px-4 pb-16 pt-12 sm:px-6 lg:px-8">
+      <header className="flex flex-wrap items-center justify-between gap-3 rounded-2xl border border-white/10 bg-white/5 px-6 py-4 text-sm text-slate-100 shadow-lg shadow-slate-950/40">
+        <div className="flex items-center gap-3 text-base font-semibold">
+          <span className="inline-flex h-10 w-10 items-center justify-center rounded-2xl bg-gradient-to-br from-sky-400 to-cyan-500 text-slate-950">
+            IC
+          </span>
+          IntegraChat Operator Console
         </div>
-        <div className="flex flex-col gap-4 text-base font-medium sm:flex-row">
-          <a
-            className="flex h-12 w-full items-center justify-center gap-2 rounded-full bg-foreground px-5 text-background transition-colors hover:bg-[#383838] dark:hover:bg-[#ccc] md:w-[158px]"
-            href="https://vercel.com/new?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            <Image
-              className="dark:invert"
-              src="/vercel.svg"
-              alt="Vercel logomark"
-              width={16}
-              height={16}
-            />
-            Deploy Now
-          </a>
-          <a
-            className="flex h-12 w-full items-center justify-center rounded-full border border-solid border-black/[.08] px-5 transition-colors hover:border-transparent hover:bg-black/[.04] dark:border-white/[.145] dark:hover:bg-[#1a1a1a] md:w-[158px]"
-            href="https://nextjs.org/docs?utm_source=create-next-app&utm_medium=appdir-template-tw&utm_campaign=create-next-app"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            Documentation
-          </a>
+        <div className="flex flex-wrap items-center gap-3 text-xs uppercase tracking-[0.4em] text-slate-400">
+          FastAPI · MCP Servers · Celery · Next.js
         </div>
-      </main>
-    </div>
+      </header>
+
+      <Hero />
+      <FeatureGrid />
+      <KnowledgeBasePanel />
+      <ChatPanel />
+      <AnalyticsPanel />
+      <Footer />
+    </main>
   );
 }

frontend/components/analytics-panel.tsx

@@ -0,0 +1,146 @@
+"use client";
+
+import { useState } from "react";
+
+type AnalyticsOverview = {
+  overview: {
+    total_queries: number;
+    tool_usage: Record<string, number>;
+    redflag_count: number;
+    active_users: number;
+  };
+};
+
+const API_BASE =
+  process.env.NEXT_PUBLIC_API_URL?.replace(/\/$/, "") || "http://localhost:8000";
+
+export function AnalyticsPanel() {
+  const [tenantId, setTenantId] = useState("tenant123");
+  const [loading, setLoading] = useState(false);
+  const [error, setError] = useState<string | null>(null);
+  const [data, setData] = useState<AnalyticsOverview["overview"] | null>(null);
+
+  async function fetchAnalytics() {
+    setLoading(true);
+    setError(null);
+    try {
+      const res = await fetch(`${API_BASE}/analytics/overview`, {
+        headers: {
+          "x-tenant-id": tenantId,
+        },
+      });
+      if (!res.ok) {
+        throw new Error(`Analytics endpoint returned ${res.status}`);
+      }
+      const payload: AnalyticsOverview = await res.json();
+      setData(payload.overview);
+    } catch (err) {
+      console.error(err);
+      setError(
+        err instanceof Error
+          ? err.message
+          : "Unable to reach analytics API. Is the FastAPI service running?",
+      );
+    } finally {
+      setLoading(false);
+    }
+  }
+
+  return (
+    <section
+      id="analytics"
+      className="glass-panel border border-white/10 p-6 text-white"
+    >
+      <div className="flex flex-wrap items-center justify-between gap-4">
+        <div>
+          <p className="text-sm uppercase tracking-[0.5em] text-cyan-200/70">
+            Compliance Pulse
+          </p>
+          <h2 className="mt-2 text-3xl font-semibold">Analytics snapshot</h2>
+        </div>
+        <div className="flex flex-col gap-2 text-sm text-slate-200">
+          <label className="text-xs uppercase tracking-widest text-slate-400">
+            Tenant ID
+          </label>
+          <input
+            value={tenantId}
+            onChange={(e) => setTenantId(e.target.value)}
+            className="rounded-full border border-white/15 bg-white/10 px-4 py-1.5 text-sm text-white outline-none focus:border-cyan-300"
+          />
+        </div>
+        <button
+          onClick={fetchAnalytics}
+          disabled={loading}
+          className="rounded-full bg-white/90 px-5 py-2.5 text-sm font-semibold text-slate-900 shadow-lg shadow-cyan-500/30 transition hover:-translate-y-0.5 disabled:opacity-60"
+        >
+          {loading ? "Loading…" : "Refresh metrics"}
+        </button>
+      </div>
+
+      <div className="mt-6 grid gap-4 md:grid-cols-4">
+        {["total_queries", "active_users", "redflag_count"].map((key) => (
+          <div
+            key={key}
+            className="rounded-2xl border border-white/5 bg-slate-900/40 p-4 text-center"
+          >
+            <p className="text-sm uppercase tracking-widest text-slate-400">
+              {key.replace("_", " ")}
+            </p>
+            <p className="mt-2 text-3xl font-semibold">
+              {data ? data[key as keyof typeof data] : "—"}
+            </p>
+          </div>
+        ))}
+        <div className="rounded-2xl border border-white/5 bg-slate-900/40 p-4 text-center">
+          <p className="text-sm uppercase tracking-widest text-slate-400">
+            Tool usage (top)
+          </p>
+          <p className="mt-2 text-3xl font-semibold">
+            {data
+              ? Object.entries(data.tool_usage)
+                  .sort((a, b) => b[1] - a[1])[0]?.[0] ?? "—"
+              : "—"}
+          </p>
+        </div>
+      </div>
+
+      <div className="mt-6 rounded-2xl border border-white/5 bg-slate-950/50 p-4">
+        <p className="text-sm uppercase tracking-[0.5em] text-slate-400">
+          Raw tool usage
+        </p>
+        <div className="mt-4 grid gap-3 sm:grid-cols-3">
+          {data
+            ? Object.entries(data.tool_usage).map(([tool, count]) => (
+                <div
+                  key={tool}
+                  className="rounded-xl border border-white/10 bg-white/5 px-4 py-3"
+                >
+                  <p className="text-sm uppercase tracking-widest text-slate-400">
+                    {tool}
+                  </p>
+                  <p className="text-2xl font-semibold text-white">{count}</p>
+                </div>
+              ))
+            : Array.from({ length: 3 }).map((_, idx) => (
+                <div
+                  key={idx}
+                  className="rounded-xl border border-white/10 bg-white/5 px-4 py-3 text-slate-500"
+                >
+                  <p className="text-sm uppercase tracking-widest text-slate-500">
+                    Tool {idx + 1}
+                  </p>
+                  <p className="text-2xl font-semibold text-slate-500">—</p>
+                </div>
+              ))}
+        </div>
+      </div>
+
+      {error && (
+        <p className="mt-4 rounded-2xl border border-red-500/40 bg-red-500/10 px-4 py-3 text-sm text-red-200">
+          {error}
+        </p>
+      )}
+    </section>
+  );
+}
+

frontend/components/chat-panel.tsx

@@ -0,0 +1,179 @@
+"use client";
+
+import { useMemo, useState } from "react";
+
+type Message = {
+  role: "user" | "assistant" | "system";
+  content: string;
+  meta?: string;
+};
+
+const API_BASE =
+  process.env.NEXT_PUBLIC_API_URL?.replace(/\/$/, "") || "http://localhost:8000";
+
+export function ChatPanel() {
+  const [tenantId, setTenantId] = useState("tenant123");
+  const [message, setMessage] = useState("");
+  const [isSending, setIsSending] = useState(false);
+  const [history, setHistory] = useState<Message[]>([
+    {
+      role: "assistant",
+      content:
+        "Hi there! I’m the IntegraChat orchestrator. Ask anything about your tenant data and I will route the right MCP tools.",
+      meta: "Agent ready",
+    },
+  ]);
+  const [lastDecision, setLastDecision] = useState<string | null>(null);
+
+  const conversationPayload = useMemo(
+    () =>
+      history
+        .filter((m) => m.role !== "system")
+        .map((m) => ({
+          role: m.role,
+          content: m.content,
+        })),
+    [history],
+  );
+
+  async function handleSend() {
+    if (!message.trim() || isSending) return;
+    const userMessage: Message = { role: "user", content: message.trim() };
+    const optimisticHistory = [...history, userMessage];
+    setHistory(optimisticHistory);
+    setMessage("");
+    setIsSending(true);
+
+    try {
+      const response = await fetch(`${API_BASE}/agent/message`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+        },
+        body: JSON.stringify({
+          tenant_id: tenantId,
+          message: userMessage.content,
+          conversation_history: conversationPayload,
+          temperature: 0,
+        }),
+      });
+
+      if (!response.ok) {
+        throw new Error(
+          `API error (${response.status}) – check backend/api/main.py`,
+        );
+      }
+
+      const data = await response.json();
+      const assistantText =
+        data?.text ??
+        "Agent responded but text field was empty. Inspect FastAPI logs for clues.";
+      setHistory((prev) => [
+        ...prev,
+        {
+          role: "assistant",
+          content: assistantText,
+          meta: data?.decision?.reason ?? "response",
+        },
+      ]);
+      setLastDecision(
+        data?.decision
+          ? `${data.decision.action} · ${data.decision.tool ?? "llm"}`
+          : null,
+      );
+    } catch (err) {
+      console.error(err);
+      setHistory((prev) => [
+        ...prev,
+        {
+          role: "assistant",
+          content:
+            err instanceof Error
+              ? err.message
+              : "Failed to reach the FastAPI gateway.",
+          meta: "error",
+        },
+      ]);
+      setLastDecision("error");
+    } finally {
+      setIsSending(false);
+    }
+  }
+
+  return (
+    <section
+      id="chat"
+      className="gradient-border relative rounded-[28px] p-1 text-white"
+    >
+      <div className="glass-panel relative rounded-[26px] p-6">
+        <div className="flex flex-wrap items-center justify-between gap-4">
+          <div>
+            <p className="text-sm uppercase tracking-[0.5em] text-cyan-200/70">
+              Orchestrator Console
+            </p>
+            <h2 className="mt-2 text-3xl font-semibold">
+              Talk to your enterprise agent
+            </h2>
+          </div>
+          <div className="flex flex-col gap-2 text-sm text-slate-200">
+            <label className="text-xs uppercase tracking-widest text-slate-400">
+              Tenant ID
+            </label>
+            <input
+              value={tenantId}
+              onChange={(e) => setTenantId(e.target.value)}
+              className="rounded-full border border-white/15 bg-white/10 px-4 py-1.5 text-sm text-white outline-none focus:border-cyan-300"
+            />
+          </div>
+        </div>
+        <div className="mt-6 h-[360px] space-y-3 overflow-y-auto rounded-2xl border border-white/10 bg-slate-950/40 p-4 scrollArea">
+          {history.map((msg, idx) => (
+            <div
+              key={`${msg.role}-${idx}`}
+              className={`flex gap-3 rounded-2xl px-4 py-3 ${
+                msg.role === "user"
+                  ? "bg-slate-900/70 text-slate-100"
+                  : "bg-cyan-500/10 text-slate-100"
+              }`}
+            >
+              <span className="text-xs font-semibold uppercase tracking-widest text-cyan-200/80">
+                {msg.role}
+              </span>
+              <div className="space-y-1 text-sm">
+                <p>{msg.content}</p>
+                {msg.meta && (
+                  <p className="text-xs text-slate-400">{msg.meta}</p>
+                )}
+              </div>
+            </div>
+          ))}
+        </div>
+
+        <div className="mt-5 flex flex-col gap-3 md:flex-row">
+          <textarea
+            placeholder="Ask about policies, knowledge base hits, or route through RAG/Web/Admin..."
+            value={message}
+            onChange={(e) => setMessage(e.target.value)}
+            className="flex-1 rounded-2xl border border-white/10 bg-white/5 px-4 py-3 text-sm text-white outline-none focus:border-cyan-200/80"
+            rows={3}
+          />
+          <button
+            onClick={handleSend}
+            disabled={isSending}
+            className="min-w-[160px] rounded-2xl bg-gradient-to-r from-sky-400 to-cyan-500 px-6 py-3 font-semibold text-slate-950 shadow-lg shadow-cyan-500/30 transition hover:-translate-y-0.5 disabled:cursor-not-allowed disabled:opacity-60"
+          >
+            {isSending ? "Routing…" : "Send to MCP"}
+          </button>
+        </div>
+
+        <div className="mt-4 flex items-center gap-3 text-sm text-slate-300">
+          <span className="h-2 w-2 rounded-full bg-emerald-400 shadow-[0_0_12px_#34d399]" />
+          {lastDecision
+            ? `Last decision: ${lastDecision}`
+            : "No tool invocation yet"}
+        </div>
+      </div>
+    </section>
+  );
+}
+

frontend/components/feature-grid.tsx

@@ -0,0 +1,56 @@
+const features = [
+  {
+    title: "Agent Orchestrator",
+    description:
+      "Observability for the FastAPI orchestrator: intents, tool routing, red-flag blocking, and reasoning traces.",
+    tag: "backend/api/services/agent_orchestrator.py",
+  },
+  {
+    title: "Knowledge RAG MCP",
+    description:
+      "Ingest docs, embed with MiniLM, and search tenant-scoped corpora via pgvector—all from the UI.",
+    tag: "backend/mcp_servers/main.py",
+  },
+  {
+    title: "Governance Policies",
+    description:
+      "Create, test, and ship regex + semantic rule packs that instantly sync to Admin MCP and Celery alerts.",
+    tag: "backend/api/services/redflag_detector.py",
+  },
+  {
+    title: "Analytics + Workers",
+    description:
+      "Monitor Celery ingestion throughput, tool usage trends, and daily compliance KPIs in one glance.",
+    tag: "backend/workers/*",
+  },
+];
+
+export function FeatureGrid() {
+  return (
+    <section className="grid gap-6 md:grid-cols-2">
+      {features.map((feature) => (
+        <article
+          key={feature.title}
+          className="glass-panel flex flex-col justify-between p-6 transition hover:-translate-y-1 hover:border-cyan-300/50"
+        >
+          <div>
+            <p className="text-xs uppercase tracking-[0.3em] text-slate-400">
+              {feature.tag}
+            </p>
+            <h3 className="mt-4 text-2xl font-semibold text-white">
+              {feature.title}
+            </h3>
+            <p className="mt-4 text-base text-slate-300">
+              {feature.description}
+            </p>
+          </div>
+          <div className="mt-6 inline-flex items-center gap-2 text-sm text-cyan-200">
+            <span className="h-1.5 w-1.5 rounded-full bg-cyan-400" />
+            Ready to run
+          </div>
+        </article>
+      ))}
+    </section>
+  );
+}
+

frontend/components/footer.tsx

@@ -0,0 +1,15 @@
+export function Footer() {
+  return (
+    <footer className="mt-16 flex flex-col items-center gap-3 border-t border-white/5 py-8 text-center text-sm text-slate-400">
+      <p>
+        IntegraChat · FastAPI + Next.js reference console for multi-agent MCP
+        stacks.
+      </p>
+      <p className="text-xs">
+        Need backend ports? API 8000 · RAG 8001 · Web 8002 · Admin 8003 · update
+        env via <code className="rounded bg-white/5 px-1">NEXT_PUBLIC_API_URL</code>
+      </p>
+    </footer>
+  );
+}
+

frontend/components/hero.tsx

@@ -0,0 +1,100 @@
+import Link from "next/link";
+
+const stats = [
+  { label: "Multi-tenant agents", value: "3 MCPs" },
+  { label: "Policies enforced", value: "128 rules" },
+  { label: "Avg. response time", value: "1.8s" },
+];
+
+export function Hero() {
+  return (
+    <section className="relative overflow-hidden rounded-[32px] border border-white/10 bg-gradient-to-br from-slate-900 via-slate-900/70 to-cyan-900/40 p-10 text-white shadow-2xl">
+      <div className="grid gap-12 md:grid-cols-[1.2fr,0.8fr]">
+        <div className="space-y-8">
+          <span className="badge">
+            <span className="h-2 w-2 rounded-full bg-cyan-400" />
+            realtime oversight
+          </span>
+          <h1 className="text-4xl font-semibold leading-tight md:text-5xl">
+            Run chat agents, red-flag governance, and analytics from a single
+            console.
+          </h1>
+          <p className="text-lg text-slate-200">
+            IntegraChat brings together the FastAPI backend, MCP tool servers,
+            and compliance automation into a cohesive operator experience.
+            Trigger conversations, inspect tool traces, and stream policy
+            alerts—without leaving the browser.
+          </p>
+          <div className="flex flex-wrap gap-4 text-base font-medium">
+            <Link
+              href="#chat"
+              className="rounded-full bg-white/90 px-6 py-3 text-slate-900 shadow-lg shadow-cyan-500/30 transition hover:-translate-y-0.5 hover:bg-white"
+            >
+              Launch chat workspace
+            </Link>
+            <Link
+              href="#analytics"
+              className="rounded-full border border-white/30 px-6 py-3 text-white transition hover:border-cyan-300/70 hover:text-cyan-100"
+            >
+              View governance metrics
+            </Link>
+          </div>
+        </div>
+        <div className="glass-panel p-6">
+          <p className="text-sm uppercase tracking-[0.3em] text-cyan-200/70">
+            Stack Snapshot
+          </p>
+          <ul className="mt-6 space-y-4 text-sm text-slate-100">
+            <li className="flex items-center justify-between rounded-2xl bg-white/5 px-4 py-3">
+              <div>
+                <p className="text-xs uppercase tracking-wider text-slate-300">
+                  API Gateway
+                </p>
+                <p className="font-semibold text-white">FastAPI 0.110 + CORS</p>
+              </div>
+              <span className="text-xs text-slate-300">backend/api</span>
+            </li>
+            <li className="flex items-center justify-between rounded-2xl bg-white/5 px-4 py-3">
+              <div>
+                <p className="text-xs uppercase tracking-wider text-slate-300">
+                  MCP Servers
+                </p>
+                <p className="font-semibold text-white">
+                  RAG · Web · Admin policy
+                </p>
+              </div>
+              <span className="text-xs text-slate-300">ports 8001-8003</span>
+            </li>
+            <li className="flex items-center justify-between rounded-2xl bg-white/5 px-4 py-3">
+              <div>
+                <p className="text-xs uppercase tracking-wider text-slate-300">
+                  Workers
+                </p>
+                <p className="font-semibold text-white">
+                  Celery ingestion + analytics
+                </p>
+              </div>
+              <span className="text-xs text-slate-300">beat + workers</span>
+            </li>
+          </ul>
+          <div className="mt-6 grid gap-4 rounded-2xl border border-white/10 bg-slate-900/30 p-5 text-center sm:grid-cols-3">
+            {stats.map((stat) => (
+              <div key={stat.label}>
+                <p className="text-2xl font-semibold text-white">
+                  {stat.value}
+                </p>
+                <p className="text-xs uppercase tracking-wider text-slate-400">
+                  {stat.label}
+                </p>
+              </div>
+            ))}
+          </div>
+        </div>
+      </div>
+      <div className="pointer-events-none absolute inset-0 opacity-40">
+        <div className="grid-fade" />
+      </div>
+    </section>
+  );
+}
+

frontend/components/ingestion-card.tsx

@@ -0,0 +1,56 @@
+const steps = [
+  {
+    title: "Chunk & Embed",
+    detail:
+      "Uploads land in Celery ingestion workers, chunked to 800 chars with 100 overlap, and embedded via MiniLM or hash fallback.",
+  },
+  {
+    title: "Supabase / pgvector",
+    detail:
+      "Chunks upsert into tenant-scoped tables with metadata, ready for RAG MCP retrieval.",
+  },
+  {
+    title: "Quality Tasks",
+    detail:
+      "Nightly analytics + RAG precision@k jobs run through Celery beat (`scheduler.py`).",
+  },
+];
+
+export function IngestionCard() {
+  return (
+    <section className="glass-panel border border-white/10 p-6 text-white">
+      <div className="flex flex-col gap-4 md:flex-row md:items-start md:justify-between">
+        <div>
+          <p className="text-sm uppercase tracking-[0.5em] text-cyan-200/70">
+            Knowledge Ops
+          </p>
+          <h2 className="mt-2 text-3xl font-semibold">Ingestion pipeline</h2>
+          <p className="mt-4 text-base text-slate-300">
+            Drop PDFs, DOCX, MD, or direct raw text and let Celery handle the
+            rest. Every step mirrors the backend implementation in
+            `backend/workers/ingestion_worker.py`, so what you see locally is
+            what ships to production.
+          </p>
+        </div>
+        <div className="rounded-full border border-white/10 bg-white/10 px-4 py-2 text-sm text-slate-100">
+          Celery broker / beat ready
+        </div>
+      </div>
+      <ol className="mt-6 grid gap-4 md:grid-cols-3">
+        {steps.map((step, idx) => (
+          <li
+            key={step.title}
+            className="rounded-2xl border border-white/10 bg-slate-950/40 p-4"
+          >
+            <p className="text-xs uppercase tracking-[0.4em] text-slate-400">
+              Step {idx + 1}
+            </p>
+            <h3 className="mt-2 text-xl font-semibold">{step.title}</h3>
+            <p className="mt-2 text-sm text-slate-300">{step.detail}</p>
+          </li>
+        ))}
+      </ol>
+    </section>
+  );
+}
+

frontend/components/knowledge-base-panel.tsx

@@ -0,0 +1,216 @@
+"use client";
+
+import { useState } from "react";
+import Link from "next/link";
+
+type SearchResult = {
+  text: string;
+  similarity?: number;
+  relevance?: number;
+};
+
+const API_BASE =
+  process.env.NEXT_PUBLIC_API_URL?.replace(/\/$/, "") || "http://localhost:8000";
+
+export function KnowledgeBasePanel() {
+  const [tenantId, setTenantId] = useState("tenant123");
+  const [searchQuery, setSearchQuery] = useState("");
+  const [searchResults, setSearchResults] = useState<SearchResult[]>([]);
+  const [isSearching, setIsSearching] = useState(false);
+  const [ingestContent, setIngestContent] = useState("");
+  const [isIngesting, setIsIngesting] = useState(false);
+  const [ingestStatus, setIngestStatus] = useState<string | null>(null);
+  const [searchError, setSearchError] = useState<string | null>(null);
+
+  async function handleSearch() {
+    if (!searchQuery.trim() || isSearching) return;
+    setIsSearching(true);
+    setSearchError(null);
+    setSearchResults([]);
+
+    try {
+      const response = await fetch(`${API_BASE}/rag/search`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "x-tenant-id": tenantId,
+        },
+        body: JSON.stringify({ query: searchQuery }),
+      });
+
+      if (!response.ok) {
+        throw new Error(`Search failed: ${response.status}`);
+      }
+
+      const data = await response.json();
+      setSearchResults(data.results || []);
+    } catch (err) {
+      console.error(err);
+      setSearchError(
+        err instanceof Error
+          ? err.message
+          : "Failed to search knowledge base. Is the RAG MCP server running?",
+      );
+    } finally {
+      setIsSearching(false);
+    }
+  }
+
+  async function handleIngest() {
+    if (!ingestContent.trim() || isIngesting) return;
+    setIsIngesting(true);
+    setIngestStatus(null);
+
+    try {
+      const response = await fetch(`${API_BASE}/rag/ingest`, {
+        method: "POST",
+        headers: {
+          "Content-Type": "application/json",
+          "x-tenant-id": tenantId,
+        },
+        body: JSON.stringify({ content: ingestContent }),
+      });
+
+      if (!response.ok) {
+        throw new Error(`Ingestion failed: ${response.status}`);
+      }
+
+      const data = await response.json();
+      setIngestStatus(
+        `✅ Successfully ingested ${data.chunks_stored || 0} chunk(s)`,
+      );
+      setIngestContent("");
+    } catch (err) {
+      console.error(err);
+      setIngestStatus(
+        err instanceof Error
+          ? `❌ Error: ${err.message}`
+          : "Failed to ingest content. Is the RAG MCP server running?",
+      );
+    } finally {
+      setIsIngesting(false);
+    }
+  }
+
+  return (
+    <section
+      id="knowledge-base"
+      className="gradient-border relative rounded-[28px] p-1 text-white"
+    >
+      <div className="glass-panel relative rounded-[26px] p-6">
+        <div className="flex flex-wrap items-center justify-between gap-4">
+          <div>
+            <p className="text-sm uppercase tracking-[0.5em] text-cyan-200/70">
+              Knowledge Base
+            </p>
+            <h2 className="mt-2 text-3xl font-semibold">
+              Search & ingest documents
+            </h2>
+          </div>
+          <Link
+            href="/knowledge-base"
+            className="rounded-full border border-cyan-500/50 bg-cyan-500/10 px-5 py-2.5 text-sm font-semibold text-cyan-300 transition hover:bg-cyan-500/20"
+          >
+            View All Documents →
+          </Link>
+          <div className="flex flex-col gap-2 text-sm text-slate-200">
+            <label className="text-xs uppercase tracking-widest text-slate-400">
+              Tenant ID
+            </label>
+            <input
+              value={tenantId}
+              onChange={(e) => setTenantId(e.target.value)}
+              className="rounded-full border border-white/15 bg-white/10 px-4 py-1.5 text-sm text-white outline-none focus:border-cyan-300"
+            />
+          </div>
+        </div>
+
+        {/* Search Section */}
+        <div className="mt-6">
+          <div className="flex flex-col gap-3 md:flex-row">
+            <input
+              type="text"
+              placeholder="Search knowledge base (e.g., 'HR policy', 'refund procedure')..."
+              value={searchQuery}
+              onChange={(e) => setSearchQuery(e.target.value)}
+              onKeyDown={(e) => e.key === "Enter" && handleSearch()}
+              className="flex-1 rounded-2xl border border-white/10 bg-white/5 px-4 py-3 text-sm text-white outline-none focus:border-cyan-200/80"
+            />
+            <button
+              onClick={handleSearch}
+              disabled={isSearching}
+              className="min-w-[140px] rounded-2xl bg-gradient-to-r from-sky-400 to-cyan-500 px-6 py-3 font-semibold text-slate-950 shadow-lg shadow-cyan-500/30 transition hover:-translate-y-0.5 disabled:cursor-not-allowed disabled:opacity-60"
+            >
+              {isSearching ? "Searching…" : "Search"}
+            </button>
+          </div>
+
+          {searchError && (
+            <p className="mt-3 rounded-2xl border border-red-500/40 bg-red-500/10 px-4 py-3 text-sm text-red-200">
+              {searchError}
+            </p>
+          )}
+
+          {searchResults.length > 0 && (
+            <div className="mt-4 space-y-3">
+              <p className="text-sm uppercase tracking-widest text-slate-400">
+                Found {searchResults.length} result(s)
+              </p>
+              {searchResults.map((result, idx) => (
+                <div
+                  key={idx}
+                  className="rounded-2xl border border-white/10 bg-slate-950/40 p-4"
+                >
+                  <div className="flex items-start justify-between gap-3">
+                    <p className="flex-1 text-sm text-slate-200">
+                      {result.text}
+                    </p>
+                    {(result.similarity !== undefined ||
+                      result.relevance !== undefined) && (
+                      <span className="text-xs text-cyan-300">
+                        {(
+                          result.similarity ?? result.relevance ?? 0
+                        ).toFixed(2)}
+                      </span>
+                    )}
+                  </div>
+                </div>
+              ))}
+            </div>
+          )}
+        </div>
+
+        {/* Ingest Section */}
+        <div className="mt-8 rounded-2xl border border-white/10 bg-slate-950/40 p-4">
+          <p className="text-sm uppercase tracking-[0.5em] text-slate-400">
+            Add to Knowledge Base
+          </p>
+          <p className="mt-2 text-sm text-slate-300">
+            Paste text content to ingest. It will be chunked, embedded, and
+            stored in your tenant's knowledge base.
+          </p>
+          <textarea
+            placeholder="Paste document content here (e.g., policy text, procedures, documentation)..."
+            value={ingestContent}
+            onChange={(e) => setIngestContent(e.target.value)}
+            className="mt-4 w-full rounded-2xl border border-white/10 bg-white/5 px-4 py-3 text-sm text-white outline-none focus:border-cyan-200/80"
+            rows={6}
+          />
+          <div className="mt-4 flex items-center gap-3">
+            <button
+              onClick={handleIngest}
+              disabled={isIngesting || !ingestContent.trim()}
+              className="rounded-2xl bg-gradient-to-r from-emerald-400 to-teal-500 px-6 py-2.5 font-semibold text-slate-950 shadow-lg shadow-emerald-500/30 transition hover:-translate-y-0.5 disabled:cursor-not-allowed disabled:opacity-60"
+            >
+              {isIngesting ? "Ingesting…" : "Ingest Content"}
+            </button>
+            {ingestStatus && (
+              <p className="text-sm text-slate-300">{ingestStatus}</p>
+            )}
+          </div>
+        </div>
+      </div>
+    </section>
+  );
+}
+