init

.dockerignore

@@ -0,0 +1,8 @@
+Dockerfile
+.dockerignore
+node_modules
+npm-debug.log
+README.md
+.next
+.git
+.gitignore

.gitattributes

@@ -0,0 +1,35 @@
+*.7z filter=lfs diff=lfs merge=lfs -text
+*.arrow filter=lfs diff=lfs merge=lfs -text
+*.bin filter=lfs diff=lfs merge=lfs -text
+*.bz2 filter=lfs diff=lfs merge=lfs -text
+*.ckpt filter=lfs diff=lfs merge=lfs -text
+*.ftz filter=lfs diff=lfs merge=lfs -text
+*.gz filter=lfs diff=lfs merge=lfs -text
+*.h5 filter=lfs diff=lfs merge=lfs -text
+*.joblib filter=lfs diff=lfs merge=lfs -text
+*.lfs.* filter=lfs diff=lfs merge=lfs -text
+*.mlmodel filter=lfs diff=lfs merge=lfs -text
+*.model filter=lfs diff=lfs merge=lfs -text
+*.msgpack filter=lfs diff=lfs merge=lfs -text
+*.npy filter=lfs diff=lfs merge=lfs -text
+*.npz filter=lfs diff=lfs merge=lfs -text
+*.onnx filter=lfs diff=lfs merge=lfs -text
+*.ot filter=lfs diff=lfs merge=lfs -text
+*.parquet filter=lfs diff=lfs merge=lfs -text
+*.pb filter=lfs diff=lfs merge=lfs -text
+*.pickle filter=lfs diff=lfs merge=lfs -text
+*.pkl filter=lfs diff=lfs merge=lfs -text
+*.pt filter=lfs diff=lfs merge=lfs -text
+*.pth filter=lfs diff=lfs merge=lfs -text
+*.rar filter=lfs diff=lfs merge=lfs -text
+*.safetensors filter=lfs diff=lfs merge=lfs -text
+saved_model/**/* filter=lfs diff=lfs merge=lfs -text
+*.tar.* filter=lfs diff=lfs merge=lfs -text
+*.tar filter=lfs diff=lfs merge=lfs -text
+*.tflite filter=lfs diff=lfs merge=lfs -text
+*.tgz filter=lfs diff=lfs merge=lfs -text
+*.wasm filter=lfs diff=lfs merge=lfs -text
+*.xz filter=lfs diff=lfs merge=lfs -text
+*.zip filter=lfs diff=lfs merge=lfs -text
+*.zst filter=lfs diff=lfs merge=lfs -text
+*tfevents* filter=lfs diff=lfs merge=lfs -text

.gitignore

@@ -0,0 +1,35 @@
+# Dependencies
+node_modules
+.pnp
+.pnp.js
+
+# Testing
+coverage
+
+# Next.js
+.next/
+out/
+build/
+
+# Misc
+.DS_Store
+*.pem
+
+# Debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Local env files
+.env*.local
+.env
+
+# Vercel
+.vercel
+
+# TypeScript
+*.tsbuildinfo
+next-env.d.ts
+
+# Data
+data/

Dockerfile

@@ -0,0 +1,55 @@
+FROM node:20-alpine AS base
+
+# Install dependencies only when needed
+FROM base AS deps
+RUN apk add --no-cache libc6-compat
+WORKDIR /app
+
+# Copy package files
+COPY package.json package-lock.json* ./
+RUN npm ci
+
+# Rebuild the source code only when needed
+FROM base AS builder
+WORKDIR /app
+COPY --from=deps /app/node_modules ./node_modules
+COPY . .
+
+# Create data directory
+RUN mkdir -p /app/data
+
+# Build the application
+ENV NEXT_TELEMETRY_DISABLED=1
+RUN npm run build
+
+# Production image, copy all the files and run next
+FROM base AS runner
+WORKDIR /app
+
+ENV NODE_ENV=production
+ENV NEXT_TELEMETRY_DISABLED=1
+
+RUN addgroup --system --gid 1001 nodejs
+RUN adduser --system --uid 1001 nextjs
+
+# Create data directory with proper permissions
+RUN mkdir -p /data && chown -R nextjs:nodejs /data
+
+COPY --from=builder /app/public ./public
+
+# Set the correct permission for prerender cache
+RUN mkdir .next
+RUN chown nextjs:nodejs .next
+
+# Automatically leverage output traces to reduce image size
+COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
+COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static
+
+USER nextjs
+
+EXPOSE 7860
+
+ENV PORT=7860
+ENV HOSTNAME="0.0.0.0"
+
+CMD ["node", "server.js"]

README copy.md

@@ -0,0 +1,48 @@
+---
+title: TeichAI Community Requests
+emoji: 🚀
+colorFrom: orange
+colorTo: red
+sdk: docker
+pinned: false
+license: apache-2.0
+---
+
+# TeichAI Community Requests
+
+A community platform for submitting and voting on model distillation and dataset requests for [TeichAI](https://teichai.com).
+
+## Features
+
+- **Model Distillation Requests**: Request distilled versions of frontier models (Claude, GPT, Gemini) into open-source student models (Qwen3, Llama, etc.)
+- **Dataset Requests**: Request reasoning datasets generated from various AI models
+- **Upvoting System**: Vote on requests to help prioritize what gets built next
+- **Persistent Storage**: All requests are saved and persisted
+
+## How It Works
+
+1. Submit a request for a model distillation or reasoning dataset
+2. Upvote requests from other community members
+3. We prioritize requests based on community interest
+4. Models and datasets are published on our [Hugging Face page](https://huggingface.co/TeichAI)
+
+## Tech Stack
+
+- Next.js 15
+- React 19
+- Tailwind CSS
+- Radix UI
+- Docker
+
+## Development
+
+```bash
+npm install
+npm run dev
+```
+
+## Links
+
+- [TeichAI Website](https://teichai.com)
+- [TeichAI on Hugging Face](https://huggingface.co/TeichAI)
+- [Support Us](https://paypal.me/TeichAI)

README.md

@@ -0,0 +1,11 @@
+---
+title: Requests
+emoji: 🔥
+colorFrom: gray
+colorTo: yellow
+sdk: docker
+pinned: false
+short_description: A space to request datasets and model distillations
+---
+
+Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference

next.config.ts

@@ -0,0 +1,7 @@
+import type { NextConfig } from "next";
+
+const nextConfig: NextConfig = {
+    output: "standalone",
+};
+
+export default nextConfig;

package.json

@@ -0,0 +1,42 @@
+{
+    "name": "teichai-requests",
+    "version": "0.1.0",
+    "private": true,
+    "scripts": {
+        "dev": "next dev",
+        "build": "next build",
+        "start": "next start -p 7860",
+        "lint": "eslint . --ext .ts,.tsx"
+    },
+    "dependencies": {
+        "@radix-ui/react-dialog": "^1.1.15",
+        "@radix-ui/react-dropdown-menu": "^2.1.16",
+        "@radix-ui/react-label": "^2.1.2",
+        "@radix-ui/react-popover": "^1.1.15",
+        "@radix-ui/react-select": "^2.1.6",
+        "@radix-ui/react-separator": "^1.1.8",
+        "@radix-ui/react-slot": "^1.2.4",
+        "@radix-ui/react-tabs": "^1.1.3",
+        "@radix-ui/react-toast": "^1.2.6",
+        "class-variance-authority": "^0.7.1",
+        "clsx": "^2.1.1",
+        "geist": "^1.5.1",
+        "lucide-react": "^0.468.0",
+        "next": "^16.0.10",
+        "react": "^19.0.0",
+        "react-dom": "^19.0.0",
+        "tailwind-merge": "^2.6.0",
+        "uuid": "^11.0.3"
+    },
+    "devDependencies": {
+        "@types/node": "^22.10.2",
+        "@types/react": "^19.0.1",
+        "@types/react-dom": "^19.0.1",
+        "@types/uuid": "^10.0.0",
+        "eslint": "^9.17.0",
+        "eslint-config-next": "15.1.0",
+        "postcss": "^8.4.49",
+        "tailwindcss": "^3.4.17",
+        "typescript": "^5.7.2"
+    }
+}

postcss.config.mjs

@@ -0,0 +1,7 @@
+const config = {
+    plugins: {
+        tailwindcss: {},
+    },
+};
+
+export default config;

src/app/admin/page.tsx

@@ -0,0 +1,391 @@
+"use client";
+
+import { useEffect, useMemo, useState } from "react";
+import Link from "next/link";
+import Navbar from "@/components/Navbar";
+import Footer from "@/components/Footer";
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import { Badge } from "@/components/ui/badge";
+import { Label } from "@/components/ui/label";
+import { Textarea } from "@/components/ui/textarea";
+import { toast } from "@/components/ui/toaster";
+import {
+    Select,
+    SelectContent,
+    SelectItem,
+    SelectTrigger,
+    SelectValue,
+} from "@/components/ui/select";
+
+type RequestStatus = "pending" | "in_progress" | "completed";
+
+type DistillationRequest = {
+    id: string;
+    sourceDataset: string;
+    studentModel: string;
+    additionalNotes: string;
+    upvotes: number;
+    createdAt: string;
+    status: RequestStatus;
+};
+
+type DatasetRequest = {
+    id: string;
+    sourceModel: string;
+    datasetSize: string;
+    reasoningDepth: string;
+    topics: string[];
+    additionalNotes: string;
+    upvotes: number;
+    createdAt: string;
+    status: RequestStatus;
+};
+
+const STATUS_OPTIONS: RequestStatus[] = ["pending", "in_progress", "completed"];
+
+function StatusBadge({ status }: { status: RequestStatus }) {
+    if (status === "completed") return <Badge variant="success">Completed</Badge>;
+    if (status === "in_progress") return <Badge variant="warning">In Progress</Badge>;
+    return <Badge variant="secondary">Pending</Badge>;
+}
+
+export default function AdminPage() {
+    const [checking, setChecking] = useState(true);
+    const [admin, setAdmin] = useState(false);
+
+    const [password, setPassword] = useState("");
+    const [loginLoading, setLoginLoading] = useState(false);
+
+    const [distillationRequests, setDistillationRequests] = useState<DistillationRequest[]>([]);
+    const [datasetRequests, setDatasetRequests] = useState<DatasetRequest[]>([]);
+    const [loading, setLoading] = useState(false);
+
+    const [replyOpen, setReplyOpen] = useState<Record<string, boolean>>({});
+    const [replyBody, setReplyBody] = useState<Record<string, string>>({});
+    const [replySubmitting, setReplySubmitting] = useState<Record<string, boolean>>({});
+
+    const allRequests = useMemo(() => {
+        const dist = distillationRequests.map((r) => ({ type: "distillation" as const, request: r }));
+        const data = datasetRequests.map((r) => ({ type: "dataset" as const, request: r }));
+        return [...dist, ...data].sort((a, b) => b.request.upvotes - a.request.upvotes);
+    }, [distillationRequests, datasetRequests]);
+
+    useEffect(() => {
+        checkAdmin();
+    }, []);
+
+    useEffect(() => {
+        if (admin) {
+            fetchAll();
+        }
+    }, [admin]);
+
+    async function checkAdmin() {
+        setChecking(true);
+        try {
+            const res = await fetch("/api/admin/me", { cache: "no-store" });
+            const data = await res.json();
+            setAdmin(Boolean(data?.admin));
+        } catch {
+            setAdmin(false);
+        } finally {
+            setChecking(false);
+        }
+    }
+
+    async function fetchAll() {
+        setLoading(true);
+        try {
+            const [distillRes, datasetRes] = await Promise.all([
+                fetch("/api/distillation", { cache: "no-store" }),
+                fetch("/api/dataset", { cache: "no-store" }),
+            ]);
+            const [distillData, datasetData] = await Promise.all([distillRes.json(), datasetRes.json()]);
+            setDistillationRequests(Array.isArray(distillData) ? distillData : []);
+            setDatasetRequests(Array.isArray(datasetData) ? datasetData : []);
+        } catch (error) {
+            console.error(error);
+            toast({ title: "Error", description: "Failed to fetch requests", variant: "destructive" });
+        } finally {
+            setLoading(false);
+        }
+    }
+
+    async function login() {
+        setLoginLoading(true);
+        try {
+            const res = await fetch("/api/admin/login", {
+                method: "POST",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify({ password }),
+            });
+
+            const data = await res.json();
+            if (!res.ok) {
+                toast({ title: "Login failed", description: data?.error || "Invalid password", variant: "destructive" });
+                return;
+            }
+
+            toast({ title: "Logged in", description: "Admin session started" });
+            setPassword("");
+            await checkAdmin();
+        } catch (error) {
+            console.error(error);
+            toast({ title: "Login failed", description: "Unexpected error", variant: "destructive" });
+        } finally {
+            setLoginLoading(false);
+        }
+    }
+
+    async function logout() {
+        try {
+            await fetch("/api/admin/logout", { method: "POST" });
+            setAdmin(false);
+            toast({ title: "Logged out" });
+        } catch {
+            toast({ title: "Error", description: "Failed to logout", variant: "destructive" });
+        }
+    }
+
+    async function updateStatus(type: "distillation" | "dataset", id: string, status: RequestStatus) {
+        try {
+            const res = await fetch(`/api/admin/requests/${type}/${id}`, {
+                method: "PATCH",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify({ status }),
+            });
+            const data = await res.json();
+            if (!res.ok) {
+                toast({ title: "Error", description: data?.error || "Failed to update status", variant: "destructive" });
+                return;
+            }
+            toast({ title: "Updated", description: "Status updated" });
+            await fetchAll();
+        } catch {
+            toast({ title: "Error", description: "Failed to update status", variant: "destructive" });
+        }
+    }
+
+    async function removeRequest(type: "distillation" | "dataset", id: string) {
+        try {
+            const res = await fetch(`/api/admin/requests/${type}/${id}`, { method: "DELETE" });
+            const data = await res.json();
+            if (!res.ok) {
+                toast({ title: "Error", description: data?.error || "Failed to delete", variant: "destructive" });
+                return;
+            }
+            toast({ title: "Deleted", description: "Request removed" });
+            await fetchAll();
+        } catch {
+            toast({ title: "Error", description: "Failed to delete", variant: "destructive" });
+        }
+    }
+
+    async function submitReply(type: "distillation" | "dataset", id: string) {
+        const key = `${type}:${id}`;
+        const body = (replyBody[key] || "").trim();
+        if (!body) {
+            toast({ title: "Error", description: "Reply cannot be empty", variant: "destructive" });
+            return;
+        }
+
+        setReplySubmitting((prev) => ({ ...prev, [key]: true }));
+        try {
+            const res = await fetch(`/api/admin/requests/${type}/${id}/comments`, {
+                method: "POST",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify({ body }),
+            });
+            const data = await res.json();
+            if (!res.ok) {
+                toast({ title: "Error", description: data?.error || "Failed to reply", variant: "destructive" });
+                return;
+            }
+            toast({ title: "Replied", description: "Comment posted" });
+            setReplyBody((prev) => ({ ...prev, [key]: "" }));
+            setReplyOpen((prev) => ({ ...prev, [key]: false }));
+        } catch {
+            toast({ title: "Error", description: "Failed to reply", variant: "destructive" });
+        } finally {
+            setReplySubmitting((prev) => ({ ...prev, [key]: false }));
+        }
+    }
+
+    return (
+        <main className="min-h-screen bg-background">
+            <Navbar />
+
+            <section className="pt-24 pb-10">
+                <div className="mx-auto max-w-6xl px-4 sm:px-6">
+                    <div className="flex items-start justify-between gap-4">
+                        <div>
+                            <h1 className="text-3xl font-bold tracking-tight text-foreground">Admin</h1>
+                            <p className="mt-1 text-muted-foreground">Manage requests, update status, and reply.</p>
+                        </div>
+                        {admin && (
+                            <Button variant="outline" onClick={logout}>
+                                Logout
+                            </Button>
+                        )}
+                    </div>
+
+                    <div className="mt-6">
+                        {checking ? (
+                            <Card>
+                                <CardContent className="p-6 text-muted-foreground">Checking session…</CardContent>
+                            </Card>
+                        ) : !admin ? (
+                            <Card>
+                                <CardHeader>
+                                    <CardTitle>Admin Login</CardTitle>
+                                    <CardDescription>Password is set via ADMIN_PASSWORD</CardDescription>
+                                </CardHeader>
+                                <CardContent className="space-y-4">
+                                    <div className="space-y-2">
+                                        <Label htmlFor="password">Password</Label>
+                                        <input
+                                            id="password"
+                                            type="password"
+                                            placeholder="Enter admin password"
+                                            title="Admin password"
+                                            className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
+                                            value={password}
+                                            onChange={(e) => setPassword(e.target.value)}
+                                        />
+                                    </div>
+                                    <Button onClick={login} disabled={loginLoading}>
+                                        {loginLoading ? "Logging in…" : "Login"}
+                                    </Button>
+                                </CardContent>
+                            </Card>
+                        ) : (
+                            <div className="space-y-4">
+                                <div className="flex items-center justify-between">
+                                    <div className="text-sm text-muted-foreground">
+                                        Total: {allRequests.length}
+                                    </div>
+                                    <Button variant="outline" onClick={fetchAll} disabled={loading}>
+                                        {loading ? "Refreshing…" : "Refresh"}
+                                    </Button>
+                                </div>
+
+                                {allRequests.length === 0 ? (
+                                    <Card>
+                                        <CardContent className="p-6 text-muted-foreground">No requests yet.</CardContent>
+                                    </Card>
+                                ) : (
+                                    <div className="grid gap-4">
+                                        {allRequests.map(({ type, request }) => {
+                                            const key = `${type}:${request.id}`;
+                                            const isReplyOpen = Boolean(replyOpen[key]);
+                                            const title =
+                                                type === "distillation"
+                                                    ? `${(request as DistillationRequest).sourceDataset} → ${(request as DistillationRequest).studentModel}`
+                                                    : `${(request as DatasetRequest).sourceModel} Dataset (${(request as DatasetRequest).datasetSize})`;
+
+                                            return (
+                                                <Card key={key} className="overflow-hidden">
+                                                    <CardContent className="p-5">
+                                                        <div className="flex flex-wrap items-start justify-between gap-4">
+                                                            <div className="min-w-[280px] flex-1">
+                                                                <div className="flex flex-wrap items-center gap-2">
+                                                                    <h3 className="font-medium text-foreground">{title}</h3>
+                                                                    <StatusBadge status={request.status} />
+                                                                    <Badge variant="outline">{type}</Badge>
+                                                                    <Badge variant="secondary">{request.upvotes} upvotes</Badge>
+                                                                </div>
+                                                                {request.additionalNotes ? (
+                                                                    <p className="mt-2 text-sm text-muted-foreground">{request.additionalNotes}</p>
+                                                                ) : null}
+                                                                {type === "dataset" ? (
+                                                                    <div className="mt-2 flex flex-wrap gap-1">
+                                                                        <Badge variant="outline">{(request as DatasetRequest).reasoningDepth} reasoning</Badge>
+                                                                        {(request as DatasetRequest).topics?.slice(0, 6)?.map((t) => (
+                                                                            <Badge key={t} variant="secondary" className="text-xs">
+                                                                                {t}
+                                                                            </Badge>
+                                                                        ))}
+                                                                    </div>
+                                                                ) : null}
+                                                            </div>
+
+                                                            <div className="flex flex-wrap items-center gap-2">
+                                                                <div className="w-[180px]">
+                                                                    <Select
+                                                                        value={request.status}
+                                                                        onValueChange={(v) => updateStatus(type, request.id, v as RequestStatus)}
+                                                                    >
+                                                                        <SelectTrigger>
+                                                                            <SelectValue />
+                                                                        </SelectTrigger>
+                                                                        <SelectContent>
+                                                                            {STATUS_OPTIONS.map((s) => (
+                                                                                <SelectItem key={s} value={s}>
+                                                                                    {s}
+                                                                                </SelectItem>
+                                                                            ))}
+                                                                        </SelectContent>
+                                                                    </Select>
+                                                                </div>
+
+                                                                <Button variant="outline" asChild>
+                                                                    <Link href={`/requests/${type}/${request.id}`}>Discussion</Link>
+                                                                </Button>
+
+                                                                <Button
+                                                                    variant="outline"
+                                                                    onClick={() => setReplyOpen((prev) => ({ ...prev, [key]: !prev[key] }))}
+                                                                >
+                                                                    {isReplyOpen ? "Close Reply" : "Reply"}
+                                                                </Button>
+
+                                                                <Button
+                                                                    variant="destructive"
+                                                                    onClick={() => removeRequest(type, request.id)}
+                                                                >
+                                                                    Delete
+                                                                </Button>
+                                                            </div>
+                                                        </div>
+
+                                                        {isReplyOpen && (
+                                                            <div className="mt-4 space-y-2">
+                                                                <Label>Admin Reply</Label>
+                                                                <Textarea
+                                                                    value={replyBody[key] || ""}
+                                                                    onChange={(e) => setReplyBody((prev) => ({ ...prev, [key]: e.target.value }))}
+                                                                    placeholder="Write a reply as TeichAI…"
+                                                                />
+                                                                <div className="flex gap-2">
+                                                                    <Button
+                                                                        onClick={() => submitReply(type, request.id)}
+                                                                        disabled={Boolean(replySubmitting[key])}
+                                                                    >
+                                                                        {replySubmitting[key] ? "Posting…" : "Post Reply"}
+                                                                    </Button>
+                                                                    <Button
+                                                                        variant="outline"
+                                                                        onClick={() => setReplyOpen((prev) => ({ ...prev, [key]: false }))}
+                                                                    >
+                                                                        Cancel
+                                                                    </Button>
+                                                                </div>
+                                                            </div>
+                                                        )}
+                                                    </CardContent>
+                                                </Card>
+                                            );
+                                        })}
+                                    </div>
+                                )}
+                            </div>
+                        )}
+                    </div>
+                </div>
+            </section>
+
+            <Footer />
+        </main>
+    );
+}

src/app/api/admin/login/route.ts

@@ -0,0 +1,28 @@
+import { NextRequest, NextResponse } from "next/server";
+import { adminCookieOptions, createAdminSessionValue } from "@/lib/adminAuth";
+
+export async function POST(request: NextRequest) {
+    try {
+        const adminPassword = process.env.ADMIN_PASSWORD || "";
+        if (!adminPassword) {
+            return NextResponse.json({ error: "ADMIN_PASSWORD is not set" }, { status: 500 });
+        }
+
+        const body = await request.json();
+        const password = typeof body?.password === "string" ? body.password : "";
+
+        if (password !== adminPassword) {
+            return NextResponse.json({ error: "Invalid password" }, { status: 401 });
+        }
+
+        const response = NextResponse.json({ ok: true });
+        response.cookies.set({
+            ...adminCookieOptions(),
+            value: createAdminSessionValue(),
+        });
+        return response;
+    } catch (error) {
+        console.error("Admin login error:", error);
+        return NextResponse.json({ error: "Failed to login" }, { status: 500 });
+    }
+}

src/app/api/admin/logout/route.ts

@@ -0,0 +1,13 @@
+import { NextResponse } from "next/server";
+import { adminCookieOptions, ADMIN_COOKIE_NAME } from "@/lib/adminAuth";
+
+export async function POST() {
+    const response = NextResponse.json({ ok: true });
+    response.cookies.set({
+        ...adminCookieOptions(),
+        name: ADMIN_COOKIE_NAME,
+        value: "",
+        maxAge: 0,
+    });
+    return response;
+}

src/app/api/admin/me/route.ts

@@ -0,0 +1,6 @@
+import { NextRequest, NextResponse } from "next/server";
+import { isAdminRequest } from "@/lib/adminAuth";
+
+export async function GET(request: NextRequest) {
+    return NextResponse.json({ admin: isAdminRequest(request) });
+}

src/app/api/admin/requests/[type]/[id]/comments/route.ts

@@ -0,0 +1,43 @@
+import { NextRequest, NextResponse } from "next/server";
+import { isAdminRequest } from "@/lib/adminAuth";
+import { addAdminComment, getRequest } from "@/lib/store";
+import { getOrCreateUserId, userCookieOptions } from "@/lib/userIdentity";
+
+export async function POST(
+    request: NextRequest,
+    context: { params: Promise<{ type: string; id: string }> }
+) {
+    try {
+        const { userId, shouldSetCookie } = getOrCreateUserId(request);
+        const params = await context.params;
+        if (!isAdminRequest(request)) {
+            return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
+        }
+
+        const type = params.type === "dataset" ? "dataset" : params.type === "distillation" ? "distillation" : null;
+        if (!type) {
+            return NextResponse.json({ error: "Invalid request type" }, { status: 400 });
+        }
+
+        const existing = getRequest(type, params.id);
+        if (!existing) {
+            return NextResponse.json({ error: "Request not found" }, { status: 404 });
+        }
+
+        const body = await request.json();
+        const text = typeof body?.body === "string" ? body.body.trim() : "";
+        if (!text) {
+            return NextResponse.json({ error: "Comment body is required" }, { status: 400 });
+        }
+
+        const comment = addAdminComment(type, params.id, text, userId);
+        const response = NextResponse.json({ ok: true, comment });
+        if (shouldSetCookie) {
+            response.cookies.set({ ...userCookieOptions(), value: userId });
+        }
+        return response;
+    } catch (error) {
+        console.error("Admin add comment error:", error);
+        return NextResponse.json({ error: "Failed to add comment" }, { status: 500 });
+    }
+}

src/app/api/admin/requests/[type]/[id]/route.ts

@@ -0,0 +1,63 @@
+import { NextRequest, NextResponse } from "next/server";
+import { isAdminRequest } from "@/lib/adminAuth";
+import { deleteRequest, updateRequestStatus } from "@/lib/store";
+
+export async function PATCH(
+    request: NextRequest,
+    context: { params: Promise<{ type: string; id: string }> }
+) {
+    try {
+        const params = await context.params;
+        if (!isAdminRequest(request)) {
+            return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
+        }
+
+        const type = params.type === "dataset" ? "dataset" : params.type === "distillation" ? "distillation" : null;
+        if (!type) {
+            return NextResponse.json({ error: "Invalid request type" }, { status: 400 });
+        }
+
+        const body = await request.json();
+        const status = body?.status;
+        if (status !== "pending" && status !== "in_progress" && status !== "completed") {
+            return NextResponse.json({ error: "Invalid status" }, { status: 400 });
+        }
+
+        const ok = updateRequestStatus(type, params.id, status);
+        if (!ok) {
+            return NextResponse.json({ error: "Request not found" }, { status: 404 });
+        }
+
+        return NextResponse.json({ ok: true });
+    } catch (error) {
+        console.error("Admin update status error:", error);
+        return NextResponse.json({ error: "Failed to update status" }, { status: 500 });
+    }
+}
+
+export async function DELETE(
+    request: NextRequest,
+    context: { params: Promise<{ type: string; id: string }> }
+) {
+    try {
+        const params = await context.params;
+        if (!isAdminRequest(request)) {
+            return NextResponse.json({ error: "Unauthorized" }, { status: 401 });
+        }
+
+        const type = params.type === "dataset" ? "dataset" : params.type === "distillation" ? "distillation" : null;
+        if (!type) {
+            return NextResponse.json({ error: "Invalid request type" }, { status: 400 });
+        }
+
+        const ok = deleteRequest(type, params.id);
+        if (!ok) {
+            return NextResponse.json({ error: "Request not found" }, { status: 404 });
+        }
+
+        return NextResponse.json({ ok: true });
+    } catch (error) {
+        console.error("Admin delete request error:", error);
+        return NextResponse.json({ error: "Failed to delete request" }, { status: 500 });
+    }
+}

src/app/api/dataset/route.ts

@@ -0,0 +1,83 @@
+import { NextRequest, NextResponse } from "next/server";
+import {
+    getDatasetRequests,
+    addDatasetRequest,
+    upvoteDataset,
+} from "@/lib/store";
+import { getOrCreateUserId, userCookieOptions } from "@/lib/userIdentity";
+
+export async function GET() {
+    try {
+        const requests = getDatasetRequests();
+        return NextResponse.json(requests);
+    } catch (error) {
+        console.error("Error fetching dataset requests:", error);
+        return NextResponse.json({ error: "Failed to fetch requests" }, { status: 500 });
+    }
+}
+
+export async function POST(request: NextRequest) {
+    try {
+        const { userId, shouldSetCookie } = getOrCreateUserId(request);
+        const body = await request.json();
+        const { sourceModel, datasetSize, reasoningDepth, topics, additionalNotes } = body;
+
+        if (!sourceModel) {
+            return NextResponse.json(
+                { error: "Source model is required" },
+                { status: 400 }
+            );
+        }
+
+        const newRequest = addDatasetRequest({
+            sourceModel,
+            datasetSize: datasetSize || "250x",
+            reasoningDepth: reasoningDepth || "high",
+            topics: topics || [],
+            additionalNotes: additionalNotes || "",
+            ownerId: userId,
+        });
+
+        const response = NextResponse.json(newRequest, { status: 201 });
+        if (shouldSetCookie) {
+            response.cookies.set({ ...userCookieOptions(), value: userId });
+        }
+        return response;
+    } catch (error) {
+        console.error("Error creating dataset request:", error);
+        return NextResponse.json({ error: "Failed to create request" }, { status: 500 });
+    }
+}
+
+export async function PATCH(request: NextRequest) {
+    try {
+        const body = await request.json();
+        const { id } = body;
+
+        if (!id) {
+            return NextResponse.json({ error: "Request ID is required" }, { status: 400 });
+        }
+
+        const ip = request.headers.get("x-forwarded-for") ||
+            request.headers.get("x-real-ip") ||
+            "anonymous";
+
+        const result = upvoteDataset(id, ip);
+
+        if (!result.success) {
+            return NextResponse.json(
+                { error: "Request not found", upvotes: result.upvotes },
+                { status: 404 }
+            );
+        }
+
+        return NextResponse.json({
+            success: true,
+            upvotes: result.upvotes,
+            action: result.action,
+        });
+    } catch (error) {
+        console.error("Error upvoting dataset request:", error);
+        return NextResponse.json({ error: "Failed to upvote" }, { status: 500 });
+    }
+}

src/app/api/distillation/route.ts

@@ -0,0 +1,81 @@
+import { NextRequest, NextResponse } from "next/server";
+import {
+    getDistillationRequests,
+    addDistillationRequest,
+    upvoteDistillation,
+} from "@/lib/store";
+import { getOrCreateUserId, userCookieOptions } from "@/lib/userIdentity";
+
+export async function GET() {
+    try {
+        const requests = getDistillationRequests();
+        return NextResponse.json(requests);
+    } catch (error) {
+        console.error("Error fetching distillation requests:", error);
+        return NextResponse.json({ error: "Failed to fetch requests" }, { status: 500 });
+    }
+}
+
+export async function POST(request: NextRequest) {
+    try {
+        const { userId, shouldSetCookie } = getOrCreateUserId(request);
+        const body = await request.json();
+        const { sourceDataset, studentModel, additionalNotes } = body;
+
+        if (!sourceDataset || !studentModel) {
+            return NextResponse.json(
+                { error: "Source dataset and student model are required" },
+                { status: 400 }
+            );
+        }
+
+        const newRequest = addDistillationRequest({
+            sourceDataset,
+            studentModel,
+            additionalNotes: additionalNotes || "",
+            ownerId: userId,
+        });
+
+        const response = NextResponse.json(newRequest, { status: 201 });
+        if (shouldSetCookie) {
+            response.cookies.set({ ...userCookieOptions(), value: userId });
+        }
+        return response;
+    } catch (error) {
+        console.error("Error creating distillation request:", error);
+        return NextResponse.json({ error: "Failed to create request" }, { status: 500 });
+    }
+}
+
+export async function PATCH(request: NextRequest) {
+    try {
+        const body = await request.json();
+        const { id } = body;
+
+        if (!id) {
+            return NextResponse.json({ error: "Request ID is required" }, { status: 400 });
+        }
+
+        const ip = request.headers.get("x-forwarded-for") ||
+            request.headers.get("x-real-ip") ||
+            "anonymous";
+
+        const result = upvoteDistillation(id, ip);
+
+        if (!result.success) {
+            return NextResponse.json(
+                { error: "Request not found", upvotes: result.upvotes },
+                { status: 404 }
+            );
+        }
+
+        return NextResponse.json({
+            success: true,
+            upvotes: result.upvotes,
+            action: result.action,
+        });
+    } catch (error) {
+        console.error("Error upvoting distillation request:", error);
+        return NextResponse.json({ error: "Failed to upvote" }, { status: 500 });
+    }
+}

src/app/api/openrouter-models/route.ts

@@ -0,0 +1,52 @@
+import { NextResponse } from "next/server";
+
+interface OpenRouterModel {
+    id: string;
+    name: string;
+    pricing: {
+        prompt: string;
+        completion: string;
+    };
+    context_length: number;
+}
+
+let cachedModels: { id: string; name: string }[] | null = null;
+let cacheTimestamp: number = 0;
+const CACHE_DURATION = 1000 * 60 * 60; // 1 hour
+
+export async function GET() {
+    try {
+        const now = Date.now();
+        if (cachedModels && now - cacheTimestamp < CACHE_DURATION) {
+            return NextResponse.json(cachedModels);
+        }
+
+        const response = await fetch("https://openrouter.ai/api/v1/models", {
+            headers: {
+                Accept: "application/json",
+            },
+            next: { revalidate: 3600 },
+        });
+
+        if (!response.ok) {
+            throw new Error(`OpenRouter API error: ${response.status}`);
+        }
+
+        const data = await response.json();
+
+        cachedModels = data.data.map((model: OpenRouterModel) => ({
+            id: model.id,
+            name: model.name || model.id,
+        })).sort((a: { name: string }, b: { name: string }) => a.name.localeCompare(b.name));
+
+        cacheTimestamp = now;
+
+        return NextResponse.json(cachedModels);
+    } catch (error) {
+        console.error("Error fetching OpenRouter models:", error);
+        if (cachedModels) {
+            return NextResponse.json(cachedModels);
+        }
+        return NextResponse.json([], { status: 500 });
+    }
+}

src/app/api/requests/[type]/[id]/comments/[commentId]/route.ts

@@ -0,0 +1,106 @@
+import { NextRequest, NextResponse } from "next/server";
+import { isAdminRequest } from "@/lib/adminAuth";
+import { deleteComment, getThread, updateComment } from "@/lib/store";
+import { getOrCreateUserId, userCookieOptions } from "@/lib/userIdentity";
+
+export async function PATCH(
+    request: NextRequest,
+    context: { params: Promise<{ type: string; id: string; commentId: string }> }
+) {
+    try {
+        const { userId, shouldSetCookie } = getOrCreateUserId(request);
+        const params = await context.params;
+
+        const type =
+            params.type === "dataset"
+                ? "dataset"
+                : params.type === "distillation"
+                    ? "distillation"
+                    : null;
+
+        if (!type) {
+            return NextResponse.json({ error: "Invalid request type" }, { status: 400 });
+        }
+
+        const thread = getThread(type, params.id);
+        const comment = thread.comments.find((c) => c.id === params.commentId);
+        if (!comment) {
+            return NextResponse.json({ error: "Comment not found" }, { status: 404 });
+        }
+
+        const admin = isAdminRequest(request);
+        const canEdit = admin || (comment.role === "user" && comment.ownerId === userId);
+        if (!canEdit) {
+            return NextResponse.json({ error: "Forbidden" }, { status: 403 });
+        }
+
+        const body = await request.json();
+        const text = typeof body?.body === "string" ? body.body.trim() : "";
+        if (!text) {
+            return NextResponse.json({ error: "Comment body is required" }, { status: 400 });
+        }
+
+        const updated = updateComment(type, params.id, params.commentId, text);
+        if (!updated) {
+            return NextResponse.json({ error: "Comment not found" }, { status: 404 });
+        }
+
+        const response = NextResponse.json({ ok: true, comment: updated });
+        if (shouldSetCookie) {
+            response.cookies.set({ ...userCookieOptions(), value: userId });
+        }
+        return response;
+    } catch (error) {
+        console.error("Update comment error:", error);
+        return NextResponse.json({ error: "Failed to update comment" }, { status: 500 });
+    }
+}
+
+export async function DELETE(
+    request: NextRequest,
+    context: { params: Promise<{ type: string; id: string; commentId: string }> }
+) {
+    try {
+        const { userId, shouldSetCookie } = getOrCreateUserId(request);
+        const params = await context.params;
+
+        const type =
+            params.type === "dataset"
+                ? "dataset"
+                : params.type === "distillation"
+                    ? "distillation"
+                    : null;
+
+        if (!type) {
+            return NextResponse.json({ error: "Invalid request type" }, { status: 400 });
+        }
+
+        const thread = getThread(type, params.id);
+        const comment = thread.comments.find((c) => c.id === params.commentId);
+        if (!comment) {
+            return NextResponse.json({ error: "Comment not found" }, { status: 404 });
+        }
+
+        const admin = isAdminRequest(request);
+        const canDelete =
+            admin ||
+            (comment.role === "user" && Boolean(comment.ownerId) && comment.ownerId === userId);
+        if (!canDelete) {
+            return NextResponse.json({ error: "Forbidden" }, { status: 403 });
+        }
+
+        const ok = deleteComment(type, params.id, params.commentId);
+        if (!ok) {
+            return NextResponse.json({ error: "Comment not found" }, { status: 404 });
+        }
+
+        const response = NextResponse.json({ ok: true });
+        if (shouldSetCookie) {
+            response.cookies.set({ ...userCookieOptions(), value: userId });
+        }
+        return response;
+    } catch (error) {
+        console.error("Delete comment error:", error);
+        return NextResponse.json({ error: "Failed to delete comment" }, { status: 500 });
+    }
+}

src/app/api/requests/[type]/[id]/comments/route.ts

@@ -0,0 +1,46 @@
+import { NextRequest, NextResponse } from "next/server";
+import { addUserComment, getRequest } from "@/lib/store";
+import { getOrCreateUserId, userCookieOptions } from "@/lib/userIdentity";
+
+export async function POST(
+    request: NextRequest,
+    context: { params: Promise<{ type: string; id: string }> }
+) {
+    try {
+        const { userId, shouldSetCookie } = getOrCreateUserId(request);
+        const params = await context.params;
+        const type =
+            params.type === "dataset"
+                ? "dataset"
+                : params.type === "distillation"
+                    ? "distillation"
+                    : null;
+
+        if (!type) {
+            return NextResponse.json({ error: "Invalid request type" }, { status: 400 });
+        }
+
+        const existing = getRequest(type, params.id);
+        if (!existing) {
+            return NextResponse.json({ error: "Request not found" }, { status: 404 });
+        }
+
+        const body = await request.json();
+        const text = typeof body?.body === "string" ? body.body.trim() : "";
+        const author = typeof body?.author === "string" ? body.author.trim() : "";
+
+        if (!text) {
+            return NextResponse.json({ error: "Comment body is required" }, { status: 400 });
+        }
+
+        const comment = addUserComment(type, params.id, text, author, userId);
+        const response = NextResponse.json({ ok: true, comment });
+        if (shouldSetCookie) {
+            response.cookies.set({ ...userCookieOptions(), value: userId });
+        }
+        return response;
+    } catch (error) {
+        console.error("Add comment error:", error);
+        return NextResponse.json({ error: "Failed to add comment" }, { status: 500 });
+    }
+}

src/app/api/requests/[type]/[id]/route.ts

@@ -0,0 +1,156 @@
+import { NextRequest, NextResponse } from "next/server";
+import { isAdminRequest } from "@/lib/adminAuth";
+import {
+    deleteRequest,
+    getRequest,
+    getThread,
+    updateDatasetRequest,
+    updateDistillationRequest,
+} from "@/lib/store";
+import { getOrCreateUserId, userCookieOptions } from "@/lib/userIdentity";
+
+export async function GET(
+    request: NextRequest,
+    context: { params: Promise<{ type: string; id: string }> }
+) {
+    const { userId, shouldSetCookie } = getOrCreateUserId(request);
+    const params = await context.params;
+    const type = params.type === "dataset" ? "dataset" : params.type === "distillation" ? "distillation" : null;
+    if (!type) {
+        return NextResponse.json({ error: "Invalid request type" }, { status: 400 });
+    }
+
+    const requestItem = getRequest(type, params.id);
+    if (!requestItem) {
+        return NextResponse.json({ error: "Request not found" }, { status: 404 });
+    }
+
+    const admin = isAdminRequest(request);
+    const ownerId = (requestItem as any).ownerId as string | undefined;
+    const canEditRequest = admin || (Boolean(ownerId) && ownerId === userId);
+    const canDeleteRequest = canEditRequest;
+
+    const thread = getThread(type, params.id);
+    const threadWithPerms = {
+        ...thread,
+        comments: thread.comments.map((c) => {
+            const cOwnerId = (c as any).ownerId as string | undefined;
+            const canEdit = admin || (c.role === "user" && Boolean(cOwnerId) && cOwnerId === userId);
+            const canDelete = admin || (c.role === "user" && Boolean(cOwnerId) && cOwnerId === userId);
+            return {
+                ...c,
+                canEdit,
+                canDelete,
+            };
+        }),
+    };
+
+    const response = NextResponse.json({
+        request: {
+            ...requestItem,
+            canEdit: canEditRequest,
+            canDelete: canDeleteRequest,
+        },
+        thread: threadWithPerms,
+        admin,
+    });
+    if (shouldSetCookie) {
+        response.cookies.set({ ...userCookieOptions(), value: userId });
+    }
+    return response;
+}
+
+export async function PATCH(
+    request: NextRequest,
+    context: { params: Promise<{ type: string; id: string }> }
+) {
+    try {
+        const { userId, shouldSetCookie } = getOrCreateUserId(request);
+        const params = await context.params;
+        const type = params.type === "dataset" ? "dataset" : params.type === "distillation" ? "distillation" : null;
+        if (!type) {
+            return NextResponse.json({ error: "Invalid request type" }, { status: 400 });
+        }
+
+        const existing = getRequest(type, params.id);
+        if (!existing) {
+            return NextResponse.json({ error: "Request not found" }, { status: 404 });
+        }
+
+        const admin = isAdminRequest(request);
+        const ownerId = (existing as any).ownerId as string | undefined;
+        const canEdit = admin || (Boolean(ownerId) && ownerId === userId);
+        if (!canEdit) {
+            return NextResponse.json({ error: "Forbidden" }, { status: 403 });
+        }
+
+        const body = await request.json();
+        const updated =
+            type === "distillation"
+                ? updateDistillationRequest(params.id, {
+                    sourceDataset: typeof body?.sourceDataset === "string" ? body.sourceDataset : undefined,
+                    studentModel: typeof body?.studentModel === "string" ? body.studentModel : undefined,
+                    additionalNotes: typeof body?.additionalNotes === "string" ? body.additionalNotes : undefined,
+                })
+                : updateDatasetRequest(params.id, {
+                    sourceModel: typeof body?.sourceModel === "string" ? body.sourceModel : undefined,
+                    datasetSize: typeof body?.datasetSize === "string" ? body.datasetSize : undefined,
+                    reasoningDepth: typeof body?.reasoningDepth === "string" ? body.reasoningDepth : undefined,
+                    topics: Array.isArray(body?.topics) ? body.topics : undefined,
+                    additionalNotes: typeof body?.additionalNotes === "string" ? body.additionalNotes : undefined,
+                });
+
+        if (!updated) {
+            return NextResponse.json({ error: "Request not found" }, { status: 404 });
+        }
+
+        const response = NextResponse.json({ ok: true, request: updated });
+        if (shouldSetCookie) {
+            response.cookies.set({ ...userCookieOptions(), value: userId });
+        }
+        return response;
+    } catch (error) {
+        console.error("Update request error:", error);
+        return NextResponse.json({ error: "Failed to update request" }, { status: 500 });
+    }
+}
+
+export async function DELETE(
+    request: NextRequest,
+    context: { params: Promise<{ type: string; id: string }> }
+) {
+    try {
+        const { userId, shouldSetCookie } = getOrCreateUserId(request);
+        const params = await context.params;
+        const type = params.type === "dataset" ? "dataset" : params.type === "distillation" ? "distillation" : null;
+        if (!type) {
+            return NextResponse.json({ error: "Invalid request type" }, { status: 400 });
+        }
+
+        const existing = getRequest(type, params.id);
+        if (!existing) {
+            return NextResponse.json({ error: "Request not found" }, { status: 404 });
+        }
+
+        const admin = isAdminRequest(request);
+        const ownerId = (existing as any).ownerId as string | undefined;
+        const canDelete = admin || (Boolean(ownerId) && ownerId === userId);
+        if (!canDelete) {
+            return NextResponse.json({ error: "Forbidden" }, { status: 403 });
+        }
+
+        const ok = deleteRequest(type, params.id);
+        if (!ok) {
+            return NextResponse.json({ error: "Request not found" }, { status: 404 });
+        }
+
+        const response = NextResponse.json({ ok: true });
+        if (shouldSetCookie) {
+            response.cookies.set({ ...userCookieOptions(), value: userId });
+        }
+        return response;
+    } catch (error) {
+        console.error("Delete request error:", error);
+        return NextResponse.json({ error: "Failed to delete request" }, { status: 500 });
+    }
+}

src/app/api/teichai-datasets/route.ts

@@ -0,0 +1,52 @@
+import { NextResponse } from "next/server";
+
+interface HFDataset {
+    id: string;
+    author: string;
+    downloads: number;
+    likes: number;
+    tags: string[];
+}
+
+let cachedDatasets: { id: string; name: string }[] | null = null;
+let cacheTimestamp: number = 0;
+const CACHE_DURATION = 1000 * 60 * 60; // 1 hour
+
+export async function GET() {
+    try {
+        const now = Date.now();
+        if (cachedDatasets && now - cacheTimestamp < CACHE_DURATION) {
+            return NextResponse.json(cachedDatasets);
+        }
+
+        const response = await fetch(
+            "https://huggingface.co/api/datasets?author=TeichAI&limit=100",
+            {
+                headers: {
+                    Accept: "application/json",
+                },
+                next: { revalidate: 3600 },
+            }
+        );
+
+        if (!response.ok) {
+            throw new Error(`HF API error: ${response.status}`);
+        }
+
+        const data: HFDataset[] = await response.json();
+
+        cachedDatasets = data.map((dataset) => ({
+            id: dataset.id,
+            name: dataset.id.replace("TeichAI/", ""),
+        }));
+        cacheTimestamp = now;
+
+        return NextResponse.json(cachedDatasets);
+    } catch (error) {
+        console.error("Error fetching TeichAI datasets:", error);
+        if (cachedDatasets) {
+            return NextResponse.json(cachedDatasets);
+        }
+        return NextResponse.json([], { status: 500 });
+    }
+}

src/app/globals.css

@@ -0,0 +1,73 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+/* Light theme */
+:root {
+    --background: #ffffff;
+    --foreground: #09090b;
+    --muted: #f4f4f5;
+    --muted-foreground: #71717a;
+    --border: #e4e4e7;
+    --card: #ffffff;
+    --card-foreground: #09090b;
+    --accent: #ff4c00;
+    --accent-hover: #e64500;
+    --accent-light: rgba(255, 76, 0, 0.1);
+}
+
+/* Dark theme */
+.dark {
+    --background: #09090b;
+    --foreground: #fafafa;
+    --muted: #18181b;
+    --muted-foreground: #a1a1aa;
+    --border: #27272a;
+    --card: #18181b;
+    --card-foreground: #fafafa;
+    --accent: #ff4c00;
+    --accent-hover: #ff6a2a;
+    --accent-light: rgba(255, 76, 0, 0.15);
+}
+
+body {
+    background: var(--background);
+    color: var(--foreground);
+    font-family: var(--font-geist-sans), system-ui, sans-serif;
+    transition: background-color 0.2s, color 0.2s;
+}
+
+html {
+    scroll-behavior: smooth;
+}
+
+/* Scrollbar */
+::-webkit-scrollbar {
+    width: 6px;
+}
+
+::-webkit-scrollbar-track {
+    background: transparent;
+}
+
+.dark ::-webkit-scrollbar-thumb {
+    background: #3f3f46;
+}
+
+:root:not(.dark) ::-webkit-scrollbar-thumb {
+    background: #d4d4d8;
+}
+
+::-webkit-scrollbar-thumb {
+    border-radius: 3px;
+}
+
+::-webkit-scrollbar-thumb:hover {
+    background: #52525b;
+}
+
+@layer base {
+    * {
+        @apply border-border;
+    }
+}

src/app/layout.tsx

@@ -0,0 +1,26 @@
+import type { Metadata } from "next";
+import { GeistMono } from "geist/font/mono";
+import { GeistSans } from "geist/font/sans";
+import { Providers } from "@/components/Providers";
+import "./globals.css";
+
+export const metadata: Metadata = {
+    title: "TeichAI - Community Requests",
+    description: "Submit and vote on model distillation and dataset requests for TeichAI",
+};
+
+export default function RootLayout({
+    children,
+}: Readonly<{
+    children: React.ReactNode;
+}>) {
+    return (
+        <html lang="en" className="dark" suppressHydrationWarning>
+            <body className={`${GeistSans.variable} ${GeistMono.variable} antialiased`}>
+                <Providers>
+                    {children}
+                </Providers>
+            </body>
+        </html>
+    );
+}

src/app/page.tsx

@@ -0,0 +1,741 @@
+"use client";
+
+import { useState, useEffect } from "react";
+import { ArrowUp, Cpu, Database, Plus, Loader2, ChevronRight } from "lucide-react";
+import Navbar from "@/components/Navbar";
+import Footer from "@/components/Footer";
+import { useRouter } from "next/navigation";
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import { Label } from "@/components/ui/label";
+import { Textarea } from "@/components/ui/textarea";
+import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs";
+import { Badge } from "@/components/ui/badge";
+import {
+    Select,
+    SelectContent,
+    SelectItem,
+    SelectTrigger,
+    SelectValue,
+} from "@/components/ui/select";
+import { Combobox } from "@/components/ui/combobox";
+import { toast } from "@/components/ui/toaster";
+
+interface DistillationRequest {
+    id: string;
+    sourceDataset: string;
+    studentModel: string;
+    additionalNotes: string;
+    upvotes: number;
+    createdAt: string;
+    status: "pending" | "in_progress" | "completed";
+}
+
+interface DatasetRequest {
+    id: string;
+    sourceModel: string;
+    datasetSize: string;
+    reasoningDepth: string;
+    topics: string[];
+    additionalNotes: string;
+    upvotes: number;
+    createdAt: string;
+    status: "pending" | "in_progress" | "completed";
+}
+
+interface TeichAIDataset {
+    id: string;
+    name: string;
+}
+
+interface OpenRouterModel {
+    id: string;
+    name: string;
+}
+
+const STUDENT_MODELS = [
+    "Qwen3-4B",
+    "Qwen3-8B",
+    "Qwen3-14B",
+    "Qwen3-30B-A3B",
+    "Qwen3-32B",
+    "Nemotron-Cascade-14B",
+    "Nemotron-Cascade-8B",
+    "Other",
+];
+
+const REASONING_DEPTHS = ["low", "medium", "high"];
+const DATASET_SIZES = ["100x", "250x", "500x", "1000x", "3000x", "11000x"];
+const TOPICS = [
+    "Coding",
+    "Math",
+    "Science",
+    "Web Development",
+    "Data Science",
+    "Machine Learning",
+    "Creative Writing",
+    "Reasoning",
+    "Logic",
+    "General Knowledge",
+];
+
+export default function Home() {
+    const router = useRouter();
+    const [distillationRequests, setDistillationRequests] = useState<DistillationRequest[]>([]);
+    const [datasetRequests, setDatasetRequests] = useState<DatasetRequest[]>([]);
+    const [loading, setLoading] = useState(true);
+    const [submitting, setSubmitting] = useState(false);
+    const [showDistillForm, setShowDistillForm] = useState(false);
+    const [showDatasetForm, setShowDatasetForm] = useState(false);
+
+    // External data
+    const [teichaiDatasets, setTeichaiDatasets] = useState<TeichAIDataset[]>([]);
+    const [openrouterModels, setOpenrouterModels] = useState<OpenRouterModel[]>([]);
+    const [loadingDatasets, setLoadingDatasets] = useState(false);
+    const [loadingModels, setLoadingModels] = useState(false);
+
+    // Distillation form state
+    const [sourceDataset, setSourceDataset] = useState("");
+    const [sourceDatasetOther, setSourceDatasetOther] = useState("");
+    const [studentModel, setStudentModel] = useState("");
+    const [studentModelOther, setStudentModelOther] = useState("");
+    const [distillNotes, setDistillNotes] = useState("");
+
+    // Dataset form state
+    const [sourceModel, setSourceModel] = useState("");
+    const [sourceModelOther, setSourceModelOther] = useState("");
+    const [datasetSize, setDatasetSize] = useState("250x");
+    const [reasoningDepth, setReasoningDepth] = useState("high");
+    const [selectedTopics, setSelectedTopics] = useState<string[]>([]);
+    const [datasetNotes, setDatasetNotes] = useState("");
+
+    useEffect(() => {
+        fetchRequests();
+        fetchTeichaiDatasets();
+        fetchOpenrouterModels();
+    }, []);
+
+    async function fetchRequests() {
+        try {
+            const [distillRes, datasetRes] = await Promise.all([
+                fetch("/api/distillation"),
+                fetch("/api/dataset"),
+            ]);
+            const distillData = await distillRes.json();
+            const datasetData = await datasetRes.json();
+            setDistillationRequests(Array.isArray(distillData) ? distillData : []);
+            setDatasetRequests(Array.isArray(datasetData) ? datasetData : []);
+        } catch (error) {
+            console.error("Error fetching requests:", error);
+        } finally {
+            setLoading(false);
+        }
+    }
+
+    async function fetchTeichaiDatasets() {
+        setLoadingDatasets(true);
+        try {
+            const res = await fetch("/api/teichai-datasets");
+            const data = await res.json();
+            setTeichaiDatasets(Array.isArray(data) ? data : []);
+        } catch (error) {
+            console.error("Error fetching TeichAI datasets:", error);
+        } finally {
+            setLoadingDatasets(false);
+        }
+    }
+
+    async function fetchOpenrouterModels() {
+        setLoadingModels(true);
+        try {
+            const res = await fetch("/api/openrouter-models");
+            const data = await res.json();
+            setOpenrouterModels(Array.isArray(data) ? data : []);
+        } catch (error) {
+            console.error("Error fetching OpenRouter models:", error);
+        } finally {
+            setLoadingModels(false);
+        }
+    }
+
+    async function handleDistillSubmit(e: React.FormEvent) {
+        e.preventDefault();
+        const resolvedSourceDataset = sourceDataset === "Other" ? sourceDatasetOther.trim() : sourceDataset;
+        const resolvedStudentModel = studentModel === "Other" ? studentModelOther.trim() : studentModel;
+        if (!resolvedSourceDataset || !resolvedStudentModel) {
+            toast({ title: "Error", description: "Please fill in required fields", variant: "destructive" });
+            return;
+        }
+        setSubmitting(true);
+        try {
+            const res = await fetch("/api/distillation", {
+                method: "POST",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify({
+                    sourceDataset: resolvedSourceDataset,
+                    studentModel: resolvedStudentModel,
+                    additionalNotes: distillNotes,
+                }),
+            });
+            if (res.ok) {
+                toast({ title: "Success", description: "Distillation request submitted!" });
+                setSourceDataset("");
+                setSourceDatasetOther("");
+                setStudentModel("");
+                setStudentModelOther("");
+                setDistillNotes("");
+                setShowDistillForm(false);
+                fetchRequests();
+            } else {
+                throw new Error("Failed to submit");
+            }
+        } catch (error) {
+            toast({ title: "Error", description: "Failed to submit request", variant: "destructive" });
+        } finally {
+            setSubmitting(false);
+        }
+    }
+
+    async function handleDatasetSubmit(e: React.FormEvent) {
+        e.preventDefault();
+        const resolvedSourceModel = sourceModel === "Other" ? sourceModelOther.trim() : sourceModel;
+        if (!resolvedSourceModel) {
+            toast({ title: "Error", description: "Please select a source model", variant: "destructive" });
+            return;
+        }
+        setSubmitting(true);
+        try {
+            const res = await fetch("/api/dataset", {
+                method: "POST",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify({
+                    sourceModel: resolvedSourceModel,
+                    datasetSize,
+                    reasoningDepth,
+                    topics: selectedTopics,
+                    additionalNotes: datasetNotes,
+                }),
+            });
+            if (res.ok) {
+                toast({ title: "Success", description: "Dataset request submitted!" });
+                setSourceModel("google/gemini-3-flash-preview");
+                setSourceModelOther("");
+                setDatasetSize("250x");
+                setReasoningDepth("high");
+                setSelectedTopics([]);
+                setDatasetNotes("");
+                setShowDatasetForm(false);
+                fetchRequests();
+            } else {
+                throw new Error("Failed to submit");
+            }
+        } catch (error) {
+            toast({ title: "Error", description: "Failed to submit request", variant: "destructive" });
+        } finally {
+            setSubmitting(false);
+        }
+    }
+
+    async function handleUpvote(type: "distillation" | "dataset", id: string) {
+        try {
+            const endpoint = type === "distillation" ? "/api/distillation" : "/api/dataset";
+            const res = await fetch(endpoint, {
+                method: "PATCH",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify({ id }),
+            });
+            const data = await res.json();
+
+            if (!res.ok) {
+                if (res.status === 404) {
+                    toast({ title: "Not found", description: "This request no longer exists", variant: "destructive" });
+                    return;
+                }
+                toast({ title: "Error", description: data?.error || "Failed to vote", variant: "destructive" });
+                return;
+            }
+
+            if (type === "distillation") {
+                setDistillationRequests((prev) =>
+                    prev.map((r) => (r.id === id ? { ...r, upvotes: data.upvotes } : r))
+                );
+            } else {
+                setDatasetRequests((prev) =>
+                    prev.map((r) => (r.id === id ? { ...r, upvotes: data.upvotes } : r))
+                );
+            }
+
+            if (data.action === "unvoted") {
+                toast({ title: "Vote removed", description: "Your vote has been removed" });
+            } else {
+                toast({ title: "Voted!", description: "Your vote has been recorded" });
+            }
+        } catch (error) {
+            toast({ title: "Error", description: "Failed to vote", variant: "destructive" });
+        }
+    }
+
+    function toggleTopic(topic: string) {
+        setSelectedTopics((prev) =>
+            prev.includes(topic) ? prev.filter((t) => t !== topic) : [...prev, topic]
+        );
+    }
+
+    function getStatusBadge(status: string) {
+        switch (status) {
+            case "completed":
+                return <Badge variant="success">Completed</Badge>;
+            case "in_progress":
+                return <Badge variant="warning">In Progress</Badge>;
+            default:
+                return <Badge variant="secondary">Pending</Badge>;
+        }
+    }
+
+    function formatDate(dateStr: string) {
+        return new Date(dateStr).toLocaleDateString("en-US", {
+            month: "short",
+            day: "numeric",
+            year: "numeric",
+        });
+    }
+
+    function goToDiscussion(type: "distillation" | "dataset", id: string) {
+        router.push(`/requests/${type}/${id}`);
+    }
+
+    return (
+        <main className="min-h-screen bg-background">
+            <Navbar />
+
+            {/* Hero */}
+            <section className="relative overflow-hidden pt-24 pb-16">
+                <div className="pointer-events-none absolute inset-0 -z-10 bg-[radial-gradient(circle_at_top,rgba(255,76,0,0.10),transparent_55%)] dark:bg-[radial-gradient(circle_at_top,rgba(255,76,0,0.16),transparent_55%)]" />
+                <div className="mx-auto max-w-6xl px-4 sm:px-6">
+                    <div className="max-w-3xl">
+                        <p className="mb-3 text-sm font-medium text-primary">Community Requests</p>
+                        <h1 className="mb-6 text-4xl font-bold leading-tight tracking-tight text-foreground md:text-5xl">
+                            Request Model Distillations & Datasets
+                        </h1>
+                        <p className="mb-8 text-lg leading-relaxed text-muted-foreground">
+                            Submit your requests for new distilled models or reasoning datasets. Vote on requests
+                            from other community members to help us prioritize what to build next.
+                        </p>
+                    </div>
+                </div>
+            </section>
+
+            {/* Main Content */}
+            <section className="py-8">
+                <div className="mx-auto max-w-6xl px-4 sm:px-6">
+                    <Tabs defaultValue="distillation" className="w-full">
+                        <TabsList className="mb-6 grid w-full grid-cols-2">
+                            <TabsTrigger value="distillation" className="flex items-center gap-2">
+                                <Cpu className="h-4 w-4" />
+                                Model Distillation
+                            </TabsTrigger>
+                            <TabsTrigger value="dataset" className="flex items-center gap-2">
+                                <Database className="h-4 w-4" />
+                                Dataset
+                            </TabsTrigger>
+                        </TabsList>
+
+                        {/* Distillation Tab */}
+                        <TabsContent value="distillation">
+                            <div className="mb-6 flex items-center justify-between">
+                                <h2 className="text-xl font-semibold text-foreground">Distillation Requests</h2>
+                                <Button onClick={() => setShowDistillForm(!showDistillForm)}>
+                                    <Plus className="h-4 w-4" />
+                                    New Request
+                                </Button>
+                            </div>
+
+                            {showDistillForm && (
+                                <Card className="mb-6">
+                                    <CardHeader>
+                                        <CardTitle>Request a Distilled Model</CardTitle>
+                                        <CardDescription>
+                                            Select one of our existing datasets to distill into a student model
+                                        </CardDescription>
+                                    </CardHeader>
+                                    <CardContent>
+                                        <form onSubmit={handleDistillSubmit} className="space-y-4">
+                                            <div className="grid gap-4 md:grid-cols-2">
+                                                <div className="space-y-2">
+                                                    <Label htmlFor="dataset">Source Dataset *</Label>
+                                                    <Combobox
+                                                        options={[...teichaiDatasets, { id: "Other", name: "Other" }]}
+                                                        value={sourceDataset}
+                                                        onValueChange={(v) => {
+                                                            setSourceDataset(v);
+                                                            if (v !== "Other") setSourceDatasetOther("");
+                                                        }}
+                                                        placeholder="Select a TeichAI dataset"
+                                                        searchPlaceholder="Search datasets..."
+                                                        emptyMessage="No datasets found"
+                                                        loading={loadingDatasets}
+                                                    />
+                                                </div>
+                                                <div className="space-y-2">
+                                                    <Label htmlFor="student">Student Model *</Label>
+                                                    <Select
+                                                        value={studentModel}
+                                                        onValueChange={(v) => {
+                                                            setStudentModel(v);
+                                                            if (v !== "Other") setStudentModelOther("");
+                                                        }}
+                                                    >
+                                                        <SelectTrigger>
+                                                            <SelectValue placeholder="Select student model" />
+                                                        </SelectTrigger>
+                                                        <SelectContent>
+                                                            {STUDENT_MODELS.map((model) => (
+                                                                <SelectItem key={model} value={model}>
+                                                                    {model}
+                                                                </SelectItem>
+                                                            ))}
+                                                        </SelectContent>
+                                                    </Select>
+                                                </div>
+                                            </div>
+                                            {sourceDataset === "Other" && (
+                                                <div className="space-y-2">
+                                                    <Label htmlFor="datasetOther">Source Dataset (Other) *</Label>
+                                                    <input
+                                                        id="datasetOther"
+                                                        className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
+                                                        value={sourceDatasetOther}
+                                                        onChange={(e) => setSourceDatasetOther(e.target.value)}
+                                                        placeholder="Type the dataset name"
+                                                    />
+                                                </div>
+                                            )}
+                                            {studentModel === "Other" && (
+                                                <div className="space-y-2">
+                                                    <Label htmlFor="studentOther">Student Model (Other) *</Label>
+                                                    <input
+                                                        id="studentOther"
+                                                        className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
+                                                        value={studentModelOther}
+                                                        onChange={(e) => setStudentModelOther(e.target.value)}
+                                                        placeholder="Type the student model name"
+                                                    />
+                                                </div>
+                                            )}
+                                            <div className="space-y-2">
+                                                <Label htmlFor="notes">Additional Notes</Label>
+                                                <Textarea
+                                                    id="notes"
+                                                    placeholder="Any specific requirements or context..."
+                                                    value={distillNotes}
+                                                    onChange={(e) => setDistillNotes(e.target.value)}
+                                                />
+                                            </div>
+                                            <div className="flex gap-2">
+                                                <Button type="submit" disabled={submitting}>
+                                                    {submitting && <Loader2 className="h-4 w-4 animate-spin" />}
+                                                    Submit Request
+                                                </Button>
+                                                <Button type="button" variant="outline" onClick={() => setShowDistillForm(false)}>
+                                                    Cancel
+                                                </Button>
+                                            </div>
+                                        </form>
+                                    </CardContent>
+                                </Card>
+                            )}
+
+                            {loading ? (
+                                <div className="flex justify-center py-12">
+                                    <Loader2 className="h-8 w-8 animate-spin text-muted-foreground" />
+                                </div>
+                            ) : distillationRequests.length === 0 ? (
+                                <Card className="p-12 text-center">
+                                    <p className="text-muted-foreground">No distillation requests yet. Be the first!</p>
+                                </Card>
+                            ) : (
+                                <div className="space-y-4">
+                                    {distillationRequests.map((request) => (
+                                        <Card
+                                            key={request.id}
+                                            className="group cursor-pointer transition-all hover:shadow-md"
+                                            onClick={() => goToDiscussion("distillation", request.id)}
+                                            role="link"
+                                            tabIndex={0}
+                                            onKeyDown={(e) => {
+                                                if (e.key === "Enter" || e.key === " ") {
+                                                    e.preventDefault();
+                                                    goToDiscussion("distillation", request.id);
+                                                }
+                                            }}
+                                        >
+                                            <CardContent className="p-5">
+                                                <div className="flex items-start gap-4">
+                                                    <button
+                                                        onClick={(e) => {
+                                                            e.stopPropagation();
+                                                            handleUpvote("distillation", request.id);
+                                                        }}
+                                                        className="flex flex-col items-center gap-1 rounded-lg border border-border bg-muted px-3 py-2 transition-colors hover:border-primary hover:bg-accent"
+                                                    >
+                                                        <ArrowUp className="h-4 w-4 text-primary" />
+                                                        <span className="text-sm font-semibold">{request.upvotes}</span>
+                                                    </button>
+                                                    <div className="flex-1">
+                                                        <div className="mb-2 flex flex-wrap items-center gap-2">
+                                                            <h3 className="font-medium text-foreground">
+                                                                {request.sourceDataset} → {request.studentModel}
+                                                            </h3>
+                                                            {getStatusBadge(request.status)}
+                                                        </div>
+                                                        {request.additionalNotes && (
+                                                            <p className="mb-2 text-sm text-muted-foreground">{request.additionalNotes}</p>
+                                                        )}
+                                                        <p className="text-xs text-muted-foreground">
+                                                            Requested on {formatDate(request.createdAt)}
+                                                        </p>
+                                                    </div>
+                                                    <div className="flex items-center text-muted-foreground">
+                                                        <ChevronRight className="h-5 w-5 opacity-50 transition-opacity group-hover:opacity-100" />
+                                                    </div>
+                                                </div>
+                                            </CardContent>
+                                        </Card>
+                                    ))}
+                                </div>
+                            )}
+                        </TabsContent>
+
+                        {/* Dataset Tab */}
+                        <TabsContent value="dataset">
+                            <div className="mb-6 flex items-center justify-between">
+                                <h2 className="text-xl font-semibold text-foreground">Dataset</h2>
+                                <Button onClick={() => setShowDatasetForm(!showDatasetForm)}>
+                                    <Plus className="h-4 w-4" />
+                                    New Request
+                                </Button>
+                            </div>
+
+                            {showDatasetForm && (
+                                <Card className="mb-6">
+                                    <CardHeader>
+                                        <CardTitle>Request a Dataset</CardTitle>
+                                        <CardDescription>
+                                            Specify which model to generate reasoning data from
+                                        </CardDescription>
+                                    </CardHeader>
+                                    <CardContent>
+                                        <form onSubmit={handleDatasetSubmit} className="space-y-4">
+                                            <div className="grid gap-4 md:grid-cols-2">
+                                                <div className="space-y-2">
+                                                    <Label htmlFor="sourceModel">Source Model *</Label>
+                                                    <Combobox
+                                                        options={[...openrouterModels, { id: "Other", name: "Other" }]}
+                                                        value={sourceModel}
+                                                        onValueChange={(v) => {
+                                                            setSourceModel(v);
+                                                            if (v !== "Other") setSourceModelOther("");
+                                                        }}
+                                                        placeholder="Select an OpenRouter model"
+                                                        searchPlaceholder="Search models..."
+                                                        emptyMessage="No models found"
+                                                        loading={loadingModels}
+                                                    />
+                                                </div>
+                                                <div className="space-y-2">
+                                                    <Label htmlFor="size">Dataset Size</Label>
+                                                    <Select value={datasetSize} onValueChange={setDatasetSize}>
+                                                        <SelectTrigger>
+                                                            <SelectValue />
+                                                        </SelectTrigger>
+                                                        <SelectContent>
+                                                            {DATASET_SIZES.map((size) => (
+                                                                <SelectItem key={size} value={size}>
+                                                                    {size} samples
+                                                                </SelectItem>
+                                                            ))}
+                                                        </SelectContent>
+                                                    </Select>
+                                                </div>
+                                            </div>
+                                            {sourceModel === "Other" && (
+                                                <div className="space-y-2">
+                                                    <Label htmlFor="sourceModelOther">Source Model (Other) *</Label>
+                                                    <input
+                                                        id="sourceModelOther"
+                                                        className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
+                                                        value={sourceModelOther}
+                                                        onChange={(e) => setSourceModelOther(e.target.value)}
+                                                        placeholder="Type the model name"
+                                                    />
+                                                </div>
+                                            )}
+                                            <div className="space-y-2">
+                                                <Label htmlFor="depth">Reasoning Depth</Label>
+                                                <Select value={reasoningDepth} onValueChange={setReasoningDepth}>
+                                                    <SelectTrigger className="w-[200px]">
+                                                        <SelectValue />
+                                                    </SelectTrigger>
+                                                    <SelectContent>
+                                                        {REASONING_DEPTHS.map((depth) => (
+                                                            <SelectItem key={depth} value={depth}>
+                                                                {depth.charAt(0).toUpperCase() + depth.slice(1)}
+                                                            </SelectItem>
+                                                        ))}
+                                                    </SelectContent>
+                                                </Select>
+                                            </div>
+                                            <div className="space-y-2">
+                                                <Label>Topics (select multiple)</Label>
+                                                <div className="flex flex-wrap gap-2">
+                                                    {TOPICS.map((topic) => (
+                                                        <button
+                                                            key={topic}
+                                                            type="button"
+                                                            onClick={() => toggleTopic(topic)}
+                                                            className={`rounded-full px-3 py-1 text-sm transition-colors ${selectedTopics.includes(topic)
+                                                                ? "bg-primary text-primary-foreground"
+                                                                : "bg-muted text-muted-foreground hover:bg-accent"
+                                                                }`}
+                                                        >
+                                                            {topic}
+                                                        </button>
+                                                    ))}
+                                                </div>
+                                            </div>
+                                            <div className="space-y-2">
+                                                <Label htmlFor="datasetNotes">Additional Notes</Label>
+                                                <Textarea
+                                                    id="datasetNotes"
+                                                    placeholder="Any specific requirements or context..."
+                                                    value={datasetNotes}
+                                                    onChange={(e) => setDatasetNotes(e.target.value)}
+                                                />
+                                            </div>
+                                            <div className="flex gap-2">
+                                                <Button type="submit" disabled={submitting}>
+                                                    {submitting && <Loader2 className="h-4 w-4 animate-spin" />}
+                                                    Submit Request
+                                                </Button>
+                                                <Button type="button" variant="outline" onClick={() => setShowDatasetForm(false)}>
+                                                    Cancel
+                                                </Button>
+                                            </div>
+                                        </form>
+                                    </CardContent>
+                                </Card>
+                            )}
+
+                            {loading ? (
+                                <div className="flex justify-center py-12">
+                                    <Loader2 className="h-8 w-8 animate-spin text-muted-foreground" />
+                                </div>
+                            ) : datasetRequests.length === 0 ? (
+                                <Card className="p-12 text-center">
+                                    <p className="text-muted-foreground">No dataset requests yet. Be the first!</p>
+                                </Card>
+                            ) : (
+                                <div className="space-y-4">
+                                    {datasetRequests.map((request) => (
+                                        <Card
+                                            key={request.id}
+                                            className="group cursor-pointer transition-all hover:shadow-md"
+                                            onClick={() => goToDiscussion("dataset", request.id)}
+                                            role="link"
+                                            tabIndex={0}
+                                            onKeyDown={(e) => {
+                                                if (e.key === "Enter" || e.key === " ") {
+                                                    e.preventDefault();
+                                                    goToDiscussion("dataset", request.id);
+                                                }
+                                            }}
+                                        >
+                                            <CardContent className="p-5">
+                                                <div className="flex items-start gap-4">
+                                                    <button
+                                                        onClick={(e) => {
+                                                            e.stopPropagation();
+                                                            handleUpvote("dataset", request.id);
+                                                        }}
+                                                        className="flex flex-col items-center gap-1 rounded-lg border border-border bg-muted px-3 py-2 transition-colors hover:border-primary hover:bg-accent"
+                                                    >
+                                                        <ArrowUp className="h-4 w-4 text-primary" />
+                                                        <span className="text-sm font-semibold">{request.upvotes}</span>
+                                                    </button>
+                                                    <div className="flex-1">
+                                                        <div className="mb-2 flex flex-wrap items-center gap-2">
+                                                            <h3 className="font-medium text-foreground">
+                                                                {request.sourceModel} Dataset ({request.datasetSize})
+                                                            </h3>
+                                                            {getStatusBadge(request.status)}
+                                                            <Badge variant="outline">{request.reasoningDepth} reasoning</Badge>
+                                                        </div>
+                                                        {request.topics.length > 0 && (
+                                                            <div className="mb-2 flex flex-wrap gap-1">
+                                                                {request.topics.map((topic) => (
+                                                                    <Badge key={topic} variant="secondary" className="text-xs">
+                                                                        {topic}
+                                                                    </Badge>
+                                                                ))}
+                                                            </div>
+                                                        )}
+                                                        {request.additionalNotes && (
+                                                            <p className="mb-2 text-sm text-muted-foreground">{request.additionalNotes}</p>
+                                                        )}
+                                                        <p className="text-xs text-muted-foreground">
+                                                            Requested on {formatDate(request.createdAt)}
+                                                        </p>
+                                                    </div>
+                                                    <div className="flex items-center text-muted-foreground">
+                                                        <ChevronRight className="h-5 w-5 opacity-50 transition-opacity group-hover:opacity-100" />
+                                                    </div>
+                                                </div>
+                                            </CardContent>
+                                        </Card>
+                                    ))}
+                                </div>
+                            )}
+                        </TabsContent>
+                    </Tabs>
+                </div>
+            </section>
+
+            {/* Info Section */}
+            <section className="py-16">
+                <div className="mx-auto max-w-6xl px-4 sm:px-6">
+                    <Card className="overflow-hidden">
+                        <CardContent className="p-8 md:p-12">
+                            <div className="max-w-2xl">
+                                <h2 className="mb-4 text-2xl font-bold text-foreground">How It Works</h2>
+                                <ul className="space-y-3 text-muted-foreground">
+                                    <li className="flex items-start gap-2">
+                                        <span className="font-bold text-primary">1.</span>
+                                        Submit a request for a model distillation or reasoning dataset
+                                    </li>
+                                    <li className="flex items-start gap-2">
+                                        <span className="font-bold text-primary">2.</span>
+                                        Upvote requests from other community members
+                                    </li>
+                                    <li className="flex items-start gap-2">
+                                        <span className="font-bold text-primary">3.</span>
+                                        We prioritize requests based on community interest
+                                    </li>
+                                    <li className="flex items-start gap-2">
+                                        <span className="font-bold text-primary">4.</span>
+                                        Models and datasets are published on our Hugging Face page
+                                    </li>
+                                    <li className="flex items-start gap-2">
+                                        <span className="font-bold text-primary">Note:</span>
+                                        We will do our best to fulfill as many requests as possible, but we can’t guarantee anything due to time and money constraints.
+                                    </li>
+                                </ul>
+                            </div>
+                        </CardContent>
+                    </Card>
+                </div>
+            </section>
+
+            <Footer />
+        </main>
+    );
+}

src/app/requests/[type]/[id]/page.tsx

@@ -0,0 +1,650 @@
+"use client";
+
+import { useEffect, useMemo, useState } from "react";
+import Link from "next/link";
+import { useParams, useRouter } from "next/navigation";
+import Navbar from "@/components/Navbar";
+import Footer from "@/components/Footer";
+import { Button } from "@/components/ui/button";
+import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
+import { Badge } from "@/components/ui/badge";
+import { Label } from "@/components/ui/label";
+import { Textarea } from "@/components/ui/textarea";
+import { toast } from "@/components/ui/toaster";
+
+type RequestStatus = "pending" | "in_progress" | "completed";
+
+type DistillationRequest = {
+    id: string;
+    sourceDataset: string;
+    studentModel: string;
+    additionalNotes: string;
+    upvotes: number;
+    createdAt: string;
+    status: RequestStatus;
+    canEdit?: boolean;
+    canDelete?: boolean;
+};
+
+type DatasetRequest = {
+    id: string;
+    sourceModel: string;
+    datasetSize: string;
+    reasoningDepth: string;
+    topics: string[];
+    additionalNotes: string;
+    upvotes: number;
+    createdAt: string;
+    status: RequestStatus;
+    canEdit?: boolean;
+    canDelete?: boolean;
+};
+
+type DiscussionComment = {
+    id: string;
+    body: string;
+    author: string;
+    role: "admin" | "user";
+    createdAt: string;
+    editedAt?: string;
+    canEdit?: boolean;
+    canDelete?: boolean;
+};
+
+type Thread = {
+    key: string;
+    requestType: "distillation" | "dataset";
+    requestId: string;
+    comments: DiscussionComment[];
+};
+
+function formatDate(dateStr: string) {
+    return new Date(dateStr).toLocaleString("en-US", {
+        year: "numeric",
+        month: "short",
+        day: "numeric",
+        hour: "numeric",
+        minute: "2-digit",
+    });
+}
+
+function StatusBadge({ status }: { status: RequestStatus }) {
+    if (status === "completed") return <Badge variant="success">Completed</Badge>;
+    if (status === "in_progress") return <Badge variant="warning">In Progress</Badge>;
+    return <Badge variant="secondary">Pending</Badge>;
+}
+
+export default function RequestDiscussionPage() {
+    const params = useParams<{ type: string; id: string }>();
+    const router = useRouter();
+    const type = params.type === "dataset" ? "dataset" : "distillation";
+    const id = params.id;
+
+    const [admin, setAdmin] = useState(false);
+    const [loading, setLoading] = useState(true);
+
+    const [request, setRequest] = useState<DistillationRequest | DatasetRequest | null>(null);
+    const [thread, setThread] = useState<Thread | null>(null);
+
+    const [author, setAuthor] = useState("");
+    const [commentBody, setCommentBody] = useState("");
+    const [submitting, setSubmitting] = useState(false);
+
+    const [editingCommentId, setEditingCommentId] = useState<string | null>(null);
+    const [editingCommentBody, setEditingCommentBody] = useState("");
+    const [editingCommentSaving, setEditingCommentSaving] = useState(false);
+
+    const [editingRequest, setEditingRequest] = useState(false);
+    const [editSourceA, setEditSourceA] = useState("");
+    const [editSourceB, setEditSourceB] = useState("");
+    const [editDatasetSize, setEditDatasetSize] = useState("");
+    const [editReasoningDepth, setEditReasoningDepth] = useState("");
+    const [editTopics, setEditTopics] = useState("");
+    const [editNotes, setEditNotes] = useState("");
+    const [savingRequest, setSavingRequest] = useState(false);
+
+    const title = useMemo(() => {
+        if (!request) return "Request";
+        if (type === "distillation") {
+            const r = request as DistillationRequest;
+            return `${r.sourceDataset} → ${r.studentModel}`;
+        }
+        const r = request as DatasetRequest;
+        return `${r.sourceModel} Dataset (${r.datasetSize})`;
+    }, [request, type]);
+
+    useEffect(() => {
+        checkAdmin();
+        fetchThread();
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [type, id]);
+
+    async function checkAdmin() {
+        try {
+            const res = await fetch("/api/admin/me", { cache: "no-store" });
+            const data = await res.json();
+            setAdmin(Boolean(data?.admin));
+        } catch {
+            setAdmin(false);
+        }
+    }
+
+    async function fetchThread() {
+        setLoading(true);
+        try {
+            const res = await fetch(`/api/requests/${type}/${id}`, { cache: "no-store" });
+            const data = await res.json();
+            if (!res.ok) {
+                toast({ title: "Error", description: data?.error || "Request not found", variant: "destructive" });
+                setRequest(null);
+                setThread(null);
+                return;
+            }
+            setRequest(data.request);
+            setThread(data.thread);
+            if (data?.request && !editingRequest) {
+                if (type === "distillation") {
+                    setEditSourceA(data.request.sourceDataset || "");
+                    setEditSourceB(data.request.studentModel || "");
+                } else {
+                    setEditSourceA(data.request.sourceModel || "");
+                    setEditDatasetSize(data.request.datasetSize || "");
+                    setEditReasoningDepth(data.request.reasoningDepth || "");
+                    setEditTopics(Array.isArray(data.request.topics) ? data.request.topics.join(", ") : "");
+                }
+                setEditNotes(data.request.additionalNotes || "");
+            }
+        } catch (error) {
+            console.error(error);
+            toast({ title: "Error", description: "Failed to load discussion", variant: "destructive" });
+        } finally {
+            setLoading(false);
+        }
+    }
+
+    async function saveEditedComment() {
+        if (!editingCommentId) return;
+        const text = editingCommentBody.trim();
+        if (!text) {
+            toast({ title: "Error", description: "Comment cannot be empty", variant: "destructive" });
+            return;
+        }
+
+        setEditingCommentSaving(true);
+        try {
+            const res = await fetch(`/api/requests/${type}/${id}/comments/${editingCommentId}`, {
+                method: "PATCH",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify({ body: text }),
+            });
+            const data = await res.json();
+            if (!res.ok) {
+                toast({ title: "Error", description: data?.error || "Failed to edit comment", variant: "destructive" });
+                return;
+            }
+            setEditingCommentId(null);
+            setEditingCommentBody("");
+            await fetchThread();
+        } catch {
+            toast({ title: "Error", description: "Failed to edit comment", variant: "destructive" });
+        } finally {
+            setEditingCommentSaving(false);
+        }
+    }
+
+    async function deleteCommentById(commentId: string) {
+        if (!confirm("Delete this comment?")) return;
+        try {
+            const res = await fetch(`/api/requests/${type}/${id}/comments/${commentId}`, {
+                method: "DELETE",
+            });
+            const data = await res.json();
+            if (!res.ok) {
+                toast({ title: "Error", description: data?.error || "Failed to delete comment", variant: "destructive" });
+                return;
+            }
+            if (editingCommentId === commentId) {
+                setEditingCommentId(null);
+                setEditingCommentBody("");
+            }
+            await fetchThread();
+        } catch {
+            toast({ title: "Error", description: "Failed to delete comment", variant: "destructive" });
+        }
+    }
+
+    async function saveRequestEdits() {
+        if (!request) return;
+        setSavingRequest(true);
+        try {
+            const payload =
+                type === "distillation"
+                    ? {
+                        sourceDataset: editSourceA.trim(),
+                        studentModel: editSourceB.trim(),
+                        additionalNotes: editNotes,
+                    }
+                    : {
+                        sourceModel: editSourceA.trim(),
+                        datasetSize: editDatasetSize.trim(),
+                        reasoningDepth: editReasoningDepth.trim(),
+                        topics: editTopics
+                            .split(",")
+                            .map((t) => t.trim())
+                            .filter(Boolean),
+                        additionalNotes: editNotes,
+                    };
+
+            const res = await fetch(`/api/requests/${type}/${id}`, {
+                method: "PATCH",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify(payload),
+            });
+            const data = await res.json();
+            if (!res.ok) {
+                toast({ title: "Error", description: data?.error || "Failed to update request", variant: "destructive" });
+                return;
+            }
+            setEditingRequest(false);
+            await fetchThread();
+        } catch {
+            toast({ title: "Error", description: "Failed to update request", variant: "destructive" });
+        } finally {
+            setSavingRequest(false);
+        }
+    }
+
+    async function deleteRequestSelf() {
+        if (!confirm("Delete this request?")) return;
+        try {
+            const res = await fetch(`/api/requests/${type}/${id}`, { method: "DELETE" });
+            const data = await res.json();
+            if (!res.ok) {
+                toast({ title: "Error", description: data?.error || "Failed to delete request", variant: "destructive" });
+                return;
+            }
+            router.push("/");
+        } catch {
+            toast({ title: "Error", description: "Failed to delete request", variant: "destructive" });
+        }
+    }
+
+    async function submitComment() {
+        const text = commentBody.trim();
+        if (!text) {
+            toast({ title: "Error", description: "Comment cannot be empty", variant: "destructive" });
+            return;
+        }
+
+        setSubmitting(true);
+        try {
+            const endpoint = admin
+                ? `/api/admin/requests/${type}/${id}/comments`
+                : `/api/requests/${type}/${id}/comments`;
+
+            const payload = admin ? { body: text } : { body: text, author };
+
+            const res = await fetch(endpoint, {
+                method: "POST",
+                headers: { "Content-Type": "application/json" },
+                body: JSON.stringify(payload),
+            });
+            const data = await res.json();
+            if (!res.ok) {
+                toast({ title: "Error", description: data?.error || "Failed to comment", variant: "destructive" });
+                return;
+            }
+            setCommentBody("");
+            await fetchThread();
+        } catch {
+            toast({ title: "Error", description: "Failed to comment", variant: "destructive" });
+        } finally {
+            setSubmitting(false);
+        }
+    }
+
+    return (
+        <main className="min-h-screen bg-background">
+            <Navbar />
+
+            <section className="pt-24 pb-10">
+                <div className="mx-auto max-w-6xl px-4 sm:px-6">
+                    <div className="mb-6 flex flex-wrap items-center justify-between gap-3">
+                        <div>
+                            <div className="flex items-center gap-2">
+                                <h1 className="text-2xl font-bold tracking-tight text-foreground">{title}</h1>
+                                {request ? <StatusBadge status={request.status} /> : null}
+                                <Badge variant="outline">{type}</Badge>
+                            </div>
+                            <p className="mt-1 text-sm text-muted-foreground">
+                                <Link href="/" className="hover:underline">Home</Link>
+                                <span className="mx-2">/</span>
+                                Discussion
+                            </p>
+                        </div>
+                    </div>
+
+                    {loading ? (
+                        <Card>
+                            <CardContent className="p-6 text-muted-foreground">Loading…</CardContent>
+                        </Card>
+                    ) : !request ? (
+                        <Card>
+                            <CardContent className="p-6 text-muted-foreground">Request not found.</CardContent>
+                        </Card>
+                    ) : (
+                        <div className="grid gap-4 lg:grid-cols-3">
+                            <div className="lg:col-span-1">
+                                <Card>
+                                    <CardHeader>
+                                        <CardTitle>Request</CardTitle>
+                                        <CardDescription>Details</CardDescription>
+                                    </CardHeader>
+                                    <CardContent className="space-y-3">
+                                        <div className="flex flex-wrap gap-2">
+                                            <Badge variant="secondary">{request.upvotes} upvotes</Badge>
+                                            <Badge variant="outline">Created {formatDate(request.createdAt)}</Badge>
+                                        </div>
+
+                                        {type === "distillation" ? (
+                                            <div className="space-y-2">
+                                                <div className="text-sm">
+                                                    <span className="text-muted-foreground">Source dataset:</span>{" "}
+                                                    <span className="text-foreground">{(request as DistillationRequest).sourceDataset}</span>
+                                                </div>
+                                                <div className="text-sm">
+                                                    <span className="text-muted-foreground">Student model:</span>{" "}
+                                                    <span className="text-foreground">{(request as DistillationRequest).studentModel}</span>
+                                                </div>
+                                            </div>
+                                        ) : (
+                                            <div className="space-y-2">
+                                                <div className="text-sm">
+                                                    <span className="text-muted-foreground">Source model:</span>{" "}
+                                                    <span className="text-foreground">{(request as DatasetRequest).sourceModel}</span>
+                                                </div>
+                                                <div className="text-sm">
+                                                    <span className="text-muted-foreground">Dataset size:</span>{" "}
+                                                    <span className="text-foreground">{(request as DatasetRequest).datasetSize}</span>
+                                                </div>
+                                                <div className="text-sm">
+                                                    <span className="text-muted-foreground">Reasoning depth:</span>{" "}
+                                                    <span className="text-foreground">{(request as DatasetRequest).reasoningDepth}</span>
+                                                </div>
+                                                {(request as DatasetRequest).topics?.length ? (
+                                                    <div className="flex flex-wrap gap-1">
+                                                        {(request as DatasetRequest).topics.map((t) => (
+                                                            <Badge key={t} variant="secondary" className="text-xs">
+                                                                {t}
+                                                            </Badge>
+                                                        ))}
+                                                    </div>
+                                                ) : null}
+                                            </div>
+                                        )}
+
+                                        {request.additionalNotes ? (
+                                            <div className="rounded-md border border-border bg-card p-3 text-sm text-muted-foreground">
+                                                {request.additionalNotes}
+                                            </div>
+                                        ) : null}
+
+                                        {(request.canEdit || request.canDelete) && (
+                                            <div className="flex flex-wrap gap-2 pt-2">
+                                                {request.canEdit && (
+                                                    <Button
+                                                        variant="outline"
+                                                        onClick={() => setEditingRequest((v) => !v)}
+                                                    >
+                                                        {editingRequest ? "Close Edit" : "Edit"}
+                                                    </Button>
+                                                )}
+                                                {request.canDelete && (
+                                                    <Button variant="destructive" onClick={deleteRequestSelf}>
+                                                        Delete
+                                                    </Button>
+                                                )}
+                                            </div>
+                                        )}
+
+                                        {editingRequest && request.canEdit && (
+                                            <div className="space-y-3 border-t border-border pt-4">
+                                                {type === "distillation" ? (
+                                                    <>
+                                                        <div className="space-y-2">
+                                                            <Label htmlFor="editSourceDataset">Source Dataset</Label>
+                                                            <input
+                                                                id="editSourceDataset"
+                                                                title="Source dataset"
+                                                                placeholder="Source dataset"
+                                                                className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
+                                                                value={editSourceA}
+                                                                onChange={(e) => setEditSourceA(e.target.value)}
+                                                            />
+                                                        </div>
+                                                        <div className="space-y-2">
+                                                            <Label htmlFor="editStudentModel">Student Model</Label>
+                                                            <input
+                                                                id="editStudentModel"
+                                                                title="Student model"
+                                                                placeholder="Student model"
+                                                                className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
+                                                                value={editSourceB}
+                                                                onChange={(e) => setEditSourceB(e.target.value)}
+                                                            />
+                                                        </div>
+                                                    </>
+                                                ) : (
+                                                    <>
+                                                        <div className="space-y-2">
+                                                            <Label htmlFor="editSourceModel">Source Model</Label>
+                                                            <input
+                                                                id="editSourceModel"
+                                                                title="Source model"
+                                                                placeholder="Source model"
+                                                                className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
+                                                                value={editSourceA}
+                                                                onChange={(e) => setEditSourceA(e.target.value)}
+                                                            />
+                                                        </div>
+                                                        <div className="space-y-2">
+                                                            <Label htmlFor="editDatasetSize">Dataset Size</Label>
+                                                            <input
+                                                                id="editDatasetSize"
+                                                                title="Dataset size"
+                                                                placeholder="Dataset size"
+                                                                className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
+                                                                value={editDatasetSize}
+                                                                onChange={(e) => setEditDatasetSize(e.target.value)}
+                                                            />
+                                                        </div>
+                                                        <div className="space-y-2">
+                                                            <Label htmlFor="editReasoning">Reasoning Depth</Label>
+                                                            <input
+                                                                id="editReasoning"
+                                                                title="Reasoning depth"
+                                                                placeholder="Reasoning depth"
+                                                                className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
+                                                                value={editReasoningDepth}
+                                                                onChange={(e) => setEditReasoningDepth(e.target.value)}
+                                                            />
+                                                        </div>
+                                                        <div className="space-y-2">
+                                                            <Label htmlFor="editTopics">Topics (comma separated)</Label>
+                                                            <input
+                                                                id="editTopics"
+                                                                title="Topics"
+                                                                placeholder="Math, Science, Coding"
+                                                                className="flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
+                                                                value={editTopics}
+                                                                onChange={(e) => setEditTopics(e.target.value)}
+                                                            />
+                                                        </div>
+                                                    </>
+                                                )}
+
+                                                <div className="space-y-2">
+                                                    <Label htmlFor="editNotes">Additional Notes</Label>
+                                                    <Textarea
+                                                        id="editNotes"
+                                                        value={editNotes}
+                                                        onChange={(e) => setEditNotes(e.target.value)}
+                                                    />
+                                                </div>
+
+                                                <div className="flex gap-2">
+                                                    <Button onClick={saveRequestEdits} disabled={savingRequest}>
+                                                        {savingRequest ? "Saving…" : "Save"}
+                                                    </Button>
+                                                    <Button
+                                                        variant="outline"
+                                                        onClick={() => setEditingRequest(false)}
+                                                        disabled={savingRequest}
+                                                    >
+                                                        Cancel
+                                                    </Button>
+                                                </div>
+                                            </div>
+                                        )}
+                                    </CardContent>
+                                </Card>
+                            </div>
+
+                            <div className="lg:col-span-2">
+                                <Card>
+                                    <CardHeader>
+                                        <CardTitle>Discussion</CardTitle>
+                                        <CardDescription>
+                                            {thread?.comments?.length ? `${thread.comments.length} comment(s)` : "No comments yet"}
+                                        </CardDescription>
+                                    </CardHeader>
+                                    <CardContent>
+                                        {!thread?.comments?.length ? (
+                                            <div className="text-sm text-muted-foreground">Be the first to comment.</div>
+                                        ) : (
+                                            <div className="space-y-3">
+                                                {thread.comments.map((c) => (
+                                                    <div
+                                                        key={c.id}
+                                                        className="rounded-md border border-border bg-card p-4"
+                                                    >
+                                                        <div className="mb-2 flex flex-wrap items-center gap-2">
+                                                            <Badge variant={c.role === "admin" ? "default" : "secondary"}>
+                                                                {c.role === "admin" ? "TeichAI" : c.author || "Anonymous"}
+                                                            </Badge>
+                                                            {c.role === "admin" ? <Badge variant="outline">maintainer</Badge> : null}
+                                                            <span className="text-xs text-muted-foreground">
+                                                                {formatDate(c.createdAt)}
+                                                                {c.editedAt ? " · edited" : ""}
+                                                            </span>
+                                                            <div className="ml-auto flex items-center gap-2">
+                                                                {c.canEdit ? (
+                                                                    <Button
+                                                                        variant="link"
+                                                                        className="h-auto px-0 text-xs"
+                                                                        onClick={() => {
+                                                                            setEditingCommentId(c.id);
+                                                                            setEditingCommentBody(c.body);
+                                                                        }}
+                                                                    >
+                                                                        Edit
+                                                                    </Button>
+                                                                ) : null}
+                                                                {c.canDelete ? (
+                                                                    <Button
+                                                                        variant="link"
+                                                                        className="h-auto px-0 text-xs text-destructive"
+                                                                        onClick={() => deleteCommentById(c.id)}
+                                                                    >
+                                                                        Delete
+                                                                    </Button>
+                                                                ) : null}
+                                                            </div>
+                                                        </div>
+                                                        {editingCommentId === c.id ? (
+                                                            <div className="space-y-2">
+                                                                <Textarea
+                                                                    value={editingCommentBody}
+                                                                    onChange={(e) => setEditingCommentBody(e.target.value)}
+                                                                />
+                                                                <div className="flex gap-2">
+                                                                    <Button onClick={saveEditedComment} disabled={editingCommentSaving}>
+                                                                        {editingCommentSaving ? "Saving…" : "Save"}
+                                                                    </Button>
+                                                                    <Button
+                                                                        variant="outline"
+                                                                        onClick={() => {
+                                                                            setEditingCommentId(null);
+                                                                            setEditingCommentBody("");
+                                                                        }}
+                                                                        disabled={editingCommentSaving}
+                                                                    >
+                                                                        Cancel
+                                                                    </Button>
+                                                                </div>
+                                                            </div>
+                                                        ) : (
+                                                            <div className="whitespace-pre-wrap text-sm text-foreground">{c.body}</div>
+                                                        )}
+                                                    </div>
+                                                ))}
+                                            </div>
+                                        )}
+
+                                        <div className="mt-6 border-t border-border pt-4">
+                                            <div className="mb-2 flex items-center justify-between">
+                                                <div className="text-sm font-medium text-foreground">
+                                                    {admin ? "Reply as TeichAI" : "Add a comment"}
+                                                </div>
+                                                {admin ? <Badge variant="outline">admin</Badge> : null}
+                                            </div>
+
+                                            {!admin && (
+                                                <div className="mb-3">
+                                                    <Label htmlFor="author">Name (optional)</Label>
+                                                    <input
+                                                        id="author"
+                                                        className="mt-2 flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2"
+                                                        value={author}
+                                                        onChange={(e) => setAuthor(e.target.value)}
+                                                        placeholder="Anonymous"
+                                                    />
+                                                </div>
+                                            )}
+
+                                            <div>
+                                                <Label htmlFor="comment">Comment</Label>
+                                                <Textarea
+                                                    id="comment"
+                                                    value={commentBody}
+                                                    onChange={(e) => setCommentBody(e.target.value)}
+                                                    placeholder={admin ? "Write a reply…" : "Write your comment…"}
+                                                    className="mt-2"
+                                                />
+                                            </div>
+
+                                            <div className="mt-3 flex gap-2">
+                                                <Button onClick={submitComment} disabled={submitting}>
+                                                    {submitting ? "Posting…" : "Post"}
+                                                </Button>
+                                                <Button
+                                                    variant="outline"
+                                                    onClick={() => setCommentBody("")}
+                                                    disabled={submitting || !commentBody}
+                                                >
+                                                    Clear
+                                                </Button>
+                                            </div>
+                                        </div>
+                                    </CardContent>
+                                </Card>
+                            </div>
+                        </div>
+                    )}
+                </div>
+            </section>
+
+            <Footer />
+        </main>
+    );
+}

src/components/Footer.tsx

@@ -0,0 +1,45 @@
+import Link from "next/link";
+
+export default function Footer() {
+    return (
+        <footer className="mt-16 bg-background/95 py-10">
+            <div className="mx-auto max-w-6xl px-4 sm:px-6">
+                <div className="flex flex-col items-center justify-between gap-4 md:flex-row">
+                    <div className="flex items-center gap-6 text-sm">
+                        <Link href="/" className="font-semibold tracking-tight text-foreground">
+                            TeichAI
+                        </Link>
+                        <a
+                            href="https://huggingface.co/TeichAI"
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            className="text-muted-foreground transition-colors hover:text-foreground"
+                        >
+                            Hugging Face
+                        </a>
+                        <a
+                            href="https://www.teichai.com"
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            className="text-muted-foreground transition-colors hover:text-foreground"
+                        >
+                            Website
+                        </a>
+                        <a
+                            href="https://paypal.me/TeichAI"
+                            target="_blank"
+                            rel="noopener noreferrer"
+                            className="text-muted-foreground transition-colors hover:text-foreground"
+                        >
+                            Support Us
+                        </a>
+                    </div>
+
+                    <p className="text-sm text-muted-foreground">
+                        &copy; {new Date().getFullYear()} TeichAI
+                    </p>
+                </div>
+            </div>
+        </footer>
+    );
+}

src/components/Navbar.tsx

@@ -0,0 +1,129 @@
+"use client";
+
+import { useEffect, useRef, useState } from "react";
+import { Menu, Sun, Moon } from "lucide-react";
+import Link from "next/link";
+import Image from "next/image";
+import { useRouter } from "next/navigation";
+import { useTheme } from "./ThemeProvider";
+import { Button } from "@/components/ui/button";
+
+export default function Navbar() {
+    const [isOpen, setIsOpen] = useState(false);
+    const { theme, toggleTheme } = useTheme();
+    const router = useRouter();
+
+    const adminHoldTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
+    const adminGestureTriggeredRef = useRef(false);
+
+    const clearAdminHoldTimer = () => {
+        if (adminHoldTimerRef.current) {
+            clearTimeout(adminHoldTimerRef.current);
+            adminHoldTimerRef.current = null;
+        }
+    };
+
+    useEffect(() => {
+        const onWindowBlur = () => {
+            clearAdminHoldTimer();
+            adminGestureTriggeredRef.current = false;
+        };
+        window.addEventListener("blur", onWindowBlur);
+        return () => {
+            window.removeEventListener("blur", onWindowBlur);
+        };
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+
+    return (
+        <nav className="fixed inset-x-0 top-0 z-50 bg-background/90 backdrop-blur supports-[backdrop-filter]:bg-background/70 shadow-[0_1px_0_rgba(255,255,255,0.03)]">
+            <div className="mx-auto flex h-16 max-w-6xl items-center justify-between px-4 sm:px-6">
+                <Link
+                    href="/"
+                    className="flex items-center gap-2.5"
+                    onPointerDown={(e) => {
+                        if (!e.ctrlKey) return;
+                        adminGestureTriggeredRef.current = false;
+                        clearAdminHoldTimer();
+                        adminHoldTimerRef.current = setTimeout(() => {
+                            adminGestureTriggeredRef.current = true;
+                            router.push("/admin");
+                        }, 3000);
+                    }}
+                    onPointerUp={() => {
+                        clearAdminHoldTimer();
+                    }}
+                    onPointerLeave={() => {
+                        clearAdminHoldTimer();
+                    }}
+                    onPointerCancel={() => {
+                        clearAdminHoldTimer();
+                    }}
+                    onClick={(e) => {
+                        if (adminGestureTriggeredRef.current) {
+                            e.preventDefault();
+                            adminGestureTriggeredRef.current = false;
+                        }
+                    }}
+                >
+                    <Image
+                        src="/teich.svg"
+                        alt="TeichAI Logo"
+                        width={32}
+                        height={32}
+                        className="rounded-lg"
+                    />
+                    <span className="text-lg font-semibold tracking-tight text-foreground">TeichAI Requests</span>
+                </Link>
+
+                <div className="hidden items-center gap-1 md:flex">
+                    <Button
+                        onClick={toggleTheme}
+                        variant="ghost"
+                        size="icon"
+                        className="ml-1"
+                        aria-label="Toggle theme"
+                    >
+                        {theme === "dark" ? <Sun className="size-4" /> : <Moon className="size-4" />}
+                    </Button>
+
+                    <Button asChild className="ml-1">
+                        <a href="https://huggingface.co/TeichAI" target="_blank" rel="noopener noreferrer">
+                            HF Hub
+                        </a>
+                    </Button>
+                </div>
+
+                <div className="flex items-center gap-1 md:hidden">
+                    <Button
+                        onClick={toggleTheme}
+                        variant="ghost"
+                        size="icon"
+                        aria-label="Toggle theme"
+                    >
+                        {theme === "dark" ? <Sun className="size-5" /> : <Moon className="size-5" />}
+                    </Button>
+
+                    <Button
+                        variant="ghost"
+                        size="icon"
+                        aria-label="Open menu"
+                        onClick={() => setIsOpen(!isOpen)}
+                    >
+                        <Menu className="size-5" />
+                    </Button>
+                </div>
+            </div>
+
+            {isOpen && (
+                <div className="border-t border-border bg-background p-4 md:hidden">
+                    <Button asChild className="w-full">
+                        <a href="https://huggingface.co/TeichAI" target="_blank" rel="noopener noreferrer">
+                            HF Hub
+                        </a>
+                    </Button>
+                </div>
+            )}
+        </nav>
+    );
+}

src/components/Providers.tsx

@@ -0,0 +1,13 @@
+"use client";
+
+import { ThemeProvider } from "./ThemeProvider";
+import { Toaster } from "./ui/toaster";
+
+export function Providers({ children }: { children: React.ReactNode }) {
+    return (
+        <ThemeProvider>
+            {children}
+            <Toaster />
+        </ThemeProvider>
+    );
+}

src/components/ThemeProvider.tsx

@@ -0,0 +1,45 @@
+"use client";
+
+import { createContext, useContext, useEffect, useState } from "react";
+
+type Theme = "light" | "dark";
+
+interface ThemeContextType {
+    theme: Theme;
+    toggleTheme: () => void;
+}
+
+const ThemeContext = createContext<ThemeContextType | undefined>(undefined);
+
+export function ThemeProvider({ children }: { children: React.ReactNode }) {
+    const [theme, setTheme] = useState<Theme>("dark");
+
+    useEffect(() => {
+        const saved = localStorage.getItem("theme") as Theme | null;
+        if (saved) {
+            setTheme(saved);
+            document.documentElement.classList.toggle("dark", saved === "dark");
+        }
+    }, []);
+
+    const toggleTheme = () => {
+        const newTheme = theme === "dark" ? "light" : "dark";
+        setTheme(newTheme);
+        localStorage.setItem("theme", newTheme);
+        document.documentElement.classList.toggle("dark", newTheme === "dark");
+    };
+
+    return (
+        <ThemeContext.Provider value={{ theme, toggleTheme }}>
+            {children}
+        </ThemeContext.Provider>
+    );
+}
+
+export function useTheme() {
+    const context = useContext(ThemeContext);
+    if (!context) {
+        throw new Error("useTheme must be used within ThemeProvider");
+    }
+    return context;
+}

src/components/ui/badge.tsx

@@ -0,0 +1,32 @@
+import * as React from "react";
+import { cva, type VariantProps } from "class-variance-authority";
+import { cn } from "@/lib/utils";
+
+const badgeVariants = cva(
+    "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2",
+    {
+        variants: {
+            variant: {
+                default: "border-transparent bg-primary text-primary-foreground hover:bg-primary/80",
+                secondary: "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80",
+                destructive: "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80",
+                outline: "text-foreground",
+                success: "border-transparent bg-green-500/20 text-green-500",
+                warning: "border-transparent bg-yellow-500/20 text-yellow-500",
+            },
+        },
+        defaultVariants: {
+            variant: "default",
+        },
+    }
+);
+
+export interface BadgeProps
+    extends React.HTMLAttributes<HTMLDivElement>,
+    VariantProps<typeof badgeVariants> { }
+
+function Badge({ className, variant, ...props }: BadgeProps) {
+    return <div className={cn(badgeVariants({ variant }), className)} {...props} />;
+}
+
+export { Badge, badgeVariants };

src/components/ui/button.tsx

@@ -0,0 +1,48 @@
+import * as React from "react";
+import { Slot } from "@radix-ui/react-slot";
+import { cva, type VariantProps } from "class-variance-authority";
+import { cn } from "@/lib/utils";
+
+const buttonVariants = cva(
+    "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0",
+    {
+        variants: {
+            variant: {
+                default: "bg-primary text-primary-foreground hover:bg-primary/90",
+                destructive: "bg-destructive text-destructive-foreground hover:bg-destructive/90",
+                outline: "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
+                secondary: "bg-secondary text-secondary-foreground hover:bg-secondary/80",
+                ghost: "hover:bg-accent hover:text-accent-foreground",
+                link: "text-primary underline-offset-4 hover:underline",
+            },
+            size: {
+                default: "h-10 px-4 py-2",
+                sm: "h-9 rounded-md px-3",
+                lg: "h-11 rounded-md px-8",
+                icon: "h-10 w-10",
+            },
+        },
+        defaultVariants: {
+            variant: "default",
+            size: "default",
+        },
+    }
+);
+
+function Button({
+    className,
+    variant,
+    size,
+    asChild = false,
+    ...props
+}: React.ComponentProps<"button"> &
+    VariantProps<typeof buttonVariants> & {
+        asChild?: boolean;
+    }) {
+    const Comp = asChild ? Slot : "button";
+    return (
+        <Comp className={cn(buttonVariants({ variant, size }), className)} {...props} />
+    );
+}
+
+export { Button, buttonVariants };

src/components/ui/card.tsx

@@ -0,0 +1,55 @@
+import * as React from "react";
+import { cn } from "@/lib/utils";
+
+const Card = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+    ({ className, ...props }, ref) => (
+        <div
+            ref={ref}
+            className={cn("rounded-xl border border-border bg-card text-card-foreground shadow-sm", className)}
+            {...props}
+        />
+    )
+);
+Card.displayName = "Card";
+
+const CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+    ({ className, ...props }, ref) => (
+        <div ref={ref} className={cn("flex flex-col space-y-1.5 p-6", className)} {...props} />
+    )
+);
+CardHeader.displayName = "CardHeader";
+
+const CardTitle = React.forwardRef<React.ElementRef<"h3">, React.ComponentPropsWithoutRef<"h3">>(
+    ({ className, ...props }, ref) => (
+        <h3
+            ref={ref}
+            className={cn("font-semibold leading-none tracking-tight", className)}
+            {...props}
+        />
+    )
+);
+CardTitle.displayName = "CardTitle";
+
+const CardDescription = React.forwardRef<
+    HTMLParagraphElement,
+    React.HTMLAttributes<HTMLParagraphElement>
+>(({ className, ...props }, ref) => (
+    <p ref={ref} className={cn("text-sm text-muted-foreground", className)} {...props} />
+));
+CardDescription.displayName = "CardDescription";
+
+const CardContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+    ({ className, ...props }, ref) => (
+        <div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
+    )
+);
+CardContent.displayName = "CardContent";
+
+const CardFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(
+    ({ className, ...props }, ref) => (
+        <div ref={ref} className={cn("flex items-center p-6 pt-0", className)} {...props} />
+    )
+);
+CardFooter.displayName = "CardFooter";
+
+export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };

src/components/ui/combobox.tsx

@@ -0,0 +1,108 @@
+"use client";
+
+import * as React from "react";
+import { Check, ChevronsUpDown } from "lucide-react";
+import { cn } from "@/lib/utils";
+import { Button } from "@/components/ui/button";
+import {
+    Popover,
+    PopoverContent,
+    PopoverTrigger,
+} from "@/components/ui/popover";
+import { Input } from "@/components/ui/input";
+
+interface ComboboxProps {
+    options: { id: string; name: string }[];
+    value: string;
+    onValueChange: (value: string) => void;
+    placeholder?: string;
+    searchPlaceholder?: string;
+    emptyMessage?: string;
+    loading?: boolean;
+}
+
+export function Combobox({
+    options,
+    value,
+    onValueChange,
+    placeholder = "Select option...",
+    searchPlaceholder = "Search...",
+    emptyMessage = "No results found.",
+    loading = false,
+}: ComboboxProps) {
+    const [open, setOpen] = React.useState(false);
+    const [search, setSearch] = React.useState("");
+
+    const filteredOptions = React.useMemo(() => {
+        if (!search) return options;
+        const lower = search.toLowerCase();
+        return options.filter(
+            (option) =>
+                option.name.toLowerCase().includes(lower) ||
+                option.id.toLowerCase().includes(lower)
+        );
+    }, [options, search]);
+
+    const selectedOption = options.find((opt) => opt.id === value);
+
+    return (
+        <Popover open={open} onOpenChange={setOpen}>
+            <PopoverTrigger asChild>
+                <Button
+                    variant="outline"
+                    role="combobox"
+                    aria-expanded={open}
+                    className="w-full justify-between font-normal"
+                >
+                    <span className="truncate">
+                        {selectedOption ? selectedOption.name : placeholder}
+                    </span>
+                    <ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
+                </Button>
+            </PopoverTrigger>
+            <PopoverContent className="w-[var(--radix-popover-trigger-width)] p-0" align="start">
+                <div className="p-2">
+                    <Input
+                        placeholder={searchPlaceholder}
+                        value={search}
+                        onChange={(e) => setSearch(e.target.value)}
+                        className="h-9"
+                    />
+                </div>
+                <div className="max-h-[300px] overflow-y-auto">
+                    {loading ? (
+                        <div className="py-6 text-center text-sm text-muted-foreground">
+                            Loading...
+                        </div>
+                    ) : filteredOptions.length === 0 ? (
+                        <div className="py-6 text-center text-sm text-muted-foreground">
+                            {emptyMessage}
+                        </div>
+                    ) : (
+                        <div className="p-1">
+                            {filteredOptions.map((option) => (
+                                <button
+                                    key={option.id}
+                                    onClick={() => {
+                                        onValueChange(option.id === value ? "" : option.id);
+                                        setOpen(false);
+                                        setSearch("");
+                                    }}
+                                    className={cn(
+                                        "relative flex w-full cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none hover:bg-accent hover:text-accent-foreground",
+                                        value === option.id && "bg-accent"
+                                    )}
+                                >
+                                    <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+                                        {value === option.id && <Check className="h-4 w-4" />}
+                                    </span>
+                                    <span className="truncate">{option.name}</span>
+                                </button>
+                            ))}
+                        </div>
+                    )}
+                </div>
+            </PopoverContent>
+        </Popover>
+    );
+}

src/components/ui/input.tsx

@@ -0,0 +1,23 @@
+import * as React from "react";
+import { cn } from "@/lib/utils";
+
+export interface InputProps extends React.InputHTMLAttributes<HTMLInputElement> { }
+
+const Input = React.forwardRef<HTMLInputElement, InputProps>(
+    ({ className, type, ...props }, ref) => {
+        return (
+            <input
+                type={type}
+                className={cn(
+                    "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+                    className
+                )}
+                ref={ref}
+                {...props}
+            />
+        );
+    }
+);
+Input.displayName = "Input";
+
+export { Input };

src/components/ui/label.tsx

@@ -0,0 +1,21 @@
+"use client";
+
+import * as React from "react";
+import * as LabelPrimitive from "@radix-ui/react-label";
+import { cva, type VariantProps } from "class-variance-authority";
+import { cn } from "@/lib/utils";
+
+const labelVariants = cva(
+    "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
+);
+
+const Label = React.forwardRef<
+    React.ElementRef<typeof LabelPrimitive.Root>,
+    React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &
+    VariantProps<typeof labelVariants>
+>(({ className, ...props }, ref) => (
+    <LabelPrimitive.Root ref={ref} className={cn(labelVariants(), className)} {...props} />
+));
+Label.displayName = LabelPrimitive.Root.displayName;
+
+export { Label };

src/components/ui/popover.tsx

@@ -0,0 +1,29 @@
+"use client";
+
+import * as React from "react";
+import * as PopoverPrimitive from "@radix-ui/react-popover";
+import { cn } from "@/lib/utils";
+
+const Popover = PopoverPrimitive.Root;
+const PopoverTrigger = PopoverPrimitive.Trigger;
+
+const PopoverContent = React.forwardRef<
+    React.ElementRef<typeof PopoverPrimitive.Content>,
+    React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>
+>(({ className, align = "center", sideOffset = 4, ...props }, ref) => (
+    <PopoverPrimitive.Portal>
+        <PopoverPrimitive.Content
+            ref={ref}
+            align={align}
+            sideOffset={sideOffset}
+            className={cn(
+                "z-50 w-72 rounded-md border border-border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+                className
+            )}
+            {...props}
+        />
+    </PopoverPrimitive.Portal>
+));
+PopoverContent.displayName = PopoverPrimitive.Content.displayName;
+
+export { Popover, PopoverTrigger, PopoverContent };

src/components/ui/select.tsx

@@ -0,0 +1,149 @@
+"use client";
+
+import * as React from "react";
+import * as SelectPrimitive from "@radix-ui/react-select";
+import { Check, ChevronDown, ChevronUp } from "lucide-react";
+import { cn } from "@/lib/utils";
+
+const Select = SelectPrimitive.Root;
+const SelectGroup = SelectPrimitive.Group;
+const SelectValue = SelectPrimitive.Value;
+
+const SelectTrigger = React.forwardRef<
+    React.ElementRef<typeof SelectPrimitive.Trigger>,
+    React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>
+>(({ className, children, ...props }, ref) => (
+    <SelectPrimitive.Trigger
+        ref={ref}
+        className={cn(
+            "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
+            className
+        )}
+        {...props}
+    >
+        {children}
+        <SelectPrimitive.Icon asChild>
+            <ChevronDown className="h-4 w-4 opacity-50" />
+        </SelectPrimitive.Icon>
+    </SelectPrimitive.Trigger>
+));
+SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
+
+const SelectScrollUpButton = React.forwardRef<
+    React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
+    React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>
+>(({ className, ...props }, ref) => (
+    <SelectPrimitive.ScrollUpButton
+        ref={ref}
+        className={cn("flex cursor-default items-center justify-center py-1", className)}
+        {...props}
+    >
+        <ChevronUp className="h-4 w-4" />
+    </SelectPrimitive.ScrollUpButton>
+));
+SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
+
+const SelectScrollDownButton = React.forwardRef<
+    React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
+    React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>
+>(({ className, ...props }, ref) => (
+    <SelectPrimitive.ScrollDownButton
+        ref={ref}
+        className={cn("flex cursor-default items-center justify-center py-1", className)}
+        {...props}
+    >
+        <ChevronDown className="h-4 w-4" />
+    </SelectPrimitive.ScrollDownButton>
+));
+SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
+
+const SelectContent = React.forwardRef<
+    React.ElementRef<typeof SelectPrimitive.Content>,
+    React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>
+>(({ className, children, position = "popper", ...props }, ref) => (
+    <SelectPrimitive.Portal>
+        <SelectPrimitive.Content
+            ref={ref}
+            className={cn(
+                "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-card text-card-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
+                position === "popper" &&
+                "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
+                className
+            )}
+            position={position}
+            {...props}
+        >
+            <SelectScrollUpButton />
+            <SelectPrimitive.Viewport
+                className={cn(
+                    "p-1",
+                    position === "popper" &&
+                    "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+                )}
+            >
+                {children}
+            </SelectPrimitive.Viewport>
+            <SelectScrollDownButton />
+        </SelectPrimitive.Content>
+    </SelectPrimitive.Portal>
+));
+SelectContent.displayName = SelectPrimitive.Content.displayName;
+
+const SelectLabel = React.forwardRef<
+    React.ElementRef<typeof SelectPrimitive.Label>,
+    React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label>
+>(({ className, ...props }, ref) => (
+    <SelectPrimitive.Label
+        ref={ref}
+        className={cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className)}
+        {...props}
+    />
+));
+SelectLabel.displayName = SelectPrimitive.Label.displayName;
+
+const SelectItem = React.forwardRef<
+    React.ElementRef<typeof SelectPrimitive.Item>,
+    React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>
+>(({ className, children, ...props }, ref) => (
+    <SelectPrimitive.Item
+        ref={ref}
+        className={cn(
+            "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+            className
+        )}
+        {...props}
+    >
+        <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
+            <SelectPrimitive.ItemIndicator>
+                <Check className="h-4 w-4" />
+            </SelectPrimitive.ItemIndicator>
+        </span>
+        <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
+    </SelectPrimitive.Item>
+));
+SelectItem.displayName = SelectPrimitive.Item.displayName;
+
+const SelectSeparator = React.forwardRef<
+    React.ElementRef<typeof SelectPrimitive.Separator>,
+    React.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator>
+>(({ className, ...props }, ref) => (
+    <SelectPrimitive.Separator
+        ref={ref}
+        className={cn("-mx-1 my-1 h-px bg-muted", className)}
+        {...props}
+    />
+));
+SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
+
+export {
+    Select,
+    SelectContent,
+    SelectGroup,
+    SelectItem,
+    SelectLabel,
+    SelectScrollDownButton,
+    SelectScrollUpButton,
+    SelectSeparator,
+    SelectTrigger,
+    SelectValue,
+};

src/components/ui/tabs.tsx

@@ -0,0 +1,54 @@
+"use client";
+
+import * as React from "react";
+import * as TabsPrimitive from "@radix-ui/react-tabs";
+import { cn } from "@/lib/utils";
+
+const Tabs = TabsPrimitive.Root;
+
+const TabsList = React.forwardRef<
+    React.ElementRef<typeof TabsPrimitive.List>,
+    React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>
+>(({ className, ...props }, ref) => (
+    <TabsPrimitive.List
+        ref={ref}
+        className={cn(
+            "inline-flex h-10 items-center justify-center rounded-md bg-muted p-1 text-muted-foreground",
+            className
+        )}
+        {...props}
+    />
+));
+TabsList.displayName = TabsPrimitive.List.displayName;
+
+const TabsTrigger = React.forwardRef<
+    React.ElementRef<typeof TabsPrimitive.Trigger>,
+    React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>
+>(({ className, ...props }, ref) => (
+    <TabsPrimitive.Trigger
+        ref={ref}
+        className={cn(
+            "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
+            className
+        )}
+        {...props}
+    />
+));
+TabsTrigger.displayName = TabsPrimitive.Trigger.displayName;
+
+const TabsContent = React.forwardRef<
+    React.ElementRef<typeof TabsPrimitive.Content>,
+    React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>
+>(({ className, ...props }, ref) => (
+    <TabsPrimitive.Content
+        ref={ref}
+        className={cn(
+            "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",
+            className
+        )}
+        {...props}
+    />
+));
+TabsContent.displayName = TabsPrimitive.Content.displayName;
+
+export { Tabs, TabsContent, TabsList, TabsTrigger };

src/components/ui/textarea.tsx

@@ -0,0 +1,22 @@
+import * as React from "react";
+import { cn } from "@/lib/utils";
+
+export interface TextareaProps extends React.TextareaHTMLAttributes<HTMLTextAreaElement> { }
+
+const Textarea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
+    ({ className, ...props }, ref) => {
+        return (
+            <textarea
+                className={cn(
+                    "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
+                    className
+                )}
+                ref={ref}
+                {...props}
+            />
+        );
+    }
+);
+Textarea.displayName = "Textarea";
+
+export { Textarea };

src/components/ui/toaster.tsx

@@ -0,0 +1,185 @@
+"use client";
+
+import * as React from "react";
+import * as ToastPrimitives from "@radix-ui/react-toast";
+import { cva, type VariantProps } from "class-variance-authority";
+import { X } from "lucide-react";
+import { cn } from "@/lib/utils";
+
+const ToastProvider = ToastPrimitives.Provider;
+
+const ToastViewport = React.forwardRef<
+    React.ElementRef<typeof ToastPrimitives.Viewport>,
+    React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>
+>(({ className, ...props }, ref) => (
+    <ToastPrimitives.Viewport
+        ref={ref}
+        className={cn(
+            "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
+            className
+        )}
+        {...props}
+    />
+));
+ToastViewport.displayName = ToastPrimitives.Viewport.displayName;
+
+const toastVariants = cva(
+    "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
+    {
+        variants: {
+            variant: {
+                default: "border bg-background text-foreground",
+                destructive: "destructive group border-destructive bg-destructive text-destructive-foreground",
+            },
+        },
+        defaultVariants: {
+            variant: "default",
+        },
+    }
+);
+
+const Toast = React.forwardRef<
+    React.ElementRef<typeof ToastPrimitives.Root>,
+    React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> & VariantProps<typeof toastVariants>
+>(({ className, variant, ...props }, ref) => {
+    return (
+        <ToastPrimitives.Root
+            ref={ref}
+            className={cn(toastVariants({ variant }), className)}
+            {...props}
+        />
+    );
+});
+Toast.displayName = ToastPrimitives.Root.displayName;
+
+const ToastAction = React.forwardRef<
+    React.ElementRef<typeof ToastPrimitives.Action>,
+    React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>
+>(({ className, ...props }, ref) => (
+    <ToastPrimitives.Action
+        ref={ref}
+        className={cn(
+            "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
+            className
+        )}
+        {...props}
+    />
+));
+ToastAction.displayName = ToastPrimitives.Action.displayName;
+
+const ToastClose = React.forwardRef<
+    React.ElementRef<typeof ToastPrimitives.Close>,
+    React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>
+>(({ className, ...props }, ref) => (
+    <ToastPrimitives.Close
+        ref={ref}
+        className={cn(
+            "absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600",
+            className
+        )}
+        toast-close=""
+        {...props}
+    >
+        <X className="h-4 w-4" />
+    </ToastPrimitives.Close>
+));
+ToastClose.displayName = ToastPrimitives.Close.displayName;
+
+const ToastTitle = React.forwardRef<
+    React.ElementRef<typeof ToastPrimitives.Title>,
+    React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title>
+>(({ className, ...props }, ref) => (
+    <ToastPrimitives.Title ref={ref} className={cn("text-sm font-semibold", className)} {...props} />
+));
+ToastTitle.displayName = ToastPrimitives.Title.displayName;
+
+const ToastDescription = React.forwardRef<
+    React.ElementRef<typeof ToastPrimitives.Description>,
+    React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description>
+>(({ className, ...props }, ref) => (
+    <ToastPrimitives.Description ref={ref} className={cn("text-sm opacity-90", className)} {...props} />
+));
+ToastDescription.displayName = ToastPrimitives.Description.displayName;
+
+type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;
+type ToastActionElement = React.ReactElement<typeof ToastAction>;
+
+interface ToastState {
+    toasts: Array<{
+        id: string;
+        title?: string;
+        description?: string;
+        action?: ToastActionElement;
+        variant?: "default" | "destructive";
+    }>;
+}
+
+const toastState: ToastState = { toasts: [] };
+const listeners: Array<() => void> = [];
+
+function dispatch() {
+    listeners.forEach((listener) => listener());
+}
+
+export function toast({
+    title,
+    description,
+    variant = "default",
+}: {
+    title?: string;
+    description?: string;
+    variant?: "default" | "destructive";
+}) {
+    const id = Math.random().toString(36).substring(2, 9);
+    toastState.toasts.push({ id, title, description, variant });
+    dispatch();
+    setTimeout(() => {
+        toastState.toasts = toastState.toasts.filter((t) => t.id !== id);
+        dispatch();
+    }, 5000);
+}
+
+function useToastState() {
+    const [state, setState] = React.useState(toastState);
+    React.useEffect(() => {
+        const listener = () => setState({ ...toastState });
+        listeners.push(listener);
+        return () => {
+            const index = listeners.indexOf(listener);
+            if (index > -1) listeners.splice(index, 1);
+        };
+    }, []);
+    return state;
+}
+
+function Toaster() {
+    const state = useToastState();
+
+    return (
+        <ToastProvider>
+            {state.toasts.map((t) => (
+                <Toast key={t.id} variant={t.variant}>
+                    <div className="grid gap-1">
+                        {t.title && <ToastTitle>{t.title}</ToastTitle>}
+                        {t.description && <ToastDescription>{t.description}</ToastDescription>}
+                    </div>
+                    <ToastClose />
+                </Toast>
+            ))}
+            <ToastViewport />
+        </ToastProvider>
+    );
+}
+
+export {
+    type ToastProps,
+    type ToastActionElement,
+    ToastProvider,
+    ToastViewport,
+    Toast,
+    ToastTitle,
+    ToastDescription,
+    ToastClose,
+    ToastAction,
+    Toaster,
+};

src/lib/adminAuth.ts

@@ -0,0 +1,67 @@
+import crypto from "crypto";
+import type { NextRequest } from "next/server";
+
+export const ADMIN_COOKIE_NAME = "teich_admin";
+
+const SESSION_MAX_AGE_SECONDS = 60 * 60 * 24 * 7;
+
+function getAdminPassword() {
+    return process.env.ADMIN_PASSWORD || "";
+}
+
+function sign(payload: string, secret: string) {
+    return crypto.createHmac("sha256", secret).update(payload).digest("hex");
+}
+
+export function createAdminSessionValue(): string {
+    const secret = getAdminPassword();
+    const ts = Date.now();
+    const nonce = crypto.randomBytes(16).toString("hex");
+    const payload = `${ts}:${nonce}`;
+    const sig = sign(payload, secret);
+    return `${payload}.${sig}`;
+}
+
+export function isAdminSessionValue(value: string | undefined | null): boolean {
+    if (!value) return false;
+    const secret = getAdminPassword();
+    if (!secret) return false;
+
+    const lastDot = value.lastIndexOf(".");
+    if (lastDot === -1) return false;
+
+    const payload = value.slice(0, lastDot);
+    const sig = value.slice(lastDot + 1);
+
+    const expected = sign(payload, secret);
+    try {
+        if (!crypto.timingSafeEqual(Buffer.from(sig), Buffer.from(expected))) return false;
+    } catch {
+        return false;
+    }
+
+    const [tsStr] = payload.split(":");
+    const ts = Number(tsStr);
+    if (!Number.isFinite(ts)) return false;
+
+    const ageSeconds = (Date.now() - ts) / 1000;
+    if (ageSeconds < 0 || ageSeconds > SESSION_MAX_AGE_SECONDS) return false;
+
+    return true;
+}
+
+export function isAdminRequest(request: NextRequest): boolean {
+    const value = request.cookies.get(ADMIN_COOKIE_NAME)?.value;
+    return isAdminSessionValue(value);
+}
+
+export function adminCookieOptions() {
+    return {
+        name: ADMIN_COOKIE_NAME,
+        httpOnly: true,
+        sameSite: "lax" as const,
+        secure: process.env.NODE_ENV === "production",
+        path: "/",
+        maxAge: SESSION_MAX_AGE_SECONDS,
+    };
+}

src/lib/store.ts

@@ -0,0 +1,409 @@
+import { v4 as uuidv4 } from "uuid";
+import fs from "fs";
+import path from "path";
+
+export interface DistillationRequest {
+    id: string;
+    sourceDataset: string;
+    studentModel: string;
+    additionalNotes: string;
+    upvotes: number;
+    votedIps: string[];
+    ownerId: string;
+    createdAt: string;
+    status: "pending" | "in_progress" | "completed";
+}
+
+export interface DatasetRequest {
+    id: string;
+    sourceModel: string;
+    datasetSize: string;
+    reasoningDepth: string;
+    topics: string[];
+    additionalNotes: string;
+    upvotes: number;
+    votedIps: string[];
+    ownerId: string;
+    createdAt: string;
+    status: "pending" | "in_progress" | "completed";
+}
+
+export type RequestType = "distillation" | "dataset";
+
+export interface DiscussionComment {
+    id: string;
+    body: string;
+    author: string;
+    role: "admin" | "user";
+    ownerId: string;
+    createdAt: string;
+    editedAt?: string;
+}
+
+export interface DiscussionThread {
+    key: string;
+    requestType: RequestType;
+    requestId: string;
+    comments: DiscussionComment[];
+}
+
+interface Store {
+    distillationRequests: DistillationRequest[];
+    datasetRequests: DatasetRequest[];
+    threads: Record<string, DiscussionThread>;
+}
+
+const DATA_DIR = process.env.NODE_ENV === "production" ? "/data" : "./data";
+const DATA_FILE = path.join(DATA_DIR, "requests.json");
+
+function ensureDataDir() {
+    if (!fs.existsSync(DATA_DIR)) {
+        fs.mkdirSync(DATA_DIR, { recursive: true });
+    }
+}
+
+function loadStore(): Store {
+    ensureDataDir();
+    try {
+        if (fs.existsSync(DATA_FILE)) {
+            const data = fs.readFileSync(DATA_FILE, "utf-8");
+            const parsed = JSON.parse(data) as Partial<Store>;
+            const parsedThreads = (parsed as any).threads;
+            const threads: Record<string, DiscussionThread> =
+                parsedThreads && typeof parsedThreads === "object" && !Array.isArray(parsedThreads)
+                    ? Object.fromEntries(
+                        Object.entries(parsedThreads as Record<string, any>).map(([key, t]) => {
+                            const requestType: RequestType = t?.requestType === "dataset" ? "dataset" : "distillation";
+                            const thread: DiscussionThread = {
+                                key: String(t?.key ?? key),
+                                requestType,
+                                requestId: String(t?.requestId ?? ""),
+                                comments: Array.isArray(t?.comments)
+                                    ? t.comments.map((c: any) => ({
+                                        id: String(c?.id ?? uuidv4()),
+                                        body: String(c?.body ?? ""),
+                                        author: String(c?.author ?? (c?.role === "user" ? "Anonymous" : "TeichAI")),
+                                        role: c?.role === "user" ? "user" : "admin",
+                                        ownerId: String(c?.ownerId ?? ""),
+                                        createdAt: String(c?.createdAt ?? new Date().toISOString()),
+                                        editedAt: c?.editedAt ? String(c.editedAt) : undefined,
+                                    }))
+                                    : [],
+                            };
+                            return [key, thread] as const;
+                        })
+                    )
+                    : {};
+            const store: Store = {
+                distillationRequests: Array.isArray(parsed.distillationRequests)
+                    ? (parsed.distillationRequests as any[]).map((r) => ({
+                        id: String(r.id ?? uuidv4()),
+                        sourceDataset: String(r.sourceDataset ?? r.teacherModel ?? ""),
+                        studentModel: String(r.studentModel ?? ""),
+                        additionalNotes: String(r.additionalNotes ?? ""),
+                        upvotes: typeof r.upvotes === "number" ? r.upvotes : 0,
+                        votedIps: Array.isArray(r.votedIps) ? r.votedIps.map(String) : [],
+                        ownerId: String(r.ownerId ?? ""),
+                        createdAt: String(r.createdAt ?? new Date().toISOString()),
+                        status: (r.status === "in_progress" || r.status === "completed") ? r.status : "pending",
+                    }))
+                    : [],
+                datasetRequests: Array.isArray(parsed.datasetRequests)
+                    ? (parsed.datasetRequests as any[]).map((r) => ({
+                        id: String(r.id ?? uuidv4()),
+                        sourceModel: String(r.sourceModel ?? ""),
+                        datasetSize: String(r.datasetSize ?? "250x"),
+                        reasoningDepth: String(r.reasoningDepth ?? "high"),
+                        topics: Array.isArray(r.topics) ? r.topics.map(String) : [],
+                        additionalNotes: String(r.additionalNotes ?? ""),
+                        upvotes: typeof r.upvotes === "number" ? r.upvotes : 0,
+                        votedIps: Array.isArray(r.votedIps) ? r.votedIps.map(String) : [],
+                        ownerId: String(r.ownerId ?? ""),
+                        createdAt: String(r.createdAt ?? new Date().toISOString()),
+                        status: (r.status === "in_progress" || r.status === "completed") ? r.status : "pending",
+                    }))
+                    : [],
+                threads,
+            };
+            return store;
+        }
+    } catch (error) {
+        console.error("Error loading store:", error);
+    }
+    return { distillationRequests: [], datasetRequests: [], threads: {} };
+}
+
+function saveStore(store: Store) {
+    ensureDataDir();
+    fs.writeFileSync(DATA_FILE, JSON.stringify(store, null, 2));
+}
+
+export function getDistillationRequests(): DistillationRequest[] {
+    const store = loadStore();
+    return store.distillationRequests.sort((a, b) => b.upvotes - a.upvotes);
+}
+
+export function getDatasetRequests(): DatasetRequest[] {
+    const store = loadStore();
+    return store.datasetRequests.sort((a, b) => b.upvotes - a.upvotes);
+}
+
+export function getRequest(type: RequestType, id: string): DistillationRequest | DatasetRequest | null {
+    const store = loadStore();
+    if (type === "distillation") {
+        return store.distillationRequests.find((r) => r.id === id) ?? null;
+    }
+    return store.datasetRequests.find((r) => r.id === id) ?? null;
+}
+
+export function updateDistillationRequest(
+    id: string,
+    updates: Partial<Pick<DistillationRequest, "sourceDataset" | "studentModel" | "additionalNotes">>
+): DistillationRequest | null {
+    const store = loadStore();
+    const request = store.distillationRequests.find((r) => r.id === id);
+    if (!request) return null;
+    if (typeof updates.sourceDataset === "string") request.sourceDataset = updates.sourceDataset;
+    if (typeof updates.studentModel === "string") request.studentModel = updates.studentModel;
+    if (typeof updates.additionalNotes === "string") request.additionalNotes = updates.additionalNotes;
+    saveStore(store);
+    return request;
+}
+
+export function updateDatasetRequest(
+    id: string,
+    updates: Partial<Pick<DatasetRequest, "sourceModel" | "datasetSize" | "reasoningDepth" | "topics" | "additionalNotes">>
+): DatasetRequest | null {
+    const store = loadStore();
+    const request = store.datasetRequests.find((r) => r.id === id);
+    if (!request) return null;
+    if (typeof updates.sourceModel === "string") request.sourceModel = updates.sourceModel;
+    if (typeof updates.datasetSize === "string") request.datasetSize = updates.datasetSize;
+    if (typeof updates.reasoningDepth === "string") request.reasoningDepth = updates.reasoningDepth;
+    if (Array.isArray(updates.topics)) request.topics = updates.topics.map(String);
+    if (typeof updates.additionalNotes === "string") request.additionalNotes = updates.additionalNotes;
+    saveStore(store);
+    return request;
+}
+
+export function updateRequestStatus(
+    type: RequestType,
+    id: string,
+    status: "pending" | "in_progress" | "completed"
+): boolean {
+    const store = loadStore();
+    if (type === "distillation") {
+        const request = store.distillationRequests.find((r) => r.id === id);
+        if (!request) return false;
+        request.status = status;
+        saveStore(store);
+        return true;
+    }
+
+    const request = store.datasetRequests.find((r) => r.id === id);
+    if (!request) return false;
+    request.status = status;
+    saveStore(store);
+    return true;
+}
+
+export function deleteRequest(type: RequestType, id: string): boolean {
+    const store = loadStore();
+    if (type === "distillation") {
+        const before = store.distillationRequests.length;
+        store.distillationRequests = store.distillationRequests.filter((r) => r.id !== id);
+        if (store.distillationRequests.length === before) return false;
+    } else {
+        const before = store.datasetRequests.length;
+        store.datasetRequests = store.datasetRequests.filter((r) => r.id !== id);
+        if (store.datasetRequests.length === before) return false;
+    }
+
+    const key = `${type}:${id}`;
+    if (store.threads[key]) {
+        delete store.threads[key];
+    }
+    saveStore(store);
+    return true;
+}
+
+export function getThread(type: RequestType, id: string): DiscussionThread {
+    const store = loadStore();
+    const key = `${type}:${id}`;
+    const existing = store.threads[key];
+    if (existing && existing.requestType === type && existing.requestId === id) {
+        return existing;
+    }
+    const thread: DiscussionThread = {
+        key,
+        requestType: type,
+        requestId: id,
+        comments: [],
+    };
+    store.threads[key] = thread;
+    saveStore(store);
+    return thread;
+}
+
+export function addAdminComment(type: RequestType, id: string, body: string, ownerId: string): DiscussionComment {
+    const store = loadStore();
+    const key = `${type}:${id}`;
+    const thread = store.threads[key] ?? {
+        key,
+        requestType: type,
+        requestId: id,
+        comments: [],
+    };
+    const comment: DiscussionComment = {
+        id: uuidv4(),
+        body,
+        author: "TeichAI",
+        role: "admin",
+        ownerId,
+        createdAt: new Date().toISOString(),
+    };
+    thread.comments.push(comment);
+    store.threads[key] = thread;
+    saveStore(store);
+    return comment;
+}
+
+export function addUserComment(
+    type: RequestType,
+    id: string,
+    body: string,
+    author: string | undefined,
+    ownerId: string
+): DiscussionComment {
+    const store = loadStore();
+    const key = `${type}:${id}`;
+    const thread = store.threads[key] ?? {
+        key,
+        requestType: type,
+        requestId: id,
+        comments: [],
+    };
+    const comment: DiscussionComment = {
+        id: uuidv4(),
+        body,
+        author: author?.trim() ? author.trim() : "Anonymous",
+        role: "user",
+        ownerId,
+        createdAt: new Date().toISOString(),
+    };
+    thread.comments.push(comment);
+    store.threads[key] = thread;
+    saveStore(store);
+    return comment;
+}
+
+export function updateComment(
+    type: RequestType,
+    requestId: string,
+    commentId: string,
+    body: string
+): DiscussionComment | null {
+    const store = loadStore();
+    const key = `${type}:${requestId}`;
+    const thread = store.threads[key];
+    if (!thread) return null;
+    const comment = thread.comments.find((c) => c.id === commentId);
+    if (!comment) return null;
+    comment.body = body;
+    comment.editedAt = new Date().toISOString();
+    saveStore(store);
+    return comment;
+}
+
+export function deleteComment(
+    type: RequestType,
+    requestId: string,
+    commentId: string
+): boolean {
+    const store = loadStore();
+    const key = `${type}:${requestId}`;
+    const thread = store.threads[key];
+    if (!thread) return false;
+    const before = thread.comments.length;
+    thread.comments = thread.comments.filter((c) => c.id !== commentId);
+    if (thread.comments.length === before) return false;
+    store.threads[key] = thread;
+    saveStore(store);
+    return true;
+}
+
+export function addDistillationRequest(
+    request: Omit<DistillationRequest, "id" | "upvotes" | "votedIps" | "createdAt" | "status">
+): DistillationRequest {
+    const store = loadStore();
+    const newRequest: DistillationRequest = {
+        ...request,
+        id: uuidv4(),
+        upvotes: 0,
+        votedIps: [],
+        createdAt: new Date().toISOString(),
+        status: "pending",
+    };
+    store.distillationRequests.push(newRequest);
+    saveStore(store);
+    return newRequest;
+}
+
+export function addDatasetRequest(
+    request: Omit<DatasetRequest, "id" | "upvotes" | "votedIps" | "createdAt" | "status">
+): DatasetRequest {
+    const store = loadStore();
+    const newRequest: DatasetRequest = {
+        ...request,
+        id: uuidv4(),
+        upvotes: 0,
+        votedIps: [],
+        createdAt: new Date().toISOString(),
+        status: "pending",
+    };
+    store.datasetRequests.push(newRequest);
+    saveStore(store);
+    return newRequest;
+}
+
+export function upvoteDistillation(
+    id: string,
+    ip: string
+): { success: boolean; upvotes: number; action?: "upvoted" | "unvoted" } {
+    const store = loadStore();
+    const request = store.distillationRequests.find((r) => r.id === id);
+    if (!request) {
+        return { success: false, upvotes: 0 };
+    }
+    if (request.votedIps.includes(ip)) {
+        request.votedIps = request.votedIps.filter((v) => v !== ip);
+        request.upvotes = Math.max(0, request.upvotes - 1);
+        saveStore(store);
+        return { success: true, upvotes: request.upvotes, action: "unvoted" };
+    }
+    request.upvotes += 1;
+    request.votedIps.push(ip);
+    saveStore(store);
+    return { success: true, upvotes: request.upvotes, action: "upvoted" };
+}
+
+export function upvoteDataset(
+    id: string,
+    ip: string
+): { success: boolean; upvotes: number; action?: "upvoted" | "unvoted" } {
+    const store = loadStore();
+    const request = store.datasetRequests.find((r) => r.id === id);
+    if (!request) {
+        return { success: false, upvotes: 0 };
+    }
+    if (request.votedIps.includes(ip)) {
+        request.votedIps = request.votedIps.filter((v) => v !== ip);
+        request.upvotes = Math.max(0, request.upvotes - 1);
+        saveStore(store);
+        return { success: true, upvotes: request.upvotes, action: "unvoted" };
+    }
+    request.upvotes += 1;
+    request.votedIps.push(ip);
+    saveStore(store);
+    return { success: true, upvotes: request.upvotes, action: "upvoted" };
+}

src/lib/userIdentity.ts

@@ -0,0 +1,30 @@
+import crypto from "crypto";
+import type { NextRequest } from "next/server";
+
+export const USER_COOKIE_NAME = "teich_uid";
+
+const USER_COOKIE_MAX_AGE_SECONDS = 60 * 60 * 24 * 365;
+
+export function getOrCreateUserId(request: NextRequest): {
+    userId: string;
+    shouldSetCookie: boolean;
+} {
+    const existing = request.cookies.get(USER_COOKIE_NAME)?.value;
+    if (existing) {
+        return { userId: existing, shouldSetCookie: false };
+    }
+
+    const userId = crypto.randomUUID();
+    return { userId, shouldSetCookie: true };
+}
+
+export function userCookieOptions() {
+    return {
+        name: USER_COOKIE_NAME,
+        httpOnly: true,
+        sameSite: "lax" as const,
+        secure: process.env.NODE_ENV === "production",
+        path: "/",
+        maxAge: USER_COOKIE_MAX_AGE_SECONDS,
+    };
+}

src/lib/utils.ts

@@ -0,0 +1,6 @@
+import { type ClassValue, clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+
+export function cn(...inputs: ClassValue[]) {
+    return twMerge(clsx(inputs));
+}

tailwind.config.ts

@@ -0,0 +1,41 @@
+import type { Config } from "tailwindcss";
+
+export default {
+    darkMode: "class",
+    content: [
+        "./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
+        "./src/components/**/*.{js,ts,jsx,tsx,mdx}",
+        "./src/app/**/*.{js,ts,jsx,tsx,mdx}",
+    ],
+    theme: {
+        extend: {
+            colors: {
+                background: "var(--background)",
+                foreground: "var(--foreground)",
+                card: "var(--card)",
+                "card-foreground": "var(--card-foreground)",
+                popover: "var(--card)",
+                "popover-foreground": "var(--card-foreground)",
+                primary: "var(--accent)",
+                "primary-foreground": "#ffffff",
+                secondary: "var(--muted)",
+                "secondary-foreground": "var(--foreground)",
+                muted: "var(--muted)",
+                "muted-foreground": "var(--muted-foreground)",
+                accent: "var(--accent-light)",
+                "accent-foreground": "var(--accent)",
+                destructive: "#ef4444",
+                "destructive-foreground": "#ffffff",
+                border: "var(--border)",
+                input: "var(--border)",
+                ring: "var(--accent)",
+            },
+            borderRadius: {
+                lg: "0.75rem",
+                md: "0.5rem",
+                sm: "0.25rem",
+            },
+        },
+    },
+    plugins: [],
+} satisfies Config;

tsconfig.json

@@ -0,0 +1,41 @@
+{
+  "compilerOptions": {
+    "lib": [
+      "dom",
+      "dom.iterable",
+      "esnext"
+    ],
+    "allowJs": true,
+    "skipLibCheck": true,
+    "strict": true,
+    "noEmit": true,
+    "esModuleInterop": true,
+    "module": "esnext",
+    "moduleResolution": "bundler",
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "jsx": "react-jsx",
+    "incremental": true,
+    "plugins": [
+      {
+        "name": "next"
+      }
+    ],
+    "paths": {
+      "@/*": [
+        "./src/*"
+      ]
+    },
+    "target": "ES2017"
+  },
+  "include": [
+    "next-env.d.ts",
+    "**/*.ts",
+    "**/*.tsx",
+    ".next/types/**/*.ts",
+    ".next/dev/types/**/*.ts"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+}