From bbaf4aa35a828bebdf35d469ae2b4ae5e4b05454 Mon Sep 17 00:00:00 2001
From: NotCayaa <yannz.2005@gmail.com>
Date: Sun, 22 Feb 2026 21:19:17 +0700
Subject: [PATCH 01/11] nyambungin db + engine ke web app, buat testing output.
 sekalian gw benerin tombol cancel + routing hooks tengs

---
 .../(auth)/login/components/login-form.tsx    |  53 +++-
 .../register/components/signup-form.tsx       |  60 +++-
 .../project/components/NewProjectLayout.tsx   |   8 +-
 .../project/components/StepContent.tsx        |  14 +-
 .../project/components/steps/ReviewStep.tsx   | 263 +++++++++++++++++-
 .../steps/webApp/DetailsScopeStep.tsx         |  37 ++-
 .../steps/webApp/ProjectInfoStep.tsx          |   4 +-
 apps/web-app/features/project/types.ts        |   6 +
 .../steps/webApp => }/hooks/index.ts          |   0
 .../webApp => }/hooks/useGenerateProject.ts   |   4 +-
 .../steps/webApp => }/hooks/useWebAppForm.ts  |   2 +-
 11 files changed, 417 insertions(+), 34 deletions(-)
 rename apps/web-app/{features/project/components/steps/webApp => }/hooks/index.ts (100%)
 rename apps/web-app/{features/project/components/steps/webApp => }/hooks/useGenerateProject.ts (95%)
 rename apps/web-app/{features/project/components/steps/webApp => }/hooks/useWebAppForm.ts (96%)

diff --git a/apps/web-app/app/(auth)/login/components/login-form.tsx b/apps/web-app/app/(auth)/login/components/login-form.tsx
index 4940752..9114477 100644
--- a/apps/web-app/app/(auth)/login/components/login-form.tsx
+++ b/apps/web-app/app/(auth)/login/components/login-form.tsx
@@ -12,20 +12,52 @@ import {
 import { Input } from "@workspace/ui/components/input";
 import Link from "next/link";
 import { useRouter } from "next/navigation";
+import { useState } from "react";
+
+const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL || "http://localhost:4000/api"
 
 export function LoginForm({
   className,
   ...props
 }: React.ComponentProps<"form">) {
-    const router = useRouter()
+  const router = useRouter()
+  const [error, setError] = useState<string | null>(null)
+  const [isLoading, setIsLoading] = useState(false)
+
+  const onSubmit = async (e: React.FormEvent) => {
+    e.preventDefault()
+    setError(null)
+    setIsLoading(true)
+
+    const form = e.target as HTMLFormElement
+    const email = (form.elements.namedItem("email") as HTMLInputElement).value
+    const password = (form.elements.namedItem("password") as HTMLInputElement).value
+
+    try {
+      const res = await fetch(`${API_BASE_URL}/auth/login`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ email, password }),
+      })
+
+      const data = await res.json()
 
-    const onSubmit = async (e: React.FormEvent) => {
-        e.preventDefault()
+      if (!res.ok) {
+        setError(data.message || "Login failed")
+        return
+      }
 
-        // logic be
+      // Store token and user data
+      localStorage.setItem("token", data.data.token)
+      localStorage.setItem("user", JSON.stringify(data.data.user))
 
-        router.push("/dashboard")
+      router.push("/dashboard")
+    } catch (err: any) {
+      setError(err.message || "Network error. Is the backend running?")
+    } finally {
+      setIsLoading(false)
     }
+  }
   return (
     <form onSubmit={onSubmit} className={cn("flex flex-col gap-6", className)} {...props}>
       <FieldGroup>
@@ -51,8 +83,17 @@ export function LoginForm({
           </div>
           <Input id="password" type="password" required />
         </Field>
+
+        {error && (
+          <div className="p-3 bg-red-50 border border-red-200 rounded-md">
+            <p className="text-sm text-red-600">{error}</p>
+          </div>
+        )}
+
         <Field>
-          <Button type="submit">Login</Button>
+          <Button type="submit" disabled={isLoading}>
+            {isLoading ? "Logging in..." : "Login"}
+          </Button>
         </Field>
         <FieldSeparator>Or continue with</FieldSeparator>
         <Field className="flex flex-col gap-3 mt-4">
diff --git a/apps/web-app/app/(auth)/register/components/signup-form.tsx b/apps/web-app/app/(auth)/register/components/signup-form.tsx
index 35d542e..30b1865 100644
--- a/apps/web-app/app/(auth)/register/components/signup-form.tsx
+++ b/apps/web-app/app/(auth)/register/components/signup-form.tsx
@@ -12,22 +12,59 @@ import {
 import { Input } from "@workspace/ui/components/input"
 import Link from "next/link"
 import { useRouter } from "next/navigation"
+import { useState } from "react"
+
+const API_BASE_URL = process.env.NEXT_PUBLIC_API_URL || "http://localhost:4000/api"
 
 export function SignupForm({
   className,
   ...props
 }: React.ComponentProps<"form">) {
 
-    const router = useRouter()
+  const router = useRouter()
+  const [error, setError] = useState<string | null>(null)
+  const [isLoading, setIsLoading] = useState(false)
 
-    const onSubmit = async (e: React.FormEvent) => {
-        e.preventDefault()
+  const onSubmit = async (e: React.FormEvent) => {
+    e.preventDefault()
+    setError(null)
 
-        // await fetch apahasdoa
+    const form = e.target as HTMLFormElement
+    const name = (form.elements.namedItem("name") as HTMLInputElement).value
+    const email = (form.elements.namedItem("email") as HTMLInputElement).value
+    const password = (form.elements.namedItem("password") as HTMLInputElement).value
+    const confirmPassword = (form.elements.namedItem("confirm-password") as HTMLInputElement).value
 
-        router.push("/otp")
+    if (password !== confirmPassword) {
+      setError("Passwords do not match")
+      return
     }
-    
+
+    setIsLoading(true)
+
+    try {
+      const res = await fetch(`${API_BASE_URL}/auth/register`, {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ email, password, name }),
+      })
+
+      const data = await res.json()
+
+      if (!res.ok) {
+        setError(data.message || "Registration failed")
+        return
+      }
+
+      // Registration successful — redirect to login
+      router.push("/login")
+    } catch (err: any) {
+      setError(err.message || "Network error. Is the backend running?")
+    } finally {
+      setIsLoading(false)
+    }
+  }
+
   return (
     <form onSubmit={onSubmit} className={cn("flex flex-col gap-6", className)} {...props}>
       <FieldGroup>
@@ -61,8 +98,17 @@ export function SignupForm({
           <Input id="confirm-password" type="password" required />
           <FieldDescription>Please confirm your password.</FieldDescription>
         </Field>
+
+        {error && (
+          <div className="p-3 bg-red-50 border border-red-200 rounded-md">
+            <p className="text-sm text-red-600">{error}</p>
+          </div>
+        )}
+
         <Field>
-          <Button type="submit">Create Account</Button>
+          <Button type="submit" disabled={isLoading}>
+            {isLoading ? "Creating Account..." : "Create Account"}
+          </Button>
         </Field>
         <FieldSeparator>Or continue with</FieldSeparator>
         <Field>
diff --git a/apps/web-app/features/project/components/NewProjectLayout.tsx b/apps/web-app/features/project/components/NewProjectLayout.tsx
index 7e0f0ee..c47021a 100644
--- a/apps/web-app/features/project/components/NewProjectLayout.tsx
+++ b/apps/web-app/features/project/components/NewProjectLayout.tsx
@@ -6,13 +6,15 @@ import type { WebAppFormData } from "../types"
 import { StepSidebar } from "./StepSidebar"
 import { StepContent } from "./StepContent"
 import { ReviewSidebar } from "./reviewSidebar"
-import { useWebAppForm } from "./steps/webApp/hooks"
+import { useWebAppForm } from "../../../hooks"
+import { useGenerateProject } from "../../../hooks"
 
 export function NewProjectLayout() {
   const [type, setType] = useState<ProjectType | null>(null)
   const [step, setStep] = useState(1)
 
   const { formData, updateField, resetForm, canProceedToDetails, canProceedToReview } = useWebAppForm()
+  const { isLoading: isGenerating, error: generateError, result: generateResult, generate, clearError } = useGenerateProject()
 
   const isReview = step === 4
 
@@ -33,6 +35,10 @@ export function NewProjectLayout() {
           updateField={updateField}
           canProceedToDetails={canProceedToDetails}
           canProceedToReview={canProceedToReview}
+          onGenerate={generate}
+          isGenerating={isGenerating}
+          generateError={generateError}
+          generateResult={generateResult}
         />
       </main>
 
diff --git a/apps/web-app/features/project/components/StepContent.tsx b/apps/web-app/features/project/components/StepContent.tsx
index 70fdb29..3486e6c 100644
--- a/apps/web-app/features/project/components/StepContent.tsx
+++ b/apps/web-app/features/project/components/StepContent.tsx
@@ -1,6 +1,6 @@
 import { stepRegistry } from "../step.registry"
 import { ProjectType } from "../types"
-import type { WebAppFormData } from "../types"
+import type { WebAppFormData, GenerateProjectResponse } from "../types"
 
 interface Props {
   type: ProjectType | null
@@ -11,6 +11,10 @@ interface Props {
   updateField: <K extends keyof WebAppFormData>(field: K, value: WebAppFormData[K]) => void
   canProceedToDetails: boolean
   canProceedToReview: boolean
+  onGenerate: (formData: WebAppFormData, includeDiagram?: boolean) => Promise<void>
+  isGenerating: boolean
+  generateError: string | null
+  generateResult: GenerateProjectResponse | null
 }
 
 export function StepContent({
@@ -22,6 +26,10 @@ export function StepContent({
   updateField,
   canProceedToDetails,
   canProceedToReview,
+  onGenerate,
+  isGenerating,
+  generateError,
+  generateResult,
 }: Props) {
   const StepComponent =
     type ? stepRegistry[type]?.[step] : stepRegistry.web_app[1]
@@ -37,6 +45,10 @@ export function StepContent({
         updateField={updateField}
         canProceedToDetails={canProceedToDetails}
         canProceedToReview={canProceedToReview}
+        onGenerate={onGenerate}
+        isGenerating={isGenerating}
+        generateError={generateError}
+        generateResult={generateResult}
       />
     </div>
   )
diff --git a/apps/web-app/features/project/components/steps/ReviewStep.tsx b/apps/web-app/features/project/components/steps/ReviewStep.tsx
index c2374cc..d2ead81 100644
--- a/apps/web-app/features/project/components/steps/ReviewStep.tsx
+++ b/apps/web-app/features/project/components/steps/ReviewStep.tsx
@@ -1,15 +1,262 @@
 "use client";
 
-export function ReviewStep() {
+import type { GenerateProjectResponse } from "../../types";
+import { Loader2 } from "lucide-react";
+
+interface Props {
+  isGenerating?: boolean;
+  generateError?: string | null;
+  generateResult?: GenerateProjectResponse | null;
+}
+
+export function ReviewStep({ isGenerating, generateError, generateResult }: Props) {
+
+  // Loading state
+  if (isGenerating) {
+    return (
+      <div className="flex flex-col gap-8 items-center justify-center min-h-screen py-12">
+        <div className="flex flex-col items-center gap-4">
+          <Loader2 className="w-10 h-10 animate-spin text-blue-500" />
+          <h2 className="text-lg font-semibold text-gray-600">Generating your project brief...</h2>
+          <p className="text-sm text-gray-400">This may take a moment depending on document style</p>
+        </div>
+      </div>
+    );
+  }
+
+  // Error state
+  if (generateError) {
+    return (
+      <div className="flex flex-col gap-8 items-center justify-center min-h-screen py-12">
+        <div className="flex flex-col items-center gap-4 max-w-md text-center">
+          <div className="w-12 h-12 rounded-full bg-red-100 flex items-center justify-center">
+            <span className="text-red-500 text-xl">✕</span>
+          </div>
+          <h2 className="text-lg font-semibold text-gray-700">Generation Failed</h2>
+          <p className="text-sm text-red-500">{generateError}</p>
+        </div>
+      </div>
+    );
+  }
+
+  // No result yet (shouldn't happen normally, but safety)
+  if (!generateResult) {
+    return (
+      <div className="flex flex-col gap-14 items-center justify-center min-h-screen py-12 overflow-auto mb-25">
+        <div className="w-[90%] max-w-198.5 aspect-794/1123 bg-white shadow-2xl border border-gray-200">
+          {" "}
+          {/* Kosong dulu */}
+        </div>
+        <div className="w-[90%] max-w-198.5 aspect-794/1123 bg-white shadow-2xl border border-gray-200">
+          {" "}
+          {/* Kosong dulu */}
+        </div>
+      </div>
+    );
+  }
+
+  // Render AI result
+  const brief = generateResult;
+
   return (
-    <div className="flex flex-col gap-14 items-center justify-center min-h-screen py-12 overflow-auto mb-25">
-      <div className="w-[90%] max-w-198.5 aspect-794/1123 bg-white shadow-2xl border border-gray-200">
-        {" "}
-        {/* Kosong dulu */}
+    <div className="flex flex-col gap-14 items-center justify-center py-12 overflow-auto mb-25">
+
+      {/* Page 1 — Title, Overview, Problem, Objectives */}
+      <div className="w-[90%] max-w-198.5 bg-white shadow-2xl border border-gray-200 p-12 space-y-8">
+
+        {/* Watermark */}
+        <p className="text-xs text-gray-300 text-right select-none">PREVIEW — Planify AI</p>
+
+        {/* Title */}
+        {brief.title && (
+          <div>
+            <h1 className="text-2xl font-bold text-gray-900">{brief.title}</h1>
+          </div>
+        )}
+
+        {/* Overview */}
+        {brief.overview && (
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Overview</h2>
+            <p className="text-sm text-gray-700 leading-relaxed">{brief.overview}</p>
+          </div>
+        )}
+
+        {/* Target Audience */}
+        {brief.targetAudience && (
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Target Audience</h2>
+            {typeof brief.targetAudience === "string" ? (
+              <p className="text-sm text-gray-700">{brief.targetAudience}</p>
+            ) : (
+              <div className="space-y-1">
+                {brief.targetAudience.primary && <p className="text-sm text-gray-700"><span className="font-medium">Primary:</span> {brief.targetAudience.primary}</p>}
+                {brief.targetAudience.secondary && <p className="text-sm text-gray-700"><span className="font-medium">Secondary:</span> {brief.targetAudience.secondary}</p>}
+                {brief.targetAudience.admin && <p className="text-sm text-gray-700"><span className="font-medium">Admin:</span> {brief.targetAudience.admin}</p>}
+              </div>
+            )}
+          </div>
+        )}
+
+        {/* Problem Statement */}
+        {brief.problemStatement && (
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Problem Statement</h2>
+            {brief.problemStatement.painPoints && (
+              <ul className="list-disc list-inside space-y-1 mb-3">
+                {brief.problemStatement.painPoints.map((p: string, i: number) => (
+                  <li key={i} className="text-sm text-gray-700">{p}</li>
+                ))}
+              </ul>
+            )}
+            {brief.problemStatement.businessImpact && (
+              <div>
+                <p className="text-xs font-medium text-gray-500 mb-1">Business Impact</p>
+                <p className="text-sm text-gray-700">{brief.problemStatement.businessImpact}</p>
+              </div>
+            )}
+          </div>
+        )}
+
+        {/* Objectives */}
+        {brief.objectives && Array.isArray(brief.objectives) && (
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Objectives</h2>
+            <ul className="list-decimal list-inside space-y-1">
+              {brief.objectives.map((obj: any, i: number) => (
+                <li key={i} className="text-sm text-gray-700">{typeof obj === "string" ? obj : obj.objective || JSON.stringify(obj)}</li>
+              ))}
+            </ul>
+          </div>
+        )}
+
+        {/* Success Criteria */}
+        {brief.successCriteria && Array.isArray(brief.successCriteria) && (
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Success Criteria</h2>
+            <div className="grid grid-cols-2 gap-2">
+              {brief.successCriteria.map((sc: any, i: number) => (
+                <div key={i} className="p-2 bg-gray-50 rounded border">
+                  <p className="text-xs font-medium text-gray-500">{sc.metric}</p>
+                  <p className="text-sm text-gray-700">{sc.target}</p>
+                </div>
+              ))}
+            </div>
+          </div>
+        )}
       </div>
-      <div className="w-[90%] max-w-198.5 aspect-794/1123 bg-white shadow-2xl border border-gray-200">
-        {" "}
-        {/* Kosong dulu */}
+
+      {/* Page 2 — Features, Tech Stack, Scope, Risks */}
+      <div className="w-[90%] max-w-198.5 bg-white shadow-2xl border border-gray-200 p-12 space-y-8">
+
+        <p className="text-xs text-gray-300 text-right select-none">PREVIEW — Planify AI</p>
+
+        {/* Key Features */}
+        {brief.keyFeatures && Array.isArray(brief.keyFeatures) && (
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-3">Key Features</h2>
+            <div className="space-y-3">
+              {brief.keyFeatures.map((f: any, i: number) => (
+                <div key={i} className="p-3 bg-gray-50 rounded border">
+                  <div className="flex items-center justify-between mb-1">
+                    <h3 className="text-sm font-semibold text-gray-800">{f.name}</h3>
+                    {f.priority && (
+                      <span className={`text-xs px-2 py-0.5 rounded-full ${f.priority === "Must" ? "bg-red-100 text-red-600" : f.priority === "Should" ? "bg-yellow-100 text-yellow-600" : "bg-gray-100 text-gray-600"}`}>
+                        {f.priority}
+                      </span>
+                    )}
+                  </div>
+                  <p className="text-sm text-gray-600">{f.description}</p>
+                  {f.userStory && <p className="text-xs text-gray-400 mt-1 italic">{f.userStory}</p>}
+                </div>
+              ))}
+            </div>
+          </div>
+        )}
+
+        {/* Tech Stack */}
+        {brief.recommendedTechStack && Array.isArray(brief.recommendedTechStack) && (
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-3">Recommended Tech Stack</h2>
+            <div className="space-y-2">
+              {brief.recommendedTechStack.map((t: any, i: number) => (
+                <div key={i} className="flex items-start gap-3 p-2 bg-gray-50 rounded border">
+                  <span className="text-xs font-medium text-blue-500 bg-blue-50 px-2 py-0.5 rounded min-w-[70px] text-center">{t.category}</span>
+                  <div>
+                    <p className="text-sm font-medium text-gray-800">{t.technology}</p>
+                    <p className="text-xs text-gray-500">{t.reason}</p>
+                  </div>
+                </div>
+              ))}
+            </div>
+          </div>
+        )}
+
+        {/* Scope */}
+        {brief.scope && (
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Scope</h2>
+            <div className="grid grid-cols-2 gap-4">
+              {brief.scope.inScope && (
+                <div>
+                  <p className="text-xs font-medium text-green-600 mb-1">In Scope</p>
+                  <ul className="list-disc list-inside space-y-1">
+                    {brief.scope.inScope.map((s: string, i: number) => (
+                      <li key={i} className="text-sm text-gray-700">{s}</li>
+                    ))}
+                  </ul>
+                </div>
+              )}
+              {brief.scope.outOfScope && (
+                <div>
+                  <p className="text-xs font-medium text-red-600 mb-1">Out of Scope</p>
+                  <ul className="list-disc list-inside space-y-1">
+                    {brief.scope.outOfScope.map((s: string, i: number) => (
+                      <li key={i} className="text-sm text-gray-700">{s}</li>
+                    ))}
+                  </ul>
+                </div>
+              )}
+            </div>
+          </div>
+        )}
+
+        {/* Risks */}
+        {brief.risks && Array.isArray(brief.risks) && (
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Risks</h2>
+            <div className="space-y-2">
+              {brief.risks.map((r: any, i: number) => (
+                <div key={i} className="p-2 bg-gray-50 rounded border">
+                  <div className="flex items-center gap-2 mb-1">
+                    <span className="text-xs px-2 py-0.5 rounded bg-orange-100 text-orange-600">{r.type}</span>
+                    <p className="text-sm font-medium text-gray-800">{r.risk}</p>
+                  </div>
+                  <p className="text-xs text-gray-500">Mitigation: {r.mitigation}</p>
+                </div>
+              ))}
+            </div>
+          </div>
+        )}
+
+        {/* Clarification Log */}
+        {brief.clarificationLog && Array.isArray(brief.clarificationLog) && (
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">AI Clarification Log</h2>
+            <div className="space-y-2">
+              {brief.clarificationLog.map((c: any, i: number) => (
+                <div key={i} className="p-2 bg-blue-50 rounded border border-blue-100">
+                  <div className="flex items-center gap-2 mb-1">
+                    <span className="text-xs text-blue-400">{c.date}</span>
+                    <p className="text-sm font-medium text-blue-700">{c.topic}</p>
+                  </div>
+                  <p className="text-xs text-gray-600">{c.advice}</p>
+                </div>
+              ))}
+            </div>
+          </div>
+        )}
+
       </div>
     </div>
   );
diff --git a/apps/web-app/features/project/components/steps/webApp/DetailsScopeStep.tsx b/apps/web-app/features/project/components/steps/webApp/DetailsScopeStep.tsx
index 816769b..f6860b5 100644
--- a/apps/web-app/features/project/components/steps/webApp/DetailsScopeStep.tsx
+++ b/apps/web-app/features/project/components/steps/webApp/DetailsScopeStep.tsx
@@ -5,7 +5,7 @@ import { Field, FieldLabel } from "@workspace/ui/components/field";
 import { Input } from "@workspace/ui/components/input";
 import { Label } from "@workspace/ui/components/label";
 import { Separator } from "@workspace/ui/components/separator";
-import { ArrowRight, Cpu, Goal, ListTodo } from "lucide-react";
+import { ArrowRight, Cpu, Goal, ListTodo, Loader2 } from "lucide-react";
 import { TagInput } from "./components/tagInput";
 import { Button } from "@workspace/ui/components/button";
 import type { WebAppFormData } from "../../../types";
@@ -15,9 +15,18 @@ interface Props {
   formData: WebAppFormData;
   updateField: <K extends keyof WebAppFormData>(field: K, value: WebAppFormData[K]) => void;
   canProceedToReview: boolean;
+  onGenerate: (formData: WebAppFormData, includeDiagram?: boolean) => Promise<void>;
+  isGenerating: boolean;
+  generateError: string | null;
 }
 
-export function DetailsScopeStep({ setStep, formData, updateField, canProceedToReview }: Props) {
+export function DetailsScopeStep({ setStep, formData, updateField, canProceedToReview, onGenerate, isGenerating, generateError }: Props) {
+
+  const handleContinueToReview = async () => {
+    await onGenerate(formData)
+    setStep(4)
+  }
+
   return (
     <div className="space-y-4 mb-25">
       <div className="flex flex-col gap-2">
@@ -142,17 +151,33 @@ export function DetailsScopeStep({ setStep, formData, updateField, canProceedToR
         <Button
           onClick={() => setStep(2)}
           variant={"outline"}
+          disabled={isGenerating}
           className="flex flex-row gap-4 items-center text-sm px-5 py-5 hover:translate-y-1 hover:shadow-md cursor-pointer "
         >Back</Button>
         <Button
-          onClick={() => setStep(4)}
-          // disabled={!canProceedToReview}
+          onClick={handleContinueToReview}
+          disabled={isGenerating}
           className="flex flex-row gap-4 items-center text-sm px-5 py-5 hover:translate-y-1 hover:shadow-md cursor-pointer disabled:opacity-50 disabled:cursor-not-allowed"
         >
-          Continue to Review
-          <ArrowRight className="w-4 h-4" />
+          {isGenerating ? (
+            <>
+              <Loader2 className="w-4 h-4 animate-spin" />
+              Generating...
+            </>
+          ) : (
+            <>
+              Continue to Review
+              <ArrowRight className="w-4 h-4" />
+            </>
+          )}
         </Button>
       </div>
+
+      {generateError && (
+        <div className="mt-2 p-3 bg-red-50 border border-red-200 rounded-md">
+          <p className="text-sm text-red-600">{generateError}</p>
+        </div>
+      )}
     </div>
   );
 }
diff --git a/apps/web-app/features/project/components/steps/webApp/ProjectInfoStep.tsx b/apps/web-app/features/project/components/steps/webApp/ProjectInfoStep.tsx
index f23aaaa..b655f81 100644
--- a/apps/web-app/features/project/components/steps/webApp/ProjectInfoStep.tsx
+++ b/apps/web-app/features/project/components/steps/webApp/ProjectInfoStep.tsx
@@ -34,7 +34,7 @@ export function ProjectInfoStep({ setStep, formData, updateField, canProceedToDe
     description: string;
   }[] = [
       {
-        value: "profesional",
+        value: "professional",
         title: "Professional",
         description: "Standar business tone, balanced detail.",
       },
@@ -128,7 +128,7 @@ export function ProjectInfoStep({ setStep, formData, updateField, canProceedToDe
 
       <div className="flex flex-row justify-between items-center">
         <Button
-          onClick={() => setStep(2)}
+          onClick={() => setStep(1)}
           variant={"outline"}
           className="flex flex-row gap-4 items-center text-sm px-5 py-5 hover:translate-y-1 hover:shadow-md cursor-pointer "
         >Cancel</Button>
diff --git a/apps/web-app/features/project/types.ts b/apps/web-app/features/project/types.ts
index 9a6bfd2..ca9c064 100644
--- a/apps/web-app/features/project/types.ts
+++ b/apps/web-app/features/project/types.ts
@@ -43,15 +43,21 @@ export interface GenerateProjectInput {
 }
 
 export interface GenerateProjectResponse {
+    title?: string
     overview?: any
+    targetAudience?: any
     problemStatement?: any
     objectives?: any
+    successCriteria?: any
     keyFeatures?: any
     userFlow?: any
     srsModules?: any
     recommendedTechStack?: any
+    nonFunctionalRequirements?: any
     scope?: any
     risks?: any
+    assumptions?: any
     clarificationLog?: any
     diagram?: any
+    [key: string]: any  // Allow any additional fields from AI
 }
diff --git a/apps/web-app/features/project/components/steps/webApp/hooks/index.ts b/apps/web-app/hooks/index.ts
similarity index 100%
rename from apps/web-app/features/project/components/steps/webApp/hooks/index.ts
rename to apps/web-app/hooks/index.ts
diff --git a/apps/web-app/features/project/components/steps/webApp/hooks/useGenerateProject.ts b/apps/web-app/hooks/useGenerateProject.ts
similarity index 95%
rename from apps/web-app/features/project/components/steps/webApp/hooks/useGenerateProject.ts
rename to apps/web-app/hooks/useGenerateProject.ts
index 8735baa..3190056 100644
--- a/apps/web-app/features/project/components/steps/webApp/hooks/useGenerateProject.ts
+++ b/apps/web-app/hooks/useGenerateProject.ts
@@ -1,8 +1,8 @@
 "use client"
 
 import { useState, useCallback } from "react"
-import { generateProjectBrief } from "../../../../services/project.service"
-import type { WebAppFormData, GenerateProjectInput, GenerateProjectResponse } from "../../../../types"
+import { generateProjectBrief } from "../features/project/services/project.service"
+import type { WebAppFormData, GenerateProjectInput, GenerateProjectResponse } from "../features/project/types"
 
 interface UseGenerateProjectReturn {
     isLoading: boolean
diff --git a/apps/web-app/features/project/components/steps/webApp/hooks/useWebAppForm.ts b/apps/web-app/hooks/useWebAppForm.ts
similarity index 96%
rename from apps/web-app/features/project/components/steps/webApp/hooks/useWebAppForm.ts
rename to apps/web-app/hooks/useWebAppForm.ts
index 591366b..a13c621 100644
--- a/apps/web-app/features/project/components/steps/webApp/hooks/useWebAppForm.ts
+++ b/apps/web-app/hooks/useWebAppForm.ts
@@ -1,7 +1,7 @@
 "use client"
 
 import { useState, useCallback } from "react"
-import type { WebAppFormData, DocumentStyle, OutputLanguage, ProjectStatus } from "../../../../types"
+import type { WebAppFormData, DocumentStyle, OutputLanguage, ProjectStatus } from "../features/project/types"
 
 const initialFormData: WebAppFormData = {
     // Step 1

From b543b3e8fa957a4624cc5de429efb85127b7c217 Mon Sep 17 00:00:00 2001
From: NotCayaa <yannz.2005@gmail.com>
Date: Sun, 22 Feb 2026 21:58:49 +0700
Subject: [PATCH 02/11] nambah engine export markdown

---
 apps/web-api/public/index.html                |  59 ++-
 apps/web-api/src/app.ts                       |   2 +
 .../src/controllers/markdown.controller.ts    |  64 +++
 apps/web-api/src/routes/markdown.route.ts     |  14 +
 .../web-api/src/services/coin/coin.service.ts |   1 +
 .../src/services/markdown/markdown.service.ts | 383 ++++++++++++++++++
 6 files changed, 516 insertions(+), 7 deletions(-)
 create mode 100644 apps/web-api/src/controllers/markdown.controller.ts
 create mode 100644 apps/web-api/src/routes/markdown.route.ts
 create mode 100644 apps/web-api/src/services/markdown/markdown.service.ts

diff --git a/apps/web-api/public/index.html b/apps/web-api/public/index.html
index 11fc7bc..21b60e9 100644
--- a/apps/web-api/public/index.html
+++ b/apps/web-api/public/index.html
@@ -327,7 +327,6 @@
 </head>
 
 <body>
-
     <!-- NAV BAR -->
     <nav class="navbar">
         <div class="brand">
@@ -453,15 +452,20 @@ <h3><i data-lucide="sparkles" size="20"
                 <div class="result-box">
                     <div class="result-header">
                         <div style="display: flex; align-items: center; gap: 0.75rem;">
-                            <h2 id="res-title" style="margin: 0; color: var(--primary);">Project Title</h2>
+                            <h2 id="res-title" style="margin:0; color:var(--primary);">Project Title</h2>
                             <span class="tag" id="res-mode">DRAFT</span>
                         </div>
-                        <button class="secondary" style="width: auto; padding: 0.4rem 1rem;" onclick="downloadPdf()"
-                            id="btn-pdf">
-                            <i data-lucide="file-down" size="16"></i> Export PDF (1c)
-                        </button>
+                        <div style="display: flex; gap: 0.5rem;">
+                            <button class="secondary" style="width: auto; padding: 0.4rem 1rem;"
+                                onclick="downloadMarkdown()" id="btn-md">
+                                <i data-lucide="file-text" size="16"></i> Export MD (1c)
+                            </button>
+                            <button class="secondary" style="width: auto; padding: 0.4rem 1rem;" onclick="downloadPdf()"
+                                id="btn-pdf">
+                                <i data-lucide="file-down" size="16"></i> Export PDF (1c)
+                            </button>
+                        </div>
                     </div>
-
                     <p id="res-overview"
                         style="line-height: 1.6; color: #cbd5e1; margin-bottom: 1.5rem; font-size: 1.05rem;"></p>
 
@@ -987,6 +991,47 @@ <h4 style="color: #fbbf24; margin-bottom:0.5rem;">AI Clarification Log</h4>
                 lucide.createIcons();
             }
         }
+
+        async function downloadMarkdown() {
+            if (!currentBrief) return;
+            const btn = document.getElementById('btn-md');
+            btn.innerHTML = `Downloading...`;
+            btn.disabled = true;
+
+            try {
+                const res = await fetch(`${API}/markdown/brief`, {
+                    method: 'POST',
+                    headers: {
+                        'Content-Type': 'application/json',
+                        'Authorization': `Bearer ${token}`
+                    },
+                    body: JSON.stringify(currentBrief)
+                });
+
+                if (res.ok) {
+                    const blob = await res.blob();
+                    const url = window.URL.createObjectURL(blob);
+                    const a = document.createElement('a');
+                    a.href = url;
+                    a.download = `${currentBrief.title}_Brief.md`;
+                    document.body.appendChild(a);
+                    a.click();
+                    a.remove();
+
+                    // update coins
+                    fetchCoins();
+                } else {
+                    const txt = await res.text();
+                    alert("Error: " + txt);
+                }
+            } catch (e) { console.error(e); alert('Markdown export failed'); }
+            finally {
+                btn.disabled = false;
+                btn.innerHTML = `<i data-lucide="file-text" size="16"></i> Export MD (1c)`;
+                lucide.createIcons();
+            }
+        }
+
     </script>
 
     <style>
diff --git a/apps/web-api/src/app.ts b/apps/web-api/src/app.ts
index beb459a..4792267 100644
--- a/apps/web-api/src/app.ts
+++ b/apps/web-api/src/app.ts
@@ -5,6 +5,7 @@ import healthRoute from "./routes/health.route";
 import authRoute from "./routes/auth.route";
 import aiRoute from "./routes/ai.route";
 import pdfRoute from "./routes/pdf.route";
+import markdownRoute from "./routes/markdown.route";
 import { errorHandler } from "./middlewares/error.middleware";
 
 const app: Express = express();
@@ -30,6 +31,7 @@ app.use("/api/health", healthRoute);
 app.use("/api/auth", authRoute);
 app.use("/api/ai", aiRoute);
 app.use("/api/pdf", pdfRoute);
+app.use("/api/markdown", markdownRoute);
 
 // Error handler (must be last)
 app.use(errorHandler);
diff --git a/apps/web-api/src/controllers/markdown.controller.ts b/apps/web-api/src/controllers/markdown.controller.ts
new file mode 100644
index 0000000..a97bedb
--- /dev/null
+++ b/apps/web-api/src/controllers/markdown.controller.ts
@@ -0,0 +1,64 @@
+/**
+ * ============================================
+ * MARKDOWN CONTROLLER
+ * Handles Markdown export requests
+ * ============================================
+ */
+
+import { Request, Response } from "express";
+import { asyncHandler } from "../utils/async-handler";
+import { markdownService } from "../services/markdown/markdown.service";
+import { ProjectBriefOutput } from "../services/ai/types";
+import { coinService, COIN_COSTS } from "../services/coin";
+import { ErrorCodes } from "../utils/app-error";
+
+export const markdownController = {
+    /**
+     * Generate Markdown from Project Brief
+     * @route POST /api/markdown/brief
+     * @body ProjectBriefOutput
+     */
+    generateBriefMarkdown: asyncHandler(
+        async (req: Request, res: Response): Promise<any> => {
+            const brief: ProjectBriefOutput = req.body;
+            const userId = (req as any).user?.userId || "anonymous";
+
+            if (!brief || !brief.title) {
+                return res.status(400).json({
+                    success: false,
+                    message: "Invalid project brief data",
+                    code: ErrorCodes.VALIDATION_ERROR,
+                });
+            }
+
+            // Check coins
+            const cost = COIN_COSTS.MARKDOWN;
+            const hasEnough = await coinService.hasEnough(userId, cost);
+
+            if (!hasEnough) {
+                const balance = await coinService.getBalance(userId);
+                return res.status(402).json({
+                    success: false,
+                    message: `Insufficient coins. Need ${cost}, have ${balance}`,
+                    code: "INSUFFICIENT_COINS",
+                });
+            }
+
+            // Generate Markdown
+            const markdown = markdownService.generateMarkdown(brief);
+
+            // Deduct coins
+            await coinService.deduct(userId, cost);
+
+            // Send as downloadable .md file
+            const filename = `${brief.title.replace(/[^a-z0-9]/gi, '_').toLowerCase()}_brief.md`;
+            const newBalance = await coinService.getBalance(userId);
+
+            res.setHeader("Content-Type", "text/markdown; charset=utf-8");
+            res.setHeader("Content-Disposition", `attachment; filename="${filename}"`);
+            res.setHeader("X-Coins-Remaining", newBalance.toString());
+
+            return res.send(markdown);
+        }
+    ),
+};
diff --git a/apps/web-api/src/routes/markdown.route.ts b/apps/web-api/src/routes/markdown.route.ts
new file mode 100644
index 0000000..a0c26fc
--- /dev/null
+++ b/apps/web-api/src/routes/markdown.route.ts
@@ -0,0 +1,14 @@
+import { Router, type Router as ExpressRouter } from "express";
+import { markdownController } from "../controllers/markdown.controller";
+import { authenticate } from "../middlewares/auth.middleware";
+
+const router: ExpressRouter = Router();
+
+/**
+ * POST /api/markdown/brief
+ * Generate Markdown from project brief JSON
+ * Cost: 1 coin
+ */
+router.post("/brief", authenticate, markdownController.generateBriefMarkdown);
+
+export default router;
diff --git a/apps/web-api/src/services/coin/coin.service.ts b/apps/web-api/src/services/coin/coin.service.ts
index aa77087..ae59807 100644
--- a/apps/web-api/src/services/coin/coin.service.ts
+++ b/apps/web-api/src/services/coin/coin.service.ts
@@ -6,6 +6,7 @@ export const COIN_COSTS = {
     BRIEF_POLISHED: 4,
     DIAGRAM: 2,
     PDF: 1,
+    MARKDOWN: 1,
 } as const;
 
 export const coinService = {
diff --git a/apps/web-api/src/services/markdown/markdown.service.ts b/apps/web-api/src/services/markdown/markdown.service.ts
new file mode 100644
index 0000000..ec729de
--- /dev/null
+++ b/apps/web-api/src/services/markdown/markdown.service.ts
@@ -0,0 +1,383 @@
+/**
+ * ============================================
+ * MARKDOWN SERVICE
+ * Converts ProjectBriefOutput to Markdown
+ * ============================================
+ */
+
+import { ProjectBriefOutput } from "../ai/types";
+
+/**
+ * Build Markdown for Research Document
+ */
+function buildResearchMarkdown(brief: ProjectBriefOutput): string {
+    const lines: string[] = [];
+
+    lines.push(`# Research Proposal Document`);
+    lines.push(`## ${brief.title}`);
+    lines.push(``);
+    lines.push(`> Generated by Planify | ${new Date().toLocaleDateString()} | Version 1.0 (${brief.methodology ? 'Final' : 'Draft'})`);
+    lines.push(``);
+    lines.push(`---`);
+    lines.push(``);
+
+    // Abstract
+    lines.push(`## 1. Abstract`);
+    lines.push(``);
+    lines.push(brief.abstract || brief.overview || 'Abstract not provided');
+    lines.push(``);
+
+    // Research Questions
+    lines.push(`## 2. Research Questions`);
+    lines.push(``);
+    if (brief.researchQuestions?.length) {
+        brief.researchQuestions.forEach((q: any, i: number) => {
+            const text = typeof q === 'string' ? q : (q.question || JSON.stringify(q));
+            lines.push(`${i + 1}. ${text}`);
+        });
+    } else {
+        lines.push(`- Research questions not yet defined`);
+    }
+    lines.push(``);
+
+    // Objectives
+    lines.push(`## 3. Research Objectives`);
+    lines.push(``);
+    if (brief.objectives?.length) {
+        brief.objectives.forEach((o: any) => {
+            const text = typeof o === 'string' ? o : (o.objective || o.id || JSON.stringify(o));
+            lines.push(`- ${text}`);
+        });
+    } else {
+        lines.push(`- Objectives not specified`);
+    }
+    lines.push(``);
+
+    // Methodology
+    lines.push(`## 4. Research Methodology`);
+    lines.push(``);
+    if (brief.methodology) {
+        lines.push(`### 4.1 Approach`);
+        lines.push(brief.methodology.approach || 'Not specified');
+        lines.push(``);
+
+        if (brief.methodology.population) {
+            lines.push(`### 4.2 Population & Sample`);
+            lines.push(brief.methodology.population);
+            lines.push(``);
+        }
+
+        if (brief.methodology.dataCollection) {
+            lines.push(`### 4.3 Data Collection`);
+            const methods = Array.isArray(brief.methodology.dataCollection.methods) ? brief.methodology.dataCollection.methods.join(', ') : (brief.methodology.dataCollection.methods || 'N/A');
+            const instruments = Array.isArray(brief.methodology.dataCollection.instruments) ? brief.methodology.dataCollection.instruments.join(', ') : (brief.methodology.dataCollection.instruments || 'N/A');
+            lines.push(`- **Methods:** ${methods}`);
+            lines.push(`- **Instruments:** ${instruments}`);
+            lines.push(``);
+        }
+
+        if (brief.methodology.dataAnalysis) {
+            lines.push(`### 4.4 Data Analysis`);
+            const techniques = Array.isArray(brief.methodology.dataAnalysis.techniques) ? brief.methodology.dataAnalysis.techniques.join(', ') : (brief.methodology.dataAnalysis.techniques || 'N/A');
+            const tools = Array.isArray(brief.methodology.dataAnalysis.software) ? brief.methodology.dataAnalysis.software.join(', ') :
+                (brief.methodology.dataAnalysis.software ||
+                    (Array.isArray(brief.methodology.dataAnalysis.tools) ? brief.methodology.dataAnalysis.tools.join(', ') : (brief.methodology.dataAnalysis.tools || 'N/A')));
+            lines.push(`- **Techniques:** ${techniques}`);
+            lines.push(`- **Tools/Software:** ${tools}`);
+            lines.push(``);
+        }
+    } else {
+        lines.push(`Methodology details available in Polished Mode`);
+        lines.push(``);
+    }
+
+    // Expected Outcomes
+    lines.push(`## 5. Expected Outcomes`);
+    lines.push(``);
+    if (brief.expectedOutcomes?.length) {
+        brief.expectedOutcomes.forEach((o: any) => {
+            const text = typeof o === 'string' ? o : (o.outcome || JSON.stringify(o));
+            lines.push(`- ${text}`);
+        });
+    } else {
+        lines.push(`- Expected outcomes defined in Polished Mode`);
+    }
+    lines.push(``);
+
+    // Timeline
+    lines.push(`## 6. Research Timeline`);
+    lines.push(``);
+    if (brief.timeline?.phases) {
+        brief.timeline.phases.forEach((p: any) => {
+            lines.push(`- **${p.name || p.phase || 'Phase'}**: ${p.duration || p.weeks || 'TBD'}`);
+        });
+    } else {
+        lines.push(`Timeline details available in Polished Mode`);
+    }
+    lines.push(``);
+
+    // Variables
+    if (brief.variables?.length) {
+        lines.push(`## 7. Research Variables`);
+        lines.push(``);
+        lines.push(`| Variable | Type | Indicators |`);
+        lines.push(`|----------|------|------------|`);
+        brief.variables.forEach((v: any) => {
+            const indicators = Array.isArray(v.indicators) ? v.indicators.join(', ') : (v.indicators || 'N/A');
+            lines.push(`| ${v.name || v.variable || 'Variable'} | ${v.type || 'N/A'} | ${indicators} |`);
+        });
+        lines.push(``);
+    }
+
+    // Hypotheses
+    if (brief.hypotheses?.length) {
+        lines.push(`## ${brief.variables ? '8' : '7'}. Hypotheses`);
+        lines.push(``);
+        brief.hypotheses.forEach((h: any, i: number) => {
+            const text = typeof h === 'string' ? h : (h.hypothesis || h.statement || JSON.stringify(h));
+            lines.push(`${i + 1}. ${text}`);
+        });
+        lines.push(``);
+    }
+
+    // Diagram
+    if (brief.diagram) {
+        lines.push(`## Appendix: Conceptual Framework`);
+        lines.push(``);
+        lines.push(brief.diagram.description || 'Research conceptual framework');
+        lines.push(``);
+        lines.push('```mermaid');
+        lines.push(brief.diagram.diagram);
+        lines.push('```');
+        lines.push(``);
+    }
+
+    return lines.join('\n');
+}
+
+/**
+ * Build Markdown for Web/Mobile Application (PRD)
+ */
+function buildAppMarkdown(brief: ProjectBriefOutput): string {
+    const lines: string[] = [];
+
+    lines.push(`# Product Requirements Document (PRD)`);
+    lines.push(`## ${brief.title}`);
+    lines.push(``);
+    lines.push(`> Generated by Planify | ${new Date().toLocaleDateString()} | Version 1.0 (${brief.srsModules ? 'Polished' : 'Draft'}) | Platform: ${brief.platformCategory || 'Web Application'}`);
+    lines.push(``);
+    lines.push(`---`);
+    lines.push(``);
+
+    // 1. Executive Summary
+    lines.push(`## 1. Executive Summary & Project Brief`);
+    lines.push(``);
+    lines.push(`### 1.1 Project Description`);
+    lines.push(brief.overview);
+    lines.push(``);
+
+    lines.push(`### 1.2 Target Audience (User Personas)`);
+    lines.push(`- **Primary:** ${brief.targetAudience?.primary || brief.targetAudience}`);
+    if (brief.targetAudience?.secondary) lines.push(`- **Secondary:** ${brief.targetAudience.secondary}`);
+    if (brief.targetAudience?.admin) lines.push(`- **Admin:** ${brief.targetAudience.admin}`);
+    lines.push(``);
+
+    lines.push(`### 1.3 Project Objectives`);
+    brief.objectives?.forEach((o: any) => {
+        lines.push(`- ${typeof o === 'string' ? o : JSON.stringify(o)}`);
+    });
+    lines.push(``);
+
+    // 2. Problem Statement
+    lines.push(`## 2. Problem Statement & Business Value`);
+    lines.push(``);
+    lines.push(`### 2.1 Key Pain Points`);
+    if (brief.problemStatement?.painPoints?.length) {
+        brief.problemStatement.painPoints.forEach((p: string) => lines.push(`- ${p}`));
+    } else {
+        lines.push(`- Data not available in Draft mode`);
+    }
+    lines.push(``);
+
+    lines.push(`### 2.2 Business Impact (Cost of Inaction)`);
+    lines.push(brief.problemStatement?.businessImpact || 'Data not available in Draft mode');
+    lines.push(``);
+
+    // 3. Success Criteria
+    lines.push(`## 3. Goals & Success Criteria`);
+    lines.push(``);
+    lines.push(`### 3.1 Key Performance Indicators (KPIs)`);
+    lines.push(``);
+    lines.push(`| Metric | Target |`);
+    lines.push(`|--------|--------|`);
+    if (brief.successCriteria?.length) {
+        brief.successCriteria.forEach((s: any) => {
+            if (typeof s === 'string') {
+                lines.push(`| Success Criteria | ${s} |`);
+            } else {
+                lines.push(`| ${s.metric} | ${s.target} |`);
+            }
+        });
+    }
+    lines.push(``);
+
+    // 4. Feature List
+    lines.push(`## 4. Feature List & Prioritization (MoSCoW)`);
+    lines.push(``);
+    lines.push(`| No | Feature | Description | Priority |`);
+    lines.push(`|----|---------|-------------|----------|`);
+    brief.keyFeatures?.forEach((f: any, i: number) => {
+        lines.push(`| ${i + 1} | **${f.name}** | ${f.description} | ${f.priority || 'Should'} |`);
+    });
+    lines.push(``);
+
+    // 5. User Flow
+    lines.push(`## 5. User Flow (Main Scenario)`);
+    lines.push(``);
+    if (brief.userFlow?.steps?.length) {
+        brief.userFlow.steps.forEach((s: string, i: number) => {
+            lines.push(`${i + 1}. ${s}`);
+        });
+    } else {
+        lines.push(`- Flow not defined in Draft mode`);
+    }
+    lines.push(``);
+
+    if (brief.userFlow?.diagramDsl) {
+        lines.push(`### 5.2 Flow Diagram`);
+        lines.push(``);
+        lines.push('```mermaid');
+        lines.push(brief.userFlow.diagramDsl);
+        lines.push('```');
+        lines.push(``);
+    }
+
+    // 6. SRS Modules
+    lines.push(`## 6. Software Requirements Specification (SRS)`);
+    lines.push(``);
+    if (brief.srsModules?.length) {
+        brief.srsModules.forEach((mod: any) => {
+            lines.push(`### Module: ${mod.moduleName}`);
+            lines.push(``);
+            mod.requirements?.forEach((req: any) => {
+                lines.push(`#### ${req.id || 'REQ'} - ${req.userStory?.split(',')[0] || 'User Story'}`);
+                lines.push(``);
+                lines.push(`> *"${req.userStory}"*`);
+                lines.push(``);
+                if (req.acceptanceCriteria?.length) {
+                    lines.push(`**Acceptance Criteria:**`);
+                    req.acceptanceCriteria.forEach((ac: string) => lines.push(`- ${ac}`));
+                    lines.push(``);
+                }
+            });
+        });
+    } else if (brief.keyFeatures?.some((f: any) => f.userStory)) {
+        brief.keyFeatures.forEach((f: any, i: number) => {
+            lines.push(`### Feature ${i + 1}: ${f.name}`);
+            if (f.userStory) lines.push(`> *"${f.userStory}"*`);
+            if (f.acceptanceCriteria?.length) {
+                lines.push(`**Acceptance Criteria:**`);
+                f.acceptanceCriteria.forEach((ac: string) => lines.push(`- ${ac}`));
+            }
+            lines.push(``);
+        });
+    } else {
+        lines.push(`SRS Details available in Polished Mode only.`);
+        lines.push(``);
+    }
+
+    // 7. Tech Stack
+    lines.push(`## 7. Technical Architecture & Non-Functional Requirements`);
+    lines.push(``);
+    lines.push(`### 7.1 Tech Stack Strategy`);
+    lines.push(``);
+    lines.push(`| Category | Technology | Selection Reason |`);
+    lines.push(`|----------|------------|------------------|`);
+    brief.recommendedTechStack?.forEach((t: any) => {
+        lines.push(`| ${t.category} | **${t.technology}** | ${t.reason} |`);
+    });
+    lines.push(``);
+
+    lines.push(`### 7.2 Non-Functional Requirements`);
+    if (brief.nonFunctionalRequirements) {
+        lines.push(`- **Security:** ${brief.nonFunctionalRequirements.security?.join(', ') || 'Standard HTTPS/Auth'}`);
+        lines.push(`- **Performance:** ${brief.nonFunctionalRequirements.performance?.join(', ') || 'Optimization required'}`);
+        lines.push(`- **Scalability:** ${brief.nonFunctionalRequirements.scalability?.join(', ') || 'Vertical scaling'}`);
+    } else {
+        lines.push(`NFRs defined in Polished Mode.`);
+    }
+    lines.push(``);
+
+    // 8. Scope
+    lines.push(`## 8. Scope & MVP Definition`);
+    lines.push(``);
+    lines.push(`### 8.1 In-Scope`);
+    if (brief.scope?.inScope?.length) {
+        brief.scope.inScope.forEach((s: string) => lines.push(`- ${s}`));
+    } else {
+        lines.push(`- Defined in Polished Mode`);
+    }
+    lines.push(``);
+    lines.push(`### 8.2 Out-of-Scope`);
+    if (brief.scope?.outOfScope?.length) {
+        brief.scope.outOfScope.forEach((s: string) => lines.push(`- ${s}`));
+    } else {
+        lines.push(`- Defined in Polished Mode`);
+    }
+    lines.push(``);
+
+    // 9. Risks
+    lines.push(`## 9. Risk, Assumptions & Mitigation`);
+    lines.push(``);
+    lines.push(`| Risk | Type | Mitigation |`);
+    lines.push(`|------|------|------------|`);
+    if (brief.risks?.length) {
+        brief.risks.forEach((r: any) => {
+            lines.push(`| ${r.risk} | ${r.type} | ${r.mitigation} |`);
+        });
+    } else {
+        lines.push(`| Risks analyzed in Polished Mode | - | - |`);
+    }
+    lines.push(``);
+
+    // 10. Clarification Log
+    lines.push(`## 10. AI Clarification Log`);
+    lines.push(``);
+    lines.push(`*This log tracks technical decisions assisted by AI consultation.*`);
+    lines.push(``);
+    lines.push(`| Date | Question / Topic | AI Clarification / Advice |`);
+    lines.push(`|------|------------------|---------------------------|`);
+    if (brief.clarificationLog?.length) {
+        brief.clarificationLog.forEach((l: any) => {
+            lines.push(`| ${l.date} | ${l.topic} | ${l.advice} |`);
+        });
+    } else {
+        lines.push(`| - | Available in Polished Mode only | - |`);
+    }
+    lines.push(``);
+
+    // Diagram
+    if (brief.diagram) {
+        lines.push(`## Appendix: System Architecture Diagram`);
+        lines.push(``);
+        lines.push(brief.diagram.description || '');
+        lines.push(``);
+        lines.push('```mermaid');
+        lines.push(brief.diagram.diagram);
+        lines.push('```');
+        lines.push(``);
+    }
+
+    return lines.join('\n');
+}
+
+export const markdownService = {
+    /**
+     * Generate Markdown string from ProjectBriefOutput
+     * Auto-detects document type (research vs app PRD)
+     */
+    generateMarkdown(brief: ProjectBriefOutput): string {
+        const isResearch = brief.platformCategory?.toLowerCase().includes('research');
+        return isResearch ? buildResearchMarkdown(brief) : buildAppMarkdown(brief);
+    },
+};

From ddfee5097135bc3a0046882610581254f6a8dbab Mon Sep 17 00:00:00 2001
From: NotCayaa <yannz.2005@gmail.com>
Date: Tue, 24 Feb 2026 22:19:04 +0700
Subject: [PATCH 03/11] pindah hooks dan service

---
 .../project/components/NewProjectLayout.tsx     |  4 ++--
 .../components/steps/webApp}/hooks/index.ts     |  0
 .../steps/webApp}/hooks/useGenerateProject.ts   |  4 ++--
 .../steps/webApp}/hooks/useWebAppForm.ts        |  2 +-
 .../{features/project => }/services/api.ts      |  0
 .../{features/project => }/services/index.ts    |  0
 .../project => }/services/project.service.ts    | 16 +++++++++++++++-
 apps/web-app/tsconfig.json                      | 17 +++++++++++++----
 8 files changed, 33 insertions(+), 10 deletions(-)
 rename apps/web-app/{ => features/project/components/steps/webApp}/hooks/index.ts (100%)
 rename apps/web-app/{ => features/project/components/steps/webApp}/hooks/useGenerateProject.ts (95%)
 rename apps/web-app/{ => features/project/components/steps/webApp}/hooks/useWebAppForm.ts (96%)
 rename apps/web-app/{features/project => }/services/api.ts (100%)
 rename apps/web-app/{features/project => }/services/index.ts (100%)
 rename apps/web-app/{features/project => }/services/project.service.ts (85%)

diff --git a/apps/web-app/features/project/components/NewProjectLayout.tsx b/apps/web-app/features/project/components/NewProjectLayout.tsx
index c47021a..f118c00 100644
--- a/apps/web-app/features/project/components/NewProjectLayout.tsx
+++ b/apps/web-app/features/project/components/NewProjectLayout.tsx
@@ -6,8 +6,8 @@ import type { WebAppFormData } from "../types"
 import { StepSidebar } from "./StepSidebar"
 import { StepContent } from "./StepContent"
 import { ReviewSidebar } from "./reviewSidebar"
-import { useWebAppForm } from "../../../hooks"
-import { useGenerateProject } from "../../../hooks"
+import { useWebAppForm } from "./steps/webApp/hooks"
+import { useGenerateProject } from "./steps/webApp/hooks"
 
 export function NewProjectLayout() {
   const [type, setType] = useState<ProjectType | null>(null)
diff --git a/apps/web-app/hooks/index.ts b/apps/web-app/features/project/components/steps/webApp/hooks/index.ts
similarity index 100%
rename from apps/web-app/hooks/index.ts
rename to apps/web-app/features/project/components/steps/webApp/hooks/index.ts
diff --git a/apps/web-app/hooks/useGenerateProject.ts b/apps/web-app/features/project/components/steps/webApp/hooks/useGenerateProject.ts
similarity index 95%
rename from apps/web-app/hooks/useGenerateProject.ts
rename to apps/web-app/features/project/components/steps/webApp/hooks/useGenerateProject.ts
index 3190056..4872e18 100644
--- a/apps/web-app/hooks/useGenerateProject.ts
+++ b/apps/web-app/features/project/components/steps/webApp/hooks/useGenerateProject.ts
@@ -1,8 +1,8 @@
 "use client"
 
 import { useState, useCallback } from "react"
-import { generateProjectBrief } from "../features/project/services/project.service"
-import type { WebAppFormData, GenerateProjectInput, GenerateProjectResponse } from "../features/project/types"
+import { generateProjectBrief } from "../../../../../../services/project.service"
+import type { WebAppFormData, GenerateProjectInput, GenerateProjectResponse } from "../../../../types"
 
 interface UseGenerateProjectReturn {
     isLoading: boolean
diff --git a/apps/web-app/hooks/useWebAppForm.ts b/apps/web-app/features/project/components/steps/webApp/hooks/useWebAppForm.ts
similarity index 96%
rename from apps/web-app/hooks/useWebAppForm.ts
rename to apps/web-app/features/project/components/steps/webApp/hooks/useWebAppForm.ts
index a13c621..591366b 100644
--- a/apps/web-app/hooks/useWebAppForm.ts
+++ b/apps/web-app/features/project/components/steps/webApp/hooks/useWebAppForm.ts
@@ -1,7 +1,7 @@
 "use client"
 
 import { useState, useCallback } from "react"
-import type { WebAppFormData, DocumentStyle, OutputLanguage, ProjectStatus } from "../features/project/types"
+import type { WebAppFormData, DocumentStyle, OutputLanguage, ProjectStatus } from "../../../../types"
 
 const initialFormData: WebAppFormData = {
     // Step 1
diff --git a/apps/web-app/features/project/services/api.ts b/apps/web-app/services/api.ts
similarity index 100%
rename from apps/web-app/features/project/services/api.ts
rename to apps/web-app/services/api.ts
diff --git a/apps/web-app/features/project/services/index.ts b/apps/web-app/services/index.ts
similarity index 100%
rename from apps/web-app/features/project/services/index.ts
rename to apps/web-app/services/index.ts
diff --git a/apps/web-app/features/project/services/project.service.ts b/apps/web-app/services/project.service.ts
similarity index 85%
rename from apps/web-app/features/project/services/project.service.ts
rename to apps/web-app/services/project.service.ts
index 5763c23..35ca7d3 100644
--- a/apps/web-app/features/project/services/project.service.ts
+++ b/apps/web-app/services/project.service.ts
@@ -6,7 +6,7 @@
  */
 
 import { apiClient } from "./api"
-import type { GenerateProjectInput, GenerateProjectResponse } from "../types"
+import type { GenerateProjectInput, GenerateProjectResponse } from "../features/project/types"
 
 /**
  * Generate Project Brief via AI
@@ -81,3 +81,17 @@ export async function exportPdf(input: {
         body: input,
     })
 }
+
+/**
+ * Export project to Markdown
+ * POST /markdown/generate
+ */
+export async function exportMarkdown(input: {
+    content: any
+    diagramImage?: string
+}) {
+    return apiClient("/markdown/generate", {
+        method: "POST",
+        body: input,
+    })
+}
\ No newline at end of file
diff --git a/apps/web-app/tsconfig.json b/apps/web-app/tsconfig.json
index 8d6f25e..873a664 100644
--- a/apps/web-app/tsconfig.json
+++ b/apps/web-app/tsconfig.json
@@ -3,8 +3,15 @@
   "compilerOptions": {
     "baseUrl": ".",
     "paths": {
-      "@/*": ["./*"],
-      "@workspace/ui/*": ["../../packages/ui/src/*"]
+      "@/*": [
+        "./*"
+      ],
+      "@workspace/ui/*": [
+        "../../packages/ui/src/*"
+      ],
+      "@Types": [
+        "./types/*"
+      ]
     },
     "plugins": [
       {
@@ -19,5 +26,7 @@
     "**/*.tsx",
     ".next/types/**/*.ts"
   ],
-  "exclude": ["node_modules"]
-}
+  "exclude": [
+    "node_modules"
+  ]
+}
\ No newline at end of file

From 9ef28ad580fabf58fa5efb064eb3b81f6dd7b5cd Mon Sep 17 00:00:00 2001
From: NotCayaa <yannz.2005@gmail.com>
Date: Wed, 25 Feb 2026 02:39:05 +0700
Subject: [PATCH 04/11] banyak dah: - ai engine rework - endpoint baru buat
 History + My Project page - table sql baru di supabase buat kedua page diatas
 - implementasi dan integrasi db dan engine ke FE - wm rework di preview page
 - output rework di preview page - preview gabisa di copas ataupun di donglot
 jadi mantap - diagram issue dengan mermaid = fixed - next gw bakal integrasi
 db ke coins sama user, biar ga welcome dr maya mulu

---
 apps/web-api/public/index.html                | 539 +---------
 apps/web-api/public/index.js                  | 531 ++++++++++
 apps/web-api/src/app.ts                       |   4 +
 apps/web-api/src/controllers/ai.controller.ts |  14 +
 .../src/controllers/history.controller.ts     |  46 +
 .../src/controllers/markdown.controller.ts    |  11 +
 .../web-api/src/controllers/pdf.controller.ts |  11 +
 .../src/controllers/projects.controller.ts    | 180 ++++
 apps/web-api/src/routes/history.route.ts      |  13 +
 apps/web-api/src/routes/projects.route.ts     |  37 +
 .../src/services/history/history.service.ts   |  61 ++
 .../src/services/project/project.service.ts   | 124 +++
 apps/web-api/supabase/migration.sql           |  84 ++
 apps/web-app/app/(app)/histories/page.tsx     | 340 ++++---
 .../myProject/components/projectProgress.tsx  | 196 ++--
 .../myProject/components/recentActivity.tsx   |  85 +-
 .../project/components/NewProjectLayout.tsx   | 103 +-
 .../project/components/StepContent.tsx        |   2 +-
 .../project/components/StepSidebar.tsx        |  14 +-
 .../project/components/steps/ReviewStep.tsx   | 295 +++++-
 .../steps/webApp/DetailsScopeStep.tsx         |   2 +-
 .../components/steps/webApp/hooks/index.ts    |   1 +
 .../steps/webApp/hooks/useGenerateProject.ts  |   2 +
 .../steps/webApp/hooks/useProjectAutoSave.ts  | 165 ++++
 .../steps/webApp/hooks/useWebAppForm.ts       |   1 +
 apps/web-app/package.json                     |   1 +
 apps/web-app/services/project.service.ts      |  70 +-
 pnpm-lock.yaml                                | 920 ++++++++++++++++++
 28 files changed, 3007 insertions(+), 845 deletions(-)
 create mode 100644 apps/web-api/public/index.js
 create mode 100644 apps/web-api/src/controllers/history.controller.ts
 create mode 100644 apps/web-api/src/controllers/projects.controller.ts
 create mode 100644 apps/web-api/src/routes/history.route.ts
 create mode 100644 apps/web-api/src/routes/projects.route.ts
 create mode 100644 apps/web-api/src/services/history/history.service.ts
 create mode 100644 apps/web-api/src/services/project/project.service.ts
 create mode 100644 apps/web-api/supabase/migration.sql
 create mode 100644 apps/web-app/features/project/components/steps/webApp/hooks/useProjectAutoSave.ts

diff --git a/apps/web-api/public/index.html b/apps/web-api/public/index.html
index 21b60e9..eeb7ae7 100644
--- a/apps/web-api/public/index.html
+++ b/apps/web-api/public/index.html
@@ -327,6 +327,14 @@
 </head>
 
 <body>
+    <!-- LOGIC -->
+    <script type="module">
+        import * as Engine from './index.js';
+
+        // expose ke global
+        Object.assign(window, Engine);
+    </script>
+
     <!-- NAV BAR -->
     <nav class="navbar">
         <div class="brand">
@@ -503,537 +511,6 @@ <h4>Key Features</h4>
 
     </div>
 
-    <!-- LOGIC -->
-    <script>
-        lucide.createIcons();
-        const API = '/api';
-        let token = localStorage.getItem('token');
-        let currentBrief = null;
-        let mode = 'professional';
-
-        // --- Init ---
-        if (token) initAuth();
-
-        function switchAuthMode(m) {
-            document.getElementById('form-login').classList.toggle('hidden', m !== 'login');
-            document.getElementById('form-register').classList.toggle('hidden', m !== 'register');
-            document.getElementById('tab-login').classList.toggle('active', m === 'login');
-            document.getElementById('tab-register').classList.toggle('active', m === 'register');
-        }
-
-        function setMode(m) {
-            mode = m;
-            document.getElementById('opt-professional').classList.toggle('active', m === 'professional');
-            document.getElementById('opt-formal').classList.toggle('active', m === 'formal');
-            document.getElementById('opt-concise').classList.toggle('active', m === 'concise');
-
-            const modeTag = document.getElementById('res-mode');
-            if (modeTag) {
-                modeTag.innerText = m.toUpperCase();
-            }
-        }
-
-        document.addEventListener('DOMContentLoaded', () => {
-            // Set mode default
-            setMode('professional');
-        });
-
-        // --- AUTH ---
-        async function login() {
-            const email = document.getElementById('login-email').value;
-            const password = document.getElementById('login-password').value;
-            if (!email || !password) return alert('Fill info plx');
-
-            try {
-                const res = await fetch(`${API}/auth/login`, {
-                    method: 'POST',
-                    headers: { 'Content-Type': 'application/json' },
-                    body: JSON.stringify({ email, password })
-                });
-                const data = await res.json();
-
-                // Retrieve token from nested data structure
-                const token = data.data?.token || data.token;
-                const user = data.data?.user || data.user;
-
-                if (token) successLogin(token, user);
-                else alert(data.message || 'Login failed');
-            } catch (e) { alert(e.message); }
-        }
-
-        async function register() {
-            const name = document.getElementById('reg-name').value;
-            const email = document.getElementById('reg-email').value;
-            const password = document.getElementById('reg-password').value;
-
-            try {
-                const res = await fetch(`${API}/auth/register`, {
-                    method: 'POST',
-                    headers: { 'Content-Type': 'application/json' },
-                    body: JSON.stringify({ name, email, password })
-                });
-                const data = await res.json();
-                if (data.success) {
-                    alert('Acc created! Login now.');
-                    switchAuthMode('login');
-                } else alert(data.message);
-            } catch (e) { alert(e.message); }
-        }
-
-        function successLogin(t, u) {
-            token = t;
-            localStorage.setItem('token', t);
-            if (u) localStorage.setItem('user_email', u.email);
-            initAuth();
-        }
-
-        function logout() {
-            token = null;
-            localStorage.clear();
-            location.reload();
-        }
-
-        function initAuth() {
-            document.getElementById('auth-card').classList.add('hidden');
-            document.getElementById('generator-card').classList.remove('hidden');
-            document.getElementById('nav-user-menu').classList.remove('hidden');
-            document.getElementById('nav-email').innerText = localStorage.getItem('user_email') || 'User';
-            fetchCoins();
-        }
-
-        async function fetchCoins() {
-            try {
-                const res = await fetch(`${API}/ai/coins`, { headers: { 'Authorization': `Bearer ${token}` } });
-
-                if (res.status === 401 || res.status === 403) {
-                    logout();
-                    return;
-                }
-
-                const d = await res.json();
-
-                if (d.success && d.coins !== undefined) {
-                    document.getElementById('coin-val').innerText = d.coins;
-                } else {
-                    document.getElementById('coin-val').innerText = 'Err';
-                }
-            } catch (e) { console.error(e); }
-        }
-
-        // --- AI ---
-        async function generate() {
-            const btn = document.querySelector('button[onclick="generate()"]');
-            btn.disabled = true;
-            btn.innerHTML = `<i data-lucide="loader-2" class="spin"></i> Generating...`;
-            document.getElementById('gen-status').innerText = "AI is thinking (this takes ~10-20s)...";
-            lucide.createIcons();
-
-            const payload = {
-                projectName: document.getElementById('p-name').value,
-                projectDescription: document.getElementById('p-desc').value,
-                projectType: document.getElementById('p-type').value,
-                mode: mode,
-                includeDiagram: document.getElementById('inc-diagram').checked,
-                techStack: document.getElementById('p-tech').value.split(','),
-                keyFeatures: document.getElementById('p-features').value.split(','),
-                targetAudience: document.getElementById('p-target').value
-            };
-
-            try {
-                const res = await fetch(`${API}/ai/project-brief`, {
-                    method: 'POST',
-                    headers: {
-                        'Content-Type': 'application/json',
-                        'Authorization': `Bearer ${token}`
-                    },
-                    body: JSON.stringify(payload)
-                });
-                const data = await res.json();
-
-                if (data.success) {
-                    currentBrief = data.data;
-                    renderResult(data.data, data.metadata);
-                    if (data.coins) document.getElementById('coin-val').innerText = data.coins;
-                    document.getElementById('gen-status').innerText = `Success! ${data.metadata.processingTime}ms | ${data.metadata.inputTokens || '?'} in + ${data.metadata.outputTokens || '?'} out = ${data.metadata.tokensUsed || '?'} tokens`;
-                } else {
-                    alert(data.message);
-                    document.getElementById('gen-status').innerText = `Error: ${data.message}`;
-                }
-            } catch (e) {
-                alert('Network Error');
-            } finally {
-                btn.disabled = false;
-                btn.innerHTML = `<i data-lucide="play" size="18"></i> Generate Brief`;
-                lucide.createIcons();
-            }
-        }
-
-        async function renderResult(data, meta) {
-            document.getElementById('intro-placeholder').classList.add('hidden');
-            const container = document.getElementById('result-container');
-            container.classList.remove('hidden');
-
-            // Clear previous results manually except header/debug to reset content
-            const resultBox = container.querySelector('.result-box');
-            // We want to keep the header, so let's clear specific IDs or rebuild structure
-            // Simplified: Rebuild inner HTML of result-box to act as a blank canvas
-            document.getElementById('res-title').innerText = data.title;
-            document.getElementById('res-mode').innerText = mode.toUpperCase();
-            document.getElementById('raw-json').innerText = JSON.stringify(data, null, 2);
-
-            // Hide PDF button initially
-            const pdfBtn = document.getElementById('btn-pdf');
-            pdfBtn.style.opacity = '0';
-
-            // Clear containers
-            const overviewEl = document.getElementById('res-overview');
-            const objEl = document.getElementById('res-objectives');
-            const techEl = document.getElementById('res-tech');
-            const featEl = document.getElementById('res-features');
-            const diagSec = document.getElementById('diagram-section');
-            const diagViz = document.getElementById('mermaid-viz');
-
-            overviewEl.innerHTML = '';
-            objEl.innerHTML = '';
-            techEl.innerHTML = '';
-            featEl.innerHTML = '';
-            diagSec.classList.add('hidden');
-
-            // --- Helper to wait ---
-            const sleep = ms => new Promise(r => setTimeout(r, ms));
-            const typeText = async (element, text, speed = 5) => {
-                element.innerHTML = '';
-                // Simple fade in for long text is better than typing
-                element.style.opacity = 0;
-                element.innerHTML = text;
-                element.classList.add('fade-in');
-                element.style.opacity = 1;
-                await sleep(300);
-            };
-
-            // 1. Overview (Research uses 'abstract' instead of 'overview')
-            const overviewText = data.overview || data.abstract || 'No overview available';
-            await typeText(overviewEl, overviewText);
-            await sleep(400);
-
-            // 2. Objectives (handle both string array and object array)
-            objEl.innerHTML = '';
-            if (data.objectives && Array.isArray(data.objectives)) {
-                for (const obj of data.objectives) {
-                    const li = document.createElement('li');
-                    // Handle both string format and object format {id, objective, measurable}
-                    li.innerText = typeof obj === 'string' ? obj : (obj.objective || obj.id || JSON.stringify(obj));
-                    li.className = 'fade-in';
-                    objEl.appendChild(li);
-                    await sleep(200);
-                }
-            }
-
-            // 3. Tech Stack (App-specific, skip for research)
-            if (data.platformCategory !== 'research' && data.recommendedTechStack) {
-                techEl.innerHTML = '';
-                for (const t of data.recommendedTechStack) {
-                    const span = document.createElement('span');
-                    span.className = 'tag tech fade-in';
-                    span.title = t.reason;
-                    span.innerText = t.technology;
-                    techEl.appendChild(span);
-                    await sleep(100);
-                }
-                await sleep(300);
-            } else {
-                // Hide tech section for research
-                techEl.parentNode.style.display = data.platformCategory === 'research' ? 'none' : '';
-            }
-
-            // 4. Features (App-specific) OR Research Questions (Research-specific)
-            featEl.innerHTML = '';
-
-            if (data.platformCategory === 'research') {
-                // === RESEARCH MODE ===
-                // Research Questions
-                if (data.researchQuestions) {
-                    const rqDiv = document.createElement('div');
-                    rqDiv.className = 'fade-in';
-                    rqDiv.style.marginBottom = '1.5rem';
-                    rqDiv.innerHTML = `
-                        <h4 style="color: #a78bfa;">Research Questions</h4>
-                        <ol style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.95rem;">
-                            ${Array.isArray(data.researchQuestions)
-                            ? data.researchQuestions.map(q => typeof q === 'string' ? `<li>${q}</li>` : `<li><strong>${q.id}:</strong> ${q.question}</li>`).join('')
-                            : ''}
-                        </ol>
-                    `;
-                    featEl.appendChild(rqDiv);
-                    await sleep(300);
-                }
-
-                // Methodology
-                if (data.methodology) {
-                    const methDiv = document.createElement('div');
-                    methDiv.className = 'fade-in';
-                    methDiv.style.marginBottom = '1.5rem';
-                    methDiv.innerHTML = `
-                        <h4 style="color: #22d3ee;">Methodology</h4>
-                        <ul style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.95rem;">
-                            <li><strong>Approach:</strong> ${data.methodology.approach || 'N/A'}</li>
-                            ${data.methodology.population ? `<li><strong>Population:</strong> ${data.methodology.population}</li>` : ''}
-                            ${data.methodology.dataCollection?.methods?.length ? `<li><strong>Data Collection:</strong> ${data.methodology.dataCollection.methods.join(', ')}</li>` : ''}
-                            ${data.methodology.dataAnalysis?.techniques?.length ? `<li><strong>Analysis:</strong> ${data.methodology.dataAnalysis.techniques.join(', ')}</li>` : ''}
-                        </ul>
-                    `;
-                    featEl.appendChild(methDiv);
-                    await sleep(300);
-                }
-
-                // Expected Outcomes
-                if (data.expectedOutcomes) {
-                    const outDiv = document.createElement('div');
-                    outDiv.className = 'fade-in';
-                    outDiv.style.marginBottom = '1.5rem';
-                    outDiv.innerHTML = `
-                        <h4 style="color: #4ade80;">Expected Outcomes</h4>
-                        <ul style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.95rem;">
-                            ${data.expectedOutcomes?.map(o => typeof o === 'string' ? `<li>${o}</li>` : `<li>${o.outcome} (${o.contribution})</li>`).join('') || '<li>N/A</li>'}
-                        </ul>
-                    `;
-                    featEl.appendChild(outDiv);
-                    await sleep(300);
-                }
-
-                // Timeline
-                if (data.timeline) {
-                    const tlDiv = document.createElement('div');
-                    tlDiv.className = 'fade-in';
-                    tlDiv.style.marginBottom = '1.5rem';
-                    tlDiv.innerHTML = `
-                        <h4 style="color: #fbbf24;">Timeline</h4>
-                        <p style="color: var(--text-muted); font-size: 0.95rem;">Duration: ${data.timeline.estimatedDuration || data.timeline.totalDuration || 'TBD'}</p>
-                        <ul style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.9rem;">
-                            ${data.timeline.phases?.map(p => typeof p === 'string' ? `<li>${p}</li>` : `<li>${p.phase}: ${p.duration}</li>`).join('') || ''}
-                        </ul>
-                    `;
-                    featEl.appendChild(tlDiv);
-                    await sleep(300);
-                }
-            } else if (data.keyFeatures) {
-                // === APP MODE (Web/Mobile) ===
-                for (const f of data.keyFeatures) {
-                    const div = document.createElement('div');
-                    div.style.background = 'rgba(255,255,255,0.05)';
-                    div.style.padding = '1rem';
-                    div.style.borderRadius = '6px';
-                    div.className = 'fade-in';
-                    div.style.marginBottom = '1rem';
-                    div.innerHTML = `
-                        <div style="display:flex; justify-content:space-between; margin-bottom: 0.3rem;">
-                            <strong style="color: #e2e8f0;">${f.name}</strong>
-                            <span class="tag ${f.priority?.toLowerCase() || 'should'}">${f.priority || 'Should'}</span>
-                        </div>
-                        <p style="font-size: 0.9rem; color: #94a3b8;">${f.description}</p>
-                    `;
-                    featEl.appendChild(div);
-                    div.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
-                    await sleep(400);
-                }
-            }
-
-            // 5. Success Criteria (Only for App projects)
-            if (data.platformCategory !== 'research') {
-                const successDiv = document.createElement('div');
-                successDiv.className = 'fade-in';
-                successDiv.style.marginBottom = '1.5rem';
-                successDiv.innerHTML = `
-                    <h4 style="color: #4ade80;">Success Criteria</h4>
-                    <ul style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.95rem;">
-                        ${data.successCriteria?.map(c => `<li><strong>${c.metric}:</strong> ${c.target}</li>`).join('') || '<li>N/A</li>'}
-                    </ul>
-                `;
-                featEl.parentNode.insertBefore(successDiv, featEl);
-                await sleep(300);
-            }
-
-            // 6. User Flow (New)
-            if (data.userFlow) {
-                const flowDiv = document.createElement('div');
-                flowDiv.className = 'fade-in';
-                flowDiv.style.marginTop = '1.5rem';
-                flowDiv.innerHTML = `
-                    <h4 style="color: #fca5a5;">User Flow</h4>
-                    <ol style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.95rem;">
-                        ${data.userFlow.steps?.map(s => `<li>${s}</li>`).join('') || ''}
-                    </ol>
-                `;
-                featEl.parentNode.appendChild(flowDiv);
-                await sleep(300);
-            }
-
-            // 7. SRS Modules (New)
-            if (data.srsModules) {
-                const srsDiv = document.createElement('div');
-                srsDiv.className = 'fade-in';
-                srsDiv.style.marginTop = '1.5rem';
-                srsDiv.innerHTML = `
-                    <h4 style="color: #f472b6;">SRS Modules</h4>
-                    ${data.srsModules?.map(m => `
-                        <div style="margin-bottom: 1rem;">
-                            <strong style="color: #e2e8f0; display:block; margin-bottom:0.3rem;">${m.moduleName}</strong>
-                            <ul style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.9rem;">
-                                ${m.requirements?.map(r => `<li>[${r.id}] ${r.userStory}</li>`).join('') || ''}
-                            </ul>
-                        </div>
-                    `).join('')}
-                `;
-                featEl.parentNode.appendChild(srsDiv);
-                await sleep(300);
-            }
-
-            // 8. Risks (New)
-            if (data.risks) {
-                const riskDiv = document.createElement('div');
-                riskDiv.className = 'fade-in';
-                riskDiv.style.marginTop = '1.5rem';
-                riskDiv.innerHTML = `
-                    <h4 style="color: #ef4444;">Risks & Mitigation</h4>
-                    <ul style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.95rem;">
-                         ${data.risks?.map(r => `<li><strong>${r.risk}</strong> (${r.type}): ${r.mitigation}</li>`).join('') || '<li>N/A</li>'}
-                    </ul>
-                `;
-                featEl.parentNode.appendChild(riskDiv);
-                await sleep(300);
-            }
-
-            // 9. Clarification Log (New)
-            if (data.clarificationLog) {
-                const logDiv = document.createElement('div');
-                logDiv.className = 'fade-in';
-                logDiv.style.marginTop = '1.5rem';
-                logDiv.style.background = 'rgba(255,255,255,0.03)';
-                logDiv.style.padding = '1rem';
-                logDiv.style.borderRadius = '8px';
-                logDiv.innerHTML = `
-                    <h4 style="color: #fbbf24; margin-bottom:0.5rem;">AI Clarification Log</h4>
-                    <ul style="padding-left: 1.2rem; color: #94a3b8; font-size: 0.9rem;">
-                         ${data.clarificationLog?.map(l => `<li><strong>${l.topic}:</strong> ${l.advice}</li>`).join('') || '<li>N/A</li>'}
-                    </ul>
-                `;
-                featEl.parentNode.appendChild(logDiv);
-                await sleep(300);
-            }
-
-            // 10. Diagram (Last because heaviest)
-            if (data.diagram) {
-                diagSec.classList.remove('hidden');
-                diagSec.scrollIntoView({ behavior: 'smooth' });
-                diagViz.innerHTML = '<div style="color:#aaa; text-align:center;"><i data-lucide="loader" class="spin"></i> Rendering Diagram...</div>';
-                lucide.createIcons();
-                await sleep(800); // Fake "rendering" time
-
-                diagViz.innerHTML = data.diagram.diagram;
-                diagViz.removeAttribute('data-processed');
-
-                try {
-                    await mermaid.init(undefined, diagViz);
-                    diagViz.className = 'mermaid fade-in';
-                } catch (e) {
-                    diagViz.innerHTML = 'Diagram syntax error';
-                }
-            } else {
-                diagSec.classList.add('hidden');
-            }
-
-            // Show PDF button
-            pdfBtn.style.opacity = '1';
-            pdfBtn.style.transition = 'opacity 0.5s';
-
-            // Re-init pdf button state
-            pdfBtn.disabled = false;
-            pdfBtn.innerHTML = `<i data-lucide="file-down" size="16"></i> Export PDF (1c)`;
-            lucide.createIcons();
-        }
-
-        async function downloadPdf() {
-            if (!currentBrief) return;
-            const btn = document.getElementById('btn-pdf');
-            btn.innerHTML = `Downloading...`;
-            btn.disabled = true;
-
-            try {
-                const res = await fetch(`${API}/pdf/brief`, {
-                    method: 'POST',
-                    headers: {
-                        'Content-Type': 'application/json',
-                        'Authorization': `Bearer ${token}`
-                    },
-                    body: JSON.stringify(currentBrief)
-                });
-
-                if (res.ok) {
-                    const blob = await res.blob();
-                    const url = window.URL.createObjectURL(blob);
-                    const a = document.createElement('a');
-                    a.href = url;
-                    a.download = `${currentBrief.title}_Brief.pdf`;
-                    document.body.appendChild(a);
-                    a.click();
-                    a.remove();
-
-                    // update coins
-                    fetchCoins();
-                } else {
-                    const txt = await res.text();
-                    alert("Error: " + txt);
-                }
-            } catch (e) { console.error(e); alert('PDF failed'); }
-            finally {
-                btn.disabled = false;
-                btn.innerHTML = `<i data-lucide="file-down" size="16"></i> Export PDF (1c)`;
-                lucide.createIcons();
-            }
-        }
-
-        async function downloadMarkdown() {
-            if (!currentBrief) return;
-            const btn = document.getElementById('btn-md');
-            btn.innerHTML = `Downloading...`;
-            btn.disabled = true;
-
-            try {
-                const res = await fetch(`${API}/markdown/brief`, {
-                    method: 'POST',
-                    headers: {
-                        'Content-Type': 'application/json',
-                        'Authorization': `Bearer ${token}`
-                    },
-                    body: JSON.stringify(currentBrief)
-                });
-
-                if (res.ok) {
-                    const blob = await res.blob();
-                    const url = window.URL.createObjectURL(blob);
-                    const a = document.createElement('a');
-                    a.href = url;
-                    a.download = `${currentBrief.title}_Brief.md`;
-                    document.body.appendChild(a);
-                    a.click();
-                    a.remove();
-
-                    // update coins
-                    fetchCoins();
-                } else {
-                    const txt = await res.text();
-                    alert("Error: " + txt);
-                }
-            } catch (e) { console.error(e); alert('Markdown export failed'); }
-            finally {
-                btn.disabled = false;
-                btn.innerHTML = `<i data-lucide="file-text" size="16"></i> Export MD (1c)`;
-                lucide.createIcons();
-            }
-        }
-
-    </script>
-
     <style>
         .spin {
             animation: spin 1s linear infinite;
diff --git a/apps/web-api/public/index.js b/apps/web-api/public/index.js
new file mode 100644
index 0000000..e7492e1
--- /dev/null
+++ b/apps/web-api/public/index.js
@@ -0,0 +1,531 @@
+lucide.createIcons();
+const API = '/api';
+let token = localStorage.getItem('token');
+let currentBrief = null;
+let mode = 'professional';
+
+// --- Init ---
+if (token) initAuth();
+
+function switchAuthMode(m) {
+    document.getElementById('form-login').classList.toggle('hidden', m !== 'login');
+    document.getElementById('form-register').classList.toggle('hidden', m !== 'register');
+    document.getElementById('tab-login').classList.toggle('active', m === 'login');
+    document.getElementById('tab-register').classList.toggle('active', m === 'register');
+}
+
+function setMode(m) {
+    mode = m;
+    document.getElementById('opt-professional').classList.toggle('active', m === 'professional');
+    document.getElementById('opt-formal').classList.toggle('active', m === 'formal');
+    document.getElementById('opt-concise').classList.toggle('active', m === 'concise');
+
+    const modeTag = document.getElementById('res-mode');
+    if (modeTag) {
+        modeTag.innerText = m.toUpperCase();
+    }
+}
+
+document.addEventListener('DOMContentLoaded', () => {
+    // Set mode default
+    setMode('professional');
+});
+
+// --- AUTH ---
+async function login() {
+    const email = document.getElementById('login-email').value;
+    const password = document.getElementById('login-password').value;
+    if (!email || !password) return alert('Fill info plx');
+
+    try {
+        const res = await fetch(`${API}/auth/login`, {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ email, password })
+        });
+        const data = await res.json();
+
+        // Retrieve token from nested data structure
+        const token = data.data?.token || data.token;
+        const user = data.data?.user || data.user;
+
+        if (token) successLogin(token, user);
+        else alert(data.message || 'Login failed');
+    } catch (e) { alert(e.message); }
+}
+
+async function register() {
+    const name = document.getElementById('reg-name').value;
+    const email = document.getElementById('reg-email').value;
+    const password = document.getElementById('reg-password').value;
+
+    try {
+        const res = await fetch(`${API}/auth/register`, {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ name, email, password })
+        });
+        const data = await res.json();
+        if (data.success) {
+            alert('Acc created! Login now.');
+            switchAuthMode('login');
+        } else alert(data.message);
+    } catch (e) { alert(e.message); }
+}
+
+function successLogin(t, u) {
+    token = t;
+    localStorage.setItem('token', t);
+    if (u) localStorage.setItem('user_email', u.email);
+    initAuth();
+}
+
+function logout() {
+    token = null;
+    localStorage.clear();
+    location.reload();
+}
+
+function initAuth() {
+    document.getElementById('auth-card').classList.add('hidden');
+    document.getElementById('generator-card').classList.remove('hidden');
+    document.getElementById('nav-user-menu').classList.remove('hidden');
+    document.getElementById('nav-email').innerText = localStorage.getItem('user_email') || 'User';
+    fetchCoins();
+}
+
+async function fetchCoins() {
+    try {
+        const res = await fetch(`${API}/ai/coins`, { headers: { 'Authorization': `Bearer ${token}` } });
+
+        if (res.status === 401 || res.status === 403) {
+            logout();
+            return;
+        }
+
+        const d = await res.json();
+
+        if (d.success && d.coins !== undefined) {
+            document.getElementById('coin-val').innerText = d.coins;
+        } else {
+            document.getElementById('coin-val').innerText = 'Err';
+        }
+    } catch (e) { console.error(e); }
+}
+
+// --- AI ---
+async function generate() {
+    const btn = document.querySelector('button[onclick="generate()"]');
+    btn.disabled = true;
+    btn.innerHTML = `<i data-lucide="loader-2" class="spin"></i> Generating...`;
+    document.getElementById('gen-status').innerText = "AI is thinking (this takes ~10-20s)...";
+    lucide.createIcons();
+
+    const payload = {
+        projectName: document.getElementById('p-name').value,
+        projectDescription: document.getElementById('p-desc').value,
+        projectType: document.getElementById('p-type').value,
+        mode: mode,
+        includeDiagram: document.getElementById('inc-diagram').checked,
+        techStack: document.getElementById('p-tech').value.split(','),
+        keyFeatures: document.getElementById('p-features').value.split(','),
+        targetAudience: document.getElementById('p-target').value
+    };
+
+    try {
+        const res = await fetch(`${API}/ai/project-brief`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+                'Authorization': `Bearer ${token}`
+            },
+            body: JSON.stringify(payload)
+        });
+        const data = await res.json();
+
+        if (data.success) {
+            currentBrief = data.data;
+            renderResult(data.data, data.metadata);
+            if (data.coins) document.getElementById('coin-val').innerText = data.coins;
+            document.getElementById('gen-status').innerText = `Success! ${data.metadata.processingTime}ms | ${data.metadata.inputTokens || '?'} in + ${data.metadata.outputTokens || '?'} out = ${data.metadata.tokensUsed || '?'} tokens`;
+        } else {
+            alert(data.message);
+            document.getElementById('gen-status').innerText = `Error: ${data.message}`;
+        }
+    } catch (e) {
+        alert('Network Error');
+    } finally {
+        btn.disabled = false;
+        btn.innerHTML = `<i data-lucide="play" size="18"></i> Generate Brief`;
+        lucide.createIcons();
+    }
+}
+
+async function renderResult(data, meta) {
+    document.getElementById('intro-placeholder').classList.add('hidden');
+    const container = document.getElementById('result-container');
+    container.classList.remove('hidden');
+
+    // Clear previous results manually except header/debug to reset content
+    const resultBox = container.querySelector('.result-box');
+    // We want to keep the header, so let's clear specific IDs or rebuild structure
+    // Simplified: Rebuild inner HTML of result-box to act as a blank canvas
+    document.getElementById('res-title').innerText = data.title;
+    document.getElementById('res-mode').innerText = mode.toUpperCase();
+    document.getElementById('raw-json').innerText = JSON.stringify(data, null, 2);
+
+    // Hide PDF button initially
+    const pdfBtn = document.getElementById('btn-pdf');
+    pdfBtn.style.opacity = '0';
+
+    // Clear containers
+    const overviewEl = document.getElementById('res-overview');
+    const objEl = document.getElementById('res-objectives');
+    const techEl = document.getElementById('res-tech');
+    const featEl = document.getElementById('res-features');
+    const diagSec = document.getElementById('diagram-section');
+    const diagViz = document.getElementById('mermaid-viz');
+
+    overviewEl.innerHTML = '';
+    objEl.innerHTML = '';
+    techEl.innerHTML = '';
+    featEl.innerHTML = '';
+    diagSec.classList.add('hidden');
+
+    // --- Helper to wait ---
+    const sleep = ms => new Promise(r => setTimeout(r, ms));
+    const typeText = async (element, text, speed = 5) => {
+        element.innerHTML = '';
+        // Simple fade in for long text is better than typing
+        element.style.opacity = 0;
+        element.innerHTML = text;
+        element.classList.add('fade-in');
+        element.style.opacity = 1;
+        await sleep(300);
+    };
+
+    // 1. Overview (Research uses 'abstract' instead of 'overview')
+    const overviewText = data.overview || data.abstract || 'No overview available';
+    await typeText(overviewEl, overviewText);
+    await sleep(400);
+
+    // 2. Objectives (handle both string array and object array)
+    objEl.innerHTML = '';
+    if (data.objectives && Array.isArray(data.objectives)) {
+        for (const obj of data.objectives) {
+            const li = document.createElement('li');
+            // Handle both string format and object format {id, objective, measurable}
+            li.innerText = typeof obj === 'string' ? obj : (obj.objective || obj.id || JSON.stringify(obj));
+            li.className = 'fade-in';
+            objEl.appendChild(li);
+            await sleep(200);
+        }
+    }
+
+    // 3. Tech Stack (App-specific, skip for research)
+    if (data.platformCategory !== 'research' && data.recommendedTechStack) {
+        techEl.innerHTML = '';
+        for (const t of data.recommendedTechStack) {
+            const span = document.createElement('span');
+            span.className = 'tag tech fade-in';
+            span.title = t.reason;
+            span.innerText = t.technology;
+            techEl.appendChild(span);
+            await sleep(100);
+        }
+        await sleep(300);
+    } else {
+        // Hide tech section for research
+        techEl.parentNode.style.display = data.platformCategory === 'research' ? 'none' : '';
+    }
+
+    // 4. Features (App-specific) OR Research Questions (Research-specific)
+    featEl.innerHTML = '';
+
+    if (data.platformCategory === 'research') {
+        // === RESEARCH MODE ===
+        // Research Questions
+        if (data.researchQuestions) {
+            const rqDiv = document.createElement('div');
+            rqDiv.className = 'fade-in';
+            rqDiv.style.marginBottom = '1.5rem';
+            rqDiv.innerHTML = `
+                        <h4 style="color: #a78bfa;">Research Questions</h4>
+                        <ol style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.95rem;">
+                            ${Array.isArray(data.researchQuestions)
+                    ? data.researchQuestions.map(q => typeof q === 'string' ? `<li>${q}</li>` : `<li><strong>${q.id}:</strong> ${q.question}</li>`).join('')
+                    : ''}
+                        </ol>
+                    `;
+            featEl.appendChild(rqDiv);
+            await sleep(300);
+        }
+
+        // Methodology
+        if (data.methodology) {
+            const methDiv = document.createElement('div');
+            methDiv.className = 'fade-in';
+            methDiv.style.marginBottom = '1.5rem';
+            methDiv.innerHTML = `
+                        <h4 style="color: #22d3ee;">Methodology</h4>
+                        <ul style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.95rem;">
+                            <li><strong>Approach:</strong> ${data.methodology.approach || 'N/A'}</li>
+                            ${data.methodology.population ? `<li><strong>Population:</strong> ${data.methodology.population}</li>` : ''}
+                            ${data.methodology.dataCollection?.methods?.length ? `<li><strong>Data Collection:</strong> ${data.methodology.dataCollection.methods.join(', ')}</li>` : ''}
+                            ${data.methodology.dataAnalysis?.techniques?.length ? `<li><strong>Analysis:</strong> ${data.methodology.dataAnalysis.techniques.join(', ')}</li>` : ''}
+                        </ul>
+                    `;
+            featEl.appendChild(methDiv);
+            await sleep(300);
+        }
+
+        // Expected Outcomes
+        if (data.expectedOutcomes) {
+            const outDiv = document.createElement('div');
+            outDiv.className = 'fade-in';
+            outDiv.style.marginBottom = '1.5rem';
+            outDiv.innerHTML = `
+                        <h4 style="color: #4ade80;">Expected Outcomes</h4>
+                        <ul style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.95rem;">
+                            ${data.expectedOutcomes?.map(o => typeof o === 'string' ? `<li>${o}</li>` : `<li>${o.outcome} (${o.contribution})</li>`).join('') || '<li>N/A</li>'}
+                        </ul>
+                    `;
+            featEl.appendChild(outDiv);
+            await sleep(300);
+        }
+
+        // Timeline
+        if (data.timeline) {
+            const tlDiv = document.createElement('div');
+            tlDiv.className = 'fade-in';
+            tlDiv.style.marginBottom = '1.5rem';
+            tlDiv.innerHTML = `
+                        <h4 style="color: #fbbf24;">Timeline</h4>
+                        <p style="color: var(--text-muted); font-size: 0.95rem;">Duration: ${data.timeline.estimatedDuration || data.timeline.totalDuration || 'TBD'}</p>
+                        <ul style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.9rem;">
+                            ${data.timeline.phases?.map(p => typeof p === 'string' ? `<li>${p}</li>` : `<li>${p.phase}: ${p.duration}</li>`).join('') || ''}
+                        </ul>
+                    `;
+            featEl.appendChild(tlDiv);
+            await sleep(300);
+        }
+    } else if (data.keyFeatures) {
+        // === APP MODE (Web/Mobile) ===
+        for (const f of data.keyFeatures) {
+            const div = document.createElement('div');
+            div.style.background = 'rgba(255,255,255,0.05)';
+            div.style.padding = '1rem';
+            div.style.borderRadius = '6px';
+            div.className = 'fade-in';
+            div.style.marginBottom = '1rem';
+            div.innerHTML = `
+                        <div style="display:flex; justify-content:space-between; margin-bottom: 0.3rem;">
+                            <strong style="color: #e2e8f0;">${f.name}</strong>
+                            <span class="tag ${f.priority?.toLowerCase() || 'should'}">${f.priority || 'Should'}</span>
+                        </div>
+                        <p style="font-size: 0.9rem; color: #94a3b8;">${f.description}</p>
+                    `;
+            featEl.appendChild(div);
+            div.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
+            await sleep(400);
+        }
+    }
+
+    // 5. Success Criteria (Only for App projects)
+    if (data.platformCategory !== 'research') {
+        const successDiv = document.createElement('div');
+        successDiv.className = 'fade-in';
+        successDiv.style.marginBottom = '1.5rem';
+        successDiv.innerHTML = `
+                    <h4 style="color: #4ade80;">Success Criteria</h4>
+                    <ul style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.95rem;">
+                        ${data.successCriteria?.map(c => `<li><strong>${c.metric}:</strong> ${c.target}</li>`).join('') || '<li>N/A</li>'}
+                    </ul>
+                `;
+        featEl.parentNode.insertBefore(successDiv, featEl);
+        await sleep(300);
+    }
+
+    // 6. User Flow (New)
+    if (data.userFlow) {
+        const flowDiv = document.createElement('div');
+        flowDiv.className = 'fade-in';
+        flowDiv.style.marginTop = '1.5rem';
+        flowDiv.innerHTML = `
+                    <h4 style="color: #fca5a5;">User Flow</h4>
+                    <ol style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.95rem;">
+                        ${data.userFlow.steps?.map(s => `<li>${s}</li>`).join('') || ''}
+                    </ol>
+                `;
+        featEl.parentNode.appendChild(flowDiv);
+        await sleep(300);
+    }
+
+    // 7. SRS Modules (New)
+    if (data.srsModules) {
+        const srsDiv = document.createElement('div');
+        srsDiv.className = 'fade-in';
+        srsDiv.style.marginTop = '1.5rem';
+        srsDiv.innerHTML = `
+                    <h4 style="color: #f472b6;">SRS Modules</h4>
+                    ${data.srsModules?.map(m => `
+                        <div style="margin-bottom: 1rem;">
+                            <strong style="color: #e2e8f0; display:block; margin-bottom:0.3rem;">${m.moduleName}</strong>
+                            <ul style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.9rem;">
+                                ${m.requirements?.map(r => `<li>[${r.id}] ${r.userStory}</li>`).join('') || ''}
+                            </ul>
+                        </div>
+                    `).join('')}
+                `;
+        featEl.parentNode.appendChild(srsDiv);
+        await sleep(300);
+    }
+
+    // 8. Risks (New)
+    if (data.risks) {
+        const riskDiv = document.createElement('div');
+        riskDiv.className = 'fade-in';
+        riskDiv.style.marginTop = '1.5rem';
+        riskDiv.innerHTML = `
+                    <h4 style="color: #ef4444;">Risks & Mitigation</h4>
+                    <ul style="padding-left: 1.2rem; color: var(--text-muted); font-size: 0.95rem;">
+                         ${data.risks?.map(r => `<li><strong>${r.risk}</strong> (${r.type}): ${r.mitigation}</li>`).join('') || '<li>N/A</li>'}
+                    </ul>
+                `;
+        featEl.parentNode.appendChild(riskDiv);
+        await sleep(300);
+    }
+
+    // 9. Clarification Log (New)
+    if (data.clarificationLog) {
+        const logDiv = document.createElement('div');
+        logDiv.className = 'fade-in';
+        logDiv.style.marginTop = '1.5rem';
+        logDiv.style.background = 'rgba(255,255,255,0.03)';
+        logDiv.style.padding = '1rem';
+        logDiv.style.borderRadius = '8px';
+        logDiv.innerHTML = `
+                    <h4 style="color: #fbbf24; margin-bottom:0.5rem;">AI Clarification Log</h4>
+                    <ul style="padding-left: 1.2rem; color: #94a3b8; font-size: 0.9rem;">
+                         ${data.clarificationLog?.map(l => `<li><strong>${l.topic}:</strong> ${l.advice}</li>`).join('') || '<li>N/A</li>'}
+                    </ul>
+                `;
+        featEl.parentNode.appendChild(logDiv);
+        await sleep(300);
+    }
+
+    // 10. Diagram (Last because heaviest)
+    if (data.diagram) {
+        diagSec.classList.remove('hidden');
+        diagSec.scrollIntoView({ behavior: 'smooth' });
+        diagViz.innerHTML = '<div style="color:#aaa; text-align:center;"><i data-lucide="loader" class="spin"></i> Rendering Diagram...</div>';
+        lucide.createIcons();
+        await sleep(800); // Fake "rendering" time
+
+        diagViz.innerHTML = data.diagram.diagram;
+        diagViz.removeAttribute('data-processed');
+
+        try {
+            await mermaid.init(undefined, diagViz);
+            diagViz.className = 'mermaid fade-in';
+        } catch (e) {
+            diagViz.innerHTML = 'Diagram syntax error';
+        }
+    } else {
+        diagSec.classList.add('hidden');
+    }
+
+    // Show PDF button
+    pdfBtn.style.opacity = '1';
+    pdfBtn.style.transition = 'opacity 0.5s';
+
+    // Re-init pdf button state
+    pdfBtn.disabled = false;
+    pdfBtn.innerHTML = `<i data-lucide="file-down" size="16"></i> Export PDF (1c)`;
+    lucide.createIcons();
+}
+
+async function downloadPdf() {
+    if (!currentBrief) return;
+    const btn = document.getElementById('btn-pdf');
+    btn.innerHTML = `Downloading...`;
+    btn.disabled = true;
+
+    try {
+        const res = await fetch(`${API}/pdf/brief`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+                'Authorization': `Bearer ${token}`
+            },
+            body: JSON.stringify(currentBrief)
+        });
+
+        if (res.ok) {
+            const blob = await res.blob();
+            const url = window.URL.createObjectURL(blob);
+            const a = document.createElement('a');
+            a.href = url;
+            a.download = `${currentBrief.title}_Brief.pdf`;
+            document.body.appendChild(a);
+            a.click();
+            a.remove();
+
+            // update coins
+            fetchCoins();
+        } else {
+            const txt = await res.text();
+            alert("Error: " + txt);
+        }
+    } catch (e) { console.error(e); alert('PDF failed'); }
+    finally {
+        btn.disabled = false;
+        btn.innerHTML = `<i data-lucide="file-down" size="16"></i> Export PDF (1c)`;
+        lucide.createIcons();
+    }
+}
+
+async function downloadMarkdown() {
+    if (!currentBrief) return;
+    const btn = document.getElementById('btn-md');
+    btn.innerHTML = `Downloading...`;
+    btn.disabled = true;
+
+    try {
+        const res = await fetch(`${API}/markdown/brief`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+                'Authorization': `Bearer ${token}`
+            },
+            body: JSON.stringify(currentBrief)
+        });
+
+        if (res.ok) {
+            const blob = await res.blob();
+            const url = window.URL.createObjectURL(blob);
+            const a = document.createElement('a');
+            a.href = url;
+            a.download = `${currentBrief.title}_Brief.md`;
+            document.body.appendChild(a);
+            a.click();
+            a.remove();
+
+            // update coins
+            fetchCoins();
+        } else {
+            const txt = await res.text();
+            alert("Error: " + txt);
+        }
+    } catch (e) { console.error(e); alert('Markdown export failed'); }
+    finally {
+        btn.disabled = false;
+        btn.innerHTML = `<i data-lucide="file-text" size="16"></i> Export MD (1c)`;
+        lucide.createIcons();
+    }
+}
+
+export {
+    switchAuthMode, setMode, login, register, successLogin, logout, initAuth, fetchCoins,
+    generate, renderResult, downloadPdf, downloadMarkdown
+};
\ No newline at end of file
diff --git a/apps/web-api/src/app.ts b/apps/web-api/src/app.ts
index 4792267..92efb96 100644
--- a/apps/web-api/src/app.ts
+++ b/apps/web-api/src/app.ts
@@ -6,6 +6,8 @@ import authRoute from "./routes/auth.route";
 import aiRoute from "./routes/ai.route";
 import pdfRoute from "./routes/pdf.route";
 import markdownRoute from "./routes/markdown.route";
+import projectsRoute from "./routes/projects.route";
+import historyRoute from "./routes/history.route";
 import { errorHandler } from "./middlewares/error.middleware";
 
 const app: Express = express();
@@ -32,6 +34,8 @@ app.use("/api/auth", authRoute);
 app.use("/api/ai", aiRoute);
 app.use("/api/pdf", pdfRoute);
 app.use("/api/markdown", markdownRoute);
+app.use("/api/projects", projectsRoute);
+app.use("/api/history", historyRoute);
 
 // Error handler (must be last)
 app.use(errorHandler);
diff --git a/apps/web-api/src/controllers/ai.controller.ts b/apps/web-api/src/controllers/ai.controller.ts
index 1b77e33..6d982e0 100644
--- a/apps/web-api/src/controllers/ai.controller.ts
+++ b/apps/web-api/src/controllers/ai.controller.ts
@@ -9,6 +9,7 @@ import { Request, Response } from "express";
 import { asyncHandler } from "../utils/async-handler";
 import { aiService, ProjectBriefInput, DiagramInput } from "../services/ai";
 import { coinService, COIN_COSTS } from "../services/coin";
+import { historyService } from "../services/history/history.service";
 import { ErrorCodes } from "../utils/app-error";
 
 // AI-specific error codes
@@ -91,6 +92,19 @@ export const aiController = {
             // Get coin balance for display (not deducting)
             const coins = await coinService.getBalance(userId);
 
+            // Log activity (non-blocking)
+            historyService.logActivity({
+                userId,
+                action: "generate_brief",
+                coinsUsed: 0,
+                metadata: {
+                    projectTitle: briefData?.title || projectName,
+                    projectType: projectType || "webapp",
+                    documentStyle: documentStyle || "professional",
+                    diagramIncluded: !!diagramData,
+                },
+            });
+
             return res.status(200).json({
                 success: true,
                 message: "Project brief generated successfully",
diff --git a/apps/web-api/src/controllers/history.controller.ts b/apps/web-api/src/controllers/history.controller.ts
new file mode 100644
index 0000000..acc8bf7
--- /dev/null
+++ b/apps/web-api/src/controllers/history.controller.ts
@@ -0,0 +1,46 @@
+/**
+ * ============================================
+ * HISTORY CONTROLLER
+ * Handles activity history retrieval
+ * ============================================
+ */
+
+import { Request, Response } from "express";
+import { asyncHandler } from "../utils/async-handler";
+import { historyService } from "../services/history/history.service";
+import { ErrorCodes } from "../utils/app-error";
+
+export const historyController = {
+    /**
+     * Get user's activity history
+     * @route GET /api/history
+     * @query limit (default 20, max 100)
+     * @query offset (default 0)
+     */
+    getHistory: asyncHandler(async (req: Request, res: Response): Promise<any> => {
+        const userId = (req as any).user?.userId;
+
+        if (!userId) {
+            return res.status(401).json({
+                success: false,
+                message: "Unauthorized",
+                code: ErrorCodes.TOKEN_MISSING,
+            });
+        }
+
+        const limit = Math.min(parseInt(req.query.limit as string) || 20, 100);
+        const offset = parseInt(req.query.offset as string) || 0;
+
+        const result = await historyService.getHistory(userId, limit, offset);
+
+        return res.json({
+            success: true,
+            data: result.logs,
+            pagination: {
+                total: result.total,
+                limit: result.limit,
+                offset: result.offset,
+            },
+        });
+    }),
+};
diff --git a/apps/web-api/src/controllers/markdown.controller.ts b/apps/web-api/src/controllers/markdown.controller.ts
index a97bedb..7b3a3e5 100644
--- a/apps/web-api/src/controllers/markdown.controller.ts
+++ b/apps/web-api/src/controllers/markdown.controller.ts
@@ -10,6 +10,7 @@ import { asyncHandler } from "../utils/async-handler";
 import { markdownService } from "../services/markdown/markdown.service";
 import { ProjectBriefOutput } from "../services/ai/types";
 import { coinService, COIN_COSTS } from "../services/coin";
+import { historyService } from "../services/history/history.service";
 import { ErrorCodes } from "../utils/app-error";
 
 export const markdownController = {
@@ -50,6 +51,16 @@ export const markdownController = {
             // Deduct coins
             await coinService.deduct(userId, cost);
 
+            // Log activity (non-blocking)
+            historyService.logActivity({
+                userId,
+                action: "export_markdown",
+                coinsUsed: cost,
+                metadata: {
+                    projectTitle: brief.title,
+                },
+            });
+
             // Send as downloadable .md file
             const filename = `${brief.title.replace(/[^a-z0-9]/gi, '_').toLowerCase()}_brief.md`;
             const newBalance = await coinService.getBalance(userId);
diff --git a/apps/web-api/src/controllers/pdf.controller.ts b/apps/web-api/src/controllers/pdf.controller.ts
index 9c5f906..97da7c6 100644
--- a/apps/web-api/src/controllers/pdf.controller.ts
+++ b/apps/web-api/src/controllers/pdf.controller.ts
@@ -10,6 +10,7 @@ import { asyncHandler } from "../utils/async-handler";
 import { pdfService } from "../services/pdf/pdf.service";
 import { ProjectBriefOutput } from "../services/ai/types";
 import { coinService, COIN_COSTS } from "../services/coin";
+import { historyService } from "../services/history/history.service";
 import { ErrorCodes } from "../utils/app-error";
 
 /**
@@ -488,6 +489,16 @@ export const pdfController = {
             // Deduct coins
             await coinService.deduct(userId, cost);
 
+            // Log activity (non-blocking)
+            historyService.logActivity({
+                userId,
+                action: "export_pdf",
+                coinsUsed: cost,
+                metadata: {
+                    projectTitle: brief.title,
+                },
+            });
+
             // Send response
             res.setHeader("Content-Type", "application/pdf");
             res.setHeader("Content-Disposition", `attachment; filename="${brief.title.replace(/[^a-z0-9]/gi, '_').toLowerCase()}_brief.pdf"`);
diff --git a/apps/web-api/src/controllers/projects.controller.ts b/apps/web-api/src/controllers/projects.controller.ts
new file mode 100644
index 0000000..625366a
--- /dev/null
+++ b/apps/web-api/src/controllers/projects.controller.ts
@@ -0,0 +1,180 @@
+/**
+ * ============================================
+ * PROJECTS CONTROLLER
+ * Handles project CRUD + auto-save
+ * ============================================
+ */
+
+import { Request, Response } from "express";
+import { asyncHandler } from "../utils/async-handler";
+import { projectService } from "../services/project/project.service";
+import { ErrorCodes } from "../utils/app-error";
+
+export const projectsController = {
+    /**
+     * List user's projects
+     * @route GET /api/projects
+     */
+    getProjects: asyncHandler(async (req: Request, res: Response): Promise<any> => {
+        const userId = (req as any).user?.userId;
+
+        if (!userId) {
+            return res.status(401).json({
+                success: false,
+                message: "Unauthorized",
+                code: ErrorCodes.TOKEN_MISSING,
+            });
+        }
+
+        const projects = await projectService.getProjects(userId);
+
+        return res.json({
+            success: true,
+            data: projects,
+        });
+    }),
+
+    /**
+     * Get project detail
+     * @route GET /api/projects/:id
+     */
+    getProject: asyncHandler(async (req: Request, res: Response): Promise<any> => {
+        const userId = (req as any).user?.userId;
+        const { id } = req.params;
+
+        if (!userId) {
+            return res.status(401).json({
+                success: false,
+                message: "Unauthorized",
+                code: ErrorCodes.TOKEN_MISSING,
+            });
+        }
+
+        const project = await projectService.getProjectById(userId, id);
+
+        if (!project) {
+            return res.status(404).json({
+                success: false,
+                message: "Project not found",
+                code: ErrorCodes.NOT_FOUND,
+            });
+        }
+
+        return res.json({
+            success: true,
+            data: project,
+        });
+    }),
+
+    /**
+     * Create new project
+     * @route POST /api/projects
+     */
+    createProject: asyncHandler(async (req: Request, res: Response): Promise<any> => {
+        const userId = (req as any).user?.userId;
+
+        if (!userId) {
+            return res.status(401).json({
+                success: false,
+                message: "Unauthorized",
+                code: ErrorCodes.TOKEN_MISSING,
+            });
+        }
+
+        const { title, description, projectType, documentStyle, formData, currentStep } = req.body;
+
+        if (!title) {
+            return res.status(400).json({
+                success: false,
+                message: "Title is required",
+                code: ErrorCodes.VALIDATION_ERROR,
+            });
+        }
+
+        const project = await projectService.createProject({
+            userId,
+            title,
+            description,
+            projectType,
+            documentStyle,
+            formData,
+            currentStep,
+        });
+
+        return res.status(201).json({
+            success: true,
+            message: "Project created",
+            data: project,
+        });
+    }),
+
+    /**
+     * Update project (auto-save)
+     * @route PUT /api/projects/:id
+     */
+    updateProject: asyncHandler(async (req: Request, res: Response): Promise<any> => {
+        const userId = (req as any).user?.userId;
+        const { id } = req.params;
+
+        if (!userId) {
+            return res.status(401).json({
+                success: false,
+                message: "Unauthorized",
+                code: ErrorCodes.TOKEN_MISSING,
+            });
+        }
+
+        // Check project exists and belongs to user
+        const existing = await projectService.getProjectById(userId, id);
+        if (!existing) {
+            return res.status(404).json({
+                success: false,
+                message: "Project not found",
+                code: ErrorCodes.NOT_FOUND,
+            });
+        }
+
+        const { title, description, projectType, currentStep, formData, generatedBrief, documentStyle, status } = req.body;
+
+        const updated = await projectService.updateProject(userId, id, {
+            title,
+            description,
+            projectType,
+            currentStep,
+            formData,
+            generatedBrief,
+            documentStyle,
+            status,
+        });
+
+        return res.json({
+            success: true,
+            message: "Project updated",
+            data: updated,
+        });
+    }),
+
+    /**
+     * Delete project
+     * @route DELETE /api/projects/:id
+     */
+    deleteProject: asyncHandler(async (req: Request, res: Response): Promise<any> => {
+        const userId = (req as any).user?.userId;
+        const { id } = req.params;
+
+        if (!userId) {
+            return res.status(401).json({
+                success: false,
+                message: "Unauthorized",
+                code: ErrorCodes.TOKEN_MISSING,
+            });
+        }
+
+        await projectService.deleteProject(userId, id);
+
+        return res.json({
+            success: true,
+            message: "Project deleted successfully",
+        });
+    }),
+};
diff --git a/apps/web-api/src/routes/history.route.ts b/apps/web-api/src/routes/history.route.ts
new file mode 100644
index 0000000..ba48f3c
--- /dev/null
+++ b/apps/web-api/src/routes/history.route.ts
@@ -0,0 +1,13 @@
+import { Router, type Router as ExpressRouter } from "express";
+import { historyController } from "../controllers/history.controller";
+import { authenticate } from "../middlewares/auth.middleware";
+
+const router: ExpressRouter = Router();
+
+/**
+ * GET /api/history
+ * Get user's activity history (paginated)
+ */
+router.get("/", authenticate, historyController.getHistory);
+
+export default router;
diff --git a/apps/web-api/src/routes/projects.route.ts b/apps/web-api/src/routes/projects.route.ts
new file mode 100644
index 0000000..7065b10
--- /dev/null
+++ b/apps/web-api/src/routes/projects.route.ts
@@ -0,0 +1,37 @@
+import { Router, type Router as ExpressRouter } from "express";
+import { projectsController } from "../controllers/projects.controller";
+import { authenticate } from "../middlewares/auth.middleware";
+
+const router: ExpressRouter = Router();
+
+/**
+ * GET /api/projects
+ * List user's projects
+ */
+router.get("/", authenticate, projectsController.getProjects);
+
+/**
+ * GET /api/projects/:id
+ * Get project detail
+ */
+router.get("/:id", authenticate, projectsController.getProject);
+
+/**
+ * POST /api/projects
+ * Create new project
+ */
+router.post("/", authenticate, projectsController.createProject);
+
+/**
+ * PUT /api/projects/:id
+ * Update project (auto-save)
+ */
+router.put("/:id", authenticate, projectsController.updateProject);
+
+/**
+ * DELETE /api/projects/:id
+ * Delete project
+ */
+router.delete("/:id", authenticate, projectsController.deleteProject);
+
+export default router;
diff --git a/apps/web-api/src/services/history/history.service.ts b/apps/web-api/src/services/history/history.service.ts
new file mode 100644
index 0000000..10224e7
--- /dev/null
+++ b/apps/web-api/src/services/history/history.service.ts
@@ -0,0 +1,61 @@
+/**
+ * ============================================
+ * HISTORY SERVICE
+ * Activity logging and retrieval via Supabase
+ * ============================================
+ */
+
+import { supabase } from "../../config/supabase";
+
+export type ActivityAction = "generate_brief" | "export_pdf" | "export_markdown";
+
+export interface LogActivityInput {
+    userId: string;
+    projectId?: string | null;
+    action: ActivityAction;
+    coinsUsed: number;
+    metadata?: Record<string, any>;
+}
+
+export const historyService = {
+    /**
+     * Log an activity
+     */
+    async logActivity(input: LogActivityInput) {
+        const { error } = await supabase
+            .from("activity_logs")
+            .insert({
+                user_id: input.userId,
+                project_id: input.projectId || null,
+                action: input.action,
+                coins_used: input.coinsUsed,
+                metadata: input.metadata || {},
+            });
+
+        if (error) {
+            console.error("Failed to log activity:", error.message);
+            // Non-blocking: don't throw, just log
+        }
+    },
+
+    /**
+     * Get user's activity history (paginated)
+     */
+    async getHistory(userId: string, limit: number = 20, offset: number = 0) {
+        const { data, error, count } = await supabase
+            .from("activity_logs")
+            .select("*", { count: "exact" })
+            .eq("user_id", userId)
+            .order("created_at", { ascending: false })
+            .range(offset, offset + limit - 1);
+
+        if (error) throw error;
+
+        return {
+            logs: data || [],
+            total: count || 0,
+            limit,
+            offset,
+        };
+    },
+};
diff --git a/apps/web-api/src/services/project/project.service.ts b/apps/web-api/src/services/project/project.service.ts
new file mode 100644
index 0000000..cc0490a
--- /dev/null
+++ b/apps/web-api/src/services/project/project.service.ts
@@ -0,0 +1,124 @@
+/**
+ * ============================================
+ * PROJECT SERVICE
+ * CRUD operations for projects table via Supabase
+ * ============================================
+ */
+
+import { supabase } from "../../config/supabase";
+
+export interface CreateProjectInput {
+    userId: string;
+    title: string;
+    description?: string;
+    projectType?: string;
+    documentStyle?: string;
+    formData?: Record<string, any>;
+    currentStep?: number;
+}
+
+export interface UpdateProjectInput {
+    title?: string;
+    description?: string;
+    projectType?: string;
+    currentStep?: number;
+    formData?: Record<string, any>;
+    generatedBrief?: Record<string, any> | null;
+    documentStyle?: string;
+    status?: string;
+}
+
+export const projectService = {
+    /**
+     * Get all projects for a user (summary list)
+     */
+    async getProjects(userId: string) {
+        const { data, error } = await supabase
+            .from("projects")
+            .select("id, title, description, project_type, current_step, document_style, status, created_at, updated_at")
+            .eq("user_id", userId)
+            .order("updated_at", { ascending: false });
+
+        if (error) throw error;
+        return data || [];
+    },
+
+    /**
+     * Get single project by ID (full detail)
+     */
+    async getProjectById(userId: string, projectId: string) {
+        const { data, error } = await supabase
+            .from("projects")
+            .select("*")
+            .eq("id", projectId)
+            .eq("user_id", userId)
+            .single();
+
+        if (error) return null;
+        return data;
+    },
+
+    /**
+     * Create a new project
+     */
+    async createProject(input: CreateProjectInput) {
+        const { data, error } = await supabase
+            .from("projects")
+            .insert({
+                user_id: input.userId,
+                title: input.title,
+                description: input.description || "",
+                project_type: input.projectType || "webapp",
+                document_style: input.documentStyle || "professional",
+                form_data: input.formData || {},
+                current_step: input.currentStep || 1,
+                status: "draft",
+            })
+            .select()
+            .single();
+
+        if (error) throw error;
+        return data;
+    },
+
+    /**
+     * Update project (auto-save)
+     */
+    async updateProject(userId: string, projectId: string, input: UpdateProjectInput) {
+        const updateData: Record<string, any> = {};
+
+        if (input.title !== undefined) updateData.title = input.title;
+        if (input.description !== undefined) updateData.description = input.description;
+        if (input.projectType !== undefined) updateData.project_type = input.projectType;
+        if (input.currentStep !== undefined) updateData.current_step = input.currentStep;
+        if (input.formData !== undefined) updateData.form_data = input.formData;
+        if (input.generatedBrief !== undefined) updateData.generated_brief = input.generatedBrief;
+        if (input.documentStyle !== undefined) updateData.document_style = input.documentStyle;
+        if (input.status !== undefined) updateData.status = input.status;
+
+        const { data, error } = await supabase
+            .from("projects")
+            .update(updateData)
+            .eq("id", projectId)
+            .eq("user_id", userId)
+            .select()
+            .single();
+
+        if (error) throw error;
+        return data;
+    },
+
+    /**
+     * Delete a project
+     */
+    async deleteProject(userId: string, projectId: string) {
+        const { error } = await supabase
+            .from("projects")
+            .delete()
+            .eq("id", projectId)
+            .eq("user_id", userId);
+
+        if (error) throw error;
+        return true;
+    },
+};
diff --git a/apps/web-api/supabase/migration.sql b/apps/web-api/supabase/migration.sql
new file mode 100644
index 0000000..9cf9caa
--- /dev/null
+++ b/apps/web-api/supabase/migration.sql
@@ -0,0 +1,84 @@
+-- ============================================
+-- PLANIFY DATABASE SCHEMA
+-- Run this in Supabase SQL Editor
+-- ============================================
+
+-- 1. Projects Table
+-- Stores user's projects with form state for auto-save/resume
+CREATE TABLE IF NOT EXISTS projects (
+    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+    user_id UUID NOT NULL REFERENCES auth.users(id) ON DELETE CASCADE,
+    title TEXT NOT NULL DEFAULT 'Untitled Project',
+    description TEXT DEFAULT '',
+    project_type TEXT NOT NULL DEFAULT 'webapp',
+    current_step INT NOT NULL DEFAULT 1,
+    form_data JSONB DEFAULT '{}',
+    generated_brief JSONB DEFAULT NULL,
+    document_style TEXT NOT NULL DEFAULT 'professional',
+    status TEXT NOT NULL DEFAULT 'draft',
+    created_at TIMESTAMPTZ NOT NULL DEFAULT now(),
+    updated_at TIMESTAMPTZ NOT NULL DEFAULT now()
+);
+
+-- Index for fast user lookups
+CREATE INDEX IF NOT EXISTS idx_projects_user_id ON projects(user_id);
+CREATE INDEX IF NOT EXISTS idx_projects_updated_at ON projects(updated_at DESC);
+
+-- 2. Activity Logs Table
+-- Stores timeline of user activity (for History page)
+CREATE TABLE IF NOT EXISTS activity_logs (
+    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+    user_id UUID NOT NULL REFERENCES auth.users(id) ON DELETE CASCADE,
+    project_id UUID REFERENCES projects(id) ON DELETE SET NULL,
+    action TEXT NOT NULL,
+    coins_used INT NOT NULL DEFAULT 0,
+    metadata JSONB DEFAULT '{}',
+    created_at TIMESTAMPTZ NOT NULL DEFAULT now()
+);
+
+-- Index for fast user + time lookups
+CREATE INDEX IF NOT EXISTS idx_activity_logs_user_id ON activity_logs(user_id);
+CREATE INDEX IF NOT EXISTS idx_activity_logs_created_at ON activity_logs(created_at DESC);
+
+-- 3. Enable RLS (Row Level Security)
+ALTER TABLE projects ENABLE ROW LEVEL SECURITY;
+ALTER TABLE activity_logs ENABLE ROW LEVEL SECURITY;
+
+-- 4. RLS Policies for projects
+-- Users can only see/modify their own projects
+CREATE POLICY "Users can view own projects" ON projects
+    FOR SELECT USING (auth.uid() = user_id);
+
+CREATE POLICY "Users can insert own projects" ON projects
+    FOR INSERT WITH CHECK (auth.uid() = user_id);
+
+CREATE POLICY "Users can update own projects" ON projects
+    FOR UPDATE USING (auth.uid() = user_id);
+
+CREATE POLICY "Users can delete own projects" ON projects
+    FOR DELETE USING (auth.uid() = user_id);
+
+-- 5. RLS Policies for activity_logs
+-- Users can only see their own logs
+CREATE POLICY "Users can view own activity" ON activity_logs
+    FOR SELECT USING (auth.uid() = user_id);
+
+CREATE POLICY "Users can insert own activity" ON activity_logs
+    FOR INSERT WITH CHECK (auth.uid() = user_id);
+
+-- 6. Service role bypass (so our backend can do everything)
+-- The supabase service role key bypasses RLS by default, so no extra policy needed.
+
+-- 7. Auto-update updated_at trigger for projects
+CREATE OR REPLACE FUNCTION update_updated_at_column()
+RETURNS TRIGGER AS $$
+BEGIN
+    NEW.updated_at = now();
+    RETURN NEW;
+END;
+$$ language 'plpgsql';
+
+CREATE TRIGGER update_projects_updated_at
+    BEFORE UPDATE ON projects
+    FOR EACH ROW
+    EXECUTE FUNCTION update_updated_at_column();
diff --git a/apps/web-app/app/(app)/histories/page.tsx b/apps/web-app/app/(app)/histories/page.tsx
index 57dbd72..5148e59 100644
--- a/apps/web-app/app/(app)/histories/page.tsx
+++ b/apps/web-app/app/(app)/histories/page.tsx
@@ -1,225 +1,223 @@
+"use client";
+
 import { Button } from "@workspace/ui/components/button";
 import { Card, CardContent } from "@workspace/ui/components/card";
-import { Separator } from "@workspace/ui/components/separator";
-import { FileDown, FileText, Plus, Coins, Pencil, Trash2 } from "lucide-react";
+import { FileDown, FileText, Plus, Coins, Pencil, Trash2, Loader2 } from "lucide-react";
+import { useEffect, useState } from "react";
+import { getHistory } from "@/services/project.service";
 
-const TRANSACTION_META = {
-  export: {
-    icon: FileDown,
-    bgColor: "bg-blue-100",
-    iconColor: "text-blue-600",
-  },
-  generate: {
+const ACTION_META: Record<string, { icon: any; bgColor: string; iconColor: string; label: string }> = {
+  generate_brief: {
     icon: FileText,
     bgColor: "bg-indigo-100",
     iconColor: "text-indigo-600",
+    label: "Generated Project Brief",
   },
-  create: {
-    icon: Plus,
-    bgColor: "bg-blue-100",
-    iconColor: "text-blue-600",
-  },
-  purchase: {
-    icon: Coins,
-    bgColor: "bg-yellow-100",
-    iconColor: "text-yellow-600",
-  },
-  update: {
-    icon: Pencil,
+  export_pdf: {
+    icon: FileDown,
     bgColor: "bg-blue-100",
     iconColor: "text-blue-600",
+    label: "Exported PDF Document",
   },
-  delete: {
-    icon: Trash2,
-    bgColor: "bg-red-100",
-    iconColor: "text-red-600",
+  export_markdown: {
+    icon: FileDown,
+    bgColor: "bg-green-100",
+    iconColor: "text-green-600",
+    label: "Exported Markdown Document",
   },
-} as const;
+};
 
-type TransactionType = keyof typeof TRANSACTION_META;
+const FALLBACK_META = {
+  icon: Plus,
+  bgColor: "bg-gray-100",
+  iconColor: "text-gray-600",
+  label: "Activity",
+};
 
-type TransactionItem = {
+type ActivityLog = {
   id: string;
-  type: TransactionType;
-  title: string;
-  projectType: string;
-  coins: number;
-  time: string;
+  action: string;
+  coins_used: number;
+  metadata: Record<string, any>;
+  created_at: string;
 };
 
-type TransactionGroup = {
-  day: string;
+type GroupedLogs = {
+  label: string;
   date: string;
-  transactions: TransactionItem[];
+  logs: ActivityLog[];
 };
 
-const dummyTransaction: TransactionGroup[] = [
-  {
-    day: "Today",
-    date: "Oct 24",
-    transactions: [
-      {
-        id: "trx-001",
-        type: "export",
-        title: "Exported PDF Document",
-        projectType: "Student Research Portal · Web App",
-        coins: -5,
-        time: "10:42 AM",
-      },
-      {
-        id: "trx-002",
-        type: "generate",
-        title: "Generated Project Brief",
-        projectType: "Student Research Portal · Web App",
-        coins: 0,
-        time: "10:15 AM",
-      },
-      {
-        id: "trx-003",
-        type: "create",
-        title: "Created New Project",
-        projectType: "Student Research Portal",
-        coins: 0,
-        time: "10:00 AM",
-      },
-    ],
-  },
-  {
-    day: "Yesterday",
-    date: "Oct 23",
-    transactions: [
-      {
-        id: "trx-004",
-        type: "purchase",
-        title: "Purchased Coin Pack",
-        projectType: "Starter Pack (50 Coins)",
-        coins: 50,
-        time: "4:30 PM",
-      },
-      {
-        id: "trx-005",
-        type: "update",
-        title: "Updated Research Scope",
-        projectType: "AI Ethics in Education · Research",
-        coins: 0,
-        time: "2:15 PM",
-      },
-    ],
-  },
-  {
-    day: "",
-    date: "Oct 18, 2024",
-    transactions: [
-      {
-        id: "trx-006",
-        type: "export",
-        title: "Exported Markdown",
-        projectType: "E-Commerce Mobile App · Mobile",
-        coins: -5,
-        time: "9:20 AM",
-      },
-      {
-        id: "trx-007",
-        type: "delete",
-        title: "Deleted Project",
-        projectType: "Untitled Project (Draft)",
-        coins: 0,
-        time: "8:45 AM",
-      },
-    ],
-  },
-];
+function groupByDate(logs: ActivityLog[]): GroupedLogs[] {
+  const groups: Record<string, ActivityLog[]> = {};
+
+  const now = new Date();
+  const today = now.toDateString();
+  const yesterday = new Date(now.getTime() - 86400000).toDateString();
+
+  for (const log of logs) {
+    const d = new Date(log.created_at);
+    const key = d.toDateString();
+    if (!groups[key]) groups[key] = [];
+    groups[key].push(log);
+  }
+
+  return Object.entries(groups).map(([dateStr, items]) => {
+    let label = "";
+    if (dateStr === today) label = "Today";
+    else if (dateStr === yesterday) label = "Yesterday";
+
+    const d = new Date(dateStr);
+    const date = d.toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" });
+
+    return { label, date, logs: items };
+  });
+}
+
+function formatTime(iso: string): string {
+  return new Date(iso).toLocaleTimeString("en-US", { hour: "numeric", minute: "2-digit", hour12: true });
+}
 
 export default function Histories() {
+  const [logs, setLogs] = useState<ActivityLog[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+  const [filter, setFilter] = useState<"all" | "documents" | "transactions">("all");
+
+  useEffect(() => {
+    async function fetchData() {
+      try {
+        setLoading(true);
+        const res = await getHistory(50, 0);
+        setLogs((res.data as any) || []);
+      } catch (e: any) {
+        setError(e.message || "Failed to load history");
+      } finally {
+        setLoading(false);
+      }
+    }
+    fetchData();
+  }, []);
+
+  const filteredLogs = logs.filter((log) => {
+    if (filter === "all") return true;
+    if (filter === "documents") return log.action === "generate_brief";
+    if (filter === "transactions") return log.coins_used !== 0;
+    return true;
+  });
+
+  const grouped = groupByDate(filteredLogs);
+
   return (
     <div className="w-full flex flex-col gap-8 py-8">
       <div className="flex flex-row items-center gap-4">
         <Button
           variant={"outline"}
-          className="px-3 rounded-full bg-blue-600 cursor-pointer hover:shadow-md hover:translate-y-1 text-white"
+          onClick={() => setFilter("all")}
+          className={`px-3 rounded-full cursor-pointer hover:shadow-md hover:translate-y-1 ${filter === "all" ? "bg-blue-600 text-white" : ""}`}
         >
           All Activity
         </Button>
         <Button
           variant={"outline"}
-          className="px-3 rounded-full cursor-pointer hover:shadow-md hover:translate-y-1 "
+          onClick={() => setFilter("documents")}
+          className={`px-3 rounded-full cursor-pointer hover:shadow-md hover:translate-y-1 ${filter === "documents" ? "bg-blue-600 text-white" : ""}`}
         >
           <FileText />
           Documents
         </Button>
         <Button
           variant={"outline"}
-          className="px-3 rounded-full cursor-pointer hover:shadow-md hover:translate-y-1 "
+          onClick={() => setFilter("transactions")}
+          className={`px-3 rounded-full cursor-pointer hover:shadow-md hover:translate-y-1 ${filter === "transactions" ? "bg-blue-600 text-white" : ""}`}
         >
           <Coins />
           Transactions
         </Button>
       </div>
 
-      <div className="flex flex-col gap-4 w-full">
-        {dummyTransaction.map((group) => (
-          <div key={group.date} className="space-y-3">
-            {/* Header tanggal */}
-            <p className="text-xs font-medium text-muted-foreground">
-              {group.day} • {group.date}
-            </p>
-
-            <Card>
-              <CardContent className="p-0">
-                {group.transactions.map((trx, idx) => {
-                  const meta = TRANSACTION_META[trx.type];
-                  const Icon = meta.icon;
-
-                  return (
-                    <div key={trx.id}>
-                      <div className="flex items-center justify-between p-4">
-                        <div className="flex items-center gap-3">
-                          <div
-                            className={`flex h-10 w-10 items-center justify-center rounded-lg ${meta.bgColor}`}
-                          >
-                            <Icon className={`h-5 w-5 ${meta.iconColor}`} />
+      {loading && (
+        <div className="flex items-center justify-center py-20">
+          <Loader2 className="animate-spin text-gray-400 size-8" />
+        </div>
+      )}
+
+      {error && (
+        <div className="p-4 bg-red-50 border border-red-200 rounded-md">
+          <p className="text-sm text-red-600">{error}</p>
+        </div>
+      )}
+
+      {!loading && !error && grouped.length === 0 && (
+        <div className="flex flex-col items-center justify-center py-20 text-gray-400">
+          <FileText className="size-12 mb-4 opacity-50" />
+          <p>No activity yet. Generate a project to get started!</p>
+        </div>
+      )}
+
+      {!loading && !error && (
+        <div className="flex flex-col gap-4 w-full">
+          {grouped.map((group) => (
+            <div key={group.date} className="space-y-3">
+              <p className="text-xs font-medium text-muted-foreground">
+                {group.label ? `${group.label} • ` : ""}{group.date}
+              </p>
+
+              <Card>
+                <CardContent className="p-0">
+                  {group.logs.map((log, idx) => {
+                    const meta = ACTION_META[log.action] || FALLBACK_META;
+                    const Icon = meta.icon;
+
+                    return (
+                      <div key={log.id}>
+                        <div className="flex items-center justify-between p-4">
+                          <div className="flex items-center gap-3">
+                            <div
+                              className={`flex h-10 w-10 items-center justify-center rounded-lg ${meta.bgColor}`}
+                            >
+                              <Icon className={`h-5 w-5 ${meta.iconColor}`} />
+                            </div>
+
+                            <div className="flex flex-col gap-1">
+                              <p className="text-sm font-semibold">{meta.label}</p>
+                              <p className="text-xs text-muted-foreground">
+                                {log.metadata?.projectTitle || "Unknown Project"}
+                                {log.metadata?.projectType ? ` · ${log.metadata.projectType}` : ""}
+                              </p>
+                            </div>
                           </div>
 
-                          <div className="flex flex-col gap-1">
-                            <p className="text-sm font-semibold">{trx.title}</p>
+                          <div className="text-right flex flex-col gap-1">
+                            <p
+                              className={`text-sm font-medium ${log.coins_used > 0
+                                  ? "text-red-500"
+                                  : "text-muted-foreground"
+                                }`}
+                            >
+                              {log.coins_used === 0
+                                ? "Free"
+                                : `-${log.coins_used} Coins`}
+                            </p>
+
                             <p className="text-xs text-muted-foreground">
-                              {trx.projectType}
+                              {formatTime(log.created_at)}
                             </p>
                           </div>
                         </div>
 
-                        <div className="text-right flex flex-col gap-1">
-                          <p
-                            className={`text-sm font-medium ${
-                              trx.coins > 0
-                                ? "text-green-600"
-                                : trx.coins < 0
-                                  ? "text-muted-foreground"
-                                  : "text-muted-foreground"
-                            }`}
-                          >
-                            {trx.coins === 0
-                              ? "Free"
-                              : `${trx.coins > 0 ? "+" : ""}${trx.coins} Coins`}
-                          </p>
-
-                          <p className="text-xs text-muted-foreground">
-                            {trx.time}
-                          </p>
-                        </div>
+                        {idx !== group.logs.length - 1 && (
+                          <div className="mx-4 h-0.5 bg-gray-200 dark:bg-gray-900" />
+                        )}
                       </div>
-
-                      {idx !== group.transactions.length - 1 && (
-                        <div className="mx-4 h-0.5 bg-gray-200 dark:bg-gray-900" />
-                      )}
-                    </div>
-                  );
-                })}
-              </CardContent>
-            </Card>
-          </div>
-        ))}
-      </div>
+                    );
+                  })}
+                </CardContent>
+              </Card>
+            </div>
+          ))}
+        </div>
+      )}
     </div>
   );
 }
diff --git a/apps/web-app/app/(app)/myProject/components/projectProgress.tsx b/apps/web-app/app/(app)/myProject/components/projectProgress.tsx
index 8150db1..ee44642 100644
--- a/apps/web-app/app/(app)/myProject/components/projectProgress.tsx
+++ b/apps/web-app/app/(app)/myProject/components/projectProgress.tsx
@@ -14,83 +14,147 @@ import {
 import { Field, FieldLabel } from "@workspace/ui/components/field";
 import { Progress } from "@workspace/ui/components/progress";
 import {
-    ArrowRight,
+  ArrowRight,
   Copy,
   Download,
   Ellipsis,
   Eye,
-  GraduationCap,
+  LayoutTemplate,
+  BookOpen,
+  Smartphone,
+  Building2,
   Pencil,
   Trash,
 } from "lucide-react";
 import { useRouter } from "next/navigation";
 
-export default function ProjectProgress() {
-    return (
-        <Card className="flex flex-col gap-8 p-4 w-full min-h-59">
-          <div className="w-full flex flex-row justify-between items-center">
-            <div className="flex flex-row gap-3 items-center">
-              <div className="flex items-center justify-center w-12 h-12 rounded-sm bg-blue-100">
-                <GraduationCap className="size-7 text-blue-600" />
-              </div>
-              <div className="flex flex-col gap-1">
-                <h1 className="font-semibold text-md">
-                  Student Research Portal
-                </h1>
-                <p className="text-sm text-gray-500">Web App . Education</p>
-              </div>
-            </div>
+type Project = {
+  id: string;
+  title: string;
+  description: string;
+  project_type: string;
+  current_step: number;
+  document_style: string;
+  status: string;
+  created_at: string;
+  updated_at: string;
+};
 
-            <DropdownMenu>
-              <DropdownMenuTrigger asChild>
-                <Button
-                  variant={"outline"}
-                  className="hover:shadow-md hover:translate-y-1 cursor-pointer"
-                >
-                  <Ellipsis />
-                </Button>
-              </DropdownMenuTrigger>
-              <DropdownMenuContent align="end" sideOffset={8} className="flex flex-col gap-1">
-                <DropdownMenuItem>
-                  <Pencil />
-                  Edit Project
-                </DropdownMenuItem>
-                <DropdownMenuItem>
-                  <Eye />
-                  View Preview
-                </DropdownMenuItem>
-                <DropdownMenuSeparator />
-                <DropdownMenuItem>
-                  <Copy />
-                  Duplicate
-                </DropdownMenuItem>
-                <DropdownMenuItem>
-                  <Download />
-                  Export PDF
-                </DropdownMenuItem>
-                <DropdownMenuSeparator />
-                <DropdownMenuItem variant="destructive">
-                  <Trash />
-                  Delete
-                </DropdownMenuItem>
-              </DropdownMenuContent>
-            </DropdownMenu>
-          </div>
+const TYPE_ICONS: Record<string, any> = {
+  webapp: LayoutTemplate,
+  web_app: LayoutTemplate,
+  mobile: Smartphone,
+  research: BookOpen,
+  enterprise: Building2,
+};
 
-          <Field className="w-full ">
-            <FieldLabel htmlFor="progress-upload">
-              <span>Completed</span>
-              <span className="ml-auto">66%</span>
-            </FieldLabel>
-            <Progress value={66} id="progress-upload" />
-          </Field>
+const TYPE_LABELS: Record<string, string> = {
+  webapp: "Web App",
+  web_app: "Web App",
+  mobile: "Mobile App",
+  research: "Research",
+  enterprise: "Enterprise",
+};
 
-          <div className="flex flex-row justify-between items-center w-full">
-            <p className="text-gray-500 font-semibold text-sm">Edited 5 mins ago</p>
-            <Button variant={"link"} className="cursor-pointer text-blue-600 flex flex-row gap-2 items-center">
-                Continue <ArrowRight className="text-blue-600 size-4" />
-            </Button>
+function getProgress(step: number, status: string): number {
+  if (status === "exported") return 100;
+  if (status === "generated") return 75;
+  // Step 1-4 = 25% each
+  return Math.min(step * 25, 100);
+}
+
+function timeAgo(iso: string): string {
+  const diff = Date.now() - new Date(iso).getTime();
+  const mins = Math.floor(diff / 60000);
+  if (mins < 1) return "Just now";
+  if (mins < 60) return `${mins} min${mins > 1 ? "s" : ""} ago`;
+  const hours = Math.floor(mins / 60);
+  if (hours < 24) return `${hours} hour${hours > 1 ? "s" : ""} ago`;
+  const days = Math.floor(hours / 24);
+  return `${days} day${days > 1 ? "s" : ""} ago`;
+}
+
+export default function ProjectProgress({
+  project,
+  onDelete,
+}: {
+  project: Project;
+  onDelete: (id: string) => void;
+}) {
+  const router = useRouter();
+  const Icon = TYPE_ICONS[project.project_type] || LayoutTemplate;
+  const typeLabel = TYPE_LABELS[project.project_type] || project.project_type;
+  const progress = getProgress(project.current_step, project.status);
+
+  return (
+    <Card className="flex flex-col gap-8 p-4 w-full min-h-59">
+      <div className="w-full flex flex-row justify-between items-center">
+        <div className="flex flex-row gap-3 items-center">
+          <div className="flex items-center justify-center w-12 h-12 rounded-sm bg-blue-100">
+            <Icon className="size-7 text-blue-600" />
           </div>
-        </Card>
-    )
+          <div className="flex flex-col gap-1">
+            <h1 className="font-semibold text-md">
+              {project.title}
+            </h1>
+            <p className="text-sm text-gray-500">{typeLabel} · {project.document_style}</p>
+          </div>
+        </div>
+
+        <DropdownMenu>
+          <DropdownMenuTrigger asChild>
+            <Button
+              variant={"outline"}
+              className="hover:shadow-md hover:translate-y-1 cursor-pointer"
+            >
+              <Ellipsis />
+            </Button>
+          </DropdownMenuTrigger>
+          <DropdownMenuContent align="end" sideOffset={8} className="flex flex-col gap-1">
+            <DropdownMenuItem onClick={() => router.push(`/newProject?projectId=${project.id}`)}>
+              <Pencil />
+              Edit Project
+            </DropdownMenuItem>
+            <DropdownMenuItem>
+              <Eye />
+              View Preview
+            </DropdownMenuItem>
+            <DropdownMenuSeparator />
+            <DropdownMenuItem>
+              <Copy />
+              Duplicate
+            </DropdownMenuItem>
+            <DropdownMenuItem>
+              <Download />
+              Export PDF
+            </DropdownMenuItem>
+            <DropdownMenuSeparator />
+            <DropdownMenuItem variant="destructive" onClick={() => onDelete(project.id)}>
+              <Trash />
+              Delete
+            </DropdownMenuItem>
+          </DropdownMenuContent>
+        </DropdownMenu>
+      </div>
+
+      <Field className="w-full ">
+        <FieldLabel htmlFor={`progress-${project.id}`}>
+          <span>{project.status === "draft" ? "In Progress" : project.status === "generated" ? "Generated" : "Completed"}</span>
+          <span className="ml-auto">{progress}%</span>
+        </FieldLabel>
+        <Progress value={progress} id={`progress-${project.id}`} />
+      </Field>
+
+      <div className="flex flex-row justify-between items-center w-full">
+        <p className="text-gray-500 font-semibold text-sm">Edited {timeAgo(project.updated_at)}</p>
+        <Button
+          variant={"link"}
+          className="cursor-pointer text-blue-600 flex flex-row gap-2 items-center"
+          onClick={() => router.push(`/newProject?projectId=${project.id}`)}
+        >
+          Continue <ArrowRight className="text-blue-600 size-4" />
+        </Button>
+      </div>
+    </Card>
+  );
 }
\ No newline at end of file
diff --git a/apps/web-app/app/(app)/myProject/components/recentActivity.tsx b/apps/web-app/app/(app)/myProject/components/recentActivity.tsx
index 69fb2d0..a851b6d 100644
--- a/apps/web-app/app/(app)/myProject/components/recentActivity.tsx
+++ b/apps/web-app/app/(app)/myProject/components/recentActivity.tsx
@@ -1,21 +1,92 @@
 "use client";
 
-
+import { useEffect, useState } from "react";
+import { getProjects, deleteProject } from "@/services/project.service";
 import ProjectProgress from "./projectProgress";
+import { Loader2, FileText } from "lucide-react";
+
+type Project = {
+  id: string;
+  title: string;
+  description: string;
+  project_type: string;
+  current_step: number;
+  document_style: string;
+  status: string;
+  created_at: string;
+  updated_at: string;
+};
 
 export default function RecentActivity() {
+  const [projects, setProjects] = useState<Project[]>([]);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState<string | null>(null);
+
+  const fetchProjects = async () => {
+    try {
+      setLoading(true);
+      const res = await getProjects();
+      setProjects((res.data as any) || []);
+    } catch (e: any) {
+      setError(e.message || "Failed to load projects");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    fetchProjects();
+  }, []);
+
+  const handleDelete = async (id: string) => {
+    try {
+      await deleteProject(id);
+      setProjects((prev) => prev.filter((p) => p.id !== id));
+    } catch (e: any) {
+      alert(e.message || "Failed to delete project");
+    }
+  };
+
+  if (loading) {
+    return (
+      <div className="flex items-center justify-center py-20">
+        <Loader2 className="animate-spin text-gray-400 size-8" />
+      </div>
+    );
+  }
+
+  if (error) {
+    return (
+      <div className="p-4 bg-red-50 border border-red-200 rounded-md">
+        <p className="text-sm text-red-600">{error}</p>
+      </div>
+    );
+  }
+
+  if (projects.length === 0) {
+    return (
+      <div className="flex flex-col items-center justify-center py-20 text-gray-400">
+        <FileText className="size-12 mb-4 opacity-50" />
+        <p>No projects yet. Create a new project to get started!</p>
+      </div>
+    );
+  }
+
   return (
     <div className="w-full gap-8 flex flex-col mt-10">
       <div className="flex flex-row justify-between items-center w-full">
         <h2 className="text-xl font-semibold">Recent Activity</h2>
-        <p className="text-gray-500 text-sm">Showing 4 of 12 projects</p>
+        <p className="text-gray-500 text-sm">Showing {projects.length} project{projects.length !== 1 ? "s" : ""}</p>
       </div>
 
-      <div className=" items-center justify-between grid grid-cols-3  gap-6">
-        <ProjectProgress />
-        <ProjectProgress />
-        <ProjectProgress />
-        <ProjectProgress />
+      <div className="items-center justify-between grid grid-cols-3 gap-6">
+        {projects.map((project) => (
+          <ProjectProgress
+            key={project.id}
+            project={project}
+            onDelete={handleDelete}
+          />
+        ))}
       </div>
     </div>
   );
diff --git a/apps/web-app/features/project/components/NewProjectLayout.tsx b/apps/web-app/features/project/components/NewProjectLayout.tsx
index f118c00..693ff7c 100644
--- a/apps/web-app/features/project/components/NewProjectLayout.tsx
+++ b/apps/web-app/features/project/components/NewProjectLayout.tsx
@@ -1,6 +1,7 @@
 "use client"
 
-import { useState } from "react"
+import { useState, useEffect } from "react"
+import { useSearchParams } from "next/navigation"
 import { ProjectType } from "../types"
 import type { WebAppFormData } from "../types"
 import { StepSidebar } from "./StepSidebar"
@@ -8,24 +9,112 @@ import { StepContent } from "./StepContent"
 import { ReviewSidebar } from "./reviewSidebar"
 import { useWebAppForm } from "./steps/webApp/hooks"
 import { useGenerateProject } from "./steps/webApp/hooks"
+import { useProjectAutoSave } from "./steps/webApp/hooks"
+import { Loader2, CloudOff, Check } from "lucide-react"
 
 export function NewProjectLayout() {
+  const searchParams = useSearchParams()
+  const resumeId = searchParams.get("projectId")
+
   const [type, setType] = useState<ProjectType | null>(null)
   const [step, setStep] = useState(1)
 
-  const { formData, updateField, resetForm, canProceedToDetails, canProceedToReview } = useWebAppForm()
-  const { isLoading: isGenerating, error: generateError, result: generateResult, generate, clearError } = useGenerateProject()
+  const { formData, updateField, setFormData, resetForm, canProceedToDetails, canProceedToReview } = useWebAppForm()
+  const { isLoading: isGenerating, error: generateError, result: generateResult, generate, clearError, setResult } = useGenerateProject()
+
+  const {
+    projectId,
+    isSaving,
+    isLoadingProject,
+    loadError,
+    loadProject,
+  } = useProjectAutoSave({
+    formData,
+    type,
+    step,
+    generateResult,
+  })
+
+  // Resume existing project if projectId in URL
+  useEffect(() => {
+    if (resumeId) {
+      loadProject(resumeId).then((data: any) => {
+        if (data) {
+          // Restore form state (bulk)
+          if (data.form_data) {
+            setFormData(data.form_data as WebAppFormData)
+          }
+          // Restore generated brief
+          if (data.generated_brief) {
+            setResult(data.generated_brief)
+          }
+          // Restore type (normalize DB values to match ProjectType keys)
+          if (data.project_type) {
+            const typeMap: Record<string, ProjectType> = {
+              webapp: "web_app",
+              web_app: "web_app",
+              research: "research",
+            }
+            setType(typeMap[data.project_type] || "web_app")
+          }
+          // Restore step (last so UI renders with all data ready)
+          if (data.current_step) {
+            setStep(data.current_step)
+          }
+        }
+      })
+    }
+  }, [resumeId])
 
   const isReview = step === 4
 
+  // Loading state for resume
+  if (isLoadingProject) {
+    return (
+      <div className="h-full flex items-center justify-center">
+        <div className="flex flex-col items-center gap-3">
+          <Loader2 className="animate-spin text-blue-500 size-10" />
+          <p className="text-gray-500 text-sm">Loading project...</p>
+        </div>
+      </div>
+    )
+  }
+
+  if (loadError) {
+    return (
+      <div className="h-full flex items-center justify-center">
+        <div className="flex flex-col items-center gap-3">
+          <CloudOff className="text-red-400 size-10" />
+          <p className="text-red-500 text-sm">{loadError}</p>
+        </div>
+      </div>
+    )
+  }
+
   return (
     <div className="h-full flex overflow-hidden">
 
-      <aside className="w-72 border-r h-full overflow-hidden">
-        <StepSidebar type={type} step={step} />
-      </aside>
+      {!isReview && (
+        <aside className="w-72 border-r h-full overflow-hidden">
+          <StepSidebar type={type} step={step} />
+        </aside>
+      )}
+
+      <main className="flex-1 overflow-y-auto relative">
+        {/* Auto-save indicator */}
+        {isSaving && (
+          <div className="absolute top-3 right-4 flex items-center gap-2 text-xs text-gray-400 z-10">
+            <Loader2 className="animate-spin size-3" />
+            Saving...
+          </div>
+        )}
+        {!isSaving && projectId && (
+          <div className="absolute top-3 right-4 flex items-center gap-2 text-xs text-green-500 z-10">
+            <Check className="size-3" />
+            Saved
+          </div>
+        )}
 
-      <main className="flex-1 overflow-y-auto ">
         <StepContent
           type={type}
           step={step}
diff --git a/apps/web-app/features/project/components/StepContent.tsx b/apps/web-app/features/project/components/StepContent.tsx
index 3486e6c..a33384e 100644
--- a/apps/web-app/features/project/components/StepContent.tsx
+++ b/apps/web-app/features/project/components/StepContent.tsx
@@ -32,7 +32,7 @@ export function StepContent({
   generateResult,
 }: Props) {
   const StepComponent =
-    type ? stepRegistry[type]?.[step] : stepRegistry.web_app[1]
+    type ? (stepRegistry[type]?.[step] || stepRegistry.web_app[step]) : stepRegistry.web_app[1]
 
   if (!StepComponent) return null
 
diff --git a/apps/web-app/features/project/components/StepSidebar.tsx b/apps/web-app/features/project/components/StepSidebar.tsx
index 9f05fe3..6984d56 100644
--- a/apps/web-app/features/project/components/StepSidebar.tsx
+++ b/apps/web-app/features/project/components/StepSidebar.tsx
@@ -14,7 +14,7 @@ export function StepSidebar({ type, step }: Props) {
     },
   ]
 
-  const steps = type ? projectFlows[type] : baseStep
+  const steps = type ? (projectFlows[type] || projectFlows.web_app) : baseStep
 
   return (
     <div className="h-full flex flex-col shadow-md ">
@@ -28,10 +28,9 @@ export function StepSidebar({ type, step }: Props) {
             <div key={index} className="flex items-start gap-4">
               <div
                 className={`min-w-8 h-8 flex items-center justify-center rounded-full text-sm font-semibold
-                  ${
-                    isActive
-                      ? "bg-blue-600 text-white"
-                      : isCompleted
+                  ${isActive
+                    ? "bg-blue-600 text-white"
+                    : isCompleted
                       ? "bg-green-500 text-white"
                       : "border border-gray-300 text-gray-500"
                   }
@@ -42,9 +41,8 @@ export function StepSidebar({ type, step }: Props) {
 
               <div>
                 <div
-                  className={`font-medium ${
-                    isActive ? "text-blue-600" : "text-gray-800"
-                  }`}
+                  className={`font-medium ${isActive ? "text-blue-600" : "text-gray-800"
+                    }`}
                 >
                   {item.title}
                 </div>
diff --git a/apps/web-app/features/project/components/steps/ReviewStep.tsx b/apps/web-app/features/project/components/steps/ReviewStep.tsx
index d2ead81..f460651 100644
--- a/apps/web-app/features/project/components/steps/ReviewStep.tsx
+++ b/apps/web-app/features/project/components/steps/ReviewStep.tsx
@@ -1,8 +1,167 @@
 "use client";
 
+import { useEffect, useRef, useState } from "react";
 import type { GenerateProjectResponse } from "../../types";
 import { Loader2 } from "lucide-react";
 
+// Repeating diagonal watermark component
+function PageWatermark() {
+  const rows = 20;
+  const cols = 3;
+  const items = Array.from({ length: rows * cols });
+
+  return (
+    <div
+      className="absolute inset-0 pointer-events-none z-10"
+      aria-hidden="true"
+      style={{ overflow: "hidden" }}
+    >
+      <div
+        className="absolute inset-0 flex flex-wrap items-center justify-center"
+        style={{
+          transform: "rotate(-35deg)",
+          transformOrigin: "center center",
+          width: "200%",
+          height: "200%",
+          top: "-50%",
+          left: "-50%",
+          position: "absolute",
+        }}
+      >
+        {items.map((_, i) => (
+          <div
+            key={i}
+            style={{
+              width: `${100 / cols}%`,
+              height: `${100 / rows}%`,
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              fontSize: "2.2rem",
+              fontWeight: 800,
+              color: "rgba(0, 0, 0, 0.04)",
+              letterSpacing: "0.09em",
+              userSelect: "none",
+              whiteSpace: "nowrap",
+            }}
+          >
+            PLANIFY - PREVIEW
+          </div>
+        ))}
+      </div>
+    </div>
+  );
+}
+
+// Mermaid diagram renderer with multiple fallback strategies
+function MermaidDiagram({ code }: { code: string }) {
+  const wrapperRef = useRef<HTMLDivElement>(null);
+  const svgContainerRef = useRef<HTMLDivElement | null>(null);
+  const [rendered, setRendered] = useState(false);
+  const [error, setError] = useState(false);
+
+  useEffect(() => {
+    let cancelled = false;
+
+    async function renderDiagram() {
+      if (!wrapperRef.current || !code) return;
+
+      // Create an isolated container outside React's tree for Mermaid to use
+      const tempContainer = document.createElement("div");
+      tempContainer.style.position = "absolute";
+      tempContainer.style.left = "-9999px";
+      tempContainer.style.top = "-9999px";
+      document.body.appendChild(tempContainer);
+
+      try {
+        const mermaid = (await import("mermaid")).default;
+        mermaid.initialize({
+          startOnLoad: false,
+          theme: "neutral",
+          securityLevel: "loose",
+          fontFamily: "Arial, sans-serif",
+        });
+
+        const tempId = `mermaid_render_${Date.now()}`;
+        const { svg } = await mermaid.render(tempId, code.trim());
+
+        if (!cancelled && wrapperRef.current) {
+          // Create a new div for SVG that React doesn't manage
+          if (svgContainerRef.current) {
+            wrapperRef.current.removeChild(svgContainerRef.current);
+          }
+          const svgDiv = document.createElement("div");
+          svgDiv.innerHTML = svg;
+          svgDiv.className = "flex items-center justify-center";
+          wrapperRef.current.appendChild(svgDiv);
+          svgContainerRef.current = svgDiv;
+          setRendered(true);
+        }
+      } catch (e: any) {
+        console.error("Mermaid render error:", e);
+        if (!cancelled) {
+          setError(true);
+        }
+      } finally {
+        // Cleanup temp container
+        if (document.body.contains(tempContainer)) {
+          document.body.removeChild(tempContainer);
+        }
+      }
+    }
+
+    renderDiagram();
+
+    return () => {
+      cancelled = true;
+    };
+  }, [code]);
+
+  // Cleanup on unmount
+  useEffect(() => {
+    return () => {
+      if (wrapperRef.current && svgContainerRef.current) {
+        try {
+          wrapperRef.current.removeChild(svgContainerRef.current);
+        } catch (_) { /* already removed */ }
+        svgContainerRef.current = null;
+      }
+    };
+  }, []);
+
+  if (error) {
+    return (
+      <div className="p-4 bg-gray-50 rounded border">
+        <p className="text-xs font-medium text-gray-500 mb-2">Diagram Source Code</p>
+        <pre className="text-xs text-gray-600 whitespace-pre-wrap font-mono">{code}</pre>
+      </div>
+    );
+  }
+
+  return (
+    <div
+      ref={wrapperRef}
+      className="p-4 bg-gray-50 rounded border overflow-x-auto flex items-center justify-center"
+      style={{ minHeight: rendered ? "auto" : "200px" }}
+    >
+      {!rendered && !error && <Loader2 className="w-6 h-6 animate-spin text-gray-400" />}
+    </div>
+  );
+}
+
+// A4 page wrapper — each page has consistent A4 look
+function PreviewPage({ children }: { children: React.ReactNode }) {
+  return (
+    <div
+      className="w-[90%] max-w-[794px] bg-white shadow-2xl border border-gray-200 p-12 space-y-8 relative overflow-hidden"
+      style={{ minHeight: "1123px" }}
+    >
+      <PageWatermark />
+      {children}
+    </div>
+  );
+}
+
 interface Props {
   isGenerating?: boolean;
   generateError?: string | null;
@@ -11,7 +170,6 @@ interface Props {
 
 export function ReviewStep({ isGenerating, generateError, generateResult }: Props) {
 
-  // Loading state
   if (isGenerating) {
     return (
       <div className="flex flex-col gap-8 items-center justify-center min-h-screen py-12">
@@ -24,7 +182,6 @@ export function ReviewStep({ isGenerating, generateError, generateResult }: Prop
     );
   }
 
-  // Error state
   if (generateError) {
     return (
       <div className="flex flex-col gap-8 items-center justify-center min-h-screen py-12">
@@ -39,42 +196,35 @@ export function ReviewStep({ isGenerating, generateError, generateResult }: Prop
     );
   }
 
-  // No result yet (shouldn't happen normally, but safety)
   if (!generateResult) {
     return (
       <div className="flex flex-col gap-14 items-center justify-center min-h-screen py-12 overflow-auto mb-25">
-        <div className="w-[90%] max-w-198.5 aspect-794/1123 bg-white shadow-2xl border border-gray-200">
-          {" "}
-          {/* Kosong dulu */}
-        </div>
-        <div className="w-[90%] max-w-198.5 aspect-794/1123 bg-white shadow-2xl border border-gray-200">
-          {" "}
-          {/* Kosong dulu */}
-        </div>
+        <div className="w-[90%] max-w-[794px] aspect-[794/1123] bg-white shadow-2xl border border-gray-200" />
+        <div className="w-[90%] max-w-[794px] aspect-[794/1123] bg-white shadow-2xl border border-gray-200" />
       </div>
     );
   }
 
-  // Render AI result
   const brief = generateResult;
+  const diagramCode = brief.diagram?.diagram || (typeof brief.diagram === "string" ? brief.diagram : null);
 
   return (
-    <div className="flex flex-col gap-14 items-center justify-center py-12 overflow-auto mb-25">
+    <div
+      className="flex flex-col gap-14 items-center justify-center py-12 overflow-auto mb-25"
+      style={{ userSelect: "none", WebkitUserSelect: "none" }}
+      onContextMenu={(e) => e.preventDefault()}
+      onCopy={(e) => e.preventDefault()}
+      onCut={(e) => e.preventDefault()}
+    >
 
-      {/* Page 1 — Title, Overview, Problem, Objectives */}
-      <div className="w-[90%] max-w-198.5 bg-white shadow-2xl border border-gray-200 p-12 space-y-8">
-
-        {/* Watermark */}
-        <p className="text-xs text-gray-300 text-right select-none">PREVIEW — Planify AI</p>
-
-        {/* Title */}
+      {/* Page 1 — Title, Overview, Target Audience, Problem Statement */}
+      <PreviewPage>
         {brief.title && (
           <div>
             <h1 className="text-2xl font-bold text-gray-900">{brief.title}</h1>
           </div>
         )}
 
-        {/* Overview */}
         {brief.overview && (
           <div>
             <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Overview</h2>
@@ -82,7 +232,6 @@ export function ReviewStep({ isGenerating, generateError, generateResult }: Prop
           </div>
         )}
 
-        {/* Target Audience */}
         {brief.targetAudience && (
           <div>
             <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Target Audience</h2>
@@ -98,7 +247,6 @@ export function ReviewStep({ isGenerating, generateError, generateResult }: Prop
           </div>
         )}
 
-        {/* Problem Statement */}
         {brief.problemStatement && (
           <div>
             <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Problem Statement</h2>
@@ -117,8 +265,10 @@ export function ReviewStep({ isGenerating, generateError, generateResult }: Prop
             )}
           </div>
         )}
+      </PreviewPage>
 
-        {/* Objectives */}
+      {/* Page 2 — Objectives, Success Criteria, Key Features */}
+      <PreviewPage>
         {brief.objectives && Array.isArray(brief.objectives) && (
           <div>
             <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Objectives</h2>
@@ -130,7 +280,6 @@ export function ReviewStep({ isGenerating, generateError, generateResult }: Prop
           </div>
         )}
 
-        {/* Success Criteria */}
         {brief.successCriteria && Array.isArray(brief.successCriteria) && (
           <div>
             <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Success Criteria</h2>
@@ -144,14 +293,7 @@ export function ReviewStep({ isGenerating, generateError, generateResult }: Prop
             </div>
           </div>
         )}
-      </div>
-
-      {/* Page 2 — Features, Tech Stack, Scope, Risks */}
-      <div className="w-[90%] max-w-198.5 bg-white shadow-2xl border border-gray-200 p-12 space-y-8">
-
-        <p className="text-xs text-gray-300 text-right select-none">PREVIEW — Planify AI</p>
 
-        {/* Key Features */}
         {brief.keyFeatures && Array.isArray(brief.keyFeatures) && (
           <div>
             <h2 className="text-sm font-semibold text-gray-500 uppercase mb-3">Key Features</h2>
@@ -173,8 +315,10 @@ export function ReviewStep({ isGenerating, generateError, generateResult }: Prop
             </div>
           </div>
         )}
+      </PreviewPage>
 
-        {/* Tech Stack */}
+      {/* Page 3 — Tech Stack, Scope, Risks */}
+      <PreviewPage>
         {brief.recommendedTechStack && Array.isArray(brief.recommendedTechStack) && (
           <div>
             <h2 className="text-sm font-semibold text-gray-500 uppercase mb-3">Recommended Tech Stack</h2>
@@ -192,7 +336,6 @@ export function ReviewStep({ isGenerating, generateError, generateResult }: Prop
           </div>
         )}
 
-        {/* Scope */}
         {brief.scope && (
           <div>
             <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Scope</h2>
@@ -221,10 +364,9 @@ export function ReviewStep({ isGenerating, generateError, generateResult }: Prop
           </div>
         )}
 
-        {/* Risks */}
         {brief.risks && Array.isArray(brief.risks) && (
           <div>
-            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Risks</h2>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Risks & Mitigation</h2>
             <div className="space-y-2">
               {brief.risks.map((r: any, i: number) => (
                 <div key={i} className="p-2 bg-gray-50 rounded border">
@@ -238,8 +380,72 @@ export function ReviewStep({ isGenerating, generateError, generateResult }: Prop
             </div>
           </div>
         )}
+      </PreviewPage>
+
+      {/* Page 4 — User Flow, SRS Modules */}
+      <PreviewPage>
+        {brief.userFlow && (
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">User Flow</h2>
+            {brief.userFlow.steps && Array.isArray(brief.userFlow.steps) && (
+              <ol className="list-decimal list-inside space-y-1">
+                {brief.userFlow.steps.map((s: string, i: number) => (
+                  <li key={i} className="text-sm text-gray-700">{s}</li>
+                ))}
+              </ol>
+            )}
+          </div>
+        )}
+
+        {brief.srsModules && Array.isArray(brief.srsModules) && (
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-3">SRS Modules</h2>
+            <div className="space-y-4">
+              {brief.srsModules.map((m: any, i: number) => (
+                <div key={i}>
+                  <h3 className="text-sm font-semibold text-gray-800 mb-1">{m.moduleName}</h3>
+                  {m.requirements && Array.isArray(m.requirements) && (
+                    <ul className="list-disc list-inside space-y-1 ml-2">
+                      {m.requirements.map((r: any, j: number) => (
+                        <li key={j} className="text-sm text-gray-700">
+                          <span className="font-medium text-gray-500">[{r.id}]</span> {r.userStory}
+                        </li>
+                      ))}
+                    </ul>
+                  )}
+                </div>
+              ))}
+            </div>
+          </div>
+        )}
+      </PreviewPage>
+
+      {/* Page 5 — NFR, Assumptions, Clarification Log */}
+      <PreviewPage>
+        {brief.nonFunctionalRequirements && Array.isArray(brief.nonFunctionalRequirements) && (
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Non-Functional Requirements</h2>
+            <ul className="list-disc list-inside space-y-1">
+              {brief.nonFunctionalRequirements.map((nfr: any, i: number) => (
+                <li key={i} className="text-sm text-gray-700">
+                  {typeof nfr === "string" ? nfr : `${nfr.category}: ${nfr.requirement}`}
+                </li>
+              ))}
+            </ul>
+          </div>
+        )}
+
+        {brief.assumptions && Array.isArray(brief.assumptions) && (
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">Assumptions</h2>
+            <ul className="list-disc list-inside space-y-1">
+              {brief.assumptions.map((a: any, i: number) => (
+                <li key={i} className="text-sm text-gray-700">{typeof a === "string" ? a : a.assumption || JSON.stringify(a)}</li>
+              ))}
+            </ul>
+          </div>
+        )}
 
-        {/* Clarification Log */}
         {brief.clarificationLog && Array.isArray(brief.clarificationLog) && (
           <div>
             <h2 className="text-sm font-semibold text-gray-500 uppercase mb-2">AI Clarification Log</h2>
@@ -256,8 +462,21 @@ export function ReviewStep({ isGenerating, generateError, generateResult }: Prop
             </div>
           </div>
         )}
+      </PreviewPage>
+
+      {/* Page 6 — Architecture Diagram (own page, like PDF service) */}
+      {diagramCode && (
+        <PreviewPage>
+          <div>
+            <h2 className="text-sm font-semibold text-gray-500 uppercase mb-3">Architecture Diagram</h2>
+            <MermaidDiagram code={diagramCode} />
+            {brief.diagram?.description && (
+              <p className="text-xs text-gray-500 mt-3 leading-relaxed">{brief.diagram.description}</p>
+            )}
+          </div>
+        </PreviewPage>
+      )}
 
-      </div>
     </div>
   );
 }
diff --git a/apps/web-app/features/project/components/steps/webApp/DetailsScopeStep.tsx b/apps/web-app/features/project/components/steps/webApp/DetailsScopeStep.tsx
index f6860b5..3a295a6 100644
--- a/apps/web-app/features/project/components/steps/webApp/DetailsScopeStep.tsx
+++ b/apps/web-app/features/project/components/steps/webApp/DetailsScopeStep.tsx
@@ -23,7 +23,7 @@ interface Props {
 export function DetailsScopeStep({ setStep, formData, updateField, canProceedToReview, onGenerate, isGenerating, generateError }: Props) {
 
   const handleContinueToReview = async () => {
-    await onGenerate(formData)
+    await onGenerate(formData, true)
     setStep(4)
   }
 
diff --git a/apps/web-app/features/project/components/steps/webApp/hooks/index.ts b/apps/web-app/features/project/components/steps/webApp/hooks/index.ts
index 6c31d9e..4ae0e0e 100644
--- a/apps/web-app/features/project/components/steps/webApp/hooks/index.ts
+++ b/apps/web-app/features/project/components/steps/webApp/hooks/index.ts
@@ -1,2 +1,3 @@
 export { useWebAppForm } from "./useWebAppForm"
 export { useGenerateProject } from "./useGenerateProject"
+export { useProjectAutoSave } from "./useProjectAutoSave"
diff --git a/apps/web-app/features/project/components/steps/webApp/hooks/useGenerateProject.ts b/apps/web-app/features/project/components/steps/webApp/hooks/useGenerateProject.ts
index 4872e18..74fcf20 100644
--- a/apps/web-app/features/project/components/steps/webApp/hooks/useGenerateProject.ts
+++ b/apps/web-app/features/project/components/steps/webApp/hooks/useGenerateProject.ts
@@ -11,6 +11,7 @@ interface UseGenerateProjectReturn {
     generate: (formData: WebAppFormData, includeDiagram?: boolean) => Promise<void>
     clearError: () => void
     clearResult: () => void
+    setResult: (result: GenerateProjectResponse | null) => void
 }
 
 export function useGenerateProject(): UseGenerateProjectReturn {
@@ -70,5 +71,6 @@ export function useGenerateProject(): UseGenerateProjectReturn {
         generate,
         clearError,
         clearResult,
+        setResult,
     }
 }
diff --git a/apps/web-app/features/project/components/steps/webApp/hooks/useProjectAutoSave.ts b/apps/web-app/features/project/components/steps/webApp/hooks/useProjectAutoSave.ts
new file mode 100644
index 0000000..fcb960c
--- /dev/null
+++ b/apps/web-app/features/project/components/steps/webApp/hooks/useProjectAutoSave.ts
@@ -0,0 +1,165 @@
+"use client"
+
+import { useState, useCallback, useEffect, useRef } from "react"
+import { createProject, updateProject, getProjectById } from "../../../../../../services/project.service"
+import type { WebAppFormData, ProjectType, GenerateProjectResponse } from "../../../../types"
+
+interface UseProjectAutoSaveOptions {
+    formData: WebAppFormData
+    type: ProjectType | null
+    step: number
+    generateResult: GenerateProjectResponse | null
+}
+
+interface UseProjectAutoSaveReturn {
+    projectId: string | null
+    isSaving: boolean
+    isLoadingProject: boolean
+    loadError: string | null
+    saveProject: () => Promise<void>
+    loadProject: (id: string) => Promise<any>
+    setProjectId: (id: string | null) => void
+}
+
+export function useProjectAutoSave({
+    formData,
+    type,
+    step,
+    generateResult,
+}: UseProjectAutoSaveOptions): UseProjectAutoSaveReturn {
+    const [projectId, setProjectId] = useState<string | null>(null)
+    const [isSaving, setIsSaving] = useState(false)
+    const [isLoadingProject, setIsLoadingProject] = useState(false)
+    const [loadError, setLoadError] = useState<string | null>(null)
+    const saveTimeout = useRef<ReturnType<typeof setTimeout> | null>(null)
+    const isResuming = useRef(false)
+
+    /**
+     * Load existing project from API
+     */
+    const loadProject = useCallback(async (id: string) => {
+        setIsLoadingProject(true)
+        setLoadError(null)
+        isResuming.current = true
+
+        try {
+            const res = await getProjectById(id)
+            if (res.success && res.data) {
+                setProjectId(id)
+                return res.data
+            } else {
+                setLoadError("Project not found")
+                return null
+            }
+        } catch (e: any) {
+            setLoadError(e.message || "Failed to load project")
+            return null
+        } finally {
+            setIsLoadingProject(false)
+            // Delay clearing resume flag so auto-save effects don't fire
+            // during the state restore cycle
+            setTimeout(() => {
+                isResuming.current = false
+            }, 3000)
+        }
+    }, [])
+
+    /**
+     * Create or update project in DB
+     */
+    const saveProject = useCallback(async () => {
+        // Don't save if resuming or no project name yet
+        if (isResuming.current) return
+        if (!formData.projectName.trim()) return
+
+        setIsSaving(true)
+
+        try {
+            if (projectId) {
+                // Update existing
+                await updateProject(projectId, {
+                    title: formData.projectName,
+                    description: formData.projectDescription,
+                    projectType: type || "web_app",
+                    currentStep: step,
+                    formData: formData as any,
+                    documentStyle: formData.documentStyle || "professional",
+                    generatedBrief: generateResult || undefined,
+                    status: generateResult ? "generated" : "draft",
+                })
+            } else {
+                // Create new
+                const res = await createProject({
+                    title: formData.projectName,
+                    description: formData.projectDescription,
+                    projectType: type || "web_app",
+                    documentStyle: formData.documentStyle || "professional",
+                    formData: formData as any,
+                    currentStep: step,
+                })
+
+                if (res.success && res.data) {
+                    setProjectId((res.data as any).id)
+                }
+            }
+        } catch (e: any) {
+            console.error("Auto-save failed:", e.message)
+            // Silent fail — don't block user
+        } finally {
+            setIsSaving(false)
+        }
+    }, [projectId, formData, step, generateResult, type])
+
+    /**
+     * Debounced auto-save: triggers 2s after last form change
+     */
+    useEffect(() => {
+        // Skip during resume or if no project name
+        if (isResuming.current) return
+        if (!formData.projectName.trim()) return
+
+        if (saveTimeout.current) {
+            clearTimeout(saveTimeout.current)
+        }
+
+        saveTimeout.current = setTimeout(() => {
+            saveProject()
+        }, 2000)
+
+        return () => {
+            if (saveTimeout.current) {
+                clearTimeout(saveTimeout.current)
+            }
+        }
+    }, [formData, step])
+
+    /**
+     * Immediate save on step change
+     */
+    useEffect(() => {
+        if (isResuming.current) return
+        if (formData.projectName.trim() && step > 1) {
+            saveProject()
+        }
+    }, [step])
+
+    /**
+     * Save when generate result comes in
+     */
+    useEffect(() => {
+        if (isResuming.current) return
+        if (generateResult && formData.projectName.trim()) {
+            saveProject()
+        }
+    }, [generateResult])
+
+    return {
+        projectId,
+        isSaving,
+        isLoadingProject,
+        loadError,
+        saveProject,
+        loadProject,
+        setProjectId,
+    }
+}
diff --git a/apps/web-app/features/project/components/steps/webApp/hooks/useWebAppForm.ts b/apps/web-app/features/project/components/steps/webApp/hooks/useWebAppForm.ts
index 591366b..57cf145 100644
--- a/apps/web-app/features/project/components/steps/webApp/hooks/useWebAppForm.ts
+++ b/apps/web-app/features/project/components/steps/webApp/hooks/useWebAppForm.ts
@@ -49,6 +49,7 @@ export function useWebAppForm() {
     return {
         formData,
         updateField,
+        setFormData,
         resetForm,
         canProceedToDetails,
         canProceedToReview,
diff --git a/apps/web-app/package.json b/apps/web-app/package.json
index a7b1857..ed61276 100644
--- a/apps/web-app/package.json
+++ b/apps/web-app/package.json
@@ -14,6 +14,7 @@
   "dependencies": {
     "@workspace/ui": "workspace:*",
     "lucide-react": "^0.563.0",
+    "mermaid": "^11.12.3",
     "next": "16.1.6",
     "next-themes": "^0.4.6",
     "react": "^19.2.4",
diff --git a/apps/web-app/services/project.service.ts b/apps/web-app/services/project.service.ts
index 35ca7d3..c59bda8 100644
--- a/apps/web-app/services/project.service.ts
+++ b/apps/web-app/services/project.service.ts
@@ -58,6 +58,44 @@ export async function getProjectById(id: string) {
     return apiClient(`/projects/${id}`)
 }
 
+/**
+ * Create a new project
+ * POST /projects
+ */
+export async function createProject(input: {
+    title: string
+    description?: string
+    projectType?: string
+    documentStyle?: string
+    formData?: Record<string, any>
+    currentStep?: number
+}) {
+    return apiClient("/projects", {
+        method: "POST",
+        body: input,
+    })
+}
+
+/**
+ * Update project (auto-save)
+ * PUT /projects/:id
+ */
+export async function updateProject(id: string, input: {
+    title?: string
+    description?: string
+    projectType?: string
+    currentStep?: number
+    formData?: Record<string, any>
+    generatedBrief?: Record<string, any> | null
+    documentStyle?: string
+    status?: string
+}) {
+    return apiClient(`/projects/${id}`, {
+        method: "PUT",
+        body: input,
+    })
+}
+
 /**
  * Delete a project
  * DELETE /projects/:id
@@ -68,30 +106,32 @@ export async function deleteProject(id: string) {
     })
 }
 
+/**
+ * Get user's activity history
+ * GET /history?limit=&offset=
+ */
+export async function getHistory(limit: number = 20, offset: number = 0) {
+    return apiClient(`/history?limit=${limit}&offset=${offset}`)
+}
+
 /**
  * Export project to PDF
- * POST /pdf/generate
+ * POST /pdf/brief
  */
-export async function exportPdf(input: {
-    content: any
-    diagramImage?: string
-}) {
-    return apiClient("/pdf/generate", {
+export async function exportPdf(briefData: any) {
+    return apiClient("/pdf/brief", {
         method: "POST",
-        body: input,
+        body: briefData,
     })
 }
 
 /**
  * Export project to Markdown
- * POST /markdown/generate
+ * POST /markdown/brief
  */
-export async function exportMarkdown(input: {
-    content: any
-    diagramImage?: string
-}) {
-    return apiClient("/markdown/generate", {
+export async function exportMarkdown(briefData: any) {
+    return apiClient("/markdown/brief", {
         method: "POST",
-        body: input,
+        body: briefData,
     })
-}
\ No newline at end of file
+}
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index ab8a95e..d5ffe36 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -133,6 +133,9 @@ importers:
       lucide-react:
         specifier: ^0.563.0
         version: 0.563.0(react@19.2.4)
+      mermaid:
+        specifier: ^11.12.3
+        version: 11.12.3
       next:
         specifier: 16.1.6
         version: 16.1.6(react-dom@19.2.4(react@19.2.4))(react@19.2.4)
@@ -297,6 +300,9 @@ packages:
     resolution: {integrity: sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==}
     engines: {node: '>=10'}
 
+  '@antfu/install-pkg@1.1.0':
+    resolution: {integrity: sha512-MGQsmw10ZyI+EJo45CdSER4zEb+p31LpDAFp2Z3gkSd1yqVZGi0Ebx++YTEMonJy4oChEMLsxZ64j8FH6sSqtQ==}
+
   '@babel/code-frame@7.29.0':
     resolution: {integrity: sha512-9NhCeYjq9+3uxgdtp20LSiJXJvN0FeCtNGpJxuMFZ1Kv3cWUNb6DOhJwUvcVCzKGR66cw4njwM6hrJLqgOwbcw==}
     engines: {node: '>=6.9.0'}
@@ -368,6 +374,24 @@ packages:
     resolution: {integrity: sha512-LwdZHpScM4Qz8Xw2iKSzS+cfglZzJGvofQICy7W7v4caru4EaAmyUuO6BGrbyQ2mYV11W0U8j5mBhd14dd3B0A==}
     engines: {node: '>=6.9.0'}
 
+  '@braintree/sanitize-url@7.1.2':
+    resolution: {integrity: sha512-jigsZK+sMF/cuiB7sERuo9V7N9jx+dhmHHnQyDSVdpZwVutaBu7WvNYqMDLSgFgfB30n452TP3vjDAvFC973mA==}
+
+  '@chevrotain/cst-dts-gen@11.1.1':
+    resolution: {integrity: sha512-fRHyv6/f542qQqiRGalrfJl/evD39mAvbJLCekPazhiextEatq1Jx1K/i9gSd5NNO0ds03ek0Cbo/4uVKmOBcw==}
+
+  '@chevrotain/gast@11.1.1':
+    resolution: {integrity: sha512-Ko/5vPEYy1vn5CbCjjvnSO4U7GgxyGm+dfUZZJIWTlQFkXkyym0jFYrWEU10hyCjrA7rQtiHtBr0EaZqvHFZvg==}
+
+  '@chevrotain/regexp-to-ast@11.1.1':
+    resolution: {integrity: sha512-ctRw1OKSXkOrR8VTvOxrQ5USEc4sNrfwXHa1NuTcR7wre4YbjPcKw+82C2uylg/TEwFRgwLmbhlln4qkmDyteg==}
+
+  '@chevrotain/types@11.1.1':
+    resolution: {integrity: sha512-wb2ToxG8LkgPYnKe9FH8oGn3TMCBdnwiuNC5l5y+CtlaVRbCytU0kbVsk6CGrqTL4ZN4ksJa0TXOYbxpbthtqw==}
+
+  '@chevrotain/utils@11.1.1':
+    resolution: {integrity: sha512-71eTYMzYXYSFPrbg/ZwftSaSDld7UYlS8OQa3lNnn9jzNtpFbaReRRyghzqS7rI3CDaorqpPJJcXGHK+FE1TVQ==}
+
   '@cspotcode/source-map-support@0.8.1':
     resolution: {integrity: sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==}
     engines: {node: '>=12'}
@@ -450,6 +474,12 @@ packages:
     resolution: {integrity: sha512-bV0Tgo9K4hfPCek+aMAn81RppFKv2ySDQeMoSZuvTASywNTnVJCArCZE2FWqpvIatKu7VMRLWlR1EazvVhDyhQ==}
     engines: {node: '>=18.18'}
 
+  '@iconify/types@2.0.0':
+    resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==}
+
+  '@iconify/utils@3.1.0':
+    resolution: {integrity: sha512-Zlzem1ZXhI1iHeeERabLNzBHdOa4VhQbqAcOQaMKuTuyZCpwKbC2R4Dd0Zo3g9EAc+Y4fiarO8HIHRAth7+skw==}
+
   '@img/colour@1.0.0':
     resolution: {integrity: sha512-A5P/LfWGFSl6nsckYtjw9da+19jB8hkJ6ACTGcDfEJ0aE+l2n2El7dsVM7UVHZQ9s2lmYMWlrS21YLy2IR1LUw==}
     engines: {node: '>=18'}
@@ -615,6 +645,9 @@ packages:
   '@jridgewell/trace-mapping@0.3.9':
     resolution: {integrity: sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==}
 
+  '@mermaid-js/parser@1.0.0':
+    resolution: {integrity: sha512-vvK0Hi/VWndxoh03Mmz6wa1KDriSPjS2XMZL/1l19HFwygiObEEoEwSDxOqyLzzAI6J2PU3261JjTMTO7x+BPw==}
+
   '@napi-rs/canvas-android-arm64@0.1.94':
     resolution: {integrity: sha512-YQ6K83RWNMQOtgpk1aIML97QTE3zxPmVCHTi5eA8Nss4+B9JZi5J7LHQr7B5oD7VwSfWd++xsPdUiJ1+frqsMg==}
     engines: {node: '>= 10'}
@@ -1665,6 +1698,99 @@ packages:
   '@types/cors@2.8.19':
     resolution: {integrity: sha512-mFNylyeyqN93lfe/9CSxOGREz8cpzAhH+E93xJ4xWQf62V8sQ/24reV2nyzUWM6H6Xji+GGHpkbLe7pVoUEskg==}
 
+  '@types/d3-array@3.2.2':
+    resolution: {integrity: sha512-hOLWVbm7uRza0BYXpIIW5pxfrKe0W+D5lrFiAEYR+pb6w3N2SwSMaJbXdUfSEv+dT4MfHBLtn5js0LAWaO6otw==}
+
+  '@types/d3-axis@3.0.6':
+    resolution: {integrity: sha512-pYeijfZuBd87T0hGn0FO1vQ/cgLk6E1ALJjfkC0oJ8cbwkZl3TpgS8bVBLZN+2jjGgg38epgxb2zmoGtSfvgMw==}
+
+  '@types/d3-brush@3.0.6':
+    resolution: {integrity: sha512-nH60IZNNxEcrh6L1ZSMNA28rj27ut/2ZmI3r96Zd+1jrZD++zD3LsMIjWlvg4AYrHn/Pqz4CF3veCxGjtbqt7A==}
+
+  '@types/d3-chord@3.0.6':
+    resolution: {integrity: sha512-LFYWWd8nwfwEmTZG9PfQxd17HbNPksHBiJHaKuY1XeqscXacsS2tyoo6OdRsjf+NQYeB6XrNL3a25E3gH69lcg==}
+
+  '@types/d3-color@3.1.3':
+    resolution: {integrity: sha512-iO90scth9WAbmgv7ogoq57O9YpKmFBbmoEoCHDB2xMBY0+/KVrqAaCDyCE16dUspeOvIxFFRI+0sEtqDqy2b4A==}
+
+  '@types/d3-contour@3.0.6':
+    resolution: {integrity: sha512-BjzLgXGnCWjUSYGfH1cpdo41/hgdWETu4YxpezoztawmqsvCeep+8QGfiY6YbDvfgHz/DkjeIkkZVJavB4a3rg==}
+
+  '@types/d3-delaunay@6.0.4':
+    resolution: {integrity: sha512-ZMaSKu4THYCU6sV64Lhg6qjf1orxBthaC161plr5KuPHo3CNm8DTHiLw/5Eq2b6TsNP0W0iJrUOFscY6Q450Hw==}
+
+  '@types/d3-dispatch@3.0.7':
+    resolution: {integrity: sha512-5o9OIAdKkhN1QItV2oqaE5KMIiXAvDWBDPrD85e58Qlz1c1kI/J0NcqbEG88CoTwJrYe7ntUCVfeUl2UJKbWgA==}
+
+  '@types/d3-drag@3.0.7':
+    resolution: {integrity: sha512-HE3jVKlzU9AaMazNufooRJ5ZpWmLIoc90A37WU2JMmeq28w1FQqCZswHZ3xR+SuxYftzHq6WU6KJHvqxKzTxxQ==}
+
+  '@types/d3-dsv@3.0.7':
+    resolution: {integrity: sha512-n6QBF9/+XASqcKK6waudgL0pf/S5XHPPI8APyMLLUHd8NqouBGLsU8MgtO7NINGtPBtk9Kko/W4ea0oAspwh9g==}
+
+  '@types/d3-ease@3.0.2':
+    resolution: {integrity: sha512-NcV1JjO5oDzoK26oMzbILE6HW7uVXOHLQvHshBUW4UMdZGfiY6v5BeQwh9a9tCzv+CeefZQHJt5SRgK154RtiA==}
+
+  '@types/d3-fetch@3.0.7':
+    resolution: {integrity: sha512-fTAfNmxSb9SOWNB9IoG5c8Hg6R+AzUHDRlsXsDZsNp6sxAEOP0tkP3gKkNSO/qmHPoBFTxNrjDprVHDQDvo5aA==}
+
+  '@types/d3-force@3.0.10':
+    resolution: {integrity: sha512-ZYeSaCF3p73RdOKcjj+swRlZfnYpK1EbaDiYICEEp5Q6sUiqFaFQ9qgoshp5CzIyyb/yD09kD9o2zEltCexlgw==}
+
+  '@types/d3-format@3.0.4':
+    resolution: {integrity: sha512-fALi2aI6shfg7vM5KiR1wNJnZ7r6UuggVqtDA+xiEdPZQwy/trcQaHnwShLuLdta2rTymCNpxYTiMZX/e09F4g==}
+
+  '@types/d3-geo@3.1.0':
+    resolution: {integrity: sha512-856sckF0oP/diXtS4jNsiQw/UuK5fQG8l/a9VVLeSouf1/PPbBE1i1W852zVwKwYCBkFJJB7nCFTbk6UMEXBOQ==}
+
+  '@types/d3-hierarchy@3.1.7':
+    resolution: {integrity: sha512-tJFtNoYBtRtkNysX1Xq4sxtjK8YgoWUNpIiUee0/jHGRwqvzYxkq0hGVbbOGSz+JgFxxRu4K8nb3YpG3CMARtg==}
+
+  '@types/d3-interpolate@3.0.4':
+    resolution: {integrity: sha512-mgLPETlrpVV1YRJIglr4Ez47g7Yxjl1lj7YKsiMCb27VJH9W8NVM6Bb9d8kkpG/uAQS5AmbA48q2IAolKKo1MA==}
+
+  '@types/d3-path@3.1.1':
+    resolution: {integrity: sha512-VMZBYyQvbGmWyWVea0EHs/BwLgxc+MKi1zLDCONksozI4YJMcTt8ZEuIR4Sb1MMTE8MMW49v0IwI5+b7RmfWlg==}
+
+  '@types/d3-polygon@3.0.2':
+    resolution: {integrity: sha512-ZuWOtMaHCkN9xoeEMr1ubW2nGWsp4nIql+OPQRstu4ypeZ+zk3YKqQT0CXVe/PYqrKpZAi+J9mTs05TKwjXSRA==}
+
+  '@types/d3-quadtree@3.0.6':
+    resolution: {integrity: sha512-oUzyO1/Zm6rsxKRHA1vH0NEDG58HrT5icx/azi9MF1TWdtttWl0UIUsjEQBBh+SIkrpd21ZjEv7ptxWys1ncsg==}
+
+  '@types/d3-random@3.0.3':
+    resolution: {integrity: sha512-Imagg1vJ3y76Y2ea0871wpabqp613+8/r0mCLEBfdtqC7xMSfj9idOnmBYyMoULfHePJyxMAw3nWhJxzc+LFwQ==}
+
+  '@types/d3-scale-chromatic@3.1.0':
+    resolution: {integrity: sha512-iWMJgwkK7yTRmWqRB5plb1kadXyQ5Sj8V/zYlFGMUBbIPKQScw+Dku9cAAMgJG+z5GYDoMjWGLVOvjghDEFnKQ==}
+
+  '@types/d3-scale@4.0.9':
+    resolution: {integrity: sha512-dLmtwB8zkAeO/juAMfnV+sItKjlsw2lKdZVVy6LRr0cBmegxSABiLEpGVmSJJ8O08i4+sGR6qQtb6WtuwJdvVw==}
+
+  '@types/d3-selection@3.0.11':
+    resolution: {integrity: sha512-bhAXu23DJWsrI45xafYpkQ4NtcKMwWnAC/vKrd2l+nxMFuvOT3XMYTIj2opv8vq8AO5Yh7Qac/nSeP/3zjTK0w==}
+
+  '@types/d3-shape@3.1.8':
+    resolution: {integrity: sha512-lae0iWfcDeR7qt7rA88BNiqdvPS5pFVPpo5OfjElwNaT2yyekbM0C9vK+yqBqEmHr6lDkRnYNoTBYlAgJa7a4w==}
+
+  '@types/d3-time-format@4.0.3':
+    resolution: {integrity: sha512-5xg9rC+wWL8kdDj153qZcsJ0FWiFt0J5RB6LYUNZjwSnesfblqrI/bJ1wBdJ8OQfncgbJG5+2F+qfqnqyzYxyg==}
+
+  '@types/d3-time@3.0.4':
+    resolution: {integrity: sha512-yuzZug1nkAAaBlBBikKZTgzCeA+k1uy4ZFwWANOfKw5z5LRhV0gNA7gNkKm7HoK+HRN0wX3EkxGk0fpbWhmB7g==}
+
+  '@types/d3-timer@3.0.2':
+    resolution: {integrity: sha512-Ps3T8E8dZDam6fUyNiMkekK3XUsaUEik+idO9/YjPtfj2qruF8tFBXS7XhtE4iIXBLxhmLjP3SXpLhVf21I9Lw==}
+
+  '@types/d3-transition@3.0.9':
+    resolution: {integrity: sha512-uZS5shfxzO3rGlu0cC3bjmMFKsXv+SmZZcgp0KD22ts4uGXp5EVYGzu/0YdwZeKmddhcAccYtREJKkPfXkZuCg==}
+
+  '@types/d3-zoom@3.0.8':
+    resolution: {integrity: sha512-iqMC4/YlFCSlO8+2Ii1GGGliCAY4XdeG748w5vQUbevlbDu0zSjH/+jojorQVBK/se0j6DUFNPBGSqD3YWYnDw==}
+
+  '@types/d3@7.4.3':
+    resolution: {integrity: sha512-lZXZ9ckh5R8uiFVt8ogUNf+pIrK4EsWrx2Np75WvF/eTpJ0FMHNhjXk8CKEx/+gpHbNQyJWehbFaTvqmHWB3ww==}
+
   '@types/estree@1.0.8':
     resolution: {integrity: sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==}
 
@@ -1674,6 +1800,9 @@ packages:
   '@types/express@4.17.25':
     resolution: {integrity: sha512-dVd04UKsfpINUnK0yBoYHDF3xu7xVH4BuDotC/xGuycx4CgbP48X/KF/586bcObxT0HENHXEU8Nqtu6NR+eKhw==}
 
+  '@types/geojson@7946.0.16':
+    resolution: {integrity: sha512-6C8nqWur3j98U6+lXDfTUWIfgvZU+EumvpHKcYjujKH7woYyLj2sUmff0tRhrqM7BohUw7Pz3ZB1jj2gW9Fvmg==}
+
   '@types/glob@7.2.0':
     resolution: {integrity: sha512-ZUxbzKl0IfJILTS6t7ip5fQQM/J3TJYubDm3nMbgubNNYS62eXeUpoLUC8/7fJNiFYHTrGPQn7hspDUzIHX3UA==}
 
@@ -1749,6 +1878,9 @@ packages:
   '@types/tinycolor2@1.4.6':
     resolution: {integrity: sha512-iEN8J0BoMnsWBqjVbWH/c0G0Hh7O21lpR2/+PrvAVgWdzL7eexIFm4JN/Wn10PTcmNdtS6U67r499mlWMXOxNw==}
 
+  '@types/trusted-types@2.0.7':
+    resolution: {integrity: sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==}
+
   '@types/ws@8.18.1':
     resolution: {integrity: sha512-ThVF6DCVhA8kUGy+aazFQ4kXQ7E1Ty7A3ypFOe0IcJV8O/M511G99AW24irKrW56Wt44yG9+ij8FaqoBGkuBXg==}
 
@@ -2091,6 +2223,14 @@ packages:
   chardet@2.1.1:
     resolution: {integrity: sha512-PsezH1rqdV9VvyNhxxOW32/d75r01NY7TQCmOqomRo15ZSOKbpTFVsfjghxo6JloQUCGnH4k1LGu0R4yCLlWQQ==}
 
+  chevrotain-allstar@0.3.1:
+    resolution: {integrity: sha512-b7g+y9A0v4mxCW1qUhf3BSVPg+/NvGErk/dOkrDaHA0nQIQGAtrOjlX//9OQtRlSCy+x9rfB5N8yC71lH1nvMw==}
+    peerDependencies:
+      chevrotain: ^11.0.0
+
+  chevrotain@11.1.1:
+    resolution: {integrity: sha512-f0yv5CPKaFxfsPTBzX7vGuim4oIC1/gcS7LUGdBSwl2dU6+FON6LVUksdOo1qJjoUvXNn45urgh8C+0a24pACQ==}
+
   chokidar@3.6.0:
     resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==}
     engines: {node: '>= 8.10.0'}
@@ -2165,9 +2305,20 @@ packages:
     resolution: {integrity: sha512-zS5PnTI22FIRM6ylNW8G4Ap0IEOyk62fhLSD0+uHRT9McRCLGpkVNvao4bjimpK/GShynyQkFFxHhwMcETmduA==}
     engines: {node: '>=14'}
 
+  commander@7.2.0:
+    resolution: {integrity: sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==}
+    engines: {node: '>= 10'}
+
+  commander@8.3.0:
+    resolution: {integrity: sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==}
+    engines: {node: '>= 12'}
+
   concat-map@0.0.1:
     resolution: {integrity: sha512-/Srv4dswyQNBfohGpz9o6Yb3Gz3SrUDqBH5rTuhGR7ahtlbYKnVxw2bCFMRljaA7EXHaXZ8wsHdodFvbkhKmqg==}
 
+  confbox@0.1.8:
+    resolution: {integrity: sha512-RMtmw0iFkeR4YV+fUOSucriAQNb9g8zFR52MWCtl+cCZOFRNL6zeB395vPzFhEjjn4fMxXudmELnl/KF/WrK6w==}
+
   confbox@0.2.2:
     resolution: {integrity: sha512-1NB+BKqhtNipMsov4xI/NnhCKp9XG9NamYp5PVm9klAT0fsrNPjaFICsCFhNhwZJKNh7zB/3q8qXz0E9oaMNtQ==}
 
@@ -2203,6 +2354,12 @@ packages:
     resolution: {integrity: sha512-tJtZBBHA6vjIAaF6EnIaq6laBBP9aq/Y3ouVJjEfoHbRBcHBAHYcMh/w8LDrk2PvIMMq8gmopa5D4V8RmbrxGw==}
     engines: {node: '>= 0.10'}
 
+  cose-base@1.0.3:
+    resolution: {integrity: sha512-s9whTXInMSgAp/NVXVNuVxVKzGH2qck3aQlVHxDCdAEPgtMKwc4Wq6/QKhgdEdgbLSi9rBTAcPoRa6JpiG4ksg==}
+
+  cose-base@2.2.0:
+    resolution: {integrity: sha512-AzlgcsCbUMymkADOJtQm3wO9S3ltPfYOFD5033keQn9NJzIbtnZj+UdBJe7DYml/8TdbtHJW3j58SOnKhWY/5g==}
+
   cosmiconfig@9.0.0:
     resolution: {integrity: sha512-itvL5h8RETACmOTFc4UfIyB2RfEHi71Ax6E/PivVxq9NseKbOWpeyHEOIbmAw1rs8Ak0VursQNww7lf7YtUwzg==}
     engines: {node: '>=14'}
@@ -2222,6 +2379,162 @@ packages:
   csstype@3.2.3:
     resolution: {integrity: sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==}
 
+  cytoscape-cose-bilkent@4.1.0:
+    resolution: {integrity: sha512-wgQlVIUJF13Quxiv5e1gstZ08rnZj2XaLHGoFMYXz7SkNfCDOOteKBE6SYRfA9WxxI/iBc3ajfDoc6hb/MRAHQ==}
+    peerDependencies:
+      cytoscape: ^3.2.0
+
+  cytoscape-fcose@2.2.0:
+    resolution: {integrity: sha512-ki1/VuRIHFCzxWNrsshHYPs6L7TvLu3DL+TyIGEsRcvVERmxokbf5Gdk7mFxZnTdiGtnA4cfSmjZJMviqSuZrQ==}
+    peerDependencies:
+      cytoscape: ^3.2.0
+
+  cytoscape@3.33.1:
+    resolution: {integrity: sha512-iJc4TwyANnOGR1OmWhsS9ayRS3s+XQ185FmuHObThD+5AeJCakAAbWv8KimMTt08xCCLNgneQwFp+JRJOr9qGQ==}
+    engines: {node: '>=0.10'}
+
+  d3-array@2.12.1:
+    resolution: {integrity: sha512-B0ErZK/66mHtEsR1TkPEEkwdy+WDesimkM5gpZr5Dsg54BiTA5RXtYW5qTLIAcekaS9xfZrzBLF/OAkB3Qn1YQ==}
+
+  d3-array@3.2.4:
+    resolution: {integrity: sha512-tdQAmyA18i4J7wprpYq8ClcxZy3SC31QMeByyCFyRt7BVHdREQZ5lpzoe5mFEYZUWe+oq8HBvk9JjpibyEV4Jg==}
+    engines: {node: '>=12'}
+
+  d3-axis@3.0.0:
+    resolution: {integrity: sha512-IH5tgjV4jE/GhHkRV0HiVYPDtvfjHQlQfJHs0usq7M30XcSBvOotpmH1IgkcXsO/5gEQZD43B//fc7SRT5S+xw==}
+    engines: {node: '>=12'}
+
+  d3-brush@3.0.0:
+    resolution: {integrity: sha512-ALnjWlVYkXsVIGlOsuWH1+3udkYFI48Ljihfnh8FZPF2QS9o+PzGLBslO0PjzVoHLZ2KCVgAM8NVkXPJB2aNnQ==}
+    engines: {node: '>=12'}
+
+  d3-chord@3.0.1:
+    resolution: {integrity: sha512-VE5S6TNa+j8msksl7HwjxMHDM2yNK3XCkusIlpX5kwauBfXuyLAtNg9jCp/iHH61tgI4sb6R/EIMWCqEIdjT/g==}
+    engines: {node: '>=12'}
+
+  d3-color@3.1.0:
+    resolution: {integrity: sha512-zg/chbXyeBtMQ1LbD/WSoW2DpC3I0mpmPdW+ynRTj/x2DAWYrIY7qeZIHidozwV24m4iavr15lNwIwLxRmOxhA==}
+    engines: {node: '>=12'}
+
+  d3-contour@4.0.2:
+    resolution: {integrity: sha512-4EzFTRIikzs47RGmdxbeUvLWtGedDUNkTcmzoeyg4sP/dvCexO47AaQL7VKy/gul85TOxw+IBgA8US2xwbToNA==}
+    engines: {node: '>=12'}
+
+  d3-delaunay@6.0.4:
+    resolution: {integrity: sha512-mdjtIZ1XLAM8bm/hx3WwjfHt6Sggek7qH043O8KEjDXN40xi3vx/6pYSVTwLjEgiXQTbvaouWKynLBiUZ6SK6A==}
+    engines: {node: '>=12'}
+
+  d3-dispatch@3.0.1:
+    resolution: {integrity: sha512-rzUyPU/S7rwUflMyLc1ETDeBj0NRuHKKAcvukozwhshr6g6c5d8zh4c2gQjY2bZ0dXeGLWc1PF174P2tVvKhfg==}
+    engines: {node: '>=12'}
+
+  d3-drag@3.0.0:
+    resolution: {integrity: sha512-pWbUJLdETVA8lQNJecMxoXfH6x+mO2UQo8rSmZ+QqxcbyA3hfeprFgIT//HW2nlHChWeIIMwS2Fq+gEARkhTkg==}
+    engines: {node: '>=12'}
+
+  d3-dsv@3.0.1:
+    resolution: {integrity: sha512-UG6OvdI5afDIFP9w4G0mNq50dSOsXHJaRE8arAS5o9ApWnIElp8GZw1Dun8vP8OyHOZ/QJUKUJwxiiCCnUwm+Q==}
+    engines: {node: '>=12'}
+    hasBin: true
+
+  d3-ease@3.0.1:
+    resolution: {integrity: sha512-wR/XK3D3XcLIZwpbvQwQ5fK+8Ykds1ip7A2Txe0yxncXSdq1L9skcG7blcedkOX+ZcgxGAmLX1FrRGbADwzi0w==}
+    engines: {node: '>=12'}
+
+  d3-fetch@3.0.1:
+    resolution: {integrity: sha512-kpkQIM20n3oLVBKGg6oHrUchHM3xODkTzjMoj7aWQFq5QEM+R6E4WkzT5+tojDY7yjez8KgCBRoj4aEr99Fdqw==}
+    engines: {node: '>=12'}
+
+  d3-force@3.0.0:
+    resolution: {integrity: sha512-zxV/SsA+U4yte8051P4ECydjD/S+qeYtnaIyAs9tgHCqfguma/aAQDjo85A9Z6EKhBirHRJHXIgJUlffT4wdLg==}
+    engines: {node: '>=12'}
+
+  d3-format@3.1.2:
+    resolution: {integrity: sha512-AJDdYOdnyRDV5b6ArilzCPPwc1ejkHcoyFarqlPqT7zRYjhavcT3uSrqcMvsgh2CgoPbK3RCwyHaVyxYcP2Arg==}
+    engines: {node: '>=12'}
+
+  d3-geo@3.1.1:
+    resolution: {integrity: sha512-637ln3gXKXOwhalDzinUgY83KzNWZRKbYubaG+fGVuc/dxO64RRljtCTnf5ecMyE1RIdtqpkVcq0IbtU2S8j2Q==}
+    engines: {node: '>=12'}
+
+  d3-hierarchy@3.1.2:
+    resolution: {integrity: sha512-FX/9frcub54beBdugHjDCdikxThEqjnR93Qt7PvQTOHxyiNCAlvMrHhclk3cD5VeAaq9fxmfRp+CnWw9rEMBuA==}
+    engines: {node: '>=12'}
+
+  d3-interpolate@3.0.1:
+    resolution: {integrity: sha512-3bYs1rOD33uo8aqJfKP3JWPAibgw8Zm2+L9vBKEHJ2Rg+viTR7o5Mmv5mZcieN+FRYaAOWX5SJATX6k1PWz72g==}
+    engines: {node: '>=12'}
+
+  d3-path@1.0.9:
+    resolution: {integrity: sha512-VLaYcn81dtHVTjEHd8B+pbe9yHWpXKZUC87PzoFmsFrJqgFwDe/qxfp5MlfsfM1V5E/iVt0MmEbWQ7FVIXh/bg==}
+
+  d3-path@3.1.0:
+    resolution: {integrity: sha512-p3KP5HCf/bvjBSSKuXid6Zqijx7wIfNW+J/maPs+iwR35at5JCbLUT0LzF1cnjbCHWhqzQTIN2Jpe8pRebIEFQ==}
+    engines: {node: '>=12'}
+
+  d3-polygon@3.0.1:
+    resolution: {integrity: sha512-3vbA7vXYwfe1SYhED++fPUQlWSYTTGmFmQiany/gdbiWgU/iEyQzyymwL9SkJjFFuCS4902BSzewVGsHHmHtXg==}
+    engines: {node: '>=12'}
+
+  d3-quadtree@3.0.1:
+    resolution: {integrity: sha512-04xDrxQTDTCFwP5H6hRhsRcb9xxv2RzkcsygFzmkSIOJy3PeRJP7sNk3VRIbKXcog561P9oU0/rVH6vDROAgUw==}
+    engines: {node: '>=12'}
+
+  d3-random@3.0.1:
+    resolution: {integrity: sha512-FXMe9GfxTxqd5D6jFsQ+DJ8BJS4E/fT5mqqdjovykEB2oFbTMDVdg1MGFxfQW+FBOGoB++k8swBrgwSHT1cUXQ==}
+    engines: {node: '>=12'}
+
+  d3-sankey@0.12.3:
+    resolution: {integrity: sha512-nQhsBRmM19Ax5xEIPLMY9ZmJ/cDvd1BG3UVvt5h3WRxKg5zGRbvnteTyWAbzeSvlh3tW7ZEmq4VwR5mB3tutmQ==}
+
+  d3-scale-chromatic@3.1.0:
+    resolution: {integrity: sha512-A3s5PWiZ9YCXFye1o246KoscMWqf8BsD9eRiJ3He7C9OBaxKhAd5TFCdEx/7VbKtxxTsu//1mMJFrEt572cEyQ==}
+    engines: {node: '>=12'}
+
+  d3-scale@4.0.2:
+    resolution: {integrity: sha512-GZW464g1SH7ag3Y7hXjf8RoUuAFIqklOAq3MRl4OaWabTFJY9PN/E1YklhXLh+OQ3fM9yS2nOkCoS+WLZ6kvxQ==}
+    engines: {node: '>=12'}
+
+  d3-selection@3.0.0:
+    resolution: {integrity: sha512-fmTRWbNMmsmWq6xJV8D19U/gw/bwrHfNXxrIN+HfZgnzqTHp9jOmKMhsTUjXOJnZOdZY9Q28y4yebKzqDKlxlQ==}
+    engines: {node: '>=12'}
+
+  d3-shape@1.3.7:
+    resolution: {integrity: sha512-EUkvKjqPFUAZyOlhY5gzCxCeI0Aep04LwIRpsZ/mLFelJiUfnK56jo5JMDSE7yyP2kLSb6LtF+S5chMk7uqPqw==}
+
+  d3-shape@3.2.0:
+    resolution: {integrity: sha512-SaLBuwGm3MOViRq2ABk3eLoxwZELpH6zhl3FbAoJ7Vm1gofKx6El1Ib5z23NUEhF9AsGl7y+dzLe5Cw2AArGTA==}
+    engines: {node: '>=12'}
+
+  d3-time-format@4.1.0:
+    resolution: {integrity: sha512-dJxPBlzC7NugB2PDLwo9Q8JiTR3M3e4/XANkreKSUxF8vvXKqm1Yfq4Q5dl8budlunRVlUUaDUgFt7eA8D6NLg==}
+    engines: {node: '>=12'}
+
+  d3-time@3.1.0:
+    resolution: {integrity: sha512-VqKjzBLejbSMT4IgbmVgDjpkYrNWUYJnbCGo874u7MMKIWsILRX+OpX/gTk8MqjpT1A/c6HY2dCA77ZN0lkQ2Q==}
+    engines: {node: '>=12'}
+
+  d3-timer@3.0.1:
+    resolution: {integrity: sha512-ndfJ/JxxMd3nw31uyKoY2naivF+r29V+Lc0svZxe1JvvIRmi8hUsrMvdOwgS1o6uBHmiz91geQ0ylPP0aj1VUA==}
+    engines: {node: '>=12'}
+
+  d3-transition@3.0.1:
+    resolution: {integrity: sha512-ApKvfjsSR6tg06xrL434C0WydLr7JewBB3V+/39RMHsaXTOG0zmt/OAXeng5M5LBm0ojmxJrpomQVZ1aPvBL4w==}
+    engines: {node: '>=12'}
+    peerDependencies:
+      d3-selection: 2 - 3
+
+  d3-zoom@3.0.0:
+    resolution: {integrity: sha512-b8AmV3kfQaqWAuacbPuNbL6vahnOJflOhexLzMMNLga62+/nh0JzvJ0aO/5a5MVgUFGS7Hu1P9P03o3fJkDCyw==}
+    engines: {node: '>=12'}
+
+  d3@7.9.0:
+    resolution: {integrity: sha512-e1U46jVP+w7Iut8Jt8ri1YsPOvFpg46k+K8TpCb0P+zjCkjkPnV7WzfDJzMHy1LnA+wj5pLT1wjO901gLXeEhA==}
+    engines: {node: '>=12'}
+
+  dagre-d3-es@7.0.13:
+    resolution: {integrity: sha512-efEhnxpSuwpYOKRm/L5KbqoZmNNukHa/Flty4Wp62JRvgH2ojwVgPgdYyr4twpieZnyRDdIH7PY2mopX26+j2Q==}
+
   data-uri-to-buffer@6.0.2:
     resolution: {integrity: sha512-7hvf7/GW8e86rW0ptuwS3OcBGDjIi6SZva7hCyWC0yYry2cOPmLIjXAUHI6DK2HsnwJd9ifmt57i8eV2n4YNpw==}
     engines: {node: '>= 14'}
@@ -2238,6 +2551,9 @@ packages:
     resolution: {integrity: sha512-BS8PfmtDGnrgYdOonGZQdLZslWIeCGFP9tpan0hi1Co2Zr2NKADsvGYA8XxuG/4UWgJ6Cjtv+YJnB6MM69QGlQ==}
     engines: {node: '>= 0.4'}
 
+  dayjs@1.11.19:
+    resolution: {integrity: sha512-t5EcLVS6QPBNqM2z8fakk/NKel+Xzshgt8FFKAn+qwlD1pzZWxh0nVCrvFK7ZDb6XucZeF9z8C7CBWTRIVApAw==}
+
   debug@2.6.9:
     resolution: {integrity: sha512-bC7ElrdJaJnPbAP+1EotYvqZsb3ecl5wi6Bfi6BJTUcNowp6cvspg0jXznRTKDjm/E7AdgFBVeAPVMNcKGsHMA==}
     peerDependencies:
@@ -2288,6 +2604,9 @@ packages:
     resolution: {integrity: sha512-wH9xOVHnczo9jN2IW68BabcecVPxacIA3g/7z6vhSU/4stOKQzeCRK0yD0A24WiAAUJmmVpWqrERcTxnLo3AnA==}
     engines: {node: '>=8'}
 
+  delaunator@5.0.1:
+    resolution: {integrity: sha512-8nvh+XBe96aCESrGOqMp/84b13H9cdKbG5P2ejQCh4d4sK9RL4371qou9drQjMhvnPmhWl5hnmqbEE0fXr9Xnw==}
+
   delayed-stream@1.0.0:
     resolution: {integrity: sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==}
     engines: {node: '>=0.4.0'}
@@ -2329,6 +2648,9 @@ packages:
     resolution: {integrity: sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==}
     engines: {node: '>=0.10.0'}
 
+  dompurify@3.3.1:
+    resolution: {integrity: sha512-qkdCKzLNtrgPFP1Vo+98FRzJnBRGe4ffyCea9IwHB1fyxPOeNTHpLKYGd4Uk9xvNoH0ZoOjwZxNptyMwqrId1Q==}
+
   dot-case@2.1.1:
     resolution: {integrity: sha512-HnM6ZlFqcajLsyudHq7LeeLDr2rFAVYtDv/hV5qchQEidSck8j9OPUsXY9KwJv/lHMtYlX4DjRQqwFYa+0r8Ug==}
 
@@ -2739,6 +3061,9 @@ packages:
   groq-sdk@0.37.0:
     resolution: {integrity: sha512-lT72pcT8b/X5XrzdKf+rWVzUGW1OQSKESmL8fFN5cTbsf02gq6oFam4SVeNtzELt9cYE2Pt3pdGgSImuTbHFDg==}
 
+  hachure-fill@0.5.2:
+    resolution: {integrity: sha512-3GKBOn+m2LX9iq+JC1064cSFprJY4jL1jCXTcpnfER5HYE2l/4EfWSGzkPa/ZDBmYI0ZOEj5VHV/eKnPGkHuOg==}
+
   handlebars@4.7.8:
     resolution: {integrity: sha512-vafaFqs8MZkRrSX7sFVUdo3ap/eNiLnb4IakshzvP56X5Nr1iGKAIqdX6tMlm6HcNRIkr6AxO5jFEoJzzpT8aQ==}
     engines: {node: '>=0.4.7'}
@@ -2811,6 +3136,10 @@ packages:
     resolution: {integrity: sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==}
     engines: {node: '>=0.10.0'}
 
+  iconv-lite@0.6.3:
+    resolution: {integrity: sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==}
+    engines: {node: '>=0.10.0'}
+
   iconv-lite@0.7.2:
     resolution: {integrity: sha512-im9DjEDQ55s9fL4EYzOAv0yMqmMBSZp6G0VvFyTMPKWxiSBHUj9NW/qqLmXUwXrrM7AvqSlTCfvqRb0cM8yYqw==}
     engines: {node: '>=0.10.0'}
@@ -2866,6 +3195,13 @@ packages:
     resolution: {integrity: sha512-4gd7VpWNQNB4UKKCFFVcp1AVv+FMOgs9NKzjHKusc8jTMhd5eL1NqQqOpE0KzMds804/yHlglp3uxgluOqAPLw==}
     engines: {node: '>= 0.4'}
 
+  internmap@1.0.1:
+    resolution: {integrity: sha512-lDB5YccMydFBtasVtxnZ3MRBHuaoE8GKsppq+EchKL2U4nK/DmEpPHNH8MZe5HkMtpSiTSOZwfN0tzYjO/lJEw==}
+
+  internmap@2.0.3:
+    resolution: {integrity: sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==}
+    engines: {node: '>=12'}
+
   ip-address@9.0.5:
     resolution: {integrity: sha512-zHtQzGojZXTwZTHQqra+ETKd4Sn3vgi7uBmlPoXVWZqYvuKmtI0l/VZTjqGmJY9x88GGOaZ9+G9ES8hC4T4X8g==}
     engines: {node: '>= 12'}
@@ -3078,9 +3414,26 @@ packages:
   jws@4.0.1:
     resolution: {integrity: sha512-EKI/M/yqPncGUUh44xz0PxSidXFr/+r0pA70+gIYhjv+et7yxM+s29Y+VGDkovRofQem0fs7Uvf4+YmAdyRduA==}
 
+  katex@0.16.33:
+    resolution: {integrity: sha512-q3N5u+1sY9Bu7T4nlXoiRBXWfwSefNGoKeOwekV+gw0cAXQlz2Ww6BLcmBxVDeXBMUDQv6fK5bcNaJLxob3ZQA==}
+    hasBin: true
+
   keyv@4.5.4:
     resolution: {integrity: sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==}
 
+  khroma@2.1.0:
+    resolution: {integrity: sha512-Ls993zuzfayK269Svk9hzpeGUKob/sIgZzyHYdjQoAdQetRKpOLj+k/QQQ/6Qi0Yz65mlROrfd+Ev+1+7dz9Kw==}
+
+  langium@4.2.1:
+    resolution: {integrity: sha512-zu9QWmjpzJcomzdJQAHgDVhLGq5bLosVak1KVa40NzQHXfqr4eAHupvnPOVXEoLkg6Ocefvf/93d//SB7du4YQ==}
+    engines: {node: '>=20.10.0', npm: '>=10.2.3'}
+
+  layout-base@1.0.2:
+    resolution: {integrity: sha512-8h2oVEZNktL4BH2JCOI90iD1yXwL6iNW7KcCKT2QZgQJR2vbqDsldCTPRU9NifTCqHZci57XvQQ15YTu+sTYPg==}
+
+  layout-base@2.0.1:
+    resolution: {integrity: sha512-dp3s92+uNI1hWIpPGH3jK2kxE2lMjdXdr+DH8ynZHpd6PUlH6x6cbuXnoMmiNumznqaNO31xu9e79F0uuZ0JFg==}
+
   levn@0.4.1:
     resolution: {integrity: sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==}
     engines: {node: '>= 0.8.0'}
@@ -3162,6 +3515,9 @@ packages:
     resolution: {integrity: sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==}
     engines: {node: '>=10'}
 
+  lodash-es@4.17.23:
+    resolution: {integrity: sha512-kVI48u3PZr38HdYz98UmfPnXl2DXrpdctLrFLCd3kOx1xUkOmpFPx7gCWWM5MPkL/fD8zb+Ph0QzjGFs4+hHWg==}
+
   lodash.get@4.4.2:
     resolution: {integrity: sha512-z+Uw/vLuy6gQe8cfaFWD7p0wVv8fJl3mbzXh33RS+0oW2wvUqiRXiQ69gLWSLpgB5/6sU+r6BlQR0MBILadqTQ==}
     deprecated: This package is deprecated. Use the optional chaining (?.) operator instead.
@@ -3235,6 +3591,11 @@ packages:
   make-event-props@2.0.0:
     resolution: {integrity: sha512-G/hncXrl4Qt7mauJEXSg3AcdYzmpkIITTNl5I+rH9sog5Yw0kK6vseJjCaPfOXqOqQuPUP89Rkhfz5kPS8ijtw==}
 
+  marked@16.4.2:
+    resolution: {integrity: sha512-TI3V8YYWvkVf3KJe1dRkpnjs68JUPyEa5vjKrp1XEEJUAOaQc+Qj+L1qWbPd0SJuAdQkFU0h73sXXqwDYxsiDA==}
+    engines: {node: '>= 20'}
+    hasBin: true
+
   math-intrinsics@1.1.0:
     resolution: {integrity: sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==}
     engines: {node: '>= 0.4'}
@@ -3261,6 +3622,9 @@ packages:
     resolution: {integrity: sha512-8q7VEgMJW4J8tcfVPy8g09NcQwZdbwFEqhe/WZkoIzjn/3TGDwtOCYtXGxA3O8tPzpczCCDgv+P2P5y00ZJOOg==}
     engines: {node: '>= 8'}
 
+  mermaid@11.12.3:
+    resolution: {integrity: sha512-wN5ZSgJQIC+CHJut9xaKWsknLxaFBwCPwPkGTSUYrTiHORWvpT8RxGk849HPnpUAQ+/9BPRqYb80jTpearrHzQ==}
+
   methods@1.1.2:
     resolution: {integrity: sha512-iclAHeNqNm68zFtnZ0e+1L2yUIdvzNoauKU4WBA3VvH/vPFieF7qfRlwUZU+DA9P9bPXIS90ulxoUoCH23sV2w==}
     engines: {node: '>= 0.6'}
@@ -3312,6 +3676,9 @@ packages:
     engines: {node: '>=10'}
     hasBin: true
 
+  mlly@1.8.0:
+    resolution: {integrity: sha512-l8D9ODSRWLe2KHJSifWGwBqpTZXIXTeo8mlKjY+E2HAakaTeNpqAyBZ8GSqLzHgw4XmHmC8whvpjJNMbFZN7/g==}
+
   ms@2.0.0:
     resolution: {integrity: sha512-Tpp60P6IUJDTuOq/5Z8cdskzJujfwqfOTkrwIwj7IRISpnkJnT6SyJ4PCPnGMoFjC9ddhal5KVIYtAt97ix05A==}
 
@@ -3489,6 +3856,9 @@ packages:
     resolution: {integrity: sha512-5NPgf87AT2STgwa2ntRMr45jTKrYBGkVU36yT0ig/n/GMAa3oPqhZfIQ2kMEimReg0+t9kZViDVZ83qfVUlckg==}
     engines: {node: '>= 14'}
 
+  package-manager-detector@1.6.0:
+    resolution: {integrity: sha512-61A5ThoTiDG/C8s8UMZwSorAGwMJ0ERVGj2OjoW5pAalsNOg15+iQiPzrLJ4jhZ1HJzmC2PIHT2oEiH3R5fzNA==}
+
   param-case@2.1.1:
     resolution: {integrity: sha512-eQE845L6ot89sk2N8liD8HAuH4ca6Vvr7VWAWwt7+kvvG5aBcPmmphQ68JsEG2qa9n1TykS2DLeMt363AAH8/w==}
 
@@ -3510,6 +3880,9 @@ packages:
   path-case@2.1.1:
     resolution: {integrity: sha512-Ou0N05MioItesaLr9q8TtHVWmJ6fxWdqKB2RohFmNWVyJ+2zeKIeDNWAN6B/Pe7wpzWChhZX6nONYmOnMeJQ/Q==}
 
+  path-data-parser@0.1.0:
+    resolution: {integrity: sha512-NOnmBpt5Y2RWbuv0LMzsayp3lVylAHLPUTut412ZA3l+C4uw4ZVkQbjShYCQ8TCpUMdPapr4YjUqLYD6v68j+w==}
+
   path-exists@4.0.0:
     resolution: {integrity: sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==}
     engines: {node: '>=8'}
@@ -3559,9 +3932,18 @@ packages:
     resolution: {integrity: sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==}
     engines: {node: '>=12'}
 
+  pkg-types@1.3.1:
+    resolution: {integrity: sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==}
+
   pkg-types@2.3.0:
     resolution: {integrity: sha512-SIqCzDRg0s9npO5XQ3tNZioRY1uK06lA41ynBC1YmFTmnY6FjUjVt6s4LoADmwoig1qqD0oK8h1p/8mlMx8Oig==}
 
+  points-on-curve@0.2.0:
+    resolution: {integrity: sha512-0mYKnYYe9ZcqMCWhUjItv/oHjvgEsfKvnUTg8sAtnHr3GVy7rGkXCb6d5cSyqrWqL4k81b9CPg3urd+T7aop3A==}
+
+  points-on-path@0.2.1:
+    resolution: {integrity: sha512-25ClnWWuw7JbWZcgqY/gJ4FQWadKxGWk+3kR/7kD0tCaDtPPMj7oHu2ToLaVhfpnHrZzYby2w6tUA0eOIuUg8g==}
+
   possible-typed-array-names@1.1.0:
     resolution: {integrity: sha512-/+5VFTchJDoVj3bhoqi6UeymcD00DAwb1nJwamzPvHEszJ4FpF6SNNbUbOS8yI56qHzdV8eK0qEfOSiodkTdxg==}
     engines: {node: '>= 0.4'}
@@ -3786,6 +4168,12 @@ packages:
     deprecated: Rimraf versions prior to v4 are no longer supported
     hasBin: true
 
+  robust-predicates@3.0.2:
+    resolution: {integrity: sha512-IXgzBWvWQwE6PrDI05OvmXUIruQTcoMDzRsOd5CDvHCVLcLHMTSYvOK5Cm46kWqlV3yAbuSpBZdJ5oP5OUoStg==}
+
+  roughjs@4.6.6:
+    resolution: {integrity: sha512-ZUz/69+SYpFN/g/lUlo2FXcIjRkSu3nDarreVdGGndHEBJ6cXPdKguS8JGxwj5HA5xIbVKSmLgr5b3AWxtRfvQ==}
+
   run-async@2.4.1:
     resolution: {integrity: sha512-tvVnVv01b8c1RrA6Ep7JkStj85Guv/YrMcwqYQnwjsAS2cTmmPGBBjAjpCW7RrSodNSoE2/qg9O4bceNvUuDgQ==}
     engines: {node: '>=0.12.0'}
@@ -3793,6 +4181,9 @@ packages:
   run-parallel@1.2.0:
     resolution: {integrity: sha512-5l4VyZR86LZ/lDxZTR6jqL8AFE2S0IFLMP26AbjsLVADxHdhB/c0GUsH+y39UfCi3dzz8OlQuPmnaJOMoDHQBA==}
 
+  rw@1.3.3:
+    resolution: {integrity: sha512-PdhdWy89SiZogBLaw42zdeqtRJ//zFd2PgQavcICDUgJT5oW10QCRKbJ6bg4r0/UY2M6BWd5tkxuGFRvCkgfHQ==}
+
   rxjs@6.6.7:
     resolution: {integrity: sha512-hTdwr+7yYNIT5n4AMYp85KA6yw2Va0FLa3Rguvbpa4W3I5xynaBZo41cM3XM+4Q6fRMj3sBYIR1VAmZMXYJvRQ==}
     engines: {npm: '>=2.0.0'}
@@ -3995,6 +4386,9 @@ packages:
       babel-plugin-macros:
         optional: true
 
+  stylis@4.3.6:
+    resolution: {integrity: sha512-yQ3rwFWRfwNUY7H5vpU0wfdkNSnvnJinhF9830Swlaxl03zsOjCfmX0ugac+3LtK0lYSgwL/KXc8oYL3mG4YFQ==}
+
   supports-color@5.5.0:
     resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==}
     engines: {node: '>=4'}
@@ -4077,6 +4471,10 @@ packages:
     peerDependencies:
       typescript: '>=4.8.4'
 
+  ts-dedent@2.2.0:
+    resolution: {integrity: sha512-q5W7tVM71e2xjHZTlgfTDoPF/SmqKG5hddq9SzR49CH2hayqRKJtQ4mtRlSxKaJlR/+9rEM+mnBHf7I2/BQcpQ==}
+    engines: {node: '>=6.10'}
+
   ts-node-dev@2.0.0:
     resolution: {integrity: sha512-ywMrhCfH6M75yftYvrvNarLEY+SUXtUvU8/0Z6llrHQVBx12GiFk5sStF8UdfE/yfzk9IAq7O5EEbTQsxlBI8w==}
     engines: {node: '>=0.8.0'}
@@ -4191,6 +4589,9 @@ packages:
     engines: {node: '>=14.17'}
     hasBin: true
 
+  ufo@1.6.3:
+    resolution: {integrity: sha512-yDJTmhydvl5lJzBmy/hyOAA0d+aqCBuwl818haVdYCRrWV84o7YyeVm4QlVHStqNrrJSTb6jKuFAVqAFsr+K3Q==}
+
   uglify-js@3.19.3:
     resolution: {integrity: sha512-v3Xu+yuwBXisp6QYTcH4UbH+xYJXqnq2m/LtQVWKWzYc1iehYnLixoQDN9FH6/j9/oybfd6W9Ghwkl8+UMKTKQ==}
     engines: {node: '>=0.8.0'}
@@ -4267,6 +4668,10 @@ packages:
     resolution: {integrity: sha512-pMZTvIkT1d+TFGvDOqodOclx0QWkkgi6Tdoa8gC8ffGAAqz9pzPTZWAybbsHHoED/ztMtkv/VoYTYyShUn81hA==}
     engines: {node: '>= 0.4.0'}
 
+  uuid@11.1.0:
+    resolution: {integrity: sha512-0/A9rDy9P7cJ+8w1c9WD9V//9Wj15Ce2MPz8Ri6032usz+NfePxx5AcN3bN+r6ZL6jEo066/yNYB3tn4pQEx+A==}
+    hasBin: true
+
   v8-compile-cache-lib@3.0.1:
     resolution: {integrity: sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==}
 
@@ -4278,6 +4683,26 @@ packages:
     resolution: {integrity: sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==}
     engines: {node: '>= 0.8'}
 
+  vscode-jsonrpc@8.2.0:
+    resolution: {integrity: sha512-C+r0eKJUIfiDIfwJhria30+TYWPtuHJXHtI7J0YlOmKAo7ogxP20T0zxB7HZQIFhIyvoBPwWskjxrvAtfjyZfA==}
+    engines: {node: '>=14.0.0'}
+
+  vscode-languageserver-protocol@3.17.5:
+    resolution: {integrity: sha512-mb1bvRJN8SVznADSGWM9u/b07H7Ecg0I3OgXDuLdn307rl/J3A9YD6/eYOssqhecL27hK1IPZAsaqh00i/Jljg==}
+
+  vscode-languageserver-textdocument@1.0.12:
+    resolution: {integrity: sha512-cxWNPesCnQCcMPeenjKKsOCKQZ/L6Tv19DTRIGuLWe32lyzWhihGVJ/rcckZXJxfdKCFvRLS3fpBIsV/ZGX4zA==}
+
+  vscode-languageserver-types@3.17.5:
+    resolution: {integrity: sha512-Ld1VelNuX9pdF39h2Hgaeb5hEZM2Z3jUrrMgWQAu82jMtZp7p3vJT3BzToKtZI7NgQssZje5o0zryOrhQvzQAg==}
+
+  vscode-languageserver@9.0.1:
+    resolution: {integrity: sha512-woByF3PDpkHFUreUa7Hos7+pUWdeWMXRd26+ZX2A8cFx6v/JPTtd4/uN0/jB6XQHYaOlHbio03NTHCqrgG5n7g==}
+    hasBin: true
+
+  vscode-uri@3.1.0:
+    resolution: {integrity: sha512-/BpdSx+yCQGnCvecbyXdxHDkuk55/G3xwnC0GqY4gmQ3j+A+g8kzzgB4Nk/SINjqn6+waqw3EgbVF2QKExkRxQ==}
+
   warning@4.0.3:
     resolution: {integrity: sha512-rpJyN222KWIvHJ/F53XSZv0Zl/accqHR8et1kpaMTD/fLCRxtV8iX8czMzY7sVZupTI3zcUTg8eycS2kNF9l6w==}
 
@@ -4391,6 +4816,11 @@ snapshots:
 
   '@alloc/quick-lru@5.2.0': {}
 
+  '@antfu/install-pkg@1.1.0':
+    dependencies:
+      package-manager-detector: 1.6.0
+      tinyexec: 1.0.2
+
   '@babel/code-frame@7.29.0':
     dependencies:
       '@babel/helper-validator-identifier': 7.28.5
@@ -4495,6 +4925,25 @@ snapshots:
       '@babel/helper-string-parser': 7.27.1
       '@babel/helper-validator-identifier': 7.28.5
 
+  '@braintree/sanitize-url@7.1.2': {}
+
+  '@chevrotain/cst-dts-gen@11.1.1':
+    dependencies:
+      '@chevrotain/gast': 11.1.1
+      '@chevrotain/types': 11.1.1
+      lodash-es: 4.17.23
+
+  '@chevrotain/gast@11.1.1':
+    dependencies:
+      '@chevrotain/types': 11.1.1
+      lodash-es: 4.17.23
+
+  '@chevrotain/regexp-to-ast@11.1.1': {}
+
+  '@chevrotain/types@11.1.1': {}
+
+  '@chevrotain/utils@11.1.1': {}
+
   '@cspotcode/source-map-support@0.8.1':
     dependencies:
       '@jridgewell/trace-mapping': 0.3.9
@@ -4583,6 +5032,14 @@ snapshots:
 
   '@humanwhocodes/retry@0.4.3': {}
 
+  '@iconify/types@2.0.0': {}
+
+  '@iconify/utils@3.1.0':
+    dependencies:
+      '@antfu/install-pkg': 1.1.0
+      '@iconify/types': 2.0.0
+      mlly: 1.8.0
+
   '@img/colour@1.0.0':
     optional: true
 
@@ -4711,6 +5168,10 @@ snapshots:
       '@jridgewell/resolve-uri': 3.1.2
       '@jridgewell/sourcemap-codec': 1.5.5
 
+  '@mermaid-js/parser@1.0.0':
+    dependencies:
+      langium: 4.2.1
+
   '@napi-rs/canvas-android-arm64@0.1.94':
     optional: true
 
@@ -5799,6 +6260,123 @@ snapshots:
     dependencies:
       '@types/node': 25.2.0
 
+  '@types/d3-array@3.2.2': {}
+
+  '@types/d3-axis@3.0.6':
+    dependencies:
+      '@types/d3-selection': 3.0.11
+
+  '@types/d3-brush@3.0.6':
+    dependencies:
+      '@types/d3-selection': 3.0.11
+
+  '@types/d3-chord@3.0.6': {}
+
+  '@types/d3-color@3.1.3': {}
+
+  '@types/d3-contour@3.0.6':
+    dependencies:
+      '@types/d3-array': 3.2.2
+      '@types/geojson': 7946.0.16
+
+  '@types/d3-delaunay@6.0.4': {}
+
+  '@types/d3-dispatch@3.0.7': {}
+
+  '@types/d3-drag@3.0.7':
+    dependencies:
+      '@types/d3-selection': 3.0.11
+
+  '@types/d3-dsv@3.0.7': {}
+
+  '@types/d3-ease@3.0.2': {}
+
+  '@types/d3-fetch@3.0.7':
+    dependencies:
+      '@types/d3-dsv': 3.0.7
+
+  '@types/d3-force@3.0.10': {}
+
+  '@types/d3-format@3.0.4': {}
+
+  '@types/d3-geo@3.1.0':
+    dependencies:
+      '@types/geojson': 7946.0.16
+
+  '@types/d3-hierarchy@3.1.7': {}
+
+  '@types/d3-interpolate@3.0.4':
+    dependencies:
+      '@types/d3-color': 3.1.3
+
+  '@types/d3-path@3.1.1': {}
+
+  '@types/d3-polygon@3.0.2': {}
+
+  '@types/d3-quadtree@3.0.6': {}
+
+  '@types/d3-random@3.0.3': {}
+
+  '@types/d3-scale-chromatic@3.1.0': {}
+
+  '@types/d3-scale@4.0.9':
+    dependencies:
+      '@types/d3-time': 3.0.4
+
+  '@types/d3-selection@3.0.11': {}
+
+  '@types/d3-shape@3.1.8':
+    dependencies:
+      '@types/d3-path': 3.1.1
+
+  '@types/d3-time-format@4.0.3': {}
+
+  '@types/d3-time@3.0.4': {}
+
+  '@types/d3-timer@3.0.2': {}
+
+  '@types/d3-transition@3.0.9':
+    dependencies:
+      '@types/d3-selection': 3.0.11
+
+  '@types/d3-zoom@3.0.8':
+    dependencies:
+      '@types/d3-interpolate': 3.0.4
+      '@types/d3-selection': 3.0.11
+
+  '@types/d3@7.4.3':
+    dependencies:
+      '@types/d3-array': 3.2.2
+      '@types/d3-axis': 3.0.6
+      '@types/d3-brush': 3.0.6
+      '@types/d3-chord': 3.0.6
+      '@types/d3-color': 3.1.3
+      '@types/d3-contour': 3.0.6
+      '@types/d3-delaunay': 6.0.4
+      '@types/d3-dispatch': 3.0.7
+      '@types/d3-drag': 3.0.7
+      '@types/d3-dsv': 3.0.7
+      '@types/d3-ease': 3.0.2
+      '@types/d3-fetch': 3.0.7
+      '@types/d3-force': 3.0.10
+      '@types/d3-format': 3.0.4
+      '@types/d3-geo': 3.1.0
+      '@types/d3-hierarchy': 3.1.7
+      '@types/d3-interpolate': 3.0.4
+      '@types/d3-path': 3.1.1
+      '@types/d3-polygon': 3.0.2
+      '@types/d3-quadtree': 3.0.6
+      '@types/d3-random': 3.0.3
+      '@types/d3-scale': 4.0.9
+      '@types/d3-scale-chromatic': 3.1.0
+      '@types/d3-selection': 3.0.11
+      '@types/d3-shape': 3.1.8
+      '@types/d3-time': 3.0.4
+      '@types/d3-time-format': 4.0.3
+      '@types/d3-timer': 3.0.2
+      '@types/d3-transition': 3.0.9
+      '@types/d3-zoom': 3.0.8
+
   '@types/estree@1.0.8': {}
 
   '@types/express-serve-static-core@4.19.8':
@@ -5815,6 +6393,8 @@ snapshots:
       '@types/qs': 6.14.0
       '@types/serve-static': 1.15.10
 
+  '@types/geojson@7946.0.16': {}
+
   '@types/glob@7.2.0':
     dependencies:
       '@types/minimatch': 6.0.0
@@ -5898,6 +6478,9 @@ snapshots:
 
   '@types/tinycolor2@1.4.6': {}
 
+  '@types/trusted-types@2.0.7':
+    optional: true
+
   '@types/ws@8.18.1':
     dependencies:
       '@types/node': 25.2.0
@@ -6329,6 +6912,20 @@ snapshots:
 
   chardet@2.1.1: {}
 
+  chevrotain-allstar@0.3.1(chevrotain@11.1.1):
+    dependencies:
+      chevrotain: 11.1.1
+      lodash-es: 4.17.23
+
+  chevrotain@11.1.1:
+    dependencies:
+      '@chevrotain/cst-dts-gen': 11.1.1
+      '@chevrotain/gast': 11.1.1
+      '@chevrotain/regexp-to-ast': 11.1.1
+      '@chevrotain/types': 11.1.1
+      '@chevrotain/utils': 11.1.1
+      lodash-es: 4.17.23
+
   chokidar@3.6.0:
     dependencies:
       anymatch: 3.1.3
@@ -6401,8 +6998,14 @@ snapshots:
 
   commander@10.0.0: {}
 
+  commander@7.2.0: {}
+
+  commander@8.3.0: {}
+
   concat-map@0.0.1: {}
 
+  confbox@0.1.8: {}
+
   confbox@0.2.2: {}
 
   consola@3.4.2: {}
@@ -6431,6 +7034,14 @@ snapshots:
       object-assign: 4.1.1
       vary: 1.1.2
 
+  cose-base@1.0.3:
+    dependencies:
+      layout-base: 1.0.2
+
+  cose-base@2.2.0:
+    dependencies:
+      layout-base: 2.0.1
+
   cosmiconfig@9.0.0(typescript@5.9.3):
     dependencies:
       env-paths: 2.2.1
@@ -6450,6 +7061,190 @@ snapshots:
 
   csstype@3.2.3: {}
 
+  cytoscape-cose-bilkent@4.1.0(cytoscape@3.33.1):
+    dependencies:
+      cose-base: 1.0.3
+      cytoscape: 3.33.1
+
+  cytoscape-fcose@2.2.0(cytoscape@3.33.1):
+    dependencies:
+      cose-base: 2.2.0
+      cytoscape: 3.33.1
+
+  cytoscape@3.33.1: {}
+
+  d3-array@2.12.1:
+    dependencies:
+      internmap: 1.0.1
+
+  d3-array@3.2.4:
+    dependencies:
+      internmap: 2.0.3
+
+  d3-axis@3.0.0: {}
+
+  d3-brush@3.0.0:
+    dependencies:
+      d3-dispatch: 3.0.1
+      d3-drag: 3.0.0
+      d3-interpolate: 3.0.1
+      d3-selection: 3.0.0
+      d3-transition: 3.0.1(d3-selection@3.0.0)
+
+  d3-chord@3.0.1:
+    dependencies:
+      d3-path: 3.1.0
+
+  d3-color@3.1.0: {}
+
+  d3-contour@4.0.2:
+    dependencies:
+      d3-array: 3.2.4
+
+  d3-delaunay@6.0.4:
+    dependencies:
+      delaunator: 5.0.1
+
+  d3-dispatch@3.0.1: {}
+
+  d3-drag@3.0.0:
+    dependencies:
+      d3-dispatch: 3.0.1
+      d3-selection: 3.0.0
+
+  d3-dsv@3.0.1:
+    dependencies:
+      commander: 7.2.0
+      iconv-lite: 0.6.3
+      rw: 1.3.3
+
+  d3-ease@3.0.1: {}
+
+  d3-fetch@3.0.1:
+    dependencies:
+      d3-dsv: 3.0.1
+
+  d3-force@3.0.0:
+    dependencies:
+      d3-dispatch: 3.0.1
+      d3-quadtree: 3.0.1
+      d3-timer: 3.0.1
+
+  d3-format@3.1.2: {}
+
+  d3-geo@3.1.1:
+    dependencies:
+      d3-array: 3.2.4
+
+  d3-hierarchy@3.1.2: {}
+
+  d3-interpolate@3.0.1:
+    dependencies:
+      d3-color: 3.1.0
+
+  d3-path@1.0.9: {}
+
+  d3-path@3.1.0: {}
+
+  d3-polygon@3.0.1: {}
+
+  d3-quadtree@3.0.1: {}
+
+  d3-random@3.0.1: {}
+
+  d3-sankey@0.12.3:
+    dependencies:
+      d3-array: 2.12.1
+      d3-shape: 1.3.7
+
+  d3-scale-chromatic@3.1.0:
+    dependencies:
+      d3-color: 3.1.0
+      d3-interpolate: 3.0.1
+
+  d3-scale@4.0.2:
+    dependencies:
+      d3-array: 3.2.4
+      d3-format: 3.1.2
+      d3-interpolate: 3.0.1
+      d3-time: 3.1.0
+      d3-time-format: 4.1.0
+
+  d3-selection@3.0.0: {}
+
+  d3-shape@1.3.7:
+    dependencies:
+      d3-path: 1.0.9
+
+  d3-shape@3.2.0:
+    dependencies:
+      d3-path: 3.1.0
+
+  d3-time-format@4.1.0:
+    dependencies:
+      d3-time: 3.1.0
+
+  d3-time@3.1.0:
+    dependencies:
+      d3-array: 3.2.4
+
+  d3-timer@3.0.1: {}
+
+  d3-transition@3.0.1(d3-selection@3.0.0):
+    dependencies:
+      d3-color: 3.1.0
+      d3-dispatch: 3.0.1
+      d3-ease: 3.0.1
+      d3-interpolate: 3.0.1
+      d3-selection: 3.0.0
+      d3-timer: 3.0.1
+
+  d3-zoom@3.0.0:
+    dependencies:
+      d3-dispatch: 3.0.1
+      d3-drag: 3.0.0
+      d3-interpolate: 3.0.1
+      d3-selection: 3.0.0
+      d3-transition: 3.0.1(d3-selection@3.0.0)
+
+  d3@7.9.0:
+    dependencies:
+      d3-array: 3.2.4
+      d3-axis: 3.0.0
+      d3-brush: 3.0.0
+      d3-chord: 3.0.1
+      d3-color: 3.1.0
+      d3-contour: 4.0.2
+      d3-delaunay: 6.0.4
+      d3-dispatch: 3.0.1
+      d3-drag: 3.0.0
+      d3-dsv: 3.0.1
+      d3-ease: 3.0.1
+      d3-fetch: 3.0.1
+      d3-force: 3.0.0
+      d3-format: 3.1.2
+      d3-geo: 3.1.1
+      d3-hierarchy: 3.1.2
+      d3-interpolate: 3.0.1
+      d3-path: 3.1.0
+      d3-polygon: 3.0.1
+      d3-quadtree: 3.0.1
+      d3-random: 3.0.1
+      d3-scale: 4.0.2
+      d3-scale-chromatic: 3.1.0
+      d3-selection: 3.0.0
+      d3-shape: 3.2.0
+      d3-time: 3.1.0
+      d3-time-format: 4.1.0
+      d3-timer: 3.0.1
+      d3-transition: 3.0.1(d3-selection@3.0.0)
+      d3-zoom: 3.0.0
+
+  dagre-d3-es@7.0.13:
+    dependencies:
+      d3: 7.9.0
+      lodash-es: 4.17.23
+
   data-uri-to-buffer@6.0.2: {}
 
   data-view-buffer@1.0.2:
@@ -6470,6 +7265,8 @@ snapshots:
       es-errors: 1.3.0
       is-data-view: 1.0.2
 
+  dayjs@1.11.19: {}
+
   debug@2.6.9:
     dependencies:
       ms: 2.0.0
@@ -6519,6 +7316,10 @@ snapshots:
       rimraf: 3.0.2
       slash: 3.0.0
 
+  delaunator@5.0.1:
+    dependencies:
+      robust-predicates: 3.0.2
+
   delayed-stream@1.0.0: {}
 
   depd@2.0.0: {}
@@ -6545,6 +7346,10 @@ snapshots:
     dependencies:
       esutils: 2.0.3
 
+  dompurify@3.3.1:
+    optionalDependencies:
+      '@types/trusted-types': 2.0.7
+
   dot-case@2.1.1:
     dependencies:
       no-case: 2.3.2
@@ -7147,6 +7952,8 @@ snapshots:
     transitivePeerDependencies:
       - encoding
 
+  hachure-fill@0.5.2: {}
+
   handlebars@4.7.8:
     dependencies:
       minimist: 1.2.8
@@ -7225,6 +8032,10 @@ snapshots:
     dependencies:
       safer-buffer: 2.1.2
 
+  iconv-lite@0.6.3:
+    dependencies:
+      safer-buffer: 2.1.2
+
   iconv-lite@0.7.2:
     dependencies:
       safer-buffer: 2.1.2
@@ -7300,6 +8111,10 @@ snapshots:
       hasown: 2.0.2
       side-channel: 1.1.0
 
+  internmap@1.0.1: {}
+
+  internmap@2.0.3: {}
+
   ip-address@9.0.5:
     dependencies:
       jsbn: 1.1.0
@@ -7514,10 +8329,28 @@ snapshots:
       jwa: 2.0.1
       safe-buffer: 5.2.1
 
+  katex@0.16.33:
+    dependencies:
+      commander: 8.3.0
+
   keyv@4.5.4:
     dependencies:
       json-buffer: 3.0.1
 
+  khroma@2.1.0: {}
+
+  langium@4.2.1:
+    dependencies:
+      chevrotain: 11.1.1
+      chevrotain-allstar: 0.3.1(chevrotain@11.1.1)
+      vscode-languageserver: 9.0.1
+      vscode-languageserver-textdocument: 1.0.12
+      vscode-uri: 3.1.0
+
+  layout-base@1.0.2: {}
+
+  layout-base@2.0.1: {}
+
   levn@0.4.1:
     dependencies:
       prelude-ls: 1.2.1
@@ -7578,6 +8411,8 @@ snapshots:
     dependencies:
       p-locate: 5.0.0
 
+  lodash-es@4.17.23: {}
+
   lodash.get@4.4.2: {}
 
   lodash.includes@4.3.0: {}
@@ -7637,6 +8472,8 @@ snapshots:
 
   make-event-props@2.0.0: {}
 
+  marked@16.4.2: {}
+
   math-intrinsics@1.1.0: {}
 
   media-typer@0.3.0: {}
@@ -7651,6 +8488,29 @@ snapshots:
 
   merge2@1.4.1: {}
 
+  mermaid@11.12.3:
+    dependencies:
+      '@braintree/sanitize-url': 7.1.2
+      '@iconify/utils': 3.1.0
+      '@mermaid-js/parser': 1.0.0
+      '@types/d3': 7.4.3
+      cytoscape: 3.33.1
+      cytoscape-cose-bilkent: 4.1.0(cytoscape@3.33.1)
+      cytoscape-fcose: 2.2.0(cytoscape@3.33.1)
+      d3: 7.9.0
+      d3-sankey: 0.12.3
+      dagre-d3-es: 7.0.13
+      dayjs: 1.11.19
+      dompurify: 3.3.1
+      katex: 0.16.33
+      khroma: 2.1.0
+      lodash-es: 4.17.23
+      marked: 16.4.2
+      roughjs: 4.6.6
+      stylis: 4.3.6
+      ts-dedent: 2.2.0
+      uuid: 11.1.0
+
   methods@1.1.2: {}
 
   micromatch@4.0.8:
@@ -7690,6 +8550,13 @@ snapshots:
 
   mkdirp@1.0.4: {}
 
+  mlly@1.8.0:
+    dependencies:
+      acorn: 8.15.0
+      pathe: 2.0.3
+      pkg-types: 1.3.1
+      ufo: 1.6.3
+
   ms@2.0.0: {}
 
   ms@2.1.3: {}
@@ -7895,6 +8762,8 @@ snapshots:
       degenerator: 5.0.1
       netmask: 2.0.2
 
+  package-manager-detector@1.6.0: {}
+
   param-case@2.1.1:
     dependencies:
       no-case: 2.3.2
@@ -7921,6 +8790,8 @@ snapshots:
     dependencies:
       no-case: 2.3.2
 
+  path-data-parser@0.1.0: {}
+
   path-exists@4.0.0: {}
 
   path-is-absolute@1.0.1: {}
@@ -7951,12 +8822,25 @@ snapshots:
 
   picomatch@4.0.3: {}
 
+  pkg-types@1.3.1:
+    dependencies:
+      confbox: 0.1.8
+      mlly: 1.8.0
+      pathe: 2.0.3
+
   pkg-types@2.3.0:
     dependencies:
       confbox: 0.2.2
       exsolve: 1.0.8
       pathe: 2.0.3
 
+  points-on-curve@0.2.0: {}
+
+  points-on-path@0.2.1:
+    dependencies:
+      path-data-parser: 0.1.0
+      points-on-curve: 0.2.0
+
   possible-typed-array-names@1.1.0: {}
 
   postcss@8.4.31:
@@ -8273,12 +9157,23 @@ snapshots:
     dependencies:
       glob: 7.2.3
 
+  robust-predicates@3.0.2: {}
+
+  roughjs@4.6.6:
+    dependencies:
+      hachure-fill: 0.5.2
+      path-data-parser: 0.1.0
+      points-on-curve: 0.2.0
+      points-on-path: 0.2.1
+
   run-async@2.4.1: {}
 
   run-parallel@1.2.0:
     dependencies:
       queue-microtask: 1.2.3
 
+  rw@1.3.3: {}
+
   rxjs@6.6.7:
     dependencies:
       tslib: 1.14.1
@@ -8561,6 +9456,8 @@ snapshots:
       client-only: 0.0.1
       react: 19.2.4
 
+  stylis@4.3.6: {}
+
   supports-color@5.5.0:
     dependencies:
       has-flag: 3.0.0
@@ -8650,6 +9547,8 @@ snapshots:
     dependencies:
       typescript: 5.9.3
 
+  ts-dedent@2.2.0: {}
+
   ts-node-dev@2.0.0(@types/node@20.19.31)(typescript@5.9.3):
     dependencies:
       chokidar: 3.6.0
@@ -8803,6 +9702,8 @@ snapshots:
 
   typescript@5.9.3: {}
 
+  ufo@1.6.3: {}
+
   uglify-js@3.19.3:
     optional: true
 
@@ -8867,6 +9768,8 @@ snapshots:
 
   utils-merge@1.0.1: {}
 
+  uuid@11.1.0: {}
+
   v8-compile-cache-lib@3.0.1: {}
 
   validate-npm-package-name@5.0.0:
@@ -8875,6 +9778,23 @@ snapshots:
 
   vary@1.1.2: {}
 
+  vscode-jsonrpc@8.2.0: {}
+
+  vscode-languageserver-protocol@3.17.5:
+    dependencies:
+      vscode-jsonrpc: 8.2.0
+      vscode-languageserver-types: 3.17.5
+
+  vscode-languageserver-textdocument@1.0.12: {}
+
+  vscode-languageserver-types@3.17.5: {}
+
+  vscode-languageserver@9.0.1:
+    dependencies:
+      vscode-languageserver-protocol: 3.17.5
+
+  vscode-uri@3.1.0: {}
+
   warning@4.0.3:
     dependencies:
       loose-envify: 1.4.0

From 0c69f81f5b6b0475dbcf7908668345a8931b79c9 Mon Sep 17 00:00:00 2001
From: NotCayaa <yannz.2005@gmail.com>
Date: Sat, 28 Feb 2026 15:33:11 +0700
Subject: [PATCH 05/11] feat: integrasi db buat user + coins - endpoint baru
 'GET /api/user/me' buat data user - fix endpoint coins yg ngawur gara2 ai,
 sekarang udh sesuai format response nya dengan yg di db, jadi konsisten
 dibungkus dalem object 'data'. - ganti component2 yg masih hardcoded jadi
 data beneran.

---
 apps/web-api/src/app.ts                       |   2 +
 apps/web-api/src/controllers/ai.controller.ts |   2 +-
 .../src/controllers/user.controller.ts        |  27 ++++
 apps/web-api/src/routes/user.route.ts         |  13 ++
 .../web-api/src/services/user/user.service.ts |  40 +++++
 apps/web-app/app/(app)/billing/page.tsx       |  20 ++-
 .../dashboard/components/recentActivity.tsx   | 110 +++++++++----
 .../dashboard/components/recentProject.tsx    | 150 +++++++++++++++---
 apps/web-app/app/(app)/dashboard/page.tsx     |  47 +++++-
 apps/web-app/app/(app)/layout.tsx             |  35 ++--
 apps/web-app/components/app-sidebar.tsx       |  41 +++--
 apps/web-app/services/project.service.ts      |  18 ++-
 12 files changed, 422 insertions(+), 83 deletions(-)
 create mode 100644 apps/web-api/src/controllers/user.controller.ts
 create mode 100644 apps/web-api/src/routes/user.route.ts
 create mode 100644 apps/web-api/src/services/user/user.service.ts

diff --git a/apps/web-api/src/app.ts b/apps/web-api/src/app.ts
index 92efb96..8fec196 100644
--- a/apps/web-api/src/app.ts
+++ b/apps/web-api/src/app.ts
@@ -8,6 +8,7 @@ import pdfRoute from "./routes/pdf.route";
 import markdownRoute from "./routes/markdown.route";
 import projectsRoute from "./routes/projects.route";
 import historyRoute from "./routes/history.route";
+import userRoute from "./routes/user.route";
 import { errorHandler } from "./middlewares/error.middleware";
 
 const app: Express = express();
@@ -36,6 +37,7 @@ app.use("/api/pdf", pdfRoute);
 app.use("/api/markdown", markdownRoute);
 app.use("/api/projects", projectsRoute);
 app.use("/api/history", historyRoute);
+app.use("/api/user", userRoute);
 
 // Error handler (must be last)
 app.use(errorHandler);
diff --git a/apps/web-api/src/controllers/ai.controller.ts b/apps/web-api/src/controllers/ai.controller.ts
index 6d982e0..ccd5da6 100644
--- a/apps/web-api/src/controllers/ai.controller.ts
+++ b/apps/web-api/src/controllers/ai.controller.ts
@@ -174,7 +174,7 @@ export const aiController = {
         const coins = await coinService.getBalance(userId);
         return res.status(200).json({
             success: true,
-            coins: coins,
+            data: { credits: coins },
         });
     }),
 
diff --git a/apps/web-api/src/controllers/user.controller.ts b/apps/web-api/src/controllers/user.controller.ts
new file mode 100644
index 0000000..d9cdc76
--- /dev/null
+++ b/apps/web-api/src/controllers/user.controller.ts
@@ -0,0 +1,27 @@
+import { Request, Response } from "express";
+import { asyncHandler } from "../utils/async-handler";
+import { userService } from "../services/user/user.service";
+
+export const userController = {
+    /**
+     * Get current user's profile
+     * @route GET /api/user/me
+     */
+    getMe: asyncHandler(async (req: Request, res: Response): Promise<any> => {
+        const userId = (req as any).user?.userId || "anonymous";
+
+        const profile = await userService.getProfile(userId);
+
+        if (!profile) {
+            return res.status(404).json({
+                success: false,
+                message: "User profile not found",
+            });
+        }
+
+        return res.status(200).json({
+            success: true,
+            data: profile,
+        });
+    }),
+};
diff --git a/apps/web-api/src/routes/user.route.ts b/apps/web-api/src/routes/user.route.ts
new file mode 100644
index 0000000..258df5f
--- /dev/null
+++ b/apps/web-api/src/routes/user.route.ts
@@ -0,0 +1,13 @@
+import { Router, type Router as ExpressRouter } from "express";
+import { userController } from "../controllers/user.controller";
+import { authenticate } from "../middlewares/auth.middleware";
+
+const router: ExpressRouter = Router();
+
+/**
+ * GET /api/user/me
+ * Get current user's profile (coins, name, email, etc.)
+ */
+router.get("/me", authenticate, userController.getMe);
+
+export default router;
diff --git a/apps/web-api/src/services/user/user.service.ts b/apps/web-api/src/services/user/user.service.ts
new file mode 100644
index 0000000..bdcb37c
--- /dev/null
+++ b/apps/web-api/src/services/user/user.service.ts
@@ -0,0 +1,40 @@
+import { supabase } from "../../config/supabase";
+
+export interface UserProfile {
+    id: string;
+    email: string;
+    fullname: string | null;
+    credits: number;
+    created_at: string;
+}
+
+export const userService = {
+    /**
+     * Get user profile from profiles table
+     */
+    async getProfile(userId: string): Promise<UserProfile | null> {
+        try {
+            const { data, error } = await supabase
+                .from("profiles")
+                .select("id, email, fullname, credits, created_at")
+                .eq("id", userId)
+                .single();
+
+            if (error || !data) {
+                console.warn("Profile fetch failed:", error?.message);
+                return null;
+            }
+
+            return {
+                id: data.id,
+                email: data.email,
+                fullname: data.fullname,
+                credits: data.credits ?? 0,
+                created_at: data.created_at,
+            };
+        } catch (error) {
+            console.error("User service error:", error);
+            return null;
+        }
+    },
+};
diff --git a/apps/web-app/app/(app)/billing/page.tsx b/apps/web-app/app/(app)/billing/page.tsx
index 15104d3..b92655b 100644
--- a/apps/web-app/app/(app)/billing/page.tsx
+++ b/apps/web-app/app/(app)/billing/page.tsx
@@ -1,10 +1,26 @@
+"use client"
+
 import { Button } from "@workspace/ui/components/button";
 import { Card } from "@workspace/ui/components/card";
 import { Coins, Plus } from "lucide-react";
 import CoinPackage from "./components/coinPackage";
 import TransactionHistory from "./components/transactionHistory";
+import { useEffect, useState } from "react";
+import { getCoins } from "@/services/project.service";
 
 export default function Billing() {
+  const [coinBalance, setCoinBalance] = useState<number>(0)
+
+  useEffect(() => {
+    getCoins()
+      .then((res: any) => {
+        if (res.success && res.data) {
+          setCoinBalance(res.data.credits)
+        }
+      })
+      .catch(() => { })
+  }, [])
+
   return (
     <div className="w-full flex flex-col gap-10">
       <Card className="flex flex-row justify-between items-center gap-3 p-6 shadow-md">
@@ -15,7 +31,7 @@ export default function Billing() {
 
           <div className="flex flex-row gap-6 items-center">
             <Coins className="w-10 h-10 text-yellow-500" />
-            <h1 className="text-5xl font-bold">410</h1>
+            <h1 className="text-5xl font-bold">{coinBalance}</h1>
           </div>
 
           <p className="text-sm text-gray-500">Coin digunakan untuk generate dokumen yang diperlukan</p>
@@ -35,7 +51,7 @@ export default function Billing() {
           </Button>
         </div>
       </Card>
-    
+
       <CoinPackage />
       <TransactionHistory />
     </div>
diff --git a/apps/web-app/app/(app)/dashboard/components/recentActivity.tsx b/apps/web-app/app/(app)/dashboard/components/recentActivity.tsx
index 86f180d..af51496 100644
--- a/apps/web-app/app/(app)/dashboard/components/recentActivity.tsx
+++ b/apps/web-app/app/(app)/dashboard/components/recentActivity.tsx
@@ -1,7 +1,56 @@
+"use client";
+
+import { useState, useEffect } from "react";
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@workspace/ui/components/table";
 import { Badge } from "@workspace/ui/components/badge";
+import { Loader2 } from "lucide-react";
+import { getHistory } from "@/services/project.service";
+
+const ACTION_BADGES: Record<string, { label: string; className: string }> = {
+    generate_brief: { label: "Generated", className: "bg-blue-50 text-blue-700" },
+    export_pdf: { label: "Success", className: "bg-green-50 text-green-700" },
+    export_markdown: { label: "Success", className: "bg-green-50 text-green-700" },
+    create_project: { label: "Created", className: "bg-purple-50 text-purple-700" },
+    update_project: { label: "Saved", className: "bg-blue-50 text-blue-700" },
+};
+
+const ACTION_LABELS: Record<string, string> = {
+    generate_brief: "Generated PRD",
+    export_pdf: "Exported PDF",
+    export_markdown: "Exported Markdown",
+    create_project: "Created Project",
+    update_project: "Updated Project",
+};
+
+function formatDate(iso: string): string {
+    const date = new Date(iso);
+    const now = new Date();
+    const diff = now.getTime() - date.getTime();
+    const days = Math.floor(diff / 86400000);
+
+    if (days === 0) {
+        return `Today, ${date.toLocaleTimeString("en-US", { hour: "numeric", minute: "2-digit", hour12: true })}`;
+    }
+    if (days === 1) return "Yesterday";
+    if (days < 7) return `${days} days ago`;
+    return date.toLocaleDateString("en-US", { month: "short", day: "numeric" });
+}
 
 export default function RecentActivity() {
+    const [activities, setActivities] = useState<any[]>([]);
+    const [loading, setLoading] = useState(true);
+
+    useEffect(() => {
+        getHistory(5, 0)
+            .then((res: any) => {
+                if (res.success && res.data && Array.isArray(res.data)) {
+                    setActivities(res.data.slice(0, 5));
+                }
+            })
+            .catch(() => { })
+            .finally(() => setLoading(false));
+    }, []);
+
     return (
         <div className="w-full flex flex-col gap-8">
             <h1 className="text-xl font-semibold">Recent Activity</h1>
@@ -14,34 +63,41 @@ export default function RecentActivity() {
                         <TableHead className="text-gray-700">Status</TableHead>
                     </TableRow>
                 </TableHeader>
-                <TableBody className="">
-                    <TableRow>
-                        <TableCell className="font-medium">Student Research Portal</TableCell>
-                        <TableCell className="text-gray-700">Exported PDF</TableCell>
-                        <TableCell className="text-gray-700">Today, 10:23 AM</TableCell>
-                        <TableCell>
-                            <Badge className="bg-green-50 text-green-700">Success</Badge>
-                        </TableCell>
-                    </TableRow>
-                    <TableRow>
-                        <TableCell className="font-medium">Student Research Portal</TableCell>
-                        <TableCell className="text-gray-700">Generated PRD</TableCell>
-                        <TableCell className="text-gray-700">Today, 09:45 AM</TableCell>
-                        <TableCell>
-                            <Badge className="bg-blue-50 text-blue-700">Saved</Badge>
-                        </TableCell>
-                    </TableRow>
-                    <TableRow>
-                        <TableCell className="font-medium">Fitness Tracker Mobile App</TableCell>
-                        <TableCell className="text-gray-700">Update Feature List</TableCell>
-                        <TableCell className="text-gray-700">Yesterday</TableCell>
-                        <TableCell>
-                            <Badge className="bg-blue-50 text-blue-700">Saved</Badge>
-                        </TableCell>
-                    </TableRow>
-                    
+                <TableBody>
+                    {loading && (
+                        <TableRow>
+                            <TableCell colSpan={4} className="text-center py-8">
+                                <Loader2 className="animate-spin text-gray-400 size-5 mx-auto" />
+                            </TableCell>
+                        </TableRow>
+                    )}
+
+                    {!loading && activities.length === 0 && (
+                        <TableRow>
+                            <TableCell colSpan={4} className="text-center py-8 text-gray-400 text-sm">
+                                No activity yet
+                            </TableCell>
+                        </TableRow>
+                    )}
+
+                    {!loading && activities.map((log) => {
+                        const badge = ACTION_BADGES[log.action] || { label: log.action, className: "bg-gray-50 text-gray-700" };
+                        const actionLabel = ACTION_LABELS[log.action] || log.action;
+                        const title = log.metadata?.projectTitle || log.metadata?.title || "Unknown";
+
+                        return (
+                            <TableRow key={log.id}>
+                                <TableCell className="font-medium">{title}</TableCell>
+                                <TableCell className="text-gray-700">{actionLabel}</TableCell>
+                                <TableCell className="text-gray-700">{formatDate(log.created_at)}</TableCell>
+                                <TableCell>
+                                    <Badge className={badge.className}>{badge.label}</Badge>
+                                </TableCell>
+                            </TableRow>
+                        );
+                    })}
                 </TableBody>
             </Table>
         </div>
-    )
+    );
 }
\ No newline at end of file
diff --git a/apps/web-app/app/(app)/dashboard/components/recentProject.tsx b/apps/web-app/app/(app)/dashboard/components/recentProject.tsx
index 275197e..2a6280e 100644
--- a/apps/web-app/app/(app)/dashboard/components/recentProject.tsx
+++ b/apps/web-app/app/(app)/dashboard/components/recentProject.tsx
@@ -1,5 +1,6 @@
 "use client";
 
+import { useState, useEffect } from "react";
 import { Button } from "@workspace/ui/components/button";
 import { Card } from "@workspace/ui/components/card";
 import {
@@ -10,14 +11,69 @@ import {
   EmptyMedia,
   EmptyTitle,
 } from "@workspace/ui/components/empty";
+import { Field, FieldLabel } from "@workspace/ui/components/field";
+import { Progress } from "@workspace/ui/components/progress";
 import {
   Plus,
+  ArrowRight,
+  LayoutTemplate,
+  BookOpen,
+  Smartphone,
+  Building2,
+  Loader2,
 } from "lucide-react";
 import { useRouter } from "next/navigation";
-import ProjectProgress from "./projectProgress";
+import { getProjects } from "@/services/project.service";
+
+const TYPE_ICONS: Record<string, any> = {
+  webapp: LayoutTemplate,
+  web_app: LayoutTemplate,
+  mobile: Smartphone,
+  research: BookOpen,
+  enterprise: Building2,
+};
+
+const TYPE_LABELS: Record<string, string> = {
+  webapp: "Web App",
+  web_app: "Web App",
+  mobile: "Mobile App",
+  research: "Research",
+  enterprise: "Enterprise",
+};
+
+function getProgress(step: number, status: string): number {
+  if (status === "exported") return 100;
+  if (status === "generated") return 75;
+  return Math.min(step * 25, 100);
+}
+
+function timeAgo(iso: string): string {
+  const diff = Date.now() - new Date(iso).getTime();
+  const mins = Math.floor(diff / 60000);
+  if (mins < 1) return "Just now";
+  if (mins < 60) return `${mins} min${mins > 1 ? "s" : ""} ago`;
+  const hours = Math.floor(mins / 60);
+  if (hours < 24) return `${hours} hour${hours > 1 ? "s" : ""} ago`;
+  const days = Math.floor(hours / 24);
+  return `${days} day${days > 1 ? "s" : ""} ago`;
+}
 
 export default function RecentProject() {
   const router = useRouter();
+  const [projects, setProjects] = useState<any[]>([]);
+  const [loading, setLoading] = useState(true);
+
+  useEffect(() => {
+    getProjects()
+      .then((res: any) => {
+        if (res.success && res.data && Array.isArray(res.data)) {
+          // Take max 3 most recent
+          setProjects(res.data.slice(0, 3));
+        }
+      })
+      .catch(() => { })
+      .finally(() => setLoading(false));
+  }, []);
 
   return (
     <div className="w-full gap-8 flex flex-col">
@@ -33,11 +89,13 @@ export default function RecentProject() {
         </Button>
       </div>
 
-      <div className=" items-center justify-between grid grid-cols-3  gap-6">
-        <Button 
-        onClick={() => router.push("/newProject")}
-        variant={"outline"} 
-        className="w-full h-full p-4 cursor-pointer bg-white hover:shadow-md hover:translate-y-1 transition-all duration-200">
+      <div className="items-center justify-between grid grid-cols-3 gap-6">
+        {/* Create New Project Card */}
+        <Button
+          onClick={() => router.push("/newProject")}
+          variant={"outline"}
+          className="w-full h-full p-4 cursor-pointer bg-white hover:shadow-md hover:translate-y-1 transition-all duration-200"
+        >
           <Empty className="py-1">
             <EmptyHeader>
               <EmptyMedia
@@ -51,22 +109,76 @@ export default function RecentProject() {
                 Start a new wizard for PRD, Feature List, or Research Proposals
               </EmptyDescription>
             </EmptyHeader>
-            <EmptyContent>
-              {/* <Button
-                onClick={() => router.push("/newProject")}
-                variant={"outline"}
-                size={"lg"}
-                className="cursor-pointer hover:shadow-md hover:translate-y-1"
-              >
-                Create Project
-              </Button> */}
-            </EmptyContent>
+            <EmptyContent />
           </Empty>
         </Button>
 
-        <ProjectProgress />
-        <ProjectProgress />
-        <ProjectProgress />
+        {/* Loading state */}
+        {loading && (
+          <>
+            <Card className="flex items-center justify-center p-4 min-h-59">
+              <Loader2 className="animate-spin text-gray-400 size-6" />
+            </Card>
+            <Card className="flex items-center justify-center p-4 min-h-59">
+              <Loader2 className="animate-spin text-gray-400 size-6" />
+            </Card>
+          </>
+        )}
+
+        {/* Real project cards */}
+        {!loading && projects.map((project) => {
+          const Icon = TYPE_ICONS[project.project_type] || LayoutTemplate;
+          const typeLabel = TYPE_LABELS[project.project_type] || project.project_type;
+          const progress = getProgress(project.current_step, project.status);
+          const statusLabel = project.status === "draft" ? "In Progress" : project.status === "generated" ? "Generated" : "Completed";
+
+          return (
+            <Card key={project.id} className="flex flex-col gap-8 p-4 w-full min-h-59">
+              <div className="w-full flex flex-row justify-between items-center">
+                <div className="flex flex-row gap-3 items-center">
+                  <div className="flex items-center justify-center w-12 h-12 rounded-sm bg-blue-100">
+                    <Icon className="size-7 text-blue-600" />
+                  </div>
+                  <div className="flex flex-col gap-1">
+                    <h1 className="font-semibold text-md">{project.title}</h1>
+                    <p className="text-sm text-gray-500">{typeLabel} · {project.document_style}</p>
+                  </div>
+                </div>
+              </div>
+
+              <Field className="w-full">
+                <FieldLabel htmlFor={`progress-${project.id}`}>
+                  <span>{statusLabel}</span>
+                  <span className="ml-auto">{progress}%</span>
+                </FieldLabel>
+                <Progress value={progress} id={`progress-${project.id}`} />
+              </Field>
+
+              <div className="flex flex-row justify-between items-center w-full">
+                <p className="text-gray-500 font-semibold text-sm">Edited {timeAgo(project.updated_at)}</p>
+                <Button
+                  variant={"link"}
+                  className="cursor-pointer text-blue-600 flex flex-row gap-2 items-center"
+                  onClick={() => router.push(`/newProject?projectId=${project.id}`)}
+                >
+                  Continue <ArrowRight className="text-blue-600 size-4" />
+                </Button>
+              </div>
+            </Card>
+          );
+        })}
+
+        {/* Empty state fillers if less than 2 projects */}
+        {!loading && projects.length === 0 && (
+          <>
+            <Card className="flex items-center justify-center p-4 min-h-59 border-dashed">
+              <p className="text-sm text-gray-400">No projects yet</p>
+            </Card>
+            <Card className="flex items-center justify-center p-4 min-h-59 border-dashed">
+              <p className="text-sm text-gray-400">No projects yet</p>
+            </Card>
+          </>
+        )}
       </div>
     </div>
   );
diff --git a/apps/web-app/app/(app)/dashboard/page.tsx b/apps/web-app/app/(app)/dashboard/page.tsx
index 399c7dc..d9331f0 100644
--- a/apps/web-app/app/(app)/dashboard/page.tsx
+++ b/apps/web-app/app/(app)/dashboard/page.tsx
@@ -1,19 +1,52 @@
 "use client"
 
+import { useState, useEffect } from "react"
+
 import { Button } from "@workspace/ui/components/button";
 import { Card } from "@workspace/ui/components/card";
 import { ArrowRight, Coins, Download, FolderOpen } from "lucide-react";
 import { useRouter } from "next/navigation";
 import RecentProject from "./components/recentProject";
 import RecentActivity from "./components/recentActivity";
+import { getUser, getCoins, getProjects } from "@/services/project.service";
 
 export default function DashboardPage() {
-    const router = useRouter()
+  const router = useRouter()
+
+  const [userName, setUserName] = useState<string>("")
+  const [coinBalance, setCoinBalance] = useState<number>(0)
+  const [projectCount, setProjectCount] = useState<number>(0)
+
+  useEffect(() => {
+    getUser()
+      .then((res) => {
+        if (res.success && res.data) {
+          setUserName(res.data.fullname || res.data.email?.split("@")[0] || "User")
+        }
+      })
+      .catch(() => { })
+
+    getCoins()
+      .then((res) => {
+        if (res.success && res.data) {
+          setCoinBalance(res.data.credits)
+        }
+      })
+      .catch(() => { })
+
+    getProjects()
+      .then((res: any) => {
+        if (res.success && res.data && Array.isArray(res.data)) {
+          setProjectCount(res.data.length)
+        }
+      })
+      .catch(() => { })
+  }, [])
 
   return (
     <div className="flex flex-col gap-10 w-full h-full py-8">
       <div className="flex flex-col gap-3">
-        <h1 className="text-3xl font-bold">Welcome back, Dr.Maya</h1>
+        <h1 className="text-3xl font-bold">Welcome back, {userName}</h1>
         <p className="text-gray-500 text-sm">
           Here's an overview of your research projects and documentation.
         </p>
@@ -27,10 +60,10 @@ export default function DashboardPage() {
               <FolderOpen className="text-blue-600 size-5" />
             </div>
           </div>
-          <h1 className="text-black text-5xl font-semibold mr-auto">4</h1>
+          <h1 className="text-black text-5xl font-semibold mr-auto">{projectCount}</h1>
 
           <Button
-          onClick={() => router.push("/myProject")}
+            onClick={() => router.push("/myProject")}
             variant="link"
             className="flex flex-row gap-3 text-blue-600 cursor-pointer mr-auto"
           >
@@ -45,10 +78,10 @@ export default function DashboardPage() {
               <Coins className="text-yellow-600 size-5" />
             </div>
           </div>
-          <h1 className="text-black text-5xl font-semibold mr-auto">34</h1>
+          <h1 className="text-black text-5xl font-semibold mr-auto">{coinBalance}</h1>
 
           <Button
-          onClick={() => router.push("/billing")}
+            onClick={() => router.push("/billing")}
             variant="link"
             className="flex flex-row gap-3 text-blue-600 cursor-pointer mr-auto"
           >
@@ -66,7 +99,7 @@ export default function DashboardPage() {
           <h1 className="text-black text-5xl font-semibold mr-auto">14</h1>
 
           <Button
-          onClick={() => router.push("/histories")}
+            onClick={() => router.push("/histories")}
             variant="link"
             className="flex flex-row gap-3 text-blue-600 cursor-pointer mr-auto"
           >
diff --git a/apps/web-app/app/(app)/layout.tsx b/apps/web-app/app/(app)/layout.tsx
index dbefabc..039b808 100644
--- a/apps/web-app/app/(app)/layout.tsx
+++ b/apps/web-app/app/(app)/layout.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import React from "react";
+import React, { useState, useEffect } from "react";
 import { usePathname } from "next/navigation";
 import { AppSidebar } from "@/components/app-sidebar";
 import {
@@ -27,6 +27,7 @@ import {
 } from "@workspace/ui/components/popover";
 import { ScrollArea } from "@workspace/ui/components/scroll-area";
 import Link from "next/link";
+import { getCoins } from "@/services/project.service";
 
 const notifications = [
   {
@@ -65,6 +66,18 @@ export default function AppLayout({ children }: { children: React.ReactNode }) {
 
   const isNewProject = pathname.includes("/newProject");
 
+  const [coinBalance, setCoinBalance] = useState<number | null>(null);
+
+  useEffect(() => {
+    getCoins()
+      .then((res) => {
+        if (res.success && res.data) {
+          setCoinBalance(res.data.credits);
+        }
+      })
+      .catch(() => setCoinBalance(0));
+  }, []);
+
   const formatLabel = (text: string) => {
     return text
       .replace(/-/g, " ")
@@ -127,7 +140,7 @@ export default function AppLayout({ children }: { children: React.ReactNode }) {
                   className="px-4 flex flex-row gap-2 items-center cursor-pointer hover:shadow-md hover:translate-y-1"
                 >
                   <Coins color="blue" className="size-5" />
-                  <p className="text-sm text-blue-500">35 Coins</p>
+                  <p className="text-sm text-blue-500">{coinBalance !== null ? `${coinBalance} Coins` : "..."}</p>
                 </Button>
               </Link>
 
@@ -167,11 +180,10 @@ export default function AppLayout({ children }: { children: React.ReactNode }) {
                       {notifications.map((notif) => (
                         <div
                           key={notif.id}
-                          className={`flex flex-col items-start gap-1 p-4 text-sm hover:bg-muted/50 cursor-pointer transition-colors border-b last:border-0 ${
-                            !notif.read
-                              ? "bg-blue-50/50 dark:bg-blue-900/10"
-                              : ""
-                          }`}
+                          className={`flex flex-col items-start gap-1 p-4 text-sm hover:bg-muted/50 cursor-pointer transition-colors border-b last:border-0 ${!notif.read
+                            ? "bg-blue-50/50 dark:bg-blue-900/10"
+                            : ""
+                            }`}
                         >
                           <div className="flex w-full justify-between gap-2">
                             <span className="font-semibold text-foreground">
@@ -208,11 +220,10 @@ export default function AppLayout({ children }: { children: React.ReactNode }) {
           </header>
 
           <main
-            className={`bg-accent/20 ${
-              isNewProject
-                ? "flex-1 overflow-hidden"
-                : "flex flex-1 flex-col px-6 py-8"
-            }`}
+            className={`bg-accent/20 ${isNewProject
+              ? "flex-1 overflow-hidden"
+              : "flex flex-1 flex-col px-6 py-8"
+              }`}
           >
             {children}
           </main>
diff --git a/apps/web-app/components/app-sidebar.tsx b/apps/web-app/components/app-sidebar.tsx
index 00d348b..ef13ca1 100644
--- a/apps/web-app/components/app-sidebar.tsx
+++ b/apps/web-app/components/app-sidebar.tsx
@@ -1,6 +1,7 @@
 "use client"
 
 import * as React from "react"
+import { useState, useEffect } from "react"
 import { usePathname } from "next/navigation"
 import {
   AudioWaveform,
@@ -24,13 +25,9 @@ import {
   SidebarHeader,
   SidebarRail,
 } from "@workspace/ui/components/sidebar"
+import { getUser } from "@/services/project.service"
 
 const data = {
-  user: {
-    name: "shadcn",
-    email: "m@example.com",
-    avatar: "/avatars/shadcn.jpg",
-  },
   teams: [
     {
       name: "Planify Inc",
@@ -87,30 +84,46 @@ const data = {
 export function AppSidebar({ ...props }: React.ComponentProps<typeof Sidebar>) {
   const pathname = usePathname()
 
+  const [user, setUser] = useState({ name: "", email: "", avatar: "" })
+
+  useEffect(() => {
+    getUser()
+      .then((res) => {
+        if (res.success && res.data) {
+          setUser({
+            name: res.data.fullname || res.data.email?.split("@")[0] || "User",
+            email: res.data.email || "",
+            avatar: "",
+          })
+        }
+      })
+      .catch(() => { })
+  }, [])
+
   return (
     <Sidebar collapsible="icon" {...props}>
       <SidebarHeader>
         <TeamSwitcher teams={data.teams} />
       </SidebarHeader>
       <SidebarContent>
-        <NavMain 
-          label="Main" 
+        <NavMain
+          label="Main"
           items={data.navMain.map((item) => ({
             ...item,
-            isActive: pathname === item.url, 
-          }))} 
+            isActive: pathname === item.url,
+          }))}
         />
-        
-        <NavMain 
-          label="Settings" 
+
+        <NavMain
+          label="Settings"
           items={data.navSettings.map((item) => ({
             ...item,
             isActive: pathname === item.url,
-          }))} 
+          }))}
         />
       </SidebarContent>
       <SidebarFooter>
-        <NavUser user={data.user} />
+        <NavUser user={user} />
       </SidebarFooter>
       <SidebarRail />
     </Sidebar>
diff --git a/apps/web-app/services/project.service.ts b/apps/web-app/services/project.service.ts
index c59bda8..b309a89 100644
--- a/apps/web-app/services/project.service.ts
+++ b/apps/web-app/services/project.service.ts
@@ -39,7 +39,23 @@ export async function regenerateSection(input: {
  * GET /ai/coins
  */
 export async function getCoins() {
-    return apiClient<{ coins: number }>("/ai/coins")
+    return apiClient<{
+        credits: number
+    }>("/ai/coins")
+}
+
+/**
+ * Get current user profile
+ * GET /user/me
+ */
+export async function getUser() {
+    return apiClient<{
+        id: string
+        email: string
+        fullname: string | null
+        credits: number
+        created_at: string
+    }>("/user/me")
 }
 
 /**

From 3a35b7b4caaf632c581e87d9a9d96ab6064f077e Mon Sep 17 00:00:00 2001
From: yaandere200-svg <yaandere200@gmail.com>
Date: Thu, 23 Apr 2026 15:18:50 +0700
Subject: [PATCH 06/11] test

---
 apps/web-api/public/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/web-api/public/index.js b/apps/web-api/public/index.js
index e7492e1..e402d6e 100644
--- a/apps/web-api/public/index.js
+++ b/apps/web-api/public/index.js
@@ -4,7 +4,7 @@ let token = localStorage.getItem('token');
 let currentBrief = null;
 let mode = 'professional';
 
-// --- Init ---
+// --- Init --- 
 if (token) initAuth();
 
 function switchAuthMode(m) {

From e9767e5ac823dd69cf535daa3051eb14d671bc41 Mon Sep 17 00:00:00 2001
From: caya8205-2 <yaandere200@gmail.com>
Date: Fri, 15 May 2026 21:43:01 +0700
Subject: [PATCH 07/11] inilah itulah

---
 apps/web-api/.env.example | 22 ++++++++++++++++++++++
 1 file changed, 22 insertions(+)
 create mode 100644 apps/web-api/.env.example

diff --git a/apps/web-api/.env.example b/apps/web-api/.env.example
new file mode 100644
index 0000000..a8a0900
--- /dev/null
+++ b/apps/web-api/.env.example
@@ -0,0 +1,22 @@
+# ================================
+# Web API Environment Variables
+# ================================
+PORT=4000
+NODE_ENV=development
+JWT_SECRET=your_key
+
+# Database / Supabase
+DATABASE_URL=your_key
+SUPABASE_URL=your_key
+SUPABASE_SERVICE_ROLE_KEY=your_key
+
+# AI Engine (Groq)
+GROQ_API_KEY=your_key
+# GROQ_API_KEY_1= for key rotation system
+# GROQ_API_KEY_2=your_key
+# GROQ_API_KEY_3=your_key
+
+# ================================
+# Web App (Frontend) Environment Variables
+# ================================
+NEXT_PUBLIC_API_URL=http://localhost:4000/api
\ No newline at end of file

From 71060fe0e6aaa0bf88fa9edab520e36250801f11 Mon Sep 17 00:00:00 2001
From: caya8205-2 <yaandere200@gmail.com>
Date: Mon, 7 Sep 2026 08:29:07 +0700
Subject: [PATCH 08/11] feat(hardening): secure backend API and add v1
 versioning

- Rate limiting on all routes, stricter on auth endpoints
- Helmet security headers (CSP, HSTS, clickjacking protection)
- XSS sanitization and HTTP parameter pollution guard
- Zod request validation on auth, projects, AI, and export endpoints
- CORS restricted to configured frontend origin
- JWT secret enforced in production
- Token blacklist backed by Redis with in-memory fallback
- Structured JSON logging with request IDs
- Request body size limited to 1MB
- Swagger/OpenAPI docs at /api/docs
- All endpoints versioned under /api/v1, legacy /api kept as deprecated
---
 apps/web-api/.env.example                     |   6 +-
 apps/web-api/.gitignore                       |   3 +
 apps/web-api/package.json                     |  17 +-
 apps/web-api/src/app.ts                       | 144 ++++-
 apps/web-api/src/config/env.ts                |   7 +-
 apps/web-api/src/config/redis.ts              |  49 ++
 .../src/controllers/auth.controller.ts        |   2 +-
 apps/web-api/src/docs/swagger.ts              | 194 ++++++
 .../src/middlewares/auth.middleware.ts        |   4 +-
 .../src/middlewares/error.middleware.ts       |  30 +-
 apps/web-api/src/middlewares/rate-limit.ts    |  47 ++
 .../src/middlewares/validation.middleware.ts  |  28 +
 apps/web-api/src/routes/ai.route.ts           |   7 +-
 apps/web-api/src/routes/auth.route.ts         |   7 +-
 apps/web-api/src/routes/markdown.route.ts     |   5 +-
 apps/web-api/src/routes/pdf.route.ts          |   5 +-
 apps/web-api/src/routes/projects.route.ts     |  10 +-
 apps/web-api/src/routes/v1/index.ts           |  32 +
 apps/web-api/src/server.ts                    |  17 +-
 apps/web-api/src/types/xss-clean.d.ts         |   5 +
 apps/web-api/src/utils/logger.ts              |  39 ++
 apps/web-api/src/utils/token-blacklist.ts     | 109 +++-
 apps/web-api/src/validators/ai.validator.ts   |  29 +
 apps/web-api/src/validators/auth.validator.ts |  16 +
 .../src/validators/export.validator.ts        |  57 ++
 .../src/validators/project.validator.ts       |  40 ++
 pnpm-lock.yaml                                | 575 ++++++++++++++++++
 27 files changed, 1419 insertions(+), 65 deletions(-)
 create mode 100644 apps/web-api/src/config/redis.ts
 create mode 100644 apps/web-api/src/docs/swagger.ts
 create mode 100644 apps/web-api/src/middlewares/rate-limit.ts
 create mode 100644 apps/web-api/src/middlewares/validation.middleware.ts
 create mode 100644 apps/web-api/src/routes/v1/index.ts
 create mode 100644 apps/web-api/src/types/xss-clean.d.ts
 create mode 100644 apps/web-api/src/utils/logger.ts
 create mode 100644 apps/web-api/src/validators/ai.validator.ts
 create mode 100644 apps/web-api/src/validators/auth.validator.ts
 create mode 100644 apps/web-api/src/validators/export.validator.ts
 create mode 100644 apps/web-api/src/validators/project.validator.ts

diff --git a/apps/web-api/.env.example b/apps/web-api/.env.example
index a8a0900..da35826 100644
--- a/apps/web-api/.env.example
+++ b/apps/web-api/.env.example
@@ -3,7 +3,7 @@
 # ================================
 PORT=4000
 NODE_ENV=development
-JWT_SECRET=your_key
+JWT_SECRET=your-super-secret-jwt-key-min-32-chars
 
 # Database / Supabase
 DATABASE_URL=your_key
@@ -16,6 +16,10 @@ GROQ_API_KEY=your_key
 # GROQ_API_KEY_2=your_key
 # GROQ_API_KEY_3=your_key
 
+# Security
+CORS_ORIGIN=http://localhost:3000
+REDIS_URL=redis://localhost:6379
+
 # ================================
 # Web App (Frontend) Environment Variables
 # ================================
diff --git a/apps/web-api/.gitignore b/apps/web-api/.gitignore
index 809ebc7..d0cb127 100644
--- a/apps/web-api/.gitignore
+++ b/apps/web-api/.gitignore
@@ -39,3 +39,6 @@ prisma/dev.db-journal
 
 # Misc
 .turbo/
+
+# Local Agent Docs
+.agents/
\ No newline at end of file
diff --git a/apps/web-api/package.json b/apps/web-api/package.json
index 6e9602f..5016aea 100644
--- a/apps/web-api/package.json
+++ b/apps/web-api/package.json
@@ -12,17 +12,32 @@
     "cors": "^2.8.5",
     "dotenv": "^16.4.5",
     "express": "^4.22.1",
+    "express-rate-limit": "^8.7.0",
     "groq-sdk": "^0.37.0",
+    "helmet": "^8.3.0",
+    "hpp": "^0.2.3",
+    "ioredis": "^6.0.0",
     "jsonwebtoken": "^9.0.3",
+    "pino": "^10.3.1",
+    "pino-http": "^11.0.0",
     "prisma": "^6.0.0",
-    "puppeteer": "^24.36.1"
+    "puppeteer": "^24.36.1",
+    "swagger-jsdoc": "^6.3.0",
+    "swagger-ui-express": "^5.0.1",
+    "xss-clean": "^0.1.4",
+    "zod": "^3.25.76"
   },
   "devDependencies": {
     "@types/bcryptjs": "^3.0.0",
     "@types/cors": "^2.8.17",
     "@types/express": "^4.17.21",
+    "@types/express-rate-limit": "^6.0.2",
+    "@types/hpp": "^0.2.7",
     "@types/jsonwebtoken": "^9.0.10",
     "@types/node": "^20.11.0",
+    "@types/swagger-jsdoc": "^6.0.4",
+    "@types/swagger-ui-express": "^4.1.8",
+    "pino-pretty": "^13.1.3",
     "ts-node-dev": "^2.0.0",
     "typescript": "^5.9.3"
   }
diff --git a/apps/web-api/src/app.ts b/apps/web-api/src/app.ts
index 8fec196..52bfa9e 100644
--- a/apps/web-api/src/app.ts
+++ b/apps/web-api/src/app.ts
@@ -1,6 +1,14 @@
-import express, { Express } from "express";
+import express, { Express, Request, Response, NextFunction } from "express";
 import cors from "cors";
+import helmet from "helmet";
+import xss from "xss-clean";
+import hpp from "hpp";
 import path from "path";
+import { env } from "./config/env";
+import { logger, httpLogger } from "./utils/logger";
+import { generalLimiter, authLimiter } from "./middlewares/rate-limit";
+import { setupSwagger } from "./docs/swagger";
+import v1Router from "./routes/v1";
 import healthRoute from "./routes/health.route";
 import authRoute from "./routes/auth.route";
 import aiRoute from "./routes/ai.route";
@@ -11,33 +19,129 @@ import historyRoute from "./routes/history.route";
 import userRoute from "./routes/user.route";
 import { errorHandler } from "./middlewares/error.middleware";
 
+/**
+ * Tandain endpoint lama (/api/...) sebagai deprecated.
+ * FE masih bisa pake, tapi disarankan pindah ke /api/v1/...
+ */
+const deprecated = (_req: Request, res: Response, next: NextFunction) => {
+  res.setHeader("Deprecation", "true");
+  res.setHeader("Sunset", "Sat, 01 Aug 2026 00:00:00 GMT");
+  res.setHeader("Link", '</api/v1>; rel="successor-version"');
+  next();
+};
+
 const app: Express = express();
 
-// Middlewares
-app.use(cors());
-app.use(express.json());
-app.use(express.urlencoded({ extended: true }));
+// Setup Swagger documentation
+setupSwagger(app);
+
+// Trust proxy (needed for rate limiting behind reverse proxy)
+app.set("trust proxy", 1);
+
+// Security headers
+app.use(
+  helmet({
+    contentSecurityPolicy: {
+      directives: {
+        defaultSrc: ["'self'"],
+        styleSrc: ["'self'", "'unsafe-inline'"],
+        scriptSrc: ["'self'"],
+        imgSrc: ["'self'", "data:", "https:"],
+        connectSrc: ["'self'"],
+        fontSrc: ["'self'"],
+        objectSrc: ["'none'"],
+        mediaSrc: ["'self'"],
+        frameSrc: ["'none'"],
+      },
+    },
+    crossOriginEmbedderPolicy: false,
+  })
+);
+
+// Prevent XSS attacks
+app.use(xss());
+
+// Prevent HTTP Parameter Pollution
+app.use(hpp());
+
+// CORS configuration
+app.use(
+  cors({
+    origin: env.corsOrigin,
+    credentials: true,
+    methods: ["GET", "POST", "PUT", "PATCH", "DELETE", "OPTIONS"],
+    allowedHeaders: ["Content-Type", "Authorization"],
+  })
+);
+
+// Request size limits
+app.use(express.json({ limit: "1mb" }));
+app.use(express.urlencoded({ extended: true, limit: "1mb" }));
+
+// HTTP request logging
+app.use((req: Request, _res: Response, next: NextFunction) => {
+  const start = Date.now();
+  const reqId = Math.random().toString(36).substring(7);
+  (req as any).reqId = reqId;
+
+  logger.info({ reqId, method: req.method, url: req.url, ip: req.ip }, "Incoming request");
+
+  _res.on("finish", () => {
+    const duration = Date.now() - start;
+    httpLogger.info(
+      { reqId, method: req.method, url: req.url, status: _res.statusCode, duration },
+      "Request completed"
+    );
+  });
+
+  next();
+});
+
+// Rate limiting (cover versi lama + v1)
+app.use("/api/", generalLimiter);
+app.use("/api/auth/register", authLimiter);
+app.use("/api/auth/login", authLimiter);
+app.use("/api/v1/auth/register", authLimiter);
+app.use("/api/v1/auth/login", authLimiter);
 
 // Serve static test UI
 app.use(express.static(path.join(__dirname, "../public")));
 
-// API info endpoint
-app.get("/api", (_req, res) => {
-    res.json({
-        message: "Planify API is running 🚀",
-        status: "OK",
-        timestamp: new Date().toISOString(),
-    });
+// API info endpoint (versi lama, deprecated)
+app.get("/api", deprecated, (_req: Request, res: Response) => {
+  res.json({
+    message: "Planify API is running 🚀",
+    status: "OK",
+    version: "v1",
+    docs: "/api/docs",
+    timestamp: new Date().toISOString(),
+  });
+});
+
+// API info endpoint (v1)
+app.get("/api/v1", (_req: Request, res: Response) => {
+  res.json({
+    message: "Planify API is running 🚀",
+    status: "OK",
+    version: "v1",
+    docs: "/api/docs",
+    timestamp: new Date().toISOString(),
+  });
 });
 
-app.use("/api/health", healthRoute);
-app.use("/api/auth", authRoute);
-app.use("/api/ai", aiRoute);
-app.use("/api/pdf", pdfRoute);
-app.use("/api/markdown", markdownRoute);
-app.use("/api/projects", projectsRoute);
-app.use("/api/history", historyRoute);
-app.use("/api/user", userRoute);
+// v1 routes (dipake ke depannya)
+app.use("/api/v1", v1Router);
+
+// Legacy routes tanpa versi (masih jalan, tapi deprecated)
+// FE lama tetap bisa pake endpoint ini tanpa perubahan
+app.use("/api/health", deprecated, healthRoute);
+app.use("/api/auth", deprecated, authRoute);
+app.use("/api/ai", deprecated, aiRoute);
+app.use("/api/pdf", deprecated, pdfRoute);
+app.use("/api/markdown", deprecated, markdownRoute);
+app.use("/api/projects", deprecated, projectsRoute);
+app.use("/api/history", deprecated, historyRoute);
+app.use("/api/user", deprecated, userRoute);
 
 // Error handler (must be last)
 app.use(errorHandler);
diff --git a/apps/web-api/src/config/env.ts b/apps/web-api/src/config/env.ts
index b01a4ea..148ab86 100644
--- a/apps/web-api/src/config/env.ts
+++ b/apps/web-api/src/config/env.ts
@@ -4,15 +4,20 @@ const requiredEnvVars = ["JWT_SECRET"];
 
 requiredEnvVars.forEach((envVar) => {
   if (!process.env[envVar]) {
+    if (process.env.NODE_ENV === "production") {
+      throw new Error(`Missing required environment variable: ${envVar}`);
+    }
     console.warn(` Missing environment variable: ${envVar}`);
   }
 });
 
 export const env = {
   port: parseInt(process.env.PORT || "4000", 10),
-  jwtSecret: process.env.JWT_SECRET || "your-secret-key",
+  jwtSecret: process.env.JWT_SECRET || (process.env.NODE_ENV === "production" ? "" : "your-secret-key"),
   databaseUrl: process.env.DATABASE_URL || "file:./dev.db",
   nodeEnv: process.env.NODE_ENV || "development",
   supabaseUrl: process.env.SUPABASE_URL || "",
   supabaseServiceRoleKey: process.env.SUPABASE_SERVICE_ROLE_KEY || "",
+  corsOrigin: process.env.CORS_ORIGIN || "http://localhost:3000",
+  redisUrl: process.env.REDIS_URL || "",
 };
diff --git a/apps/web-api/src/config/redis.ts b/apps/web-api/src/config/redis.ts
new file mode 100644
index 0000000..5708f25
--- /dev/null
+++ b/apps/web-api/src/config/redis.ts
@@ -0,0 +1,49 @@
+import Redis from "ioredis";
+import { env } from "./env";
+
+let redis: Redis | null = null;
+
+export function getRedisClient(): Redis | null {
+  if (redis) return redis;
+
+  if (!env.redisUrl) {
+    console.warn("REDIS_URL not set, token blacklist will use in-memory fallback");
+    return null;
+  }
+
+  try {
+    redis = new Redis(env.redisUrl, {
+      maxRetriesPerRequest: 3,
+      retryStrategy: (times) => {
+        if (times > 3) return null;
+        return Math.min(times * 200, 2000);
+      },
+      lazyConnect: true,
+    });
+
+    redis.on("error", (err) => {
+      console.error("Redis connection error:", err.message);
+    });
+
+    redis.on("connect", () => {
+      console.log("Redis connected for token blacklist");
+    });
+
+    redis.connect().catch((err) => {
+      console.error("Failed to connect to Redis:", err.message);
+      redis = null;
+    });
+
+    return redis;
+  } catch (error) {
+    console.error("Failed to initialize Redis:", error);
+    return null;
+  }
+}
+
+export function closeRedis(): void {
+  if (redis) {
+    redis.quit();
+    redis = null;
+  }
+}
\ No newline at end of file
diff --git a/apps/web-api/src/controllers/auth.controller.ts b/apps/web-api/src/controllers/auth.controller.ts
index e7b77da..33a7a8f 100644
--- a/apps/web-api/src/controllers/auth.controller.ts
+++ b/apps/web-api/src/controllers/auth.controller.ts
@@ -96,7 +96,7 @@ export const authController = {
     const token = authHeader?.split(" ")[1];
 
     if (token) {
-      tokenBlacklist.add(token);
+      await tokenBlacklist.add(token);
     }
 
     return res.status(200).json({
diff --git a/apps/web-api/src/docs/swagger.ts b/apps/web-api/src/docs/swagger.ts
new file mode 100644
index 0000000..ffac396
--- /dev/null
+++ b/apps/web-api/src/docs/swagger.ts
@@ -0,0 +1,194 @@
+import swaggerJsdoc from "swagger-jsdoc";
+import swaggerUi from "swagger-ui-express";
+import { Express } from "express";
+import { env } from "../config/env";
+
+const swaggerOptions: swaggerJsdoc.Options = {
+  definition: {
+    openapi: "3.0.0",
+    info: {
+      title: "Planify API",
+      version: "1.0.0",
+      description: "RESTful API for Planify - AI-powered project documentation generator",
+      contact: {
+        name: "Planify Team",
+      },
+    },
+    servers: [
+      {
+        url: env.nodeEnv === "production" ? "https://api.planify.example.com/api/v1" : `http://localhost:${env.port}/api/v1`,
+        description: env.nodeEnv === "production" ? "Production server" : "Development server",
+      },
+    ],
+    components: {
+      securitySchemes: {
+        bearerAuth: {
+          type: "http",
+          scheme: "bearer",
+          bearerFormat: "JWT",
+        },
+      },
+      schemas: {
+        ErrorResponse: {
+          type: "object",
+          properties: {
+            success: { type: "boolean", example: false },
+            message: { type: "string" },
+            code: { type: "string" },
+            error: { type: "string" },
+          },
+        },
+        SuccessResponse: {
+          type: "object",
+          properties: {
+            success: { type: "boolean", example: true },
+            message: { type: "string" },
+            data: { type: "object" },
+          },
+        },
+        User: {
+          type: "object",
+          properties: {
+            id: { type: "string", format: "uuid" },
+            email: { type: "string", format: "email" },
+            name: { type: "string" },
+            createdAt: { type: "string", format: "date-time" },
+            updatedAt: { type: "string", format: "date-time" },
+          },
+        },
+        AuthResponse: {
+          type: "object",
+          properties: {
+            success: { type: "boolean", example: true },
+            message: { type: "string" },
+            data: {
+              type: "object",
+              properties: {
+                token: { type: "string" },
+                user: { $ref: "#/components/schemas/User" },
+              },
+            },
+          },
+        },
+        Project: {
+          type: "object",
+          properties: {
+            id: { type: "string", format: "uuid" },
+            title: { type: "string" },
+            description: { type: "string" },
+            projectType: { type: "string", enum: ["webapp", "mobile", "research", "enterprise"] },
+            documentStyle: { type: "string", enum: ["professional", "formal", "concise"] },
+            currentStep: { type: "integer" },
+            status: { type: "string", enum: ["draft", "published", "archived"] },
+            createdAt: { type: "string", format: "date-time" },
+            updatedAt: { type: "string", format: "date-time" },
+          },
+        },
+        ProjectDetail: {
+          allOf: [
+            { $ref: "#/components/schemas/Project" },
+            {
+              type: "object",
+              properties: {
+                formData: { type: "object" },
+                generatedBrief: { type: "object" },
+              },
+            },
+          ],
+        },
+        CoinBalance: {
+          type: "object",
+          properties: {
+            success: { type: "boolean", example: true },
+            data: {
+              type: "object",
+              properties: {
+                credits: { type: "integer" },
+              },
+            },
+          },
+        },
+        AIStatus: {
+          type: "object",
+          properties: {
+            success: { type: "boolean", example: true },
+            data: {
+              type: "object",
+              properties: {
+                available: { type: "boolean" },
+                provider: { type: "string" },
+              },
+            },
+          },
+        },
+        ActivityLog: {
+          type: "object",
+          properties: {
+            id: { type: "string", format: "uuid" },
+            userId: { type: "string", format: "uuid" },
+            projectId: { type: "string", format: "uuid", nullable: true },
+            action: { type: "string", enum: ["generate_brief", "export_pdf", "export_markdown"] },
+            coinsUsed: { type: "integer" },
+            metadata: { type: "object" },
+            createdAt: { type: "string", format: "date-time" },
+          },
+        },
+        PaginatedResponse: {
+          type: "object",
+          properties: {
+            success: { type: "boolean", example: true },
+            data: { type: "array", items: { type: "object" } },
+            pagination: {
+              type: "object",
+              properties: {
+                total: { type: "integer" },
+                limit: { type: "integer" },
+                offset: { type: "integer" },
+              },
+            },
+          },
+        },
+      },
+    },
+    security: [
+      {
+        bearerAuth: [],
+      },
+    ],
+    tags: [
+      { name: "Health", description: "Health check endpoints" },
+      { name: "Authentication", description: "User authentication endpoints" },
+      { name: "AI Generation", description: "AI-powered document generation" },
+      { name: "Projects", description: "Project CRUD operations" },
+      { name: "PDF Export", description: "Export documents to PDF" },
+      { name: "Markdown Export", description: "Export documents to Markdown" },
+      { name: "History", description: "Activity history" },
+      { name: "User", description: "User profile" },
+    ],
+  },
+  apis: [
+    "./src/routes/*.route.ts",
+    "./src/controllers/*.controller.ts",
+  ],
+};
+
+export const swaggerSpec = swaggerJsdoc(swaggerOptions);
+
+export function setupSwagger(app: Express): void {
+  app.use(
+    "/api/docs",
+    swaggerUi.serve,
+    swaggerUi.setup(swaggerSpec, {
+      customCss: ".swagger-ui .topbar { display: none }",
+      customSiteTitle: "Planify API Documentation",
+      swaggerOptions: {
+        persistAuthorization: true,
+      },
+    })
+  );
+
+  app.get("/api/docs.json", (_req, res) => {
+    res.setHeader("Content-Type", "application/json");
+    res.send(swaggerSpec);
+  });
+}
\ No newline at end of file
diff --git a/apps/web-api/src/middlewares/auth.middleware.ts b/apps/web-api/src/middlewares/auth.middleware.ts
index 0e32504..cc57521 100644
--- a/apps/web-api/src/middlewares/auth.middleware.ts
+++ b/apps/web-api/src/middlewares/auth.middleware.ts
@@ -1,7 +1,6 @@
 import { Request, Response, NextFunction } from "express";
 import { ErrorCodes } from "../utils/app-error";
 import { tokenBlacklist } from "../utils/token-blacklist";
-
 import { supabase } from "../config/supabase";
 
 export const authenticate = async (
@@ -30,7 +29,8 @@ export const authenticate = async (
     }
 
     // Check if token is blacklisted (logged out)
-    if (tokenBlacklist.isBlacklisted(token)) {
+    const isBlacklisted = await tokenBlacklist.isBlacklisted(token);
+    if (isBlacklisted) {
         return res.status(401).json({
             success: false,
             message: "Token has been revoked",
diff --git a/apps/web-api/src/middlewares/error.middleware.ts b/apps/web-api/src/middlewares/error.middleware.ts
index 9dbcd13..4deed3e 100644
--- a/apps/web-api/src/middlewares/error.middleware.ts
+++ b/apps/web-api/src/middlewares/error.middleware.ts
@@ -1,5 +1,6 @@
 import { Request, Response, NextFunction } from "express";
 import { AppError, ErrorCodes } from "../utils/app-error";
+import { logger } from "../utils/logger";
 
 interface ErrorResponse {
   success: boolean;
@@ -10,10 +11,12 @@ interface ErrorResponse {
 
 export function errorHandler(
   err: any,
-  _: Request,
+  req: Request,
   res: Response,
-  __: NextFunction
+  _next: NextFunction
 ): void {
+  const reqId = (req as any).reqId || "unknown";
+
   // Handle AppError instances
   if (err instanceof AppError) {
     const response: ErrorResponse = {
@@ -23,22 +26,31 @@ export function errorHandler(
       error: process.env.NODE_ENV === "development" ? err.stack : undefined,
     };
 
-    console.error(`[ERROR] [${err.code}]`, err.message);
+    logger.warn({ reqId, code: err.code, message: err.message, status: err.statusCode }, "AppError");
     res.status(err.statusCode).json(response);
     return;
   }
 
+  // Handle Zod validation errors
+  if (err.name === "ZodError") {
+    const response: ErrorResponse = {
+      success: false,
+      message: "Validation failed",
+      code: ErrorCodes.VALIDATION_ERROR,
+      error: process.env.NODE_ENV === "development" ? JSON.stringify(err.errors) : undefined,
+    };
+
+    logger.warn({ reqId, errors: err.errors }, "Zod Validation Error");
+    res.status(400).json(response);
+    return;
+  }
+
   // Handle unknown errors
   const status = err.status || err.statusCode || 500;
   const message = err.message || "Internal Server Error";
   const code = err.code || ErrorCodes.INTERNAL_ERROR;
 
-  console.error("[ERROR]", {
-    code,
-    status,
-    message,
-    stack: err.stack,
-  });
+  logger.error({ reqId, code, status, message, stack: err.stack }, "Internal Error");
 
   const response: ErrorResponse = {
     success: false,
diff --git a/apps/web-api/src/middlewares/rate-limit.ts b/apps/web-api/src/middlewares/rate-limit.ts
new file mode 100644
index 0000000..67b0022
--- /dev/null
+++ b/apps/web-api/src/middlewares/rate-limit.ts
@@ -0,0 +1,47 @@
+import rateLimit from "express-rate-limit";
+import { Request, Response } from "express";
+
+const createLimiter = (windowMs: number, max: number, message: string) =>
+  rateLimit({
+    windowMs,
+    max,
+    message: { success: false, message, code: "RATE_LIMIT_EXCEEDED" },
+    standardHeaders: true,
+    legacyHeaders: false,
+    keyGenerator: (_req: Request) => _req.ip || "unknown",
+    handler: (_req: Request, res: Response) => {
+      res.status(429).json({
+        success: false,
+        message,
+        code: "RATE_LIMIT_EXCEEDED",
+      });
+    },
+    skip: (_req: Request) => {
+      if (process.env.NODE_ENV === "test") return true;
+      return false;
+    },
+  });
+
+export const generalLimiter = createLimiter(
+  15 * 60 * 1000,
+  100,
+  "Too many requests from this IP, please try again later."
+);
+
+export const authLimiter = createLimiter(
+  15 * 60 * 1000,
+  5,
+  "Too many authentication attempts, please try again later."
+);
+
+export const aiLimiter = createLimiter(
+  60 * 60 * 1000,
+  20,
+  "Too many AI generation requests, please try again later."
+);
+
+export const exportLimiter = createLimiter(
+  60 * 60 * 1000,
+  10,
+  "Too many export requests, please try again later."
+);
\ No newline at end of file
diff --git a/apps/web-api/src/middlewares/validation.middleware.ts b/apps/web-api/src/middlewares/validation.middleware.ts
new file mode 100644
index 0000000..51d5c57
--- /dev/null
+++ b/apps/web-api/src/middlewares/validation.middleware.ts
@@ -0,0 +1,28 @@
+import { Request, Response, NextFunction } from "express";
+import { AnyZodObject, ZodError } from "zod";
+
+export const validate =
+  (schema: AnyZodObject) =>
+  async (req: Request, _res: Response, next: NextFunction): Promise<void> => {
+    try {
+      await schema.parseAsync({
+        body: req.body,
+        query: req.query,
+        params: req.params,
+      });
+      next();
+    } catch (error) {
+      if (error instanceof ZodError) {
+        const formattedErrors = error.errors.map((e) => ({
+          field: e.path.join("."),
+          message: e.message,
+        }));
+        const err = new Error("Validation failed") as any;
+        err.name = "ZodError";
+        err.errors = formattedErrors;
+        next(err);
+      } else {
+        next(error);
+      }
+    }
+  };
\ No newline at end of file
diff --git a/apps/web-api/src/routes/ai.route.ts b/apps/web-api/src/routes/ai.route.ts
index ce3bc7e..a4eaa88 100644
--- a/apps/web-api/src/routes/ai.route.ts
+++ b/apps/web-api/src/routes/ai.route.ts
@@ -2,6 +2,9 @@ import { type Router as ExpressRouter } from "express";
 import { Router } from "express";
 import { aiController } from "../controllers/ai.controller";
 import { authenticate } from "../middlewares/auth.middleware";
+import { validate } from "../middlewares/validation.middleware";
+import { generateProjectBriefSchema, generateDiagramSchema } from "../validators/ai.validator";
+import { aiLimiter } from "../middlewares/rate-limit";
 
 const router: ExpressRouter = Router();
 
@@ -31,7 +34,7 @@ router.get("/status", aiController.getStatus);
  * REQUIRES: Authorization header dengan Bearer token
  * Deducts coins: draft=1, polished=3
  */
-router.post("/project-brief", authenticate, aiController.generateProjectBrief);
+router.post("/project-brief", authenticate, aiLimiter, validate(generateProjectBriefSchema), aiController.generateProjectBrief);
 
 /**
  * POST /api/ai/diagram
@@ -39,7 +42,7 @@ router.post("/project-brief", authenticate, aiController.generateProjectBrief);
  * REQUIRES: Authorization header dengan Bearer token
  * Deducts coins: 2
  */
-router.post("/diagram", authenticate, aiController.generateDiagram);
+router.post("/diagram", authenticate, aiLimiter, validate(generateDiagramSchema), aiController.generateDiagram);
 
 /**
  * GET /api/ai/coins
diff --git a/apps/web-api/src/routes/auth.route.ts b/apps/web-api/src/routes/auth.route.ts
index e5276b9..1eb4a73 100644
--- a/apps/web-api/src/routes/auth.route.ts
+++ b/apps/web-api/src/routes/auth.route.ts
@@ -1,8 +1,9 @@
 import { type Router as ExpressRouter } from "express";
 import { Router } from "express";
 import { authController } from "../controllers/auth.controller";
-
 import { authenticate } from "../middlewares/auth.middleware";
+import { validate } from "../middlewares/validation.middleware";
+import { registerSchema, loginSchema } from "../validators/auth.validator";
 
 const router: ExpressRouter = Router();
 
@@ -29,7 +30,7 @@ const router: ExpressRouter = Router();
  *   - AUTH_MISSING_FIELDS: email/password tidak diisi
  *   - AUTH_EMAIL_EXISTS: email sudah terdaftar
  */
-router.post("/register", authController.register);
+router.post("/register", validate(registerSchema), authController.register);
 
 /**
  * POST /api/auth/login
@@ -46,7 +47,7 @@ router.post("/register", authController.register);
  *   - AUTH_MISSING_FIELDS: email/password tidak diisi
  *   - AUTH_INVALID_CREDENTIALS: email/password salah
  */
-router.post("/login", authController.login);
+router.post("/login", validate(loginSchema), authController.login);
 
 /**
  * GET /api/auth/me
diff --git a/apps/web-api/src/routes/markdown.route.ts b/apps/web-api/src/routes/markdown.route.ts
index a0c26fc..970ec62 100644
--- a/apps/web-api/src/routes/markdown.route.ts
+++ b/apps/web-api/src/routes/markdown.route.ts
@@ -1,6 +1,9 @@
 import { Router, type Router as ExpressRouter } from "express";
 import { markdownController } from "../controllers/markdown.controller";
 import { authenticate } from "../middlewares/auth.middleware";
+import { validate } from "../middlewares/validation.middleware";
+import { exportMarkdownSchema } from "../validators/export.validator";
+import { exportLimiter } from "../middlewares/rate-limit";
 
 const router: ExpressRouter = Router();
 
@@ -9,6 +12,6 @@ const router: ExpressRouter = Router();
  * Generate Markdown from project brief JSON
  * Cost: 1 coin
  */
-router.post("/brief", authenticate, markdownController.generateBriefMarkdown);
+router.post("/brief", authenticate, exportLimiter, validate(exportMarkdownSchema), markdownController.generateBriefMarkdown);
 
 export default router;
diff --git a/apps/web-api/src/routes/pdf.route.ts b/apps/web-api/src/routes/pdf.route.ts
index 434c2b8..97db479 100644
--- a/apps/web-api/src/routes/pdf.route.ts
+++ b/apps/web-api/src/routes/pdf.route.ts
@@ -1,6 +1,9 @@
 import { Router, type Router as ExpressRouter } from "express";
 import { pdfController } from "../controllers/pdf.controller";
 import { authenticate } from "../middlewares/auth.middleware";
+import { validate } from "../middlewares/validation.middleware";
+import { exportPdfSchema } from "../validators/export.validator";
+import { exportLimiter } from "../middlewares/rate-limit";
 
 const router: ExpressRouter = Router();
 
@@ -9,6 +12,6 @@ const router: ExpressRouter = Router();
  * Generate PDF from project brief JSON
  * Cost: 1 coin
  */
-router.post("/brief", authenticate, pdfController.generateBriefPdf);
+router.post("/brief", authenticate, exportLimiter, validate(exportPdfSchema), pdfController.generateBriefPdf);
 
 export default router;
diff --git a/apps/web-api/src/routes/projects.route.ts b/apps/web-api/src/routes/projects.route.ts
index 7065b10..07dd2b8 100644
--- a/apps/web-api/src/routes/projects.route.ts
+++ b/apps/web-api/src/routes/projects.route.ts
@@ -1,6 +1,8 @@
 import { Router, type Router as ExpressRouter } from "express";
 import { projectsController } from "../controllers/projects.controller";
 import { authenticate } from "../middlewares/auth.middleware";
+import { validate } from "../middlewares/validation.middleware";
+import { createProjectSchema, updateProjectSchema, getProjectSchema, deleteProjectSchema } from "../validators/project.validator";
 
 const router: ExpressRouter = Router();
 
@@ -14,24 +16,24 @@ router.get("/", authenticate, projectsController.getProjects);
  * GET /api/projects/:id
  * Get project detail
  */
-router.get("/:id", authenticate, projectsController.getProject);
+router.get("/:id", authenticate, validate(getProjectSchema), projectsController.getProject);
 
 /**
  * POST /api/projects
  * Create new project
  */
-router.post("/", authenticate, projectsController.createProject);
+router.post("/", authenticate, validate(createProjectSchema), projectsController.createProject);
 
 /**
  * PUT /api/projects/:id
  * Update project (auto-save)
  */
-router.put("/:id", authenticate, projectsController.updateProject);
+router.put("/:id", authenticate, validate(updateProjectSchema), projectsController.updateProject);
 
 /**
  * DELETE /api/projects/:id
  * Delete project
  */
-router.delete("/:id", authenticate, projectsController.deleteProject);
+router.delete("/:id", authenticate, validate(deleteProjectSchema), projectsController.deleteProject);
 
 export default router;
diff --git a/apps/web-api/src/routes/v1/index.ts b/apps/web-api/src/routes/v1/index.ts
new file mode 100644
index 0000000..b4fb92f
--- /dev/null
+++ b/apps/web-api/src/routes/v1/index.ts
@@ -0,0 +1,32 @@
+import { Router, type Router as ExpressRouter } from "express";
+import healthRoute from "../health.route";
+import authRoute from "../auth.route";
+import aiRoute from "../ai.route";
+import pdfRoute from "../pdf.route";
+import markdownRoute from "../markdown.route";
+import projectsRoute from "../projects.route";
+import historyRoute from "../history.route";
+import userRoute from "../user.route";
+
+/**
+ * ============================================
+ * API v1 ROUTER
+ * Mounted at: /api/v1
+ * ============================================
+ *
+ * Semua route versi 1 dikumpulin di sini.
+ * Kalau nanti ada breaking change, bikin folder v2/
+ * tanpa ngerusak endpoint v1 yang udah dipake FE.
+ */
+const v1Router: ExpressRouter = Router();
+
+v1Router.use("/health", healthRoute);
+v1Router.use("/auth", authRoute);
+v1Router.use("/ai", aiRoute);
+v1Router.use("/pdf", pdfRoute);
+v1Router.use("/markdown", markdownRoute);
+v1Router.use("/projects", projectsRoute);
+v1Router.use("/history", historyRoute);
+v1Router.use("/user", userRoute);
+
+export default v1Router;
diff --git a/apps/web-api/src/server.ts b/apps/web-api/src/server.ts
index ae92d3f..642fb82 100644
--- a/apps/web-api/src/server.ts
+++ b/apps/web-api/src/server.ts
@@ -1,9 +1,24 @@
 import app from "./app";
 import { env } from "./config/env";
+import { logger } from "./utils/logger";
+import { closeRedis } from "./config/redis";
 
 const PORT = env.port || 4000;
 
-app.listen(PORT, () => {
+const server = app.listen(PORT, () => {
+  logger.info({ port: PORT, env: env.nodeEnv }, "Server started");
   console.log(`API running on http://localhost:${PORT}`);
   console.log(`Environment: ${process.env.NODE_ENV || "development"}`);
 });
+
+const shutdown = async (signal: string) => {
+  logger.info({ signal }, "Shutting down...");
+  server.close(async () => {
+    await closeRedis();
+    logger.info("Server closed");
+    process.exit(0);
+  });
+};
+
+process.on("SIGTERM", () => shutdown("SIGTERM"));
+process.on("SIGINT", () => shutdown("SIGINT"));
diff --git a/apps/web-api/src/types/xss-clean.d.ts b/apps/web-api/src/types/xss-clean.d.ts
new file mode 100644
index 0000000..3c3ee37
--- /dev/null
+++ b/apps/web-api/src/types/xss-clean.d.ts
@@ -0,0 +1,5 @@
+declare module "xss-clean" {
+  import { RequestHandler } from "express";
+  const xss: () => RequestHandler;
+  export = xss;
+}
\ No newline at end of file
diff --git a/apps/web-api/src/utils/logger.ts b/apps/web-api/src/utils/logger.ts
new file mode 100644
index 0000000..8844cb0
--- /dev/null
+++ b/apps/web-api/src/utils/logger.ts
@@ -0,0 +1,39 @@
+import pino from "pino";
+import { env } from "../config/env";
+
+const isDev = env.nodeEnv === "development";
+
+export const logger = pino({
+  level: isDev ? "debug" : "info",
+  transport: isDev
+    ? {
+        target: "pino-pretty",
+        options: {
+          colorize: true,
+          translateTime: "HH:MM:ss Z",
+          ignore: "pid,hostname",
+        },
+      }
+    : undefined,
+  formatters: {
+    level: (label) => ({ level: label }),
+  },
+  base: {
+    service: "planify-api",
+    env: env.nodeEnv,
+  },
+});
+
+export const httpLogger = pino({
+  level: isDev ? "info" : "warn",
+  transport: isDev
+    ? {
+        target: "pino-pretty",
+        options: {
+          colorize: true,
+          translateTime: "HH:MM:ss Z",
+          ignore: "pid,hostname",
+        },
+      }
+    : undefined,
+});
\ No newline at end of file
diff --git a/apps/web-api/src/utils/token-blacklist.ts b/apps/web-api/src/utils/token-blacklist.ts
index 73206e2..e2fe079 100644
--- a/apps/web-api/src/utils/token-blacklist.ts
+++ b/apps/web-api/src/utils/token-blacklist.ts
@@ -1,25 +1,98 @@
-// In-memory token blacklist
-// For production with multiple instances, use Redis instead
-const blacklistedTokens = new Set<string>();
+import { getRedisClient } from "../config/redis";
+
+// In-memory fallback for when Redis is not available
+const memoryBlacklist = new Set<string>();
+let useMemoryFallback = false;
+
+function decodeTokenPayload(token: string): { exp?: number } | null {
+  try {
+    const payload = token.split(".")[1];
+    const decoded = Buffer.from(payload, "base64").toString();
+    return JSON.parse(decoded);
+  } catch {
+    return null;
+  }
+}
+
+function getTokenTtl(token: string): number {
+  const payload = decodeTokenPayload(token);
+  if (!payload?.exp) return 24 * 60 * 60; // default 24h
+  const ttl = payload.exp - Math.floor(Date.now() / 1000);
+  return Math.max(ttl, 60); // minimum 1 minute
+}
 
 export const tokenBlacklist = {
-    add(token: string): void {
-        blacklistedTokens.add(token);
-    },
+  async add(token: string): Promise<void> {
+    const redis = getRedisClient();
+    const ttl = getTokenTtl(token);
+
+    if (redis && !useMemoryFallback) {
+      try {
+        await redis.setex(`blacklist:${token}`, ttl, "1");
+        return;
+      } catch (error) {
+        console.warn("Redis add failed, falling back to memory:", error);
+        useMemoryFallback = true;
+      }
+    }
+
+    memoryBlacklist.add(token);
+  },
+
+  async isBlacklisted(token: string): Promise<boolean> {
+    const redis = getRedisClient();
+
+    if (redis && !useMemoryFallback) {
+      try {
+        const result = await redis.exists(`blacklist:${token}`);
+        return result === 1;
+      } catch (error) {
+        console.warn("Redis check failed, falling back to memory:", error);
+        useMemoryFallback = true;
+      }
+    }
+
+    return memoryBlacklist.has(token);
+  },
+
+  async remove(token: string): Promise<void> {
+    const redis = getRedisClient();
+
+    if (redis && !useMemoryFallback) {
+      try {
+        await redis.del(`blacklist:${token}`);
+        return;
+      } catch (error) {
+        console.warn("Redis remove failed, falling back to memory:", error);
+        useMemoryFallback = true;
+      }
+    }
+
+    memoryBlacklist.delete(token);
+  },
+
+  async clear(): Promise<void> {
+    const redis = getRedisClient();
 
-    isBlacklisted(token: string): boolean {
-        return blacklistedTokens.has(token);
-    },
+    if (redis && !useMemoryFallback) {
+      try {
+        // Note: This is a simplified clear - in production use SCAN
+        const keys = await redis.keys("blacklist:*");
+        if (keys.length > 0) await redis.del(...keys);
+        return;
+      } catch (error) {
+        console.warn("Redis clear failed:", error);
+      }
+    }
 
-    remove(token: string): void {
-        blacklistedTokens.delete(token);
-    },
+    memoryBlacklist.clear();
+  },
 
-    clear(): void {
-        blacklistedTokens.clear();
-    },
+  size(): number {
+    return memoryBlacklist.size;
+  },
 
-    size(): number {
-        return blacklistedTokens.size;
-    },
+  isUsingFallback(): boolean {
+    return useMemoryFallback;
+  },
 };
diff --git a/apps/web-api/src/validators/ai.validator.ts b/apps/web-api/src/validators/ai.validator.ts
new file mode 100644
index 0000000..df773eb
--- /dev/null
+++ b/apps/web-api/src/validators/ai.validator.ts
@@ -0,0 +1,29 @@
+import { z } from "zod";
+
+export const generateProjectBriefSchema = z.object({
+  body: z.object({
+    projectName: z.string().min(1, "Project name is required").max(200),
+    projectDescription: z.string().min(10, "Description must be at least 10 characters").max(5000),
+    projectType: z.enum(["webapp", "mobile", "research", "enterprise"]).optional(),
+    documentStyle: z.enum(["professional", "formal", "concise"]).optional(),
+    outputLanguage: z.string().optional(),
+    projectStatus: z.string().optional(),
+    targetAudience: z.string().optional(),
+    keyFeatures: z.array(z.string()).optional(),
+    techStack: z.array(z.string()).optional(),
+    primaryMetric: z.string().optional(),
+    outOfScope: z.string().optional(),
+    integrationRequirements: z.string().optional(),
+    knownConstraints: z.string().optional(),
+    includeDiagram: z.boolean().optional(),
+  }),
+});
+
+export const generateDiagramSchema = z.object({
+  body: z.object({
+    projectName: z.string().min(1, "Project name is required").max(200),
+    projectDescription: z.string().min(10, "Description must be at least 10 characters").max(5000),
+    techStack: z.array(z.string()).optional(),
+    projectType: z.enum(["webapp", "mobile", "research", "enterprise"]).optional(),
+  }),
+});
\ No newline at end of file
diff --git a/apps/web-api/src/validators/auth.validator.ts b/apps/web-api/src/validators/auth.validator.ts
new file mode 100644
index 0000000..1364655
--- /dev/null
+++ b/apps/web-api/src/validators/auth.validator.ts
@@ -0,0 +1,16 @@
+import { z } from "zod";
+
+export const registerSchema = z.object({
+  body: z.object({
+    email: z.string().email("Invalid email format"),
+    password: z.string().min(8, "Password must be at least 8 characters"),
+    name: z.string().min(1, "Name is required").max(100).optional(),
+  }),
+});
+
+export const loginSchema = z.object({
+  body: z.object({
+    email: z.string().email("Invalid email format"),
+    password: z.string().min(1, "Password is required"),
+  }),
+});
\ No newline at end of file
diff --git a/apps/web-api/src/validators/export.validator.ts b/apps/web-api/src/validators/export.validator.ts
new file mode 100644
index 0000000..2d85215
--- /dev/null
+++ b/apps/web-api/src/validators/export.validator.ts
@@ -0,0 +1,57 @@
+import { z } from "zod";
+
+export const exportPdfSchema = z.object({
+  body: z.object({
+    title: z.string().min(1, "Title is required").max(200),
+    overview: z.string().optional(),
+    platformCategory: z.string().optional(),
+    targetAudience: z.any().optional(),
+    objectives: z.array(z.any()).optional(),
+    problemStatement: z.any().optional(),
+    successCriteria: z.array(z.any()).optional(),
+    keyFeatures: z.array(z.any()).optional(),
+    userFlow: z.any().optional(),
+    srsModules: z.array(z.any()).optional(),
+    recommendedTechStack: z.array(z.any()).optional(),
+    nonFunctionalRequirements: z.any().optional(),
+    scope: z.any().optional(),
+    risks: z.array(z.any()).optional(),
+    clarificationLog: z.array(z.any()).optional(),
+    diagram: z.any().optional(),
+    abstract: z.string().optional(),
+    researchQuestions: z.array(z.any()).optional(),
+    methodology: z.any().optional(),
+    expectedOutcomes: z.array(z.any()).optional(),
+    timeline: z.any().optional(),
+    variables: z.array(z.any()).optional(),
+    hypotheses: z.array(z.any()).optional(),
+  }),
+});
+
+export const exportMarkdownSchema = z.object({
+  body: z.object({
+    title: z.string().min(1, "Title is required").max(200),
+    overview: z.string().optional(),
+    platformCategory: z.string().optional(),
+    targetAudience: z.any().optional(),
+    objectives: z.array(z.any()).optional(),
+    problemStatement: z.any().optional(),
+    successCriteria: z.array(z.any()).optional(),
+    keyFeatures: z.array(z.any()).optional(),
+    userFlow: z.any().optional(),
+    srsModules: z.array(z.any()).optional(),
+    recommendedTechStack: z.array(z.any()).optional(),
+    nonFunctionalRequirements: z.any().optional(),
+    scope: z.any().optional(),
+    risks: z.array(z.any()).optional(),
+    clarificationLog: z.array(z.any()).optional(),
+    diagram: z.any().optional(),
+    abstract: z.string().optional(),
+    researchQuestions: z.array(z.any()).optional(),
+    methodology: z.any().optional(),
+    expectedOutcomes: z.array(z.any()).optional(),
+    timeline: z.any().optional(),
+    variables: z.array(z.any()).optional(),
+    hypotheses: z.array(z.any()).optional(),
+  }),
+});
\ No newline at end of file
diff --git a/apps/web-api/src/validators/project.validator.ts b/apps/web-api/src/validators/project.validator.ts
new file mode 100644
index 0000000..473eebb
--- /dev/null
+++ b/apps/web-api/src/validators/project.validator.ts
@@ -0,0 +1,40 @@
+import { z } from "zod";
+
+export const createProjectSchema = z.object({
+  body: z.object({
+    title: z.string().min(1, "Title is required").max(200),
+    description: z.string().max(2000).optional(),
+    projectType: z.enum(["webapp", "mobile", "research", "enterprise"]).optional(),
+    documentStyle: z.enum(["professional", "formal", "concise"]).optional(),
+    formData: z.record(z.any()).optional(),
+    currentStep: z.number().int().min(1).max(10).optional(),
+  }),
+});
+
+export const updateProjectSchema = z.object({
+  params: z.object({
+    id: z.string().uuid("Invalid project ID"),
+  }),
+  body: z.object({
+    title: z.string().min(1).max(200).optional(),
+    description: z.string().max(2000).optional(),
+    projectType: z.enum(["webapp", "mobile", "research", "enterprise"]).optional(),
+    currentStep: z.number().int().min(1).max(10).optional(),
+    formData: z.record(z.any()).optional(),
+    generatedBrief: z.record(z.any()).nullable().optional(),
+    documentStyle: z.enum(["professional", "formal", "concise"]).optional(),
+    status: z.enum(["draft", "published", "archived"]).optional(),
+  }),
+});
+
+export const getProjectSchema = z.object({
+  params: z.object({
+    id: z.string().uuid("Invalid project ID"),
+  }),
+});
+
+export const deleteProjectSchema = z.object({
+  params: z.object({
+    id: z.string().uuid("Invalid project ID"),
+  }),
+});
\ No newline at end of file
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index d5ffe36..482bb8c 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -90,18 +90,48 @@ importers:
       express:
         specifier: ^4.22.1
         version: 4.22.1
+      express-rate-limit:
+        specifier: ^8.7.0
+        version: 8.7.0(express@4.22.1)
       groq-sdk:
         specifier: ^0.37.0
         version: 0.37.0
+      helmet:
+        specifier: ^8.3.0
+        version: 8.3.0
+      hpp:
+        specifier: ^0.2.3
+        version: 0.2.3
+      ioredis:
+        specifier: ^6.0.0
+        version: 6.0.0
       jsonwebtoken:
         specifier: ^9.0.3
         version: 9.0.3
+      pino:
+        specifier: ^10.3.1
+        version: 10.3.1
+      pino-http:
+        specifier: ^11.0.0
+        version: 11.0.0
       prisma:
         specifier: ^6.0.0
         version: 6.19.2(typescript@5.9.3)
       puppeteer:
         specifier: ^24.36.1
         version: 24.36.1(typescript@5.9.3)
+      swagger-jsdoc:
+        specifier: ^6.3.0
+        version: 6.3.0(openapi-types@12.1.3)
+      swagger-ui-express:
+        specifier: ^5.0.1
+        version: 5.0.1(express@4.22.1)
+      xss-clean:
+        specifier: ^0.1.4
+        version: 0.1.4
+      zod:
+        specifier: ^3.25.76
+        version: 3.25.76
     devDependencies:
       '@types/bcryptjs':
         specifier: ^3.0.0
@@ -112,12 +142,27 @@ importers:
       '@types/express':
         specifier: ^4.17.21
         version: 4.17.25
+      '@types/express-rate-limit':
+        specifier: ^6.0.2
+        version: 6.0.2(express@4.22.1)
+      '@types/hpp':
+        specifier: ^0.2.7
+        version: 0.2.7
       '@types/jsonwebtoken':
         specifier: ^9.0.10
         version: 9.0.10
       '@types/node':
         specifier: ^20.11.0
         version: 20.19.31
+      '@types/swagger-jsdoc':
+        specifier: ^6.0.4
+        version: 6.0.4
+      '@types/swagger-ui-express':
+        specifier: ^4.1.8
+        version: 4.1.8
+      pino-pretty:
+        specifier: ^13.1.3
+        version: 13.1.3
       ts-node-dev:
         specifier: ^2.0.0
         version: 2.0.0(@types/node@20.19.31)(typescript@5.9.3)
@@ -303,6 +348,22 @@ packages:
   '@antfu/install-pkg@1.1.0':
     resolution: {integrity: sha512-MGQsmw10ZyI+EJo45CdSER4zEb+p31LpDAFp2Z3gkSd1yqVZGi0Ebx++YTEMonJy4oChEMLsxZ64j8FH6sSqtQ==}
 
+  '@apidevtools/json-schema-ref-parser@14.0.1':
+    resolution: {integrity: sha512-Oc96zvmxx1fqoSEdUmfmvvb59/KDOnUoJ7s2t7bISyAn0XEz57LCCw8k2Y4Pf3mwKaZLMciESALORLgfe2frCw==}
+    engines: {node: '>= 16'}
+
+  '@apidevtools/openapi-schemas@2.1.0':
+    resolution: {integrity: sha512-Zc1AlqrJlX3SlpupFGpiLi2EbteyP7fXmUOGup6/DnkRgjP9bgMM/ag+n91rsv0U1Gpz0H3VILA/o3bW7Ua6BQ==}
+    engines: {node: '>=10'}
+
+  '@apidevtools/swagger-methods@3.0.2':
+    resolution: {integrity: sha512-QAkD5kK2b1WfjDS/UQn/qQkbwF31uqRjPTrsCs5ZG9BQGAkjwvqGFjjPqAuzac/IYzpPtRzjCP1WrTuAIjMrXg==}
+
+  '@apidevtools/swagger-parser@12.1.0':
+    resolution: {integrity: sha512-e5mJoswsnAX0jG+J09xHFYQXb/bUc5S3pLpMxUuRUA2H8T2kni3yEoyz2R3Dltw5f4A6j6rPNMpWTK+iVDFlng==}
+    peerDependencies:
+      openapi-types: '>=7'
+
   '@babel/code-frame@7.29.0':
     resolution: {integrity: sha512-9NhCeYjq9+3uxgdtp20LSiJXJvN0FeCtNGpJxuMFZ1Kv3cWUNb6DOhJwUvcVCzKGR66cw4njwM6hrJLqgOwbcw==}
     engines: {node: '>=6.9.0'}
@@ -626,6 +687,13 @@ packages:
       '@types/node':
         optional: true
 
+  '@ioredis/commands@2.0.0':
+    resolution: {integrity: sha512-vrx0AE/T0h7cRZwfo1M39Cr+ZhZrkf0V8mQN75wucKCxCLD9l/VX6no3gFvrLqD1IlG/1LtzWovqEw3t0Vr9zg==}
+
+  '@isaacs/cliui@9.0.0':
+    resolution: {integrity: sha512-AokJm4tuBHillT+FpMtxQ60n8ObyXBatq7jD2/JA9dxbDDokKQm8KMht5ibGzLVU9IJDIKK4TPKgMHEYMn3lMg==}
+    engines: {node: '>=18'}
+
   '@jridgewell/gen-mapping@0.3.13':
     resolution: {integrity: sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==}
 
@@ -784,6 +852,9 @@ packages:
     resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
     engines: {node: '>= 8'}
 
+  '@pinojs/redact@0.4.0':
+    resolution: {integrity: sha512-k2ENnmBugE/rzQfEcdWHcCY+/FM3VLzH9cYEsbdsoqrvzAKRhUZeRNhAZvB8OitQJ1TBed3yqWtdjzS6wJKBwg==}
+
   '@prisma/client@6.19.2':
     resolution: {integrity: sha512-gR2EMvfK/aTxsuooaDA32D8v+us/8AAet+C3J1cc04SW35FPdZYgLF+iN4NDLUgAaUGTKdAB0CYenu1TAgGdMg==}
     engines: {node: '>=18.18'}
@@ -1544,6 +1615,9 @@ packages:
   '@radix-ui/rect@1.1.1':
     resolution: {integrity: sha512-HPwpGIzkl28mWyZqG52jiqDJ12waP11Pa1lGoiyUkIEuMLBP0oeK/C89esbXrxsky5we7dfd8U58nm0SgAWpVw==}
 
+  '@scarf/scarf@1.4.0':
+    resolution: {integrity: sha512-xxeapPiUXdZAE3che6f3xogoJPeZgig6omHEy1rIY5WVsB3H2BHNnZH+gHG6x91SCWyQCzWGsuL2Hh3ClO5/qQ==}
+
   '@standard-schema/spec@1.1.0':
     resolution: {integrity: sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==}
 
@@ -1794,6 +1868,10 @@ packages:
   '@types/estree@1.0.8':
     resolution: {integrity: sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==}
 
+  '@types/express-rate-limit@6.0.2':
+    resolution: {integrity: sha512-e1xZLOOlxCDvplAGq7rDcXtbdBu2CWRsMjaIu1LVqGxWtKvwr884YE5mPs3IvHeG/OMDhf24oTaqG5T1bV3rBQ==}
+    deprecated: This is a stub types definition. express-rate-limit provides its own type definitions, so you do not need this installed.
+
   '@types/express-serve-static-core@4.19.8':
     resolution: {integrity: sha512-02S5fmqeoKzVZCHPZid4b8JH2eM5HzQLZWN2FohQEy/0eXTq8VXZfSN6Pcr3F6N9R/vNrj7cpgbhjie6m/1tCA==}
 
@@ -1806,6 +1884,9 @@ packages:
   '@types/glob@7.2.0':
     resolution: {integrity: sha512-ZUxbzKl0IfJILTS6t7ip5fQQM/J3TJYubDm3nMbgubNNYS62eXeUpoLUC8/7fJNiFYHTrGPQn7hspDUzIHX3UA==}
 
+  '@types/hpp@0.2.7':
+    resolution: {integrity: sha512-YSQBkTwZepklRez0wgsljeewMytGNKgBAZR1YbmE0X49+elqkZ+fr/gvB407wL9Dl7a/Kv3W04yJueRmEHytBw==}
+
   '@types/http-errors@2.0.5':
     resolution: {integrity: sha512-r8Tayk8HJnX0FztbZN7oVqGccWgw98T/0neJphO91KkmOzug1KkofZURD4UaD5uH8AqcFLfdPErnBod0u71/qg==}
 
@@ -1872,6 +1953,12 @@ packages:
   '@types/strip-json-comments@0.0.30':
     resolution: {integrity: sha512-7NQmHra/JILCd1QqpSzl8+mJRc8ZHz3uDm8YV1Ks9IhK0epEiTw8aIErbvH9PI+6XbqhyIQy3462nEsn7UVzjQ==}
 
+  '@types/swagger-jsdoc@6.0.4':
+    resolution: {integrity: sha512-W+Xw5epcOZrF/AooUM/PccNMSAFOKWZA5dasNyMujTwsBkU74njSJBpvCCJhHAJ95XRMzQrrW844Btu0uoetwQ==}
+
+  '@types/swagger-ui-express@4.1.8':
+    resolution: {integrity: sha512-AhZV8/EIreHFmBV5wAs0gzJUNq9JbbSXgJLQubCC0jtIo6prnI9MIRRxnU4MZX9RB9yXxF1V4R7jtLl/Wcj31g==}
+
   '@types/through@0.0.33':
     resolution: {integrity: sha512-HsJ+z3QuETzP3cswwtzt2vEIiHBk/dCcHGhbmG5X3ecnwFD/lPrMpliGXxSCg03L9AhrdwA4Oz/qfspkDW+xGQ==}
 
@@ -1980,9 +2067,20 @@ packages:
     resolution: {integrity: sha512-4I7Td01quW/RpocfNayFdFVk1qSuoh0E7JrbRJ16nH01HhKFQ88INq9Sd+nd72zqRySlr9BmDA8xlEJ6vJMrYA==}
     engines: {node: '>=8'}
 
+  ajv-draft-04@1.0.0:
+    resolution: {integrity: sha512-mv00Te6nmYbRp5DCwclxtt7yV/joXJPGS7nM+97GdxvuttCOfgI3K4U25zboyeX0O+myI8ERluxQe5wljMmVIw==}
+    peerDependencies:
+      ajv: ^8.5.0
+    peerDependenciesMeta:
+      ajv:
+        optional: true
+
   ajv@6.12.6:
     resolution: {integrity: sha512-j3fVLgvTo527anyYyJOGTYJbG+vnnQYvE0m5mmkc1TK+nxAppkCLMIL0aZ4dblVCNoGShhm+kzE4ZUykBoMg4g==}
 
+  ajv@8.20.0:
+    resolution: {integrity: sha512-Thbli+OlOj+iMPYFBVBfJ3OmCAnaSyNn4M1vz9T6Gka5Jt9ba/HIR56joy65tY6kx/FCF5VXNB819Y7/GUrBGA==}
+
   ansi-escapes@4.3.2:
     resolution: {integrity: sha512-gKXj5ALrKWQLsYG9jlTRmR/xKluxHV+Z9QEwNIgCfM1/uwPMCuzVVnh5mwTd+OuBZcwSIMbqssNWRm1lE51QaQ==}
     engines: {node: '>=8'}
@@ -2059,6 +2157,10 @@ packages:
   asynckit@0.4.0:
     resolution: {integrity: sha512-Oei9OH4tRh0YqU3GxhX79dM/mwVgvbZJaSNaRk+bshkj0S5cfHcgYakreBjrHwatXKbz+IoIdYLxrKim2MjW0Q==}
 
+  atomic-sleep@1.0.0:
+    resolution: {integrity: sha512-kNOjDqAh7px0XWNI+4QbzoiR/nTkHAWNud2uvnJquD1/x5a7EQZMJT0AczqK0Qn67oY/TTQ1LbUKajZpp3I9tQ==}
+    engines: {node: '>=8.0.0'}
+
   available-typed-arrays@1.0.7:
     resolution: {integrity: sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==}
     engines: {node: '>= 0.4'}
@@ -2074,6 +2176,10 @@ packages:
   balanced-match@1.0.2:
     resolution: {integrity: sha512-3oSeUO0TMV67hN1AmbXsK4yaqU7tjiHlbxRDZOpH0KW9+CeX4bRAaX0Anxt0tx2MrpRpWwQaPwIlISEJhYU5Pw==}
 
+  balanced-match@4.0.4:
+    resolution: {integrity: sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA==}
+    engines: {node: 18 || 20 || >=22}
+
   bare-events@2.8.2:
     resolution: {integrity: sha512-riJjyv1/mHLIPX4RwiK+oW9/4c3TEUeORHKefKAKnZ5kyslbN+HXowtbaVEqt4IMUB7OXlfixcs6gsFeo/jhiQ==}
     peerDependencies:
@@ -2122,6 +2228,7 @@ packages:
   basic-ftp@5.0.5:
     resolution: {integrity: sha512-4Bcg1P8xhUuqcii/S0Z9wiHIrQVPMermM1any+MX5GeGD7faD3/msQUDGLol9wOcz4/jbg/WJnGqoJF6LiBdtg==}
     engines: {node: '>=10.0.0'}
+    deprecated: Security vulnerability fixed in 5.2.1, please upgrade
 
   bcryptjs@3.0.3:
     resolution: {integrity: sha512-GlF5wPWnSa/X5LKM1o0wz0suXIINz1iHRLvTS+sLyi7XPbe5ycmYI3DlZqVGZZtDgl4DmasFg7gOB3JYbphV5g==}
@@ -2144,6 +2251,10 @@ packages:
   brace-expansion@2.0.2:
     resolution: {integrity: sha512-Jt0vHyM+jmUBqojB7E1NIYadt0vI0Qxjxd2TErW94wDz+E2LAm5vKMXXwg6ZZBTHPuUlDgQHKXvjGBdfcF1ZDQ==}
 
+  brace-expansion@5.0.9:
+    resolution: {integrity: sha512-ScQ4IuvIEF1TMlP7Zt+vjJ//9zlPb2SDcxWxM3bk8s6t6GGdJ7KO1dCcTidOPJKePW30LE/2cT7wCyPho9/Wxg==}
+    engines: {node: 20 || >=22}
+
   braces@3.0.3:
     resolution: {integrity: sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==}
     engines: {node: '>=8'}
@@ -2192,6 +2303,9 @@ packages:
     resolution: {integrity: sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==}
     engines: {node: '>= 0.4'}
 
+  call-me-maybe@1.0.2:
+    resolution: {integrity: sha512-HpX65o1Hnr9HH25ojC1YGs7HCQLq0GCOibSaWER0eNpgJ/Z1MZv2mTc7+xh6WOPxbRVcmgbv4hGU+uSQ/2xFZQ==}
+
   callsites@3.1.0:
     resolution: {integrity: sha512-P8BjAsXvZS+VIDUI11hHCQEv74YT67YUi5JJFNWIqL235sBmjX4+qx9Muvls5ivyNENctx46xQLQ3aTuE7ssaQ==}
     engines: {node: '>=6'}
@@ -2284,6 +2398,10 @@ packages:
     resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==}
     engines: {node: '>=6'}
 
+  cluster-key-slot@1.1.1:
+    resolution: {integrity: sha512-rwHwUfXL40Chm1r08yrhU3qpUvdVlgkKNeyeGPOxnW8/SyVDvgRaed/Uz54AqWNaTCAThlj6QAs3TZcKI0xDEw==}
+    engines: {node: '>=0.10.0'}
+
   color-convert@1.9.3:
     resolution: {integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==}
 
@@ -2297,6 +2415,9 @@ packages:
   color-name@1.1.4:
     resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
 
+  colorette@2.0.20:
+    resolution: {integrity: sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w==}
+
   combined-stream@1.0.8:
     resolution: {integrity: sha512-FQN4MRfuJeHf7cBbBMJFXhKSDq+2kAArBlmRBvcvFE5BB1HZKXtSFASDhdlz9zOYwxh8lDdnvmMOe/+5cdoEdg==}
     engines: {node: '>= 0.8'}
@@ -2305,6 +2426,10 @@ packages:
     resolution: {integrity: sha512-zS5PnTI22FIRM6ylNW8G4Ap0IEOyk62fhLSD0+uHRT9McRCLGpkVNvao4bjimpK/GShynyQkFFxHhwMcETmduA==}
     engines: {node: '>=14'}
 
+  commander@6.2.0:
+    resolution: {integrity: sha512-zP4jEKbe8SHzKJYQmq8Y9gYjtO/POJLgIdKgV7B9qNmABVFVc+ctqSX6iXh4mCpJfRBOabiZ2YKPg8ciDw6C+Q==}
+    engines: {node: '>= 6'}
+
   commander@7.2.0:
     resolution: {integrity: sha512-QrWXB+ZQSVPmIWIhtEO9H+gwHaMGYiF5ChvoJ+K9ZGHG/sVsa6yiesAD1GC/x46sET00Xlwo1u49RVVVzvcSkw==}
     engines: {node: '>= 10'}
@@ -2551,6 +2676,9 @@ packages:
     resolution: {integrity: sha512-BS8PfmtDGnrgYdOonGZQdLZslWIeCGFP9tpan0hi1Co2Zr2NKADsvGYA8XxuG/4UWgJ6Cjtv+YJnB6MM69QGlQ==}
     engines: {node: '>= 0.4'}
 
+  dateformat@4.6.3:
+    resolution: {integrity: sha512-2P0p0pFGzHS5EMnhdxQi7aJN+iMheud0UhG4dlE1DLAlvL8JHjJJTX/CSm4JXwV0Ka5nGk3zC5mcb5bUQUxxMA==}
+
   dayjs@1.11.19:
     resolution: {integrity: sha512-t5EcLVS6QPBNqM2z8fakk/NKel+Xzshgt8FFKAn+qwlD1pzZWxh0nVCrvFK7ZDb6XucZeF9z8C7CBWTRIVApAw==}
 
@@ -2611,6 +2739,10 @@ packages:
     resolution: {integrity: sha512-ZySD7Nf91aLB0RxL4KGrKHBXl7Eds1DAmEdcoVawXnLD7SDhpNgtuII2aAkg7a7QS41jxPSZ17p4VdGnMHk3MQ==}
     engines: {node: '>=0.4.0'}
 
+  denque@2.1.0:
+    resolution: {integrity: sha512-HVQE3AAb/pxF8fQAoiqpvg9i3evqug3hoiwakOyZAwJm+6vZehbkYXZ0l4JxS+I3QxM97v5aaRNhj8v5oBhekw==}
+    engines: {node: '>=0.10'}
+
   depd@2.0.0:
     resolution: {integrity: sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==}
     engines: {node: '>= 0.8'}
@@ -2648,6 +2780,10 @@ packages:
     resolution: {integrity: sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==}
     engines: {node: '>=0.10.0'}
 
+  doctrine@3.0.0:
+    resolution: {integrity: sha512-yS+Q5i3hBf7GBkd4KG8a7eBNNWNGLTaEwwYWUijIYM7zrlYDM0BFXHjjPWlWZ1Rg7UaddZeIDmi9jF3HmqiQ2w==}
+    engines: {node: '>=6.0.0'}
+
   dompurify@3.3.1:
     resolution: {integrity: sha512-qkdCKzLNtrgPFP1Vo+98FRzJnBRGe4ffyCea9IwHB1fyxPOeNTHpLKYGd4Uk9xvNoH0ZoOjwZxNptyMwqrId1Q==}
 
@@ -2801,6 +2937,7 @@ packages:
   eslint@9.39.2:
     resolution: {integrity: sha512-LEyamqS7W5HB3ujJyvi0HQK/dtVINZvd5mAAp9eT5S/ujByGjiZLCzPcHVzuXbpJDJF/cxwHlfceVUDZ2lnSTw==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
+    deprecated: This version is no longer supported. Please see https://eslint.org/version-support for other options.
     hasBin: true
     peerDependencies:
       jiti: '*'
@@ -2848,6 +2985,12 @@ packages:
     resolution: {integrity: sha512-8uSpZZocAZRBAPIEINJj3Lo9HyGitllczc27Eh5YYojjMFMn8yHMDMaUHE2Jqfq05D/wucwI4JGURyXt1vchyg==}
     engines: {node: '>=10'}
 
+  express-rate-limit@8.7.0:
+    resolution: {integrity: sha512-hOwV7WOxXfjRpAM1DSJWZDXx3GhplwD8IfwuwvogD8i1Qnkgosw/H45s4ZnFAUHDAhPjlY9hLBvJhKmGMyY26g==}
+    engines: {node: '>= 16'}
+    peerDependencies:
+      express: '>= 4.11'
+
   express@4.22.1:
     resolution: {integrity: sha512-F2X8g9P1X7uCPZMA3MVf9wcTqlyNp7IhH5qPCI0izhaOIYXaW9L535tGA3qmjRzpH+bZczqq7hVKxTR4NWnu+g==}
     engines: {node: '>= 0.10.0'}
@@ -2868,6 +3011,9 @@ packages:
     resolution: {integrity: sha512-h5+1OzzfCC3Ef7VbtKdcv7zsstUQwUDlYpUTvjeUsJAssPgLn7QzbboPtL5ro04Mq0rPOsMzl7q5hIbRs2wD1A==}
     engines: {node: '>=8.0.0'}
 
+  fast-copy@4.1.1:
+    resolution: {integrity: sha512-A4QTJmuiztpGtr6AMeJts9R4hbj2ZBUwtOaKrG6rw2y7t6+IaJKjz5M3XDs8BUznxDH43FVc6A0y/gWlMl4UtA==}
+
   fast-deep-equal@3.1.3:
     resolution: {integrity: sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==}
 
@@ -2892,6 +3038,12 @@ packages:
   fast-levenshtein@2.0.6:
     resolution: {integrity: sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==}
 
+  fast-safe-stringify@2.1.1:
+    resolution: {integrity: sha512-W+KJc2dmILlPplD/H4K9l9LcAHAfPtP6BY84uVLXQ6Evcz9Lcg33Y2z1IVblT6xdY54PXYVHEv+0Wpq8Io6zkA==}
+
+  fast-uri@3.1.7:
+    resolution: {integrity: sha512-dOvZVzjdZdz7phd9v6jCbwxrBW3fK6n8Rc0CtdmM4bumzMnxywBYhuph6J819RRw/ku+rLbelwfMunktuzVVHg==}
+
   fastq@1.19.1:
     resolution: {integrity: sha512-GwLTyxkCXjXbxqIhTsMI2Nui8huMPtnxg7krajPJAjnEG/iiOS7i+zCtWGZR9G0NBKbXKh6X9m9UIsYX/N6vvQ==}
 
@@ -2938,6 +3090,10 @@ packages:
     resolution: {integrity: sha512-dKx12eRCVIzqCxFGplyFKJMPvLEWgmNtUrpTiJIR5u97zEhRG8ySrtboPHZXx7daLxQVrl643cTzbab2tkQjxg==}
     engines: {node: '>= 0.4'}
 
+  foreground-child@3.3.1:
+    resolution: {integrity: sha512-gIXjKqtFuWEgzFRJA9WCQeSJLZDjgJUOMCMzxtvFq/37KojM1BFGufqsCy0r4qSQmYLsZYMeyRqzIWOMup03sw==}
+    engines: {node: '>=14'}
+
   form-data-encoder@1.7.2:
     resolution: {integrity: sha512-qfqtYan3rxrnCk1VYaA4H+Ms9xdpPqvLZa6xmMgFvhO32x7/3J/ExcTd6qpxM0vH2GdMI+poehyBZvqfMTto8A==}
 
@@ -3027,6 +3183,12 @@ packages:
     resolution: {integrity: sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==}
     engines: {node: '>=10.13.0'}
 
+  glob@11.1.0:
+    resolution: {integrity: sha512-vuNwKSaKiqm7g0THUBu2x7ckSs3XJLXE+2ssL7/MfTGPLLcrJQ/4Uq1CjPTtO5cCIiRxqvN6Twy1qOwhL0Xjcw==}
+    engines: {node: 20 || >=22}
+    deprecated: Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me
+    hasBin: true
+
   glob@7.2.3:
     resolution: {integrity: sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==}
     deprecated: Old versions of glob are not supported, and contain widely publicized security vulnerabilities, which have been fixed in the current version. Please update. Support for old versions may be purchased (at exorbitant rates) by contacting i@izs.me
@@ -3103,12 +3265,23 @@ packages:
   header-case@1.0.1:
     resolution: {integrity: sha512-i0q9mkOeSuhXw6bGgiQCCBgY/jlZuV/7dZXyZ9c6LcBrqwvT8eT719E9uxE5LiZftdl+z81Ugbg/VvXV4OJOeQ==}
 
+  helmet@8.3.0:
+    resolution: {integrity: sha512-Qgpiaws3Sm30Av8Eah6sjMCZZwjlBu+E68rhpCWBshY1lb09HtLwj5GviX0OyQIn+ulUS0iX0AxN5n3tLZzz1w==}
+    engines: {node: '>=18.0.0'}
+
+  help-me@5.0.0:
+    resolution: {integrity: sha512-7xgomUX6ADmcYzFik0HzAxh/73YlKR9bmFzf51CZwR+b6YtzU2m0u49hQCqV6SvlqIqsaxovfwdvbnsw3b/zpg==}
+
   hermes-estree@0.25.1:
     resolution: {integrity: sha512-0wUoCcLp+5Ev5pDW2OriHC2MJCbwLwuRx+gAqMTOkGKJJiBCLjtrvy4PWUGn6MIVefecRpzoOZ/UV6iGdOr+Cw==}
 
   hermes-parser@0.25.1:
     resolution: {integrity: sha512-6pEjquH3rqaI6cYAXYPcz9MS4rY6R4ngRgrgfDshRptUZIc3lw0MCIJIGDj9++mfySOuPTHB4nrSW99BCvOPIA==}
 
+  hpp@0.2.3:
+    resolution: {integrity: sha512-4zDZypjQcxK/8pfFNR7jaON7zEUpXZxz4viyFmqjb3kWNWAHsLEUmWXcdn25c5l76ISvnD6hbOGO97cXUI3Ryw==}
+    engines: {node: '>=0.10.0'}
+
   http-errors@2.0.1:
     resolution: {integrity: sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ==}
     engines: {node: '>= 0.8'}
@@ -3202,6 +3375,14 @@ packages:
     resolution: {integrity: sha512-5Hh7Y1wQbvY5ooGgPbDaL5iYLAPzMTUrjMulskHLH6wnv/A+1q5rgEaiuqEjB+oxGXIVZs1FF+R/KPN3ZSQYYg==}
     engines: {node: '>=12'}
 
+  ioredis@6.0.0:
+    resolution: {integrity: sha512-f+Dtubxfpf6KYFq7WVXJoOLn0bk4TJrMrN9SzeE+jrWrCWj7XX3fA6vkryafhADX+GMymRxgDJDOI33COkJc0w==}
+    engines: {node: '>=20.0.0'}
+
+  ip-address@10.7.0:
+    resolution: {integrity: sha512-BGFsyJd5mpXp3rK6jIdADLNgpJUK1jnjzvYF8lK+VyDab9JAmqN0YOKDdP17HlgKb2+ehPgDc8EtnRLbGCAMhA==}
+    engines: {node: '>= 12'}
+
   ip-address@9.0.5:
     resolution: {integrity: sha512-zHtQzGojZXTwZTHQqra+ETKd4Sn3vgi7uBmlPoXVWZqYvuKmtI0l/VZTjqGmJY9x88GGOaZ9+G9ES8hC4T4X8g==}
     engines: {node: '>= 12'}
@@ -3361,10 +3542,18 @@ packages:
     resolution: {integrity: sha512-H0dkQoCa3b2VEeKQBOxFph+JAbcrQdE7KC0UkqwpLmv2EC4P41QXP+rqo9wYodACiG5/WM5s9oDApTU8utwj9g==}
     engines: {node: '>= 0.4'}
 
+  jackspeak@4.2.3:
+    resolution: {integrity: sha512-ykkVRwrYvFm1nb2AJfKKYPr0emF6IiXDYUaFx4Zn9ZuIH7MrzEZ3sD5RlqGXNRpHtvUHJyOnCEFxOlNDtGo7wg==}
+    engines: {node: 20 || >=22}
+
   jiti@2.6.1:
     resolution: {integrity: sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==}
     hasBin: true
 
+  joycon@3.1.1:
+    resolution: {integrity: sha512-34wB/Y7MW7bzjKRjUKTa46I2Z7eV62Rkhva+KkopW7Qvv/OSWBqvkSY7vusOPrNuZcUG3tApvdVgNB8POj3SPw==}
+    engines: {node: '>=10'}
+
   js-tokens@4.0.0:
     resolution: {integrity: sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==}
 
@@ -3389,6 +3578,9 @@ packages:
   json-schema-traverse@0.4.1:
     resolution: {integrity: sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==}
 
+  json-schema-traverse@1.0.0:
+    resolution: {integrity: sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==}
+
   json-stable-stringify-without-jsonify@1.0.1:
     resolution: {integrity: sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==}
 
@@ -3543,6 +3735,9 @@ packages:
   lodash.merge@4.6.2:
     resolution: {integrity: sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==}
 
+  lodash.mergewith@4.6.2:
+    resolution: {integrity: sha512-GK3g5RPZWTRSeLSpgP8Xhra+pnjBC56q9FZYe1d5RN3TJ35dbkGy3YqBSMbyCrlbi+CM9Z3Jk5yTL7RCsqboyQ==}
+
   lodash.once@4.1.1:
     resolution: {integrity: sha512-Sb487aTOCr9drQVL8pIxOzVhafOjZN9UU54hiN8PU3uAiSV7lx1yYNpbNmex2PK6dSJoNTSJUUswT651yww3Mg==}
 
@@ -3567,6 +3762,10 @@ packages:
   lower-case@1.1.4:
     resolution: {integrity: sha512-2Fgx1Ycm599x+WGpIYwJOvsjmXFzTSc34IwDWALRA/8AopUKAVPwfJ+h5+f85BCp0PWmmJcWzEpxOpoXycMpdA==}
 
+  lru-cache@11.5.2:
+    resolution: {integrity: sha512-4pfM1Ff0x50o0tQwb5ucw/RzNyD0/YJME6IVcStalZuMWxdt3sR3huStTtxz4PUmvZfRguvDejasvQ2kifR11g==}
+    engines: {node: 20 || >=22}
+
   lru-cache@5.1.1:
     resolution: {integrity: sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==}
 
@@ -3650,6 +3849,10 @@ packages:
     resolution: {integrity: sha512-OqbOk5oEQeAZ8WXWydlu9HJjz9WVdEIvamMCcXmuqUYjTknH/sqsWvhQ3vgwKFRR1HpjvNBKQ37nbJgYzGqGcg==}
     engines: {node: '>=6'}
 
+  minimatch@10.2.6:
+    resolution: {integrity: sha512-vpLQEs+VLCr1nU0BXS07maYoFwlDAH0gngQuuttxIwutDFEMHq2blX+8vpgxDdK3J1PwjCJiep77OitTZ4Ll1A==}
+    engines: {node: 18 || 20 || >=22}
+
   minimatch@3.1.2:
     resolution: {integrity: sha512-J7p63hRiAjw1NDEww1W7i37+ByIrOWO5XQQAzZ3VOcL0PNybwpfmV/N05zFAzwQ9USyEcX6t3UO+K5aqBQOIHw==}
 
@@ -3664,6 +3867,10 @@ packages:
   minimist@1.2.8:
     resolution: {integrity: sha512-2yyAR8qBkN3YuheJanUpWC5U3bb5osDywNB8RzDVlDwDHbocAJveqqj1u8+SVD7jkWT4yvsHCpWqqWqAxb0zCA==}
 
+  minipass@7.1.3:
+    resolution: {integrity: sha512-tEBHqDnIoM/1rXME1zgka9g6Q2lcoCkxHLuc7ODJ5BxbP5d4c2Z5cGgtXAku59200Cx7diuHTOYfSBD8n6mm8A==}
+    engines: {node: '>=16 || 14 >=14.17'}
+
   mitt@3.0.1:
     resolution: {integrity: sha512-vKivATfr97l2/QBCYAkXYDbrIWPM2IIKEl7YPhjCvKlG3kE2gm+uBo6nEXK3M5/Ffh/FLpKExzOQ3JJoJGFKBw==}
 
@@ -3805,6 +4012,10 @@ packages:
   ohash@2.0.11:
     resolution: {integrity: sha512-RdR9FQrFwNBNXAr4GixM8YaRZRJ5PUWbKYbE5eOsrwAjJW0q2REGcf79oYPsLyskQCZG1PLN+S/K1V00joZAoQ==}
 
+  on-exit-leak-free@2.1.2:
+    resolution: {integrity: sha512-0eJJY6hXLGf1udHwfNftBqH+g73EU4B504nZeKpz1sYRKafAghwxEJunB2O7rDZkL4PGfsMVnTXZ2EjibbqcsA==}
+    engines: {node: '>=14.0.0'}
+
   on-finished@2.4.1:
     resolution: {integrity: sha512-oVlzkg3ENAhCk2zdv7IJwd/QUD4z2RxRwpkcGY8psCVcCYZNq4wYnVWALHM+brtuJjePWiYF/ClmuDr8Ch5+kg==}
     engines: {node: '>= 0.8'}
@@ -3816,6 +4027,9 @@ packages:
     resolution: {integrity: sha512-kbpaSSGJTWdAY5KPVeMOKXSrPtr8C8C7wodJbcsd51jRnmD+GZu8Y0VoU6Dm5Z4vWr0Ig/1NKuWRKf7j5aaYSg==}
     engines: {node: '>=6'}
 
+  openapi-types@12.1.3:
+    resolution: {integrity: sha512-N4YtSYJqghVu4iek2ZUvcN/0aqH1kRDuNqzcycDxhOUpg7GdvLa2F3DgS6yBNhInhv2r/6I0Flkn7CqL8+nIcw==}
+
   optionator@0.9.4:
     resolution: {integrity: sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==}
     engines: {node: '>= 0.8.0'}
@@ -3856,6 +4070,9 @@ packages:
     resolution: {integrity: sha512-5NPgf87AT2STgwa2ntRMr45jTKrYBGkVU36yT0ig/n/GMAa3oPqhZfIQ2kMEimReg0+t9kZViDVZ83qfVUlckg==}
     engines: {node: '>= 14'}
 
+  package-json-from-dist@1.0.1:
+    resolution: {integrity: sha512-UEZIS3/by4OC8vL3P2dTXRETpebLI2NiI5vIrjaD/5UtrkFX/tNbwjTSRAGC/+7CAo2pIcBaRgWmcBBHcsaCIw==}
+
   package-manager-detector@1.6.0:
     resolution: {integrity: sha512-61A5ThoTiDG/C8s8UMZwSorAGwMJ0ERVGj2OjoW5pAalsNOg15+iQiPzrLJ4jhZ1HJzmC2PIHT2oEiH3R5fzNA==}
 
@@ -3898,6 +4115,10 @@ packages:
   path-parse@1.0.7:
     resolution: {integrity: sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==}
 
+  path-scurry@2.0.2:
+    resolution: {integrity: sha512-3O/iVVsJAPsOnpwWIeD+d6z/7PmqApyQePUtCndjatj/9I5LylHvt5qluFaBT3I5h3r1ejfR056c+FCv+NnNXg==}
+    engines: {node: 18 || 20 || >=22}
+
   path-to-regexp@0.1.12:
     resolution: {integrity: sha512-RA1GjUVMnvYFxuqovrEqZoxxW5NUZqbwKtYz/Tt7nXerk0LbLblQmrsgdeOxV5SFHf0UDggjS/bSeOZwt1pmEQ==}
 
@@ -3932,6 +4153,23 @@ packages:
     resolution: {integrity: sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==}
     engines: {node: '>=12'}
 
+  pino-abstract-transport@3.0.0:
+    resolution: {integrity: sha512-wlfUczU+n7Hy/Ha5j9a/gZNy7We5+cXp8YL+X+PG8S0KXxw7n/JXA3c46Y0zQznIJ83URJiwy7Lh56WLokNuxg==}
+
+  pino-http@11.0.0:
+    resolution: {integrity: sha512-wqg5XIAGRRIWtTk8qPGxkbrfiwEWz1lgedVLvhLALudKXvg1/L2lTFgTGPJ4Z2e3qcRmxoFxDuSdMdMGNM6I1g==}
+
+  pino-pretty@13.1.3:
+    resolution: {integrity: sha512-ttXRkkOz6WWC95KeY9+xxWL6AtImwbyMHrL1mSwqwW9u+vLp/WIElvHvCSDg0xO/Dzrggz1zv3rN5ovTRVowKg==}
+    hasBin: true
+
+  pino-std-serializers@7.1.0:
+    resolution: {integrity: sha512-BndPH67/JxGExRgiX1dX0w1FvZck5Wa4aal9198SrRhZjH3GxKQUKIBnYJTdj2HDN3UQAS06HlfcSbQj2OHmaw==}
+
+  pino@10.3.1:
+    resolution: {integrity: sha512-r34yH/GlQpKZbU1BvFFqOjhISRo1MNx1tWYsYvmj6KIRHSPMT2+yHOEb1SG6NMvRoHRF0a07kCOox/9yakl1vg==}
+    hasBin: true
+
   pkg-types@1.3.1:
     resolution: {integrity: sha512-/Jm5M4RvtBFVkKWRu2BLUTNP8/M2a+UwuAX+ae4770q1qVGtfjG+WTCupoZixokjmHiry8uI+dlY8KXYV5HVVQ==}
 
@@ -3975,6 +4213,9 @@ packages:
       typescript:
         optional: true
 
+  process-warning@5.1.0:
+    resolution: {integrity: sha512-jQSaVHsPgtyw60e1rQ/A+/ArPEj/S8pS/vFnyGa/gYFXrKk/6RuDkoqVDQ5NI5MmS01698ltlAk0NoDBNLujRw==}
+
   progress@2.0.3:
     resolution: {integrity: sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==}
     engines: {node: '>=0.4.0'}
@@ -4019,6 +4260,9 @@ packages:
   queue-microtask@1.2.3:
     resolution: {integrity: sha512-NuaNSa6flKT5JaSYQzJok04JzTL1CA6aGhv5rfLW3PgqA+M2ChpZQnAC8h8i4ZFkBS8X5RqkDBHA7r4hej3K9A==}
 
+  quick-format-unescaped@4.0.4:
+    resolution: {integrity: sha512-tYC1Q1hgyRuHgloV/YXs2w15unPVh8qfu/qCTfhTYamaw7fyhumKa2yGpdSo87vY32rIclj+4fWYQXUMs9EHvg==}
+
   radix-ui@1.4.3:
     resolution: {integrity: sha512-aWizCQiyeAenIdUbqEpXgRA1ya65P13NKn/W8rWkcN0OPkRDxdBVLWnIEDsS2RpwCK2nobI7oMUSmexzTDyAmA==}
     peerDependencies:
@@ -4118,6 +4362,17 @@ packages:
     resolution: {integrity: sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==}
     engines: {node: '>= 14.18.0'}
 
+  real-require@0.2.0:
+    resolution: {integrity: sha512-57frrGM/OCTLqLOAh0mhVA9VBMHd+9U7Zb2THMGdBUoZVOtGbJzjxsYGDJ3A9AYYCP4hn6y1TVbaOfzWtm5GFg==}
+    engines: {node: '>= 12.13.0'}
+
+  real-require@1.0.0:
+    resolution: {integrity: sha512-P4nbQYQfePJxRSmY+v/KINxVucm4NF3p3s7pJveMTtom52FR4YGltUQLB8idDXwDDWW+eYrWDFbuzUnjoWHF7g==}
+
+  redis-errors@1.2.0:
+    resolution: {integrity: sha512-1qny3OExCf0UvUV/5wpYKf2YwPcOqXzkwKKSmKHiE6ZMQs5heeE/c8eXK+PNllPvmjgAbfnsbpkGZWy8cBpn9w==}
+    engines: {node: '>=4'}
+
   reflect.getprototypeof@1.0.10:
     resolution: {integrity: sha512-00o4I+DVrefhv+nX0ulyi3biSHCPDe+yLv5o/p6d/UVlirijB8E16FtfwSAi4g3tcqrQ4lRAqQSoFEZJehYEcw==}
     engines: {node: '>= 0.4'}
@@ -4137,6 +4392,10 @@ packages:
     resolution: {integrity: sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==}
     engines: {node: '>=0.10.0'}
 
+  require-from-string@2.0.2:
+    resolution: {integrity: sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==}
+    engines: {node: '>=0.10.0'}
+
   resolve-from@4.0.0:
     resolution: {integrity: sha512-pb/MYmXstAkysRFx8piNI1tGFNQIFA3vkE3Gq4EuA1dF6gHp/+vgZqsCGJapvy8N3Q+4o7FwvquPJcnZ7RYy4g==}
     engines: {node: '>=4'}
@@ -4206,12 +4465,19 @@ packages:
     resolution: {integrity: sha512-x/+Cz4YrimQxQccJf5mKEbIa1NzeCRNI5Ecl/ekmlYaampdNLPalVyIcCZNNH3MvmqBugV5TMYZXv0ljslUlaw==}
     engines: {node: '>= 0.4'}
 
+  safe-stable-stringify@2.5.0:
+    resolution: {integrity: sha512-b3rppTKm9T+PsVCBEOUR46GWI7fdOs00VKZ1+9c1EWDaDMvjQc6tUwuFyIprgGgTcWoVHSKrU8H31ZHA2e0RHA==}
+    engines: {node: '>=10'}
+
   safer-buffer@2.1.2:
     resolution: {integrity: sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==}
 
   scheduler@0.27.0:
     resolution: {integrity: sha512-eNv+WrVbKu1f3vbYJT/xtiF5syA5HPIMtf9IgY/nKg0sWqzAUEvqY/xm7OcZc/qafLx/iO9FgOmeSAp4v5ti/Q==}
 
+  secure-json-parse@4.1.0:
+    resolution: {integrity: sha512-l4KnYfEyqYJxDwlNVyRfO2E4NTHfMKAWdUuA8J0yve2Dz/E/PdBepY03RvyJpssIpRFwJoCD55wA+mEDs6ByWA==}
+
   semver@6.3.1:
     resolution: {integrity: sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==}
     hasBin: true
@@ -4283,6 +4549,10 @@ packages:
   signal-exit@3.0.7:
     resolution: {integrity: sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==}
 
+  signal-exit@4.1.0:
+    resolution: {integrity: sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==}
+    engines: {node: '>=14'}
+
   slash@3.0.0:
     resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==}
     engines: {node: '>=8'}
@@ -4302,6 +4572,9 @@ packages:
     resolution: {integrity: sha512-pe4Y2yzru68lXCb38aAqRf5gvN8YdjP1lok5o0J7BOHljkyCGKVz7H3vpVIXKD27rj2giOJ7DwVyk/GWrPHDWA==}
     engines: {node: '>= 10.0.0', npm: '>= 3.0.0'}
 
+  sonic-boom@4.2.1:
+    resolution: {integrity: sha512-w6AxtubXa2wTXAUsZMMWERrsIRAdrK0Sc+FUytWvYAhBJLyuI4llrMIC1DtlNSdI99EI86KZum2MMq3EAZlF9Q==}
+
   source-map-js@1.2.1:
     resolution: {integrity: sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==}
     engines: {node: '>=0.10.0'}
@@ -4313,9 +4586,16 @@ packages:
     resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==}
     engines: {node: '>=0.10.0'}
 
+  split2@4.2.0:
+    resolution: {integrity: sha512-UcjcJOWknrNkF6PLX83qcHM6KHgVKNkV62Y8a5uYDVv9ydGQVwAHMKqHdJje1VTWpljG0WYpCDhrCdAOYH4TWg==}
+    engines: {node: '>= 10.x'}
+
   sprintf-js@1.1.3:
     resolution: {integrity: sha512-Oo+0REFV59/rz3gfJNKQiBlwfHaSESl1pcGyABQsnnIfWOFt6JNj5gCog2U6MLZ//IGYD+nA8nI+mTShREReaA==}
 
+  standard-as-callback@2.1.0:
+    resolution: {integrity: sha512-qoRRSyROncaz1z0mvYqIE4lCd9p2R90i6GxW3uZv5ucSu8tU7B5HXUP1gG8pVZsYNVaXjk8ClXHPttLyxAL48A==}
+
   statuses@2.0.2:
     resolution: {integrity: sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==}
     engines: {node: '>= 0.8'}
@@ -4373,6 +4653,10 @@ packages:
     resolution: {integrity: sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==}
     engines: {node: '>=8'}
 
+  strip-json-comments@5.0.3:
+    resolution: {integrity: sha512-1tB5mhVo7U+ETBKNf92xT4hrQa3pm0MZ0PQvuDnWgAAGHDsfp4lPSpiS6psrSiet87wyGPh9ft6wmhOMQ0hDiw==}
+    engines: {node: '>=14.16'}
+
   styled-jsx@5.1.6:
     resolution: {integrity: sha512-qSVyDTeMotdvQYoHWLNGwRFJHC+i+ZvdBRYosOFgC+Wg1vx4frN2/RG/NA7SYqqvKNLf39P2LSRA2pu6n0XYZA==}
     engines: {node: '>= 12.0.0'}
@@ -4401,6 +4685,20 @@ packages:
     resolution: {integrity: sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==}
     engines: {node: '>= 0.4'}
 
+  swagger-jsdoc@6.3.0:
+    resolution: {integrity: sha512-I+iQjVGV3t28pOkQUJv2MncthvOtkEactOn8R76SvSYhxgtIn7FoqfDHwQaN+GBnQdXQLrhgDXseKitmJcHMsA==}
+    engines: {node: '>=20.0.0'}
+    hasBin: true
+
+  swagger-ui-dist@5.32.15:
+    resolution: {integrity: sha512-TSFER+rFQlf1nzk6WvKkMaHTxAPQ3eAAxigFThnxQedSREanfZgSbJFayZVs/ULnSbNdrJOb99vLD6xpb3R3eg==}
+
+  swagger-ui-express@5.0.1:
+    resolution: {integrity: sha512-SrNU3RiBGTLLmFU8GIJdOdanJTl4TOmT27tt3bWWHppqYmAZ6IDuEuBvMU6nZq0zLEe6b/1rACXCgLZqO6ZfrA==}
+    engines: {node: '>= v0.10.32'}
+    peerDependencies:
+      express: '>=4.0.0 || >=5.0.0-beta'
+
   swap-case@1.1.2:
     resolution: {integrity: sha512-BAmWG6/bx8syfc6qXPprof3Mn5vQgf5dwdUNJhsNqU9WdPt5P+ES/wQ5bxfijy8zwZgZZHslC3iAsxsuQMCzJQ==}
 
@@ -4423,6 +4721,10 @@ packages:
   text-decoder@1.2.3:
     resolution: {integrity: sha512-3/o9z3X0X0fTupwsYvR03pJ/DjWuqqrfwBgTQzdWDiQSm9KitAyz/9WqsT2JQW7KV2m+bC2ol/zqpW37NHxLaA==}
 
+  thread-stream@4.2.0:
+    resolution: {integrity: sha512-e2zZ96wSChazBsbENf/Pcm/4swHt2cEKQ92rhUjkL9GCKiTDJIaTBenjE/m9DXi0QBmTMDkFDdOomUy20A1tDQ==}
+    engines: {node: '>=20'}
+
   through@2.3.8:
     resolution: {integrity: sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg==}
 
@@ -4773,6 +5075,13 @@ packages:
       utf-8-validate:
         optional: true
 
+  xss-clean@0.1.4:
+    resolution: {integrity: sha512-4hArTFHYxrifK9VXOu/zFvwjTXVjKByPi6woUHb1IqxlX0Z4xtFBRjOhTKuYV/uE1VswbYsIh5vUEYp7MmoISQ==}
+    deprecated: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.
+
+  xss-filters@1.2.7:
+    resolution: {integrity: sha512-KzcmYT/f+YzcYrYRqw6mXxd25BEZCxBQnf+uXTopQDIhrmiaLwO+f+yLsIvvNlPhYvgff8g3igqrBxYh9k8NbQ==}
+
   xtend@4.0.2:
     resolution: {integrity: sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==}
     engines: {node: '>=0.4'}
@@ -4784,6 +5093,10 @@ packages:
   yallist@3.1.1:
     resolution: {integrity: sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==}
 
+  yaml@2.0.0-1:
+    resolution: {integrity: sha512-W7h5dEhywMKenDJh2iX/LABkbFnBxasD27oyXWDS/feDsxiw0dD5ncXdYXgkvAsXIY2MpW/ZKkr9IU30DBdMNQ==}
+    engines: {node: '>= 6'}
+
   yargs-parser@21.1.1:
     resolution: {integrity: sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==}
     engines: {node: '>=12'}
@@ -4821,6 +5134,25 @@ snapshots:
       package-manager-detector: 1.6.0
       tinyexec: 1.0.2
 
+  '@apidevtools/json-schema-ref-parser@14.0.1':
+    dependencies:
+      '@types/json-schema': 7.0.15
+      js-yaml: 4.1.1
+
+  '@apidevtools/openapi-schemas@2.1.0': {}
+
+  '@apidevtools/swagger-methods@3.0.2': {}
+
+  '@apidevtools/swagger-parser@12.1.0(openapi-types@12.1.3)':
+    dependencies:
+      '@apidevtools/json-schema-ref-parser': 14.0.1
+      '@apidevtools/openapi-schemas': 2.1.0
+      '@apidevtools/swagger-methods': 3.0.2
+      ajv: 8.20.0
+      ajv-draft-04: 1.0.0(ajv@8.20.0)
+      call-me-maybe: 1.0.2
+      openapi-types: 12.1.3
+
   '@babel/code-frame@7.29.0':
     dependencies:
       '@babel/helper-validator-identifier': 7.28.5
@@ -5144,6 +5476,10 @@ snapshots:
     optionalDependencies:
       '@types/node': 25.2.0
 
+  '@ioredis/commands@2.0.0': {}
+
+  '@isaacs/cliui@9.0.0': {}
+
   '@jridgewell/gen-mapping@0.3.13':
     dependencies:
       '@jridgewell/sourcemap-codec': 1.5.5
@@ -5262,6 +5598,8 @@ snapshots:
       '@nodelib/fs.scandir': 2.1.5
       fastq: 1.19.1
 
+  '@pinojs/redact@0.4.0': {}
+
   '@prisma/client@6.19.2(prisma@6.19.2(typescript@5.9.3))(typescript@5.9.3)':
     optionalDependencies:
       prisma: 6.19.2(typescript@5.9.3)
@@ -6084,6 +6422,8 @@ snapshots:
 
   '@radix-ui/rect@1.1.1': {}
 
+  '@scarf/scarf@1.4.0': {}
+
   '@standard-schema/spec@1.1.0': {}
 
   '@supabase/auth-js@2.94.1':
@@ -6379,6 +6719,13 @@ snapshots:
 
   '@types/estree@1.0.8': {}
 
+  '@types/express-rate-limit@6.0.2(express@4.22.1)':
+    dependencies:
+      express-rate-limit: 8.7.0(express@4.22.1)
+    transitivePeerDependencies:
+      - express
+      - supports-color
+
   '@types/express-serve-static-core@4.19.8':
     dependencies:
       '@types/node': 20.19.31
@@ -6400,6 +6747,10 @@ snapshots:
       '@types/minimatch': 6.0.0
       '@types/node': 25.2.0
 
+  '@types/hpp@0.2.7':
+    dependencies:
+      '@types/express': 4.17.25
+
   '@types/http-errors@2.0.5': {}
 
   '@types/inquirer@6.5.0':
@@ -6472,6 +6823,13 @@ snapshots:
 
   '@types/strip-json-comments@0.0.30': {}
 
+  '@types/swagger-jsdoc@6.0.4': {}
+
+  '@types/swagger-ui-express@4.1.8':
+    dependencies:
+      '@types/express': 4.17.25
+      '@types/serve-static': 1.15.10
+
   '@types/through@0.0.33':
     dependencies:
       '@types/node': 25.2.0
@@ -6611,6 +6969,10 @@ snapshots:
       clean-stack: 2.2.0
       indent-string: 4.0.0
 
+  ajv-draft-04@1.0.0(ajv@8.20.0):
+    optionalDependencies:
+      ajv: 8.20.0
+
   ajv@6.12.6:
     dependencies:
       fast-deep-equal: 3.1.3
@@ -6618,6 +6980,13 @@ snapshots:
       json-schema-traverse: 0.4.1
       uri-js: 4.4.1
 
+  ajv@8.20.0:
+    dependencies:
+      fast-deep-equal: 3.1.3
+      fast-uri: 3.1.7
+      json-schema-traverse: 1.0.0
+      require-from-string: 2.0.2
+
   ansi-escapes@4.3.2:
     dependencies:
       type-fest: 0.21.3
@@ -6714,6 +7083,8 @@ snapshots:
 
   asynckit@0.4.0: {}
 
+  atomic-sleep@1.0.0: {}
+
   available-typed-arrays@1.0.7:
     dependencies:
       possible-typed-array-names: 1.1.0
@@ -6722,6 +7093,8 @@ snapshots:
 
   balanced-match@1.0.2: {}
 
+  balanced-match@4.0.4: {}
+
   bare-events@2.8.2: {}
 
   bare-fs@4.5.3:
@@ -6801,6 +7174,10 @@ snapshots:
     dependencies:
       balanced-match: 1.0.2
 
+  brace-expansion@5.0.9:
+    dependencies:
+      balanced-match: 4.0.4
+
   braces@3.0.3:
     dependencies:
       fill-range: 7.1.1
@@ -6862,6 +7239,8 @@ snapshots:
       call-bind-apply-helpers: 1.0.2
       get-intrinsic: 1.3.0
 
+  call-me-maybe@1.0.2: {}
+
   callsites@3.1.0: {}
 
   camel-case@3.0.0:
@@ -6980,6 +7359,8 @@ snapshots:
 
   clsx@2.1.1: {}
 
+  cluster-key-slot@1.1.1: {}
+
   color-convert@1.9.3:
     dependencies:
       color-name: 1.1.3
@@ -6992,12 +7373,16 @@ snapshots:
 
   color-name@1.1.4: {}
 
+  colorette@2.0.20: {}
+
   combined-stream@1.0.8:
     dependencies:
       delayed-stream: 1.0.0
 
   commander@10.0.0: {}
 
+  commander@6.2.0: {}
+
   commander@7.2.0: {}
 
   commander@8.3.0: {}
@@ -7265,6 +7650,8 @@ snapshots:
       es-errors: 1.3.0
       is-data-view: 1.0.2
 
+  dateformat@4.6.3: {}
+
   dayjs@1.11.19: {}
 
   debug@2.6.9:
@@ -7322,6 +7709,8 @@ snapshots:
 
   delayed-stream@1.0.0: {}
 
+  denque@2.1.0: {}
+
   depd@2.0.0: {}
 
   dequal@2.0.3: {}
@@ -7346,6 +7735,10 @@ snapshots:
     dependencies:
       esutils: 2.0.3
 
+  doctrine@3.0.0:
+    dependencies:
+      esutils: 2.0.3
+
   dompurify@3.3.1:
     optionalDependencies:
       '@types/trusted-types': 2.0.7
@@ -7656,6 +8049,14 @@ snapshots:
       signal-exit: 3.0.7
       strip-final-newline: 2.0.0
 
+  express-rate-limit@8.7.0(express@4.22.1):
+    dependencies:
+      debug: 4.4.3
+      express: 4.22.1
+      ip-address: 10.7.0
+    transitivePeerDependencies:
+      - supports-color
+
   express@4.22.1:
     dependencies:
       accepts: 1.3.8
@@ -7714,6 +8115,8 @@ snapshots:
     dependencies:
       pure-rand: 6.1.0
 
+  fast-copy@4.1.1: {}
+
   fast-deep-equal@3.1.3: {}
 
   fast-fifo@1.3.2: {}
@@ -7746,6 +8149,10 @@ snapshots:
 
   fast-levenshtein@2.0.6: {}
 
+  fast-safe-stringify@2.1.1: {}
+
+  fast-uri@3.1.7: {}
+
   fastq@1.19.1:
     dependencies:
       reusify: 1.1.0
@@ -7798,6 +8205,11 @@ snapshots:
     dependencies:
       is-callable: 1.2.7
 
+  foreground-child@3.3.1:
+    dependencies:
+      cross-spawn: 7.0.6
+      signal-exit: 4.1.0
+
   form-data-encoder@1.7.2: {}
 
   form-data@4.0.5:
@@ -7902,6 +8314,15 @@ snapshots:
     dependencies:
       is-glob: 4.0.3
 
+  glob@11.1.0:
+    dependencies:
+      foreground-child: 3.3.1
+      jackspeak: 4.2.3
+      minimatch: 10.2.6
+      minipass: 7.1.3
+      package-json-from-dist: 1.0.1
+      path-scurry: 2.0.2
+
   glob@7.2.3:
     dependencies:
       fs.realpath: 1.0.0
@@ -7992,12 +8413,21 @@ snapshots:
       no-case: 2.3.2
       upper-case: 1.1.3
 
+  helmet@8.3.0: {}
+
+  help-me@5.0.0: {}
+
   hermes-estree@0.25.1: {}
 
   hermes-parser@0.25.1:
     dependencies:
       hermes-estree: 0.25.1
 
+  hpp@0.2.3:
+    dependencies:
+      lodash: 4.17.21
+      type-is: 1.6.18
+
   http-errors@2.0.1:
     dependencies:
       depd: 2.0.0
@@ -8115,6 +8545,19 @@ snapshots:
 
   internmap@2.0.3: {}
 
+  ioredis@6.0.0:
+    dependencies:
+      '@ioredis/commands': 2.0.0
+      cluster-key-slot: 1.1.1
+      debug: 4.4.3
+      denque: 2.1.0
+      redis-errors: 1.2.0
+      standard-as-callback: 2.1.0
+    transitivePeerDependencies:
+      - supports-color
+
+  ip-address@10.7.0: {}
+
   ip-address@9.0.5:
     dependencies:
       jsbn: 1.1.0
@@ -8270,8 +8713,14 @@ snapshots:
       has-symbols: 1.1.0
       set-function-name: 2.0.2
 
+  jackspeak@4.2.3:
+    dependencies:
+      '@isaacs/cliui': 9.0.0
+
   jiti@2.6.1: {}
 
+  joycon@3.1.1: {}
+
   js-tokens@4.0.0: {}
 
   js-yaml@4.1.1:
@@ -8288,6 +8737,8 @@ snapshots:
 
   json-schema-traverse@0.4.1: {}
 
+  json-schema-traverse@1.0.0: {}
+
   json-stable-stringify-without-jsonify@1.0.1: {}
 
   json5@2.2.3: {}
@@ -8429,6 +8880,8 @@ snapshots:
 
   lodash.merge@4.6.2: {}
 
+  lodash.mergewith@4.6.2: {}
+
   lodash.once@4.1.1: {}
 
   lodash@4.17.21: {}
@@ -8452,6 +8905,8 @@ snapshots:
 
   lower-case@1.1.4: {}
 
+  lru-cache@11.5.2: {}
+
   lru-cache@5.1.1:
     dependencies:
       yallist: 3.1.1
@@ -8528,6 +8983,10 @@ snapshots:
 
   mimic-fn@2.1.0: {}
 
+  minimatch@10.2.6:
+    dependencies:
+      brace-expansion: 5.0.9
+
   minimatch@3.1.2:
     dependencies:
       brace-expansion: 1.1.12
@@ -8542,6 +9001,8 @@ snapshots:
 
   minimist@1.2.8: {}
 
+  minipass@7.1.3: {}
+
   mitt@3.0.1: {}
 
   mkdirp@0.5.6:
@@ -8680,6 +9141,8 @@ snapshots:
 
   ohash@2.0.11: {}
 
+  on-exit-leak-free@2.1.2: {}
+
   on-finished@2.4.1:
     dependencies:
       ee-first: 1.1.1
@@ -8692,6 +9155,8 @@ snapshots:
     dependencies:
       mimic-fn: 2.1.0
 
+  openapi-types@12.1.3: {}
+
   optionator@0.9.4:
     dependencies:
       deep-is: 0.1.4
@@ -8762,6 +9227,8 @@ snapshots:
       degenerator: 5.0.1
       netmask: 2.0.2
 
+  package-json-from-dist@1.0.1: {}
+
   package-manager-detector@1.6.0: {}
 
   param-case@2.1.1:
@@ -8800,6 +9267,11 @@ snapshots:
 
   path-parse@1.0.7: {}
 
+  path-scurry@2.0.2:
+    dependencies:
+      lru-cache: 11.5.2
+      minipass: 7.1.3
+
   path-to-regexp@0.1.12: {}
 
   path-type@4.0.0: {}
@@ -8822,6 +9294,49 @@ snapshots:
 
   picomatch@4.0.3: {}
 
+  pino-abstract-transport@3.0.0:
+    dependencies:
+      split2: 4.2.0
+
+  pino-http@11.0.0:
+    dependencies:
+      get-caller-file: 2.0.5
+      pino: 10.3.1
+      pino-std-serializers: 7.1.0
+      process-warning: 5.1.0
+
+  pino-pretty@13.1.3:
+    dependencies:
+      colorette: 2.0.20
+      dateformat: 4.6.3
+      fast-copy: 4.1.1
+      fast-safe-stringify: 2.1.1
+      help-me: 5.0.0
+      joycon: 3.1.1
+      minimist: 1.2.8
+      on-exit-leak-free: 2.1.2
+      pino-abstract-transport: 3.0.0
+      pump: 3.0.3
+      secure-json-parse: 4.1.0
+      sonic-boom: 4.2.1
+      strip-json-comments: 5.0.3
+
+  pino-std-serializers@7.1.0: {}
+
+  pino@10.3.1:
+    dependencies:
+      '@pinojs/redact': 0.4.0
+      atomic-sleep: 1.0.0
+      on-exit-leak-free: 2.1.2
+      pino-abstract-transport: 3.0.0
+      pino-std-serializers: 7.1.0
+      process-warning: 5.1.0
+      quick-format-unescaped: 4.0.4
+      real-require: 0.2.0
+      safe-stable-stringify: 2.5.0
+      sonic-boom: 4.2.1
+      thread-stream: 4.2.0
+
   pkg-types@1.3.1:
     dependencies:
       confbox: 0.1.8
@@ -8868,6 +9383,8 @@ snapshots:
     transitivePeerDependencies:
       - magicast
 
+  process-warning@5.1.0: {}
+
   progress@2.0.3: {}
 
   prop-types@15.8.1:
@@ -8945,6 +9462,8 @@ snapshots:
 
   queue-microtask@1.2.3: {}
 
+  quick-format-unescaped@4.0.4: {}
+
   radix-ui@1.4.3(@types/react-dom@19.2.3(@types/react@19.2.10))(@types/react@19.2.10)(react-dom@19.2.4(react@19.2.4))(react@19.2.4):
     dependencies:
       '@radix-ui/primitive': 1.1.3
@@ -9097,6 +9616,12 @@ snapshots:
 
   readdirp@4.1.2: {}
 
+  real-require@0.2.0: {}
+
+  real-require@1.0.0: {}
+
+  redis-errors@1.2.0: {}
+
   reflect.getprototypeof@1.0.10:
     dependencies:
       call-bind: 1.0.8
@@ -9128,6 +9653,8 @@ snapshots:
 
   require-directory@2.1.1: {}
 
+  require-from-string@2.0.2: {}
+
   resolve-from@4.0.0: {}
 
   resolve@1.22.10:
@@ -9203,10 +9730,14 @@ snapshots:
       es-errors: 1.3.0
       is-regex: 1.2.1
 
+  safe-stable-stringify@2.5.0: {}
+
   safer-buffer@2.1.2: {}
 
   scheduler@0.27.0: {}
 
+  secure-json-parse@4.1.0: {}
+
   semver@6.3.1: {}
 
   semver@7.6.2: {}
@@ -9337,6 +9868,8 @@ snapshots:
 
   signal-exit@3.0.7: {}
 
+  signal-exit@4.1.0: {}
+
   slash@3.0.0: {}
 
   smart-buffer@4.2.0: {}
@@ -9358,6 +9891,10 @@ snapshots:
       ip-address: 9.0.5
       smart-buffer: 4.2.0
 
+  sonic-boom@4.2.1:
+    dependencies:
+      atomic-sleep: 1.0.0
+
   source-map-js@1.2.1: {}
 
   source-map-support@0.5.21:
@@ -9367,8 +9904,12 @@ snapshots:
 
   source-map@0.6.1: {}
 
+  split2@4.2.0: {}
+
   sprintf-js@1.1.3: {}
 
+  standard-as-callback@2.1.0: {}
+
   statuses@2.0.2: {}
 
   stop-iteration-iterator@1.1.0:
@@ -9451,6 +9992,8 @@ snapshots:
 
   strip-json-comments@3.1.1: {}
 
+  strip-json-comments@5.0.3: {}
+
   styled-jsx@5.1.6(react@19.2.4):
     dependencies:
       client-only: 0.0.1
@@ -9468,6 +10011,26 @@ snapshots:
 
   supports-preserve-symlinks-flag@1.0.0: {}
 
+  swagger-jsdoc@6.3.0(openapi-types@12.1.3):
+    dependencies:
+      '@apidevtools/swagger-parser': 12.1.0(openapi-types@12.1.3)
+      commander: 6.2.0
+      doctrine: 3.0.0
+      glob: 11.1.0
+      lodash.mergewith: 4.6.2
+      yaml: 2.0.0-1
+    transitivePeerDependencies:
+      - openapi-types
+
+  swagger-ui-dist@5.32.15:
+    dependencies:
+      '@scarf/scarf': 1.4.0
+
+  swagger-ui-express@5.0.1(express@4.22.1):
+    dependencies:
+      express: 4.22.1
+      swagger-ui-dist: 5.32.15
+
   swap-case@1.1.2:
     dependencies:
       lower-case: 1.1.4
@@ -9506,6 +10069,10 @@ snapshots:
     transitivePeerDependencies:
       - react-native-b4a
 
+  thread-stream@4.2.0:
+    dependencies:
+      real-require: 1.0.0
+
   through@2.3.8: {}
 
   tiny-invariant@1.3.3: {}
@@ -9879,12 +10446,20 @@ snapshots:
 
   ws@8.19.0: {}
 
+  xss-clean@0.1.4:
+    dependencies:
+      xss-filters: 1.2.7
+
+  xss-filters@1.2.7: {}
+
   xtend@4.0.2: {}
 
   y18n@5.0.8: {}
 
   yallist@3.1.1: {}
 
+  yaml@2.0.0-1: {}
+
   yargs-parser@21.1.1: {}
 
   yargs@17.7.2:

From ad5f8a4e7ca849223d414f54bc50200e5bab7cfb Mon Sep 17 00:00:00 2001
From: caya8205-2 <yaandere200@gmail.com>
Date: Mon, 7 Sep 2026 08:46:14 +0700
Subject: [PATCH 09/11] feat(tests): add unit tests and root test runner

- 40 Vitest unit tests for web-api (Zod validators, middlewares, token blacklist)
- pnpm test runnable from repo root via turbo run test
- Restructure API-Endpoint-Docs with accurate v1 section and legacy section
---
 apps/web-api/API-Endpoint-Docs.md             | 415 ++++++++++++-
 apps/web-api/package.json                     |   6 +-
 apps/web-api/tests/error.middleware.test.ts   |  63 ++
 apps/web-api/tests/token-blacklist.test.ts    |  36 ++
 .../tests/validation.middleware.test.ts       |  33 +
 apps/web-api/tests/validators.ai.test.ts      |  72 +++
 apps/web-api/tests/validators.auth.test.ts    |  60 ++
 apps/web-api/tests/validators.export.test.ts  |  40 ++
 apps/web-api/tests/validators.project.test.ts |  87 +++
 apps/web-api/vitest.config.ts                 |   8 +
 package.json                                  |   1 +
 pnpm-lock.yaml                                | 564 ++++++++++++++++++
 turbo.json                                    |   3 +
 13 files changed, 1384 insertions(+), 4 deletions(-)
 create mode 100644 apps/web-api/tests/error.middleware.test.ts
 create mode 100644 apps/web-api/tests/token-blacklist.test.ts
 create mode 100644 apps/web-api/tests/validation.middleware.test.ts
 create mode 100644 apps/web-api/tests/validators.ai.test.ts
 create mode 100644 apps/web-api/tests/validators.auth.test.ts
 create mode 100644 apps/web-api/tests/validators.export.test.ts
 create mode 100644 apps/web-api/tests/validators.project.test.ts
 create mode 100644 apps/web-api/vitest.config.ts

diff --git a/apps/web-api/API-Endpoint-Docs.md b/apps/web-api/API-Endpoint-Docs.md
index 8023c11..03959e2 100644
--- a/apps/web-api/API-Endpoint-Docs.md
+++ b/apps/web-api/API-Endpoint-Docs.md
@@ -1,11 +1,422 @@
 # **Dokumentasi API Planify**
 
-Dokumen ini menjelaskan endpoint API yang digunakan oleh aplikasi Planify untuk kebutuhan autentikasi, pembuatan dokumentasi berbasis AI, manajemen project, serta ekspor dokumen ke PDF.
+Dokumen ini menjelaskan endpoint API yang digunakan oleh aplikasi Planify untuk kebutuhan autentikasi, pembuatan dokumentasi berbasis AI, manajemen project, serta ekspor dokumen ke PDF/Markdown.
 
 Dokumentasi ini ditujukan untuk **Frontend Developer** dan pihak lain yang perlu memahami cara berkomunikasi dengan backend Planify.
 
+> **Dokumentasi interaktif (disarankan):** buka `/api/docs` di browser
+> (Swagger UI) atau `/api/docs.json` buat spec mentahnya.
+
+---
+
+# **BAGIAN A — API v1 (dipakai sekarang)**
+
+**Base URL (Development):**
+
+```
+http://localhost:4000/api/v1
+```
+
+**Autentikasi:**
+Sebagian besar endpoint membutuhkan autentikasi menggunakan **Bearer Token (JWT)**.
+
+Token dikirim melalui header:
+
+```
+Authorization: Bearer <ACCESS_TOKEN>
+```
+
+Endpoint yang **tidak memerlukan autentikasi**:
+
+* `POST /auth/register`
+* `POST /auth/login`
+* `GET /ai/status`
+* `GET /health`
+
+**Batasan (rate limit):**
+
+* Global: **100 request / 15 menit** per IP
+* Register & login: **5 request / 15 menit** per IP (anti brute-force)
+* Generate AI: **20 request / jam** per IP
+* Export PDF/Markdown: **10 request / jam** per IP
+
+Kalau kena limit, responsenya `429` dengan code `RATE_LIMIT_EXCEEDED`.
+
+**Validasi input:**
+Semua body POST/PUT/PATCH divalidasi pakai Zod. Kalau gagal,
+responsenya `400` dengan code `VALIDATION_ERROR` plus detail field yang salah:
+
+```json
+{
+  "success": false,
+  "message": "Validation failed",
+  "code": "VALIDATION_ERROR",
+  "error": "[{\"field\":\"body.email\",\"message\":\"Invalid email format\"}]"
+}
+```
+
+**Batas ukuran body:** maksimal **1MB** per request.
+
+---
+
+## **A.1. Health Check**
+
+```
+GET /health
+```
+
+Response (200):
+
+```json
+{ "status": "ok" }
+```
+
+---
+
+## **A.2. Autentikasi User**
+
+### **A.2.1 Registrasi User**
+
+```
+POST /auth/register
+```
+
+**Request Body:**
+
+```json
+{
+  "email": "user@example.com",
+  "password": "securePassword123",
+  "name": "John Doe"
+}
+```
+
+**Aturan validasi:**
+
+* `email`: wajib, format email valid
+* `password`: wajib, minimal 8 karakter
+* `name`: opsional, maksimal 100 karakter
+
+**Response Berhasil (201):**
+
+```json
+{
+  "success": true,
+  "message": "User registered successfully",
+  "data": { "id": "uuid", "email": "user@example.com", "name": "John Doe" }
+}
+```
+
+**Error:**
+
+* `VALIDATION_ERROR` — email/password tidak valid
+* `AUTH_EMAIL_EXISTS` — email sudah terdaftar
+
+---
+
+### **A.2.2 Login User**
+
+```
+POST /auth/login
+```
+
+**Request Body:**
+
+```json
+{
+  "email": "user@example.com",
+  "password": "securePassword123"
+}
+```
+
+**Response Berhasil (200):**
+
+```json
+{
+  "success": true,
+  "message": "Login successful",
+  "data": {
+    "token": "eyJhbG...",
+    "user": { "id": "uuid", "email": "user@example.com", "name": "John Doe" }
+  }
+}
+```
+
+**Catatan:**
+
+* Token disimpan di FE (localStorage/state) dan dikirim di header `Authorization` tiap request yang butuh auth.
+* `AUTH_INVALID_CREDENTIALS` — email/password salah.
+
+---
+
+### **A.2.3 Profil User Login (butuh token)**
+
+```
+GET /auth/me
+```
+
+Response (200): `{ success: true, message: "...", data: { userId, email } }`
+
+---
+
+### **A.2.4 Logout (butuh token)**
+
+```
+POST /auth/logout
+```
+
+Token yang dipakai langsung masuk blacklist dan nggak bisa dipakai lagi.
+FE wajib hapus token dari localStorage/state setelah logout.
+
+**Error token:**
+
+* `TOKEN_MISSING` — tidak ada token di header
+* `TOKEN_INVALID` — token tidak valid/kadaluarsa
+* `TOKEN_REVOKED` — token sudah di-logout
+
+---
+
+## **A.3. AI & Pembuatan Dokumen**
+
+> Catatan: generate brief & diagram preview itu **GRATIS**.
+> Koin cuma kepotong pas export PDF/Markdown (dan generate diagram terpisah).
+
+### **A.3.1 Status Layanan AI (publik)**
+
+```
+GET /ai/status
+```
+
+Response (200): `{ success: true, data: { available: boolean, provider: "groq" } }`
+
+---
+
+### **A.3.2 Generate Project Brief (butuh token)**
+
+```
+POST /ai/project-brief
+```
+
+**Request Body:**
+
+```json
+{
+  "projectName": "E-Commerce App",
+  "projectDescription": "A marketplace platform for small businesses",
+  "projectType": "webapp",
+  "documentStyle": "professional",
+  "targetAudience": "Small business owners",
+  "keyFeatures": ["Cart", "Checkout"],
+  "techStack": ["Next.js", "Supabase"],
+  "includeDiagram": false
+}
+```
+
+**Aturan validasi:**
+
+* `projectName`: wajib, 1–200 karakter
+* `projectDescription`: wajib, minimal 10 karakter, maksimal 5000
+* `projectType`: `webapp` | `mobile` | `research` | `enterprise`
+* `documentStyle`: `professional` | `formal` | `concise`
+
+**Response Berhasil (200):**
+
+```json
+{
+  "success": true,
+  "message": "Project brief generated successfully",
+  "data": { "...": "FULL_DOCUMENT_JSON" },
+  "metadata": { "...": "PROVIDER_INFO", "diagramIncluded": false },
+  "coins": 48
+}
+```
+
+---
+
+### **A.3.3 Generate Diagram (butuh token, 2 koin)**
+
+```
+POST /ai/diagram
+```
+
+**Request Body:**
+
+```json
+{
+  "projectName": "E-Commerce App",
+  "projectDescription": "A marketplace platform for small businesses",
+  "techStack": ["Next.js", "Supabase"]
+}
+```
+
+Kalau koin kurang: `402` dengan code `INSUFFICIENT_COINS`.
+
+---
+
+### **A.3.4 Saldo Koin (butuh token)**
+
+```
+GET /ai/coins
+```
+
+Response (200): `{ success: true, data: { credits: 50 } }`
+
+---
+
+## **A.4. Manajemen Project (butuh token)**
+
+### **A.4.1 Daftar Project**
+
+```
+GET /projects
+```
+
+Response (200): `{ success: true, data: [ { id, title, description, ... } ] }`
+
+---
+
+### **A.4.2 Detail Project**
+
+```
+GET /projects/:id
+```
+
+* `:id` harus UUID valid, kalau nggak: `400 VALIDATION_ERROR`.
+* Kalau bukan milik user / tidak ada: `404 NOT_FOUND`.
+
+---
+
+### **A.4.3 Buat Project**
+
+```
+POST /projects
+```
+
+**Request Body:**
+
+```json
+{
+  "title": "App A",
+  "description": "Deskripsi singkat",
+  "projectType": "webapp",
+  "documentStyle": "professional",
+  "formData": {},
+  "currentStep": 1
+}
+```
+
+* `title`: wajib, 1–200 karakter.
+
+Response (201): `{ success: true, message: "Project created", data: {...} }`
+
+---
+
+### **A.4.4 Update Project (auto-save)**
+
+```
+PUT /projects/:id
+```
+
+Semua field opsional: `title`, `description`, `projectType`,
+`currentStep`, `formData`, `generatedBrief`, `documentStyle`, `status`
+(`draft` | `published` | `archived`).
+
+---
+
+### **A.4.5 Hapus Project**
+
+```
+DELETE /projects/:id
+```
+
+Response (200): `{ success: true, message: "Project deleted successfully" }`
+
+---
+
+## **A.5. Ekspor Dokumen (butuh token, 1 koin)**
+
+### **A.5.1 Ekspor ke PDF**
+
+```
+POST /pdf/brief
+```
+
+Body: JSON `ProjectBriefOutput` (field `title` wajib).
+Response: file PDF (`Content-Type: application/pdf`), header `X-Coins-Remaining` berisi sisa koin.
+
+### **A.5.2 Ekspor ke Markdown**
+
+```
+POST /markdown/brief
+```
+
+Body: JSON `ProjectBriefOutput` (field `title` wajib).
+Response: file `.md` (`Content-Type: text/markdown`), header `X-Coins-Remaining` berisi sisa koin.
+
+---
+
+## **A.6. Riwayat Aktivitas (butuh token)**
+
+```
+GET /history?limit=20&offset=0
+```
+
+* `limit`: default 20, maksimal 100.
+* Response: `{ success: true, data: [...], pagination: { total, limit, offset } }`
+
+---
+
+## **A.7. Profil User (butuh token)**
+
+```
+GET /user/me
+```
+
+Response (200): `{ success: true, data: { id, email, fullname, credits, created_at } }`
+
 ---
 
+## **A.8. Format Error Standar**
+
+Semua error punya format:
+
+```json
+{
+  "success": false,
+  "message": "",
+  "code": ""
+}
+```
+
+**Daftar code:**
+
+| Code | Arti |
+|------|------|
+| `VALIDATION_ERROR` | Input tidak valid (lihat detail field) |
+| `RATE_LIMIT_EXCEEDED` | Kebanyakan request, coba lagi nanti |
+| `TOKEN_MISSING` / `TOKEN_INVALID` / `TOKEN_REVOKED` | Masalah token auth |
+| `AUTH_MISSING_FIELDS` | Email/password kosong |
+| `AUTH_EMAIL_EXISTS` | Email sudah terdaftar |
+| `AUTH_INVALID_CREDENTIALS` | Email/password salah |
+| `INSUFFICIENT_COINS` | Koin kurang (HTTP 402) |
+| `NOT_FOUND` | Data tidak ditemukan (HTTP 404) |
+| `INTERNAL_ERROR` | Error server (HTTP 500) |
+
+> Di mode development, response error menyertakan stack trace di field `error`.
+> Di production, stack trace disembunyikan.
+
+---
+
+# **BAGIAN B — LEGACY (deprecated, jangan dipakai buat fitur baru)**
+
+> Endpoint di bawah ini adalah dokumentasi lama **tanpa prefix versi**
+> (`/api/...` bukan `/api/v1/...`). Masih bisa diakses dan otomatis
+> ngasih header `Deprecation: true`, tapi **sebagian isinya sudah basi**
+> (mis. `/ai/generate`, `/ai/regenerate-section`, dan `/pdf/generate`
+> sudah tidak ada di kode — gantinya ada di Bagian A).
+>
+> Buat integrasi baru, selalu pakai **Bagian A**.
+
 ## **1. Informasi Umum**
 
 **Base URL (Development):**
@@ -356,4 +767,4 @@ File PDF akan otomatis terunduh melalui browser.
 
 Dokumentasi ini dibuat untuk memudahkan integrasi frontend dengan backend Planify serta menjadi referensi utama dalam pengembangan fitur lanjutan.
 
----
\ No newline at end of file
+---
diff --git a/apps/web-api/package.json b/apps/web-api/package.json
index 5016aea..0b52de8 100644
--- a/apps/web-api/package.json
+++ b/apps/web-api/package.json
@@ -3,7 +3,8 @@
   "private": true,
   "scripts": {
     "dev": "ts-node-dev --respawn --transpile-only --ignore-watch node_modules src/server.ts",
-    "build": "tsc"
+    "build": "tsc",
+    "test": "vitest run"
   },
   "dependencies": {
     "@prisma/client": "^6.0.0",
@@ -39,6 +40,7 @@
     "@types/swagger-ui-express": "^4.1.8",
     "pino-pretty": "^13.1.3",
     "ts-node-dev": "^2.0.0",
-    "typescript": "^5.9.3"
+    "typescript": "^5.9.3",
+    "vitest": "^5.0.0"
   }
 }
\ No newline at end of file
diff --git a/apps/web-api/tests/error.middleware.test.ts b/apps/web-api/tests/error.middleware.test.ts
new file mode 100644
index 0000000..8a4017e
--- /dev/null
+++ b/apps/web-api/tests/error.middleware.test.ts
@@ -0,0 +1,63 @@
+import { describe, it, expect, vi, beforeEach } from "vitest";
+import { errorHandler } from "../src/middlewares/error.middleware";
+import { AppError, ErrorCodes } from "../src/utils/app-error";
+
+function mockRes() {
+  const res: any = {};
+  res.status = vi.fn().mockReturnValue(res);
+  res.json = vi.fn().mockReturnValue(res);
+  return res;
+}
+
+describe("errorHandler", () => {
+  beforeEach(() => {
+    vi.clearAllMocks();
+  });
+
+  it("handles AppError with its status code and error code", () => {
+    const res = mockRes();
+    const err = new AppError("Email already registered", 400, ErrorCodes.AUTH_EMAIL_EXISTS);
+    errorHandler(err, { reqId: "test-1" } as any, res, (() => {}) as any);
+    expect(res.status).toHaveBeenCalledWith(400);
+    expect(res.json).toHaveBeenCalledWith(
+      expect.objectContaining({
+        success: false,
+        message: "Email already registered",
+        code: "AUTH_EMAIL_EXISTS",
+      })
+    );
+  });
+
+  it("handles ZodError-shaped errors with 400 VALIDATION_ERROR", () => {
+    const res = mockRes();
+    const err: any = new Error("Validation failed");
+    err.name = "ZodError";
+    err.errors = [{ field: "body.email", message: "Invalid email format" }];
+    errorHandler(err, { reqId: "test-2" } as any, res, (() => {}) as any);
+    expect(res.status).toHaveBeenCalledWith(400);
+    expect(res.json).toHaveBeenCalledWith(
+      expect.objectContaining({ success: false, code: ErrorCodes.VALIDATION_ERROR })
+    );
+  });
+
+  it("handles unknown errors with 500 INTERNAL_ERROR", () => {
+    const res = mockRes();
+    errorHandler(new Error("Something broke"), { reqId: "test-3" } as any, res, (() => {}) as any);
+    expect(res.status).toHaveBeenCalledWith(500);
+    expect(res.json).toHaveBeenCalledWith(
+      expect.objectContaining({ success: false, code: ErrorCodes.INTERNAL_ERROR })
+    );
+  });
+
+  it("respects custom status on unknown errors", () => {
+    const res = mockRes();
+    const err: any = new Error("Too many");
+    err.status = 429;
+    err.code = "RATE_LIMIT_EXCEEDED";
+    errorHandler(err, {} as any, res, (() => {}) as any);
+    expect(res.status).toHaveBeenCalledWith(429);
+    expect(res.json).toHaveBeenCalledWith(
+      expect.objectContaining({ success: false, code: "RATE_LIMIT_EXCEEDED" })
+    );
+  });
+});
diff --git a/apps/web-api/tests/token-blacklist.test.ts b/apps/web-api/tests/token-blacklist.test.ts
new file mode 100644
index 0000000..c08a965
--- /dev/null
+++ b/apps/web-api/tests/token-blacklist.test.ts
@@ -0,0 +1,36 @@
+import { describe, it, expect, beforeEach } from "vitest";
+
+// Paksa jalur in-memory: string kosong tetap kosong walau dotenv
+// me-load ulang REDIS_URL dari file .env lokal saat import
+process.env.REDIS_URL = "";
+
+const { tokenBlacklist } = await import("../src/utils/token-blacklist");
+
+describe("tokenBlacklist (in-memory fallback)", () => {
+  beforeEach(async () => {
+    await tokenBlacklist.clear();
+  });
+
+  it("marks added token as blacklisted", async () => {
+    await tokenBlacklist.add("token-abc");
+    expect(await tokenBlacklist.isBlacklisted("token-abc")).toBe(true);
+  });
+
+  it("returns false for unknown token", async () => {
+    expect(await tokenBlacklist.isBlacklisted("never-added")).toBe(false);
+  });
+
+  it("removes token from blacklist", async () => {
+    await tokenBlacklist.add("token-xyz");
+    await tokenBlacklist.remove("token-xyz");
+    expect(await tokenBlacklist.isBlacklisted("token-xyz")).toBe(false);
+  });
+
+  it("clears all blacklisted tokens", async () => {
+    await tokenBlacklist.add("token-1");
+    await tokenBlacklist.add("token-2");
+    await tokenBlacklist.clear();
+    expect(await tokenBlacklist.isBlacklisted("token-1")).toBe(false);
+    expect(await tokenBlacklist.isBlacklisted("token-2")).toBe(false);
+  });
+});
diff --git a/apps/web-api/tests/validation.middleware.test.ts b/apps/web-api/tests/validation.middleware.test.ts
new file mode 100644
index 0000000..9acddb8
--- /dev/null
+++ b/apps/web-api/tests/validation.middleware.test.ts
@@ -0,0 +1,33 @@
+import { describe, it, expect, vi } from "vitest";
+import { validate } from "../src/middlewares/validation.middleware";
+import { loginSchema } from "../src/validators/auth.validator";
+
+function mockReq(body: unknown) {
+  return { body, query: {}, params: {} } as any;
+}
+
+describe("validate middleware", () => {
+  it("calls next() with no args on valid payload", async () => {
+    const next = vi.fn();
+    await validate(loginSchema)(
+      mockReq({ email: "user@example.com", password: "secret123" }),
+      {} as any,
+      next
+    );
+    expect(next).toHaveBeenCalledTimes(1);
+    expect(next).toHaveBeenCalledWith();
+  });
+
+  it("calls next(err) with ZodError shape on invalid payload", async () => {
+    const next = vi.fn();
+    await validate(loginSchema)(mockReq({ email: "bad", password: "" }), {} as any, next);
+    expect(next).toHaveBeenCalledTimes(1);
+    const err = next.mock.calls[0][0];
+    expect(err.name).toBe("ZodError");
+    expect(err.message).toBe("Validation failed");
+    expect(Array.isArray(err.errors)).toBe(true);
+    expect(err.errors.length).toBeGreaterThan(0);
+    expect(err.errors[0]).toHaveProperty("field");
+    expect(err.errors[0]).toHaveProperty("message");
+  });
+});
diff --git a/apps/web-api/tests/validators.ai.test.ts b/apps/web-api/tests/validators.ai.test.ts
new file mode 100644
index 0000000..06bbee3
--- /dev/null
+++ b/apps/web-api/tests/validators.ai.test.ts
@@ -0,0 +1,72 @@
+import { describe, it, expect } from "vitest";
+import { generateProjectBriefSchema, generateDiagramSchema } from "../src/validators/ai.validator";
+
+describe("generateProjectBriefSchema", () => {
+  it("accepts minimal valid payload", () => {
+    const result = generateProjectBriefSchema.safeParse({
+      body: {
+        projectName: "E-Commerce App",
+        projectDescription: "A marketplace platform for small businesses",
+      },
+    });
+    expect(result.success).toBe(true);
+  });
+
+  it("accepts full valid payload", () => {
+    const result = generateProjectBriefSchema.safeParse({
+      body: {
+        projectName: "E-Commerce App",
+        projectDescription: "A marketplace platform for small businesses",
+        projectType: "webapp",
+        documentStyle: "concise",
+        keyFeatures: ["Cart", "Checkout"],
+        techStack: ["Next.js"],
+        includeDiagram: true,
+      },
+    });
+    expect(result.success).toBe(true);
+  });
+
+  it("rejects missing projectName", () => {
+    const result = generateProjectBriefSchema.safeParse({
+      body: { projectDescription: "A marketplace platform for small businesses" },
+    });
+    expect(result.success).toBe(false);
+  });
+
+  it("rejects description shorter than 10 chars", () => {
+    const result = generateProjectBriefSchema.safeParse({
+      body: { projectName: "App", projectDescription: "short" },
+    });
+    expect(result.success).toBe(false);
+  });
+
+  it("rejects invalid projectType", () => {
+    const result = generateProjectBriefSchema.safeParse({
+      body: {
+        projectName: "App",
+        projectDescription: "A valid description here",
+        projectType: "desktop",
+      },
+    });
+    expect(result.success).toBe(false);
+  });
+});
+
+describe("generateDiagramSchema", () => {
+  it("accepts valid payload", () => {
+    const result = generateDiagramSchema.safeParse({
+      body: {
+        projectName: "E-Commerce App",
+        projectDescription: "A marketplace platform for small businesses",
+        techStack: ["Next.js", "Supabase"],
+      },
+    });
+    expect(result.success).toBe(true);
+  });
+
+  it("rejects missing fields", () => {
+    const result = generateDiagramSchema.safeParse({ body: {} });
+    expect(result.success).toBe(false);
+  });
+});
diff --git a/apps/web-api/tests/validators.auth.test.ts b/apps/web-api/tests/validators.auth.test.ts
new file mode 100644
index 0000000..f0e00b5
--- /dev/null
+++ b/apps/web-api/tests/validators.auth.test.ts
@@ -0,0 +1,60 @@
+import { describe, it, expect } from "vitest";
+import { registerSchema, loginSchema } from "../src/validators/auth.validator";
+
+describe("registerSchema", () => {
+  it("accepts valid register payload", () => {
+    const result = registerSchema.safeParse({
+      body: { email: "user@example.com", password: "securePassword123", name: "John Doe" },
+    });
+    expect(result.success).toBe(true);
+  });
+
+  it("accepts payload without optional name", () => {
+    const result = registerSchema.safeParse({
+      body: { email: "user@example.com", password: "securePassword123" },
+    });
+    expect(result.success).toBe(true);
+  });
+
+  it("rejects invalid email format", () => {
+    const result = registerSchema.safeParse({
+      body: { email: "not-an-email", password: "securePassword123" },
+    });
+    expect(result.success).toBe(false);
+  });
+
+  it("rejects password shorter than 8 chars", () => {
+    const result = registerSchema.safeParse({
+      body: { email: "user@example.com", password: "short" },
+    });
+    expect(result.success).toBe(false);
+  });
+
+  it("rejects missing email and password", () => {
+    const result = registerSchema.safeParse({ body: {} });
+    expect(result.success).toBe(false);
+  });
+});
+
+describe("loginSchema", () => {
+  it("accepts valid login payload", () => {
+    const result = loginSchema.safeParse({
+      body: { email: "user@example.com", password: "securePassword123" },
+    });
+    expect(result.success).toBe(true);
+  });
+
+  it("rejects invalid email format", () => {
+    const result = loginSchema.safeParse({
+      body: { email: "invalid", password: "securePassword123" },
+    });
+    expect(result.success).toBe(false);
+  });
+
+  it("rejects empty password", () => {
+    const result = loginSchema.safeParse({
+      body: { email: "user@example.com", password: "" },
+    });
+    expect(result.success).toBe(false);
+  });
+});
diff --git a/apps/web-api/tests/validators.export.test.ts b/apps/web-api/tests/validators.export.test.ts
new file mode 100644
index 0000000..d4f9170
--- /dev/null
+++ b/apps/web-api/tests/validators.export.test.ts
@@ -0,0 +1,40 @@
+import { describe, it, expect } from "vitest";
+import { exportPdfSchema, exportMarkdownSchema } from "../src/validators/export.validator";
+
+describe("exportPdfSchema", () => {
+  it("accepts title-only payload", () => {
+    const result = exportPdfSchema.safeParse({ body: { title: "My Brief" } });
+    expect(result.success).toBe(true);
+  });
+
+  it("accepts full brief payload", () => {
+    const result = exportPdfSchema.safeParse({
+      body: {
+        title: "My Brief",
+        overview: "Overview text",
+        platformCategory: "webapp",
+        objectives: ["Goal 1"],
+        keyFeatures: [{ name: "Login" }],
+        diagram: { diagram: "graph TD; A-->B;" },
+      },
+    });
+    expect(result.success).toBe(true);
+  });
+
+  it("rejects missing title", () => {
+    const result = exportPdfSchema.safeParse({ body: { overview: "No title" } });
+    expect(result.success).toBe(false);
+  });
+});
+
+describe("exportMarkdownSchema", () => {
+  it("accepts title-only payload", () => {
+    const result = exportMarkdownSchema.safeParse({ body: { title: "My Brief" } });
+    expect(result.success).toBe(true);
+  });
+
+  it("rejects missing title", () => {
+    const result = exportMarkdownSchema.safeParse({ body: {} });
+    expect(result.success).toBe(false);
+  });
+});
diff --git a/apps/web-api/tests/validators.project.test.ts b/apps/web-api/tests/validators.project.test.ts
new file mode 100644
index 0000000..55c93a6
--- /dev/null
+++ b/apps/web-api/tests/validators.project.test.ts
@@ -0,0 +1,87 @@
+import { describe, it, expect } from "vitest";
+import {
+  createProjectSchema,
+  updateProjectSchema,
+  getProjectSchema,
+  deleteProjectSchema,
+} from "../src/validators/project.validator";
+
+const VALID_UUID = "123e4567-e89b-12d3-a456-426614174000";
+
+describe("createProjectSchema", () => {
+  it("accepts minimal valid payload (title only)", () => {
+    const result = createProjectSchema.safeParse({ body: { title: "App A" } });
+    expect(result.success).toBe(true);
+  });
+
+  it("accepts full valid payload", () => {
+    const result = createProjectSchema.safeParse({
+      body: {
+        title: "App A",
+        description: "Desc",
+        projectType: "mobile",
+        documentStyle: "formal",
+        formData: { step1: "done" },
+        currentStep: 3,
+      },
+    });
+    expect(result.success).toBe(true);
+  });
+
+  it("rejects missing title", () => {
+    const result = createProjectSchema.safeParse({ body: {} });
+    expect(result.success).toBe(false);
+  });
+
+  it("rejects invalid projectType", () => {
+    const result = createProjectSchema.safeParse({
+      body: { title: "App A", projectType: "desktop" },
+    });
+    expect(result.success).toBe(false);
+  });
+
+  it("rejects currentStep out of range", () => {
+    const result = createProjectSchema.safeParse({
+      body: { title: "App A", currentStep: 99 },
+    });
+    expect(result.success).toBe(false);
+  });
+});
+
+describe("updateProjectSchema", () => {
+  it("accepts valid params + partial body", () => {
+    const result = updateProjectSchema.safeParse({
+      params: { id: VALID_UUID },
+      body: { title: "New title", status: "published" },
+    });
+    expect(result.success).toBe(true);
+  });
+
+  it("rejects non-UUID id", () => {
+    const result = updateProjectSchema.safeParse({
+      params: { id: "not-a-uuid" },
+      body: { title: "New title" },
+    });
+    expect(result.success).toBe(false);
+  });
+
+  it("rejects invalid status value", () => {
+    const result = updateProjectSchema.safeParse({
+      params: { id: VALID_UUID },
+      body: { status: "deleted" },
+    });
+    expect(result.success).toBe(false);
+  });
+});
+
+describe("getProjectSchema / deleteProjectSchema", () => {
+  it("accepts valid UUID param", () => {
+    expect(getProjectSchema.safeParse({ params: { id: VALID_UUID } }).success).toBe(true);
+    expect(deleteProjectSchema.safeParse({ params: { id: VALID_UUID } }).success).toBe(true);
+  });
+
+  it("rejects non-UUID param", () => {
+    expect(getProjectSchema.safeParse({ params: { id: "abc" } }).success).toBe(false);
+    expect(deleteProjectSchema.safeParse({ params: { id: "abc" } }).success).toBe(false);
+  });
+});
diff --git a/apps/web-api/vitest.config.ts b/apps/web-api/vitest.config.ts
new file mode 100644
index 0000000..faa6d98
--- /dev/null
+++ b/apps/web-api/vitest.config.ts
@@ -0,0 +1,8 @@
+import { defineConfig } from "vitest/config";
+
+export default defineConfig({
+  test: {
+    environment: "node",
+    include: ["tests/**/*.test.ts"],
+  },
+});
diff --git a/package.json b/package.json
index 2c24644..4f794ac 100644
--- a/package.json
+++ b/package.json
@@ -6,6 +6,7 @@
     "build": "turbo build",
     "dev": "turbo dev",
     "lint": "turbo lint",
+    "test": "turbo run test",
     "format": "prettier --write \"**/*.{ts,tsx,md}\""
   },
   "devDependencies": {
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 482bb8c..e2e653a 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -169,6 +169,9 @@ importers:
       typescript:
         specifier: ^5.9.3
         version: 5.9.3
+      vitest:
+        specifier: ^5.0.0
+        version: 5.0.0(@types/node@20.19.31)(vite@8.2.2(@types/node@20.19.31)(jiti@2.6.1))
 
   apps/web-app:
     dependencies:
@@ -852,6 +855,9 @@ packages:
     resolution: {integrity: sha512-oGB+UxlgWcgQkgwo8GcEGwemoTFt3FIO9ababBmaGwXIoBKZ+GTy0pP185beGg7Llih/NSHSV2XAs1lnznocSg==}
     engines: {node: '>= 8'}
 
+  '@oxc-project/types@0.148.0':
+    resolution: {integrity: sha512-Nm4s/jB+4FpFsPhWGEC4h7rzksesmtnMXomo6rCMcg/b8zLQuOziRgkCS1fxDCXOlJB/6Q8oABOZ/OP6RIPj9A==}
+
   '@pinojs/redact@0.4.0':
     resolution: {integrity: sha512-k2ENnmBugE/rzQfEcdWHcCY+/FM3VLzH9cYEsbdsoqrvzAKRhUZeRNhAZvB8OitQJ1TBed3yqWtdjzS6wJKBwg==}
 
@@ -1615,6 +1621,99 @@ packages:
   '@radix-ui/rect@1.1.1':
     resolution: {integrity: sha512-HPwpGIzkl28mWyZqG52jiqDJ12waP11Pa1lGoiyUkIEuMLBP0oeK/C89esbXrxsky5we7dfd8U58nm0SgAWpVw==}
 
+  '@rolldown/binding-android-arm-eabi@1.2.7':
+    resolution: {integrity: sha512-EypzgnYCwyVY4NDHKzGmNJT5b+XaQEBniHxsMdeIQLB/tcCzZnhqrzHpZFbX9iaxx+5RiB8caATBtfvZP7zVxQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [android]
+
+  '@rolldown/binding-android-arm64@1.2.7':
+    resolution: {integrity: sha512-l17HE9EweWaqJZhuUuNBN/FzM62xw+DECVnJyvMsxn8vJFAGLy5QfLDoYAcronkAN8VxKZHezDpulHDPx95vFw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [android]
+
+  '@rolldown/binding-darwin-arm64@1.2.7':
+    resolution: {integrity: sha512-8ED8ELFvHXc6OCETIn4gXObPiaR6bckM/ipXtbzlPVDRMBfEGjCKgO90F9YtfdpDatVx/ZQw7aZ1vUMf/+T3Mw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [darwin]
+
+  '@rolldown/binding-darwin-x64@1.2.7':
+    resolution: {integrity: sha512-/WPripjtiAIZ2tWY7ddijORT0Ujg87wxWW/qcoFVCKAWVDPhtY0xr7Dj0M3GyNGz60jGwTElhro/mkF9dT7dDQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [darwin]
+
+  '@rolldown/binding-freebsd-x64@1.2.7':
+    resolution: {integrity: sha512-14DI4NcqpvbICxSnGLx3PmtDaWqRP/KGSGb6C+JLLVPeZRl6dKdHba3pGsqT3vpdTqhEYIPG0MMQ8c0xYqoJxA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [freebsd]
+
+  '@rolldown/binding-linux-arm-gnueabihf@1.2.7':
+    resolution: {integrity: sha512-bxrWIRvHWQvbJwi+VIie/kDJmQxcNE6xxWwZdqF/ExVAigtHkv54WTLQPb+QsZdnFy18fg7JPfWGL0RH6vwIlQ==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm]
+    os: [linux]
+
+  '@rolldown/binding-linux-arm64-gnu@1.2.7':
+    resolution: {integrity: sha512-toOY2BChBZyuxU7OYX6Tn389di4IzAqPTycVcci0O7FSfBqzRB3RZn+K5Is6ANf4tmgRd/K1yZTsNTXbkXsnLg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [linux]
+
+  '@rolldown/binding-linux-arm64-musl@1.2.7':
+    resolution: {integrity: sha512-lAIXTH/aiLRLxsTgQvfhjo4K1ydWIp00+V0voOr9beb/9ZmkUFrSIb03dXNFRgMNvkE6oGsF10ioQ6UsI+vS5Q==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [linux]
+
+  '@rolldown/binding-linux-ppc64-gnu@1.2.7':
+    resolution: {integrity: sha512-kdnwS28Pkenp/mZMRwjXXXwxQ7pIsm+bF919LUK93BOyhcLsrVKdP2p9fxpiPNPAbNuch8ypQt0pm2P2LYCAGg==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [ppc64]
+    os: [linux]
+
+  '@rolldown/binding-linux-s390x-gnu@1.2.7':
+    resolution: {integrity: sha512-516OdsyLdr5E65paF3yBF55t8mfm9+gmtCsK3xI7XKXIT7EfRlHhxL8K/NR6Hu8BWSgF5+1w74lTL0+nxcc8Qw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [s390x]
+    os: [linux]
+
+  '@rolldown/binding-linux-x64-gnu@1.2.7':
+    resolution: {integrity: sha512-r8/z8n7GFaYRln3xmP1Cxy0HH/HLM0uBUPkEuSVEfKGDA89M0FsZRZJRSwe/tJjRx+fpH/gjorfhB8tmEbSFLA==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [linux]
+
+  '@rolldown/binding-linux-x64-musl@1.2.7':
+    resolution: {integrity: sha512-pAsE8iiDxUg1xBqdhrTfg45AVDVpirjz00sblEYClGNNcMnDb+e8beQgqIAw6LvauX/APvgxUnwrgun/YYGBhw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [linux]
+
+  '@rolldown/binding-openharmony-arm64@1.2.7':
+    resolution: {integrity: sha512-lTcIYmmnQQA8Or/2DatS6oSqcdLHvendjS+zLu+FwgToynWMRSmQdpM65fTANJgIS4mjbMOo5KT2lnT9SAb96w==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [openharmony]
+
+  '@rolldown/binding-win32-arm64-msvc@1.2.7':
+    resolution: {integrity: sha512-e3Gu3WxbNk/UqQhxqU7YIYO+9ZBvWNz3U+h/qRFosscMFzdRPbXYSaSWgSnklv2fz1TgzBTcti2z35c/7irsHw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [arm64]
+    os: [win32]
+
+  '@rolldown/binding-win32-x64-msvc@1.2.7':
+    resolution: {integrity: sha512-W/jg5qoRSqjsEv0+dZi4e687mcHqmVuU0P4fK6qS/xjetW2Gmc1W8j//z5nAeNcC8Ttm0hV46IjcYeuVwYhuiw==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    cpu: [x64]
+    os: [win32]
+
+  '@rolldown/pluginutils@1.0.1':
+    resolution: {integrity: sha512-2j9bGt5Jh8hj+vPtgzPtl72j0yRxHAyumoo6TNfAjsLB04UtpSvPbPcDcBMxz7n+9CYB0c1GxQFxYRg2jimqGw==}
+
   '@scarf/scarf@1.4.0':
     resolution: {integrity: sha512-xxeapPiUXdZAE3che6f3xogoJPeZgig6omHEy1rIY5WVsB3H2BHNnZH+gHG6x91SCWyQCzWGsuL2Hh3ClO5/qQ==}
 
@@ -1766,6 +1865,9 @@ packages:
   '@types/body-parser@1.19.6':
     resolution: {integrity: sha512-HLFeCYgz89uk22N5Qg3dvGvsv46B8GLvKKo1zKG4NybA8U2DiEO3w9lqGg29t/tfLRJpJ6iQxnVw4OnB7MoM9g==}
 
+  '@types/chai@5.2.3':
+    resolution: {integrity: sha512-Mw558oeA9fFbv65/y4mHtXDs9bPnFMZAL/jxdPFUpOHHIXX91mcgEHbS5Lahr+pwZFR8A7GQleRWeI6cGFC2UA==}
+
   '@types/connect@3.4.38':
     resolution: {integrity: sha512-K6uROf1LD88uDQqJCktA4yzL1YYAK6NgfsI0v/mTgyPKWsX1CnJ0XPSDhViejru1GcRkLWb8RlzFYJRqGUbaug==}
 
@@ -1865,6 +1967,9 @@ packages:
   '@types/d3@7.4.3':
     resolution: {integrity: sha512-lZXZ9ckh5R8uiFVt8ogUNf+pIrK4EsWrx2Np75WvF/eTpJ0FMHNhjXk8CKEx/+gpHbNQyJWehbFaTvqmHWB3ww==}
 
+  '@types/deep-eql@4.0.2':
+    resolution: {integrity: sha512-c9h9dVVMigMPc4bwTvC5dxqtqJZwQPePsWjPlpSOnojbor6pGqdk541lfA7AqFQr5pB1BRdq0juY9db81BwyFw==}
+
   '@types/estree@1.0.8':
     resolution: {integrity: sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==}
 
@@ -2033,6 +2138,20 @@ packages:
     resolution: {integrity: sha512-VFlhGSl4opC0bprJiItPQ1RfUhGDIBokcPwaFH4yiBCaNPeld/9VeXbiPO1cLyorQi1G1vL+ecBk1x8o1axORA==}
     engines: {node: ^18.18.0 || ^20.9.0 || >=21.1.0}
 
+  '@vitest/mocker@5.0.0':
+    resolution: {integrity: sha512-66PGTMIiVJP3t4a5yxU9qPtf7MdTBs8jmToMvy+HVflB3Yy13WJZTtPePdvU+wjRV02SKK5doLbSA6o9pwOmiA==}
+    peerDependencies:
+      msw: ^2.4.9
+      vite: ^6.0.0 || ^7.0.0 || ^8.0.0
+    peerDependenciesMeta:
+      msw:
+        optional: true
+      vite:
+        optional: true
+
+  '@vitest/spy@5.0.0':
+    resolution: {integrity: sha512-uy+luWBAPw9XfthoHi5AkfHUnuPYEESjl0p/r+meoBnU8bxg5GDQ3Ey8MjcJ6sqahkL4PFyrvfMJJBw7LbU06g==}
+
   abort-controller@3.0.0:
     resolution: {integrity: sha512-h8lQ8tacZYnR3vNQTgibj+tODHI5/+l06Au2Pcriv/Gmet0eaj4TwWH41sO9wnHDiQsEj19q0drzdWdeAHtweg==}
     engines: {node: '>=6.5'}
@@ -2146,6 +2265,10 @@ packages:
     resolution: {integrity: sha512-BNoCY6SXXPQ7gF2opIP4GBE+Xw7U+pHMYKuzjgCN3GwiaIR09UUeKfheyIry77QtrCBlC0KK0q5/TER/tYh3PQ==}
     engines: {node: '>= 0.4'}
 
+  assertion-error@2.0.1:
+    resolution: {integrity: sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==}
+    engines: {node: '>=12'}
+
   ast-types@0.13.4:
     resolution: {integrity: sha512-x1FCFnFifvYDDzTaLII71vG5uvDwgtmDTEVWAxrgeiR8VjMONcCXJx7E+USjDtHlwFmt9MysbqgF9b9Vjr6w+w==}
     engines: {node: '>=4'}
@@ -2316,6 +2439,10 @@ packages:
   caniuse-lite@1.0.30001760:
     resolution: {integrity: sha512-7AAMPcueWELt1p3mi13HR/LHH0TJLT11cnwDJEs3xA4+CK/PLKeO9Kl1oru24htkyUKtkGCvAx4ohB0Ttry8Dw==}
 
+  chai@6.2.2:
+    resolution: {integrity: sha512-NUPRluOfOiTKBKvWPtSD4PhFvWCqOi0BGStNWs57X9js7XGTprSmFoz5F0tWhR4WPjNeR9jXqdC7/UpSJTnlRg==}
+    engines: {node: '>=18'}
+
   chalk@2.4.2:
     resolution: {integrity: sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==}
     engines: {node: '>=4'}
@@ -2858,6 +2985,9 @@ packages:
     resolution: {integrity: sha512-uDn+FE1yrDzyC0pCo961B2IHbdM8y/ACZsKD4dG6WqrjV53BADjwa7D+1aom2rsNVfLyDgU/eigvlJGJ08OQ4w==}
     engines: {node: '>= 0.4'}
 
+  es-module-lexer@2.3.2:
+    resolution: {integrity: sha512-poHGpORABojJJucnV9KbOavETW8lBVnphkW77ER5/BQ5Fz7oXSoCNek7IH3vR5nRjdsEz926ibFYX8KtLQmdyw==}
+
   es-object-atoms@1.1.1:
     resolution: {integrity: sha512-FGgH2h8zKNim9ljj7dankFPcICIK9Cp5bm+c2gQSYePhpaG5+esrLODihIorn+Pe6FGJzWhXQotPv73jTaldXA==}
     engines: {node: '>= 0.4'}
@@ -2966,6 +3096,9 @@ packages:
     resolution: {integrity: sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==}
     engines: {node: '>=4.0'}
 
+  estree-walker@3.0.3:
+    resolution: {integrity: sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==}
+
   esutils@2.0.3:
     resolution: {integrity: sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==}
     engines: {node: '>=0.10.0'}
@@ -2985,6 +3118,10 @@ packages:
     resolution: {integrity: sha512-8uSpZZocAZRBAPIEINJj3Lo9HyGitllczc27Eh5YYojjMFMn8yHMDMaUHE2Jqfq05D/wucwI4JGURyXt1vchyg==}
     engines: {node: '>=10'}
 
+  expect-type@1.4.0:
+    resolution: {integrity: sha512-KfYbmpRm0VbLjEvVa9yGwCi9GI34xvi7A/HXYWQO65CSD2u3MczUJSuwXKFIxlGsgBQizV9q5J9NHj4VG0n+pA==}
+    engines: {node: '>=12.0.0'}
+
   express-rate-limit@8.7.0:
     resolution: {integrity: sha512-hOwV7WOxXfjRpAM1DSJWZDXx3GhplwD8IfwuwvogD8i1Qnkgosw/H45s4ZnFAUHDAhPjlY9hLBvJhKmGMyY26g==}
     engines: {node: '>= 16'}
@@ -3636,70 +3773,140 @@ packages:
     cpu: [arm64]
     os: [android]
 
+  lightningcss-android-arm64@1.33.0:
+    resolution: {integrity: sha512-gEpRTalKdosp4Bb8qWtc2iOgE5SeIHlpS1up9bFq2wAyYhl1UdTObYiHe98zEM9SQvSoqQZ1IQD0JNpg3Ml5pg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [android]
+
   lightningcss-darwin-arm64@1.30.2:
     resolution: {integrity: sha512-ylTcDJBN3Hp21TdhRT5zBOIi73P6/W0qwvlFEk22fkdXchtNTOU4Qc37SkzV+EKYxLouZ6M4LG9NfZ1qkhhBWA==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm64]
     os: [darwin]
 
+  lightningcss-darwin-arm64@1.33.0:
+    resolution: {integrity: sha512-Sciaz8eenNTKn9b3t7+xr0ipTp9YxKQY4npwQ3mrRuL0BAVHBLyZxofhaKBAVtzmtRZ/zTyo0/to4B1uWG/Djg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [darwin]
+
   lightningcss-darwin-x64@1.30.2:
     resolution: {integrity: sha512-oBZgKchomuDYxr7ilwLcyms6BCyLn0z8J0+ZZmfpjwg9fRVZIR5/GMXd7r9RH94iDhld3UmSjBM6nXWM2TfZTQ==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [darwin]
 
+  lightningcss-darwin-x64@1.33.0:
+    resolution: {integrity: sha512-Z5UPAxzrjlWNNyGy6i65cJzzvgJ5D3T6wMvs+gWpY9d7qRhANrxqAp6LhxIgZhWEw18RfJTGcRxjuLIBr+m8XQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [darwin]
+
   lightningcss-freebsd-x64@1.30.2:
     resolution: {integrity: sha512-c2bH6xTrf4BDpK8MoGG4Bd6zAMZDAXS569UxCAGcA7IKbHNMlhGQ89eRmvpIUGfKWNVdbhSbkQaWhEoMGmGslA==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [freebsd]
 
+  lightningcss-freebsd-x64@1.33.0:
+    resolution: {integrity: sha512-QQM/Ti/hQajJwCY+RiWuCZ9sdtI/XQk7nDK5vC8kkdwixezOlDgvDx7+RT+QjK6FcFT4MpsuoBnHIo/O3StRRg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [freebsd]
+
   lightningcss-linux-arm-gnueabihf@1.30.2:
     resolution: {integrity: sha512-eVdpxh4wYcm0PofJIZVuYuLiqBIakQ9uFZmipf6LF/HRj5Bgm0eb3qL/mr1smyXIS1twwOxNWndd8z0E374hiA==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm]
     os: [linux]
 
+  lightningcss-linux-arm-gnueabihf@1.33.0:
+    resolution: {integrity: sha512-N7FVBe6iS24MlM6R/4RBTxGhQheZGs7tiQ9U32UtF75NzP5Q7xWPRqLBCKxlRQRk3rY1jCIPLzx7WzOhuUIRLQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm]
+    os: [linux]
+
   lightningcss-linux-arm64-gnu@1.30.2:
     resolution: {integrity: sha512-UK65WJAbwIJbiBFXpxrbTNArtfuznvxAJw4Q2ZGlU8kPeDIWEX1dg3rn2veBVUylA2Ezg89ktszWbaQnxD/e3A==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm64]
     os: [linux]
 
+  lightningcss-linux-arm64-gnu@1.33.0:
+    resolution: {integrity: sha512-j2v/itmy4HlNxlc6voKXYgBqNi0Ng2LShg4z7GufpEgs05P+2suBVyi9I6YHq5uoVFx9ETin3eCEhLVyXGQnKg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [linux]
+
   lightningcss-linux-arm64-musl@1.30.2:
     resolution: {integrity: sha512-5Vh9dGeblpTxWHpOx8iauV02popZDsCYMPIgiuw97OJ5uaDsL86cnqSFs5LZkG3ghHoX5isLgWzMs+eD1YzrnA==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm64]
     os: [linux]
 
+  lightningcss-linux-arm64-musl@1.33.0:
+    resolution: {integrity: sha512-yiO5ROMuYQgXbC60yjZU5CYSFZGKXL0HFATXt9mHJn1+zW55oCtMI9NfcVhYLMFDL7gV7oBPon/EmMMGg2OvtQ==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [linux]
+
   lightningcss-linux-x64-gnu@1.30.2:
     resolution: {integrity: sha512-Cfd46gdmj1vQ+lR6VRTTadNHu6ALuw2pKR9lYq4FnhvgBc4zWY1EtZcAc6EffShbb1MFrIPfLDXD6Xprbnni4w==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [linux]
 
+  lightningcss-linux-x64-gnu@1.33.0:
+    resolution: {integrity: sha512-ar+Ju7LmcN0Jo4FpL4hpFybwNG9/3A/Br5KW2n2jyODg3MEZXaDYADdemoNS+BDNfMgKvylJLj4S5tyRActuAg==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [linux]
+
   lightningcss-linux-x64-musl@1.30.2:
     resolution: {integrity: sha512-XJaLUUFXb6/QG2lGIW6aIk6jKdtjtcffUT0NKvIqhSBY3hh9Ch+1LCeH80dR9q9LBjG3ewbDjnumefsLsP6aiA==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [linux]
 
+  lightningcss-linux-x64-musl@1.33.0:
+    resolution: {integrity: sha512-RYiYbkokw0trfKqqzfF55lginwEPrD3OJDfTuJzFs1MK6iFnDenaz1fqLLtX4ITG3OktJQXOeTaw1awrBAlZPw==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [linux]
+
   lightningcss-win32-arm64-msvc@1.30.2:
     resolution: {integrity: sha512-FZn+vaj7zLv//D/192WFFVA0RgHawIcHqLX9xuWiQt7P0PtdFEVaxgF9rjM/IRYHQXNnk61/H/gb2Ei+kUQ4xQ==}
     engines: {node: '>= 12.0.0'}
     cpu: [arm64]
     os: [win32]
 
+  lightningcss-win32-arm64-msvc@1.33.0:
+    resolution: {integrity: sha512-1K+MPfLSFVpphzpdbfkhlWk6wBrTObBzS2T6db10PNOZgR9GoVsAWzwNyuhUYYbTp23j+4RrncfujZ4uAzXvwA==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [arm64]
+    os: [win32]
+
   lightningcss-win32-x64-msvc@1.30.2:
     resolution: {integrity: sha512-5g1yc73p+iAkid5phb4oVFMB45417DkRevRbt/El/gKXJk4jid+vPFF/AXbxn05Aky8PapwzZrdJShv5C0avjw==}
     engines: {node: '>= 12.0.0'}
     cpu: [x64]
     os: [win32]
 
+  lightningcss-win32-x64-msvc@1.33.0:
+    resolution: {integrity: sha512-OlEICDx/Xl0FqSp4bry8zFnCvGpig3Gl4gCquvYwHuqJKEC1+n9NgDniFvqHGmMv1ZkqDJrDqKKSykTDX+ehuA==}
+    engines: {node: '>= 12.0.0'}
+    cpu: [x64]
+    os: [win32]
+
   lightningcss@1.30.2:
     resolution: {integrity: sha512-utfs7Pr5uJyyvDETitgsaqSyjCb2qNRAtuqUeWIAKztsOYdcACf2KtARYXg2pSvhkt+9NfoaNY7fxjl6nuMjIQ==}
     engines: {node: '>= 12.0.0'}
 
+  lightningcss@1.33.0:
+    resolution: {integrity: sha512-WkUDrojuJs0xkgGf2udWxa3yGBRxPtxUkB79i6aCZLRgc7PM8fZe9TosfPDcvEpQZbuFASnHYmRLBLUbmLOIIA==}
+    engines: {node: '>= 12.0.0'}
+
   lines-and-columns@1.2.4:
     resolution: {integrity: sha512-7ylylesZQ/PV29jhEDl3Ufjo6ZX7gCqJr5F7PKrqc93v7fzSymt1BpwEU8nAUXs8qzzvqhbjhK5QZg6Mt/HkBg==}
 
@@ -3781,6 +3988,9 @@ packages:
   magic-string@0.30.21:
     resolution: {integrity: sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==}
 
+  magic-string@1.2.3:
+    resolution: {integrity: sha512-Bpb0W2TbLKOZ7vJnOUnVRGq3WL2p+ISV29M6hYPL1AFCpyKZpdr5ytiXoTSSxRVhg8YW7f65+6gbG8WG6PCa/g==}
+
   make-cancellable-promise@2.0.0:
     resolution: {integrity: sha512-3SEQqTpV9oqVsIWqAcmDuaNeo7yBO3tqPtqGRcKkEo0lrzD3wqbKG9mkxO65KoOgXqj+zH2phJ2LiAsdzlogSw==}
 
@@ -3900,6 +4110,11 @@ packages:
     engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
     hasBin: true
 
+  nanoid@3.3.18:
+    resolution: {integrity: sha512-DTg4MJbGMWkfi6VZFdNt2/caMbQy4Ou+Op/hJQvGEWcnVfoA1QA+xzRKAzw9jD6+GVOOeYr/mIcuDSdug6F6+w==}
+    engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
+    hasBin: true
+
   natural-compare@1.4.0:
     resolution: {integrity: sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==}
 
@@ -4009,6 +4224,10 @@ packages:
     resolution: {integrity: sha512-gXah6aZrcUxjWg2zR2MwouP2eHlCBzdV4pygudehaKXSGW4v2AsRQUK+lwwXhii6KFZcunEnmSUoYp5CXibxtA==}
     engines: {node: '>= 0.4'}
 
+  obug@2.1.4:
+    resolution: {integrity: sha512-4a+OsYv9UktOJKE+l1A4OufDgdRF9PifWj+tJnHURo/P+WOxpG4GzUFL9qCalmWauao6ogiG+QvnCovwPoyAWA==}
+    engines: {node: '>=12.20.0'}
+
   ohash@2.0.11:
     resolution: {integrity: sha512-RdR9FQrFwNBNXAr4GixM8YaRZRJ5PUWbKYbE5eOsrwAjJW0q2REGcf79oYPsLyskQCZG1PLN+S/K1V00joZAoQ==}
 
@@ -4153,6 +4372,10 @@ packages:
     resolution: {integrity: sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==}
     engines: {node: '>=12'}
 
+  picomatch@4.0.7:
+    resolution: {integrity: sha512-qcJu88Q2IWqJsDD529JKMdwGm/dvInW4HvQnRwiH9JtihJvzGOscDtHE3x1pBKeUOTysQ8kVmLnJ2kJu7yhcGA==}
+    engines: {node: '>=12'}
+
   pino-abstract-transport@3.0.0:
     resolution: {integrity: sha512-wlfUczU+n7Hy/Ha5j9a/gZNy7We5+cXp8YL+X+PG8S0KXxw7n/JXA3c46Y0zQznIJ83URJiwy7Lh56WLokNuxg==}
 
@@ -4190,6 +4413,10 @@ packages:
     resolution: {integrity: sha512-PS08Iboia9mts/2ygV3eLpY5ghnUcfLV/EXTOW1E2qYxJKGGBUtNjN76FYHnMs36RmARn41bC0AZmn+rR0OVpQ==}
     engines: {node: ^10 || ^12 || >=14}
 
+  postcss@8.5.28:
+    resolution: {integrity: sha512-RRuzqDtt5Y9h3quz5hWhK+TPnsmVs6WwSU6LkJMeY4HstUEDuYTG8UJSdawMRzmzAtV+KEoG8N3Qg2qLy5vM/A==}
+    engines: {node: ^10 || ^12 || >=14}
+
   postcss@8.5.6:
     resolution: {integrity: sha512-3Ybi1tAuwAP9s0r1UQ2J4n5Y0G05bJkpUIO0/bI9MhwmD70S5aTWbXGBwxHrelT+XM1k6dM0pk+SwNkpTRN7Pg==}
     engines: {node: ^10 || ^12 || >=14}
@@ -4430,6 +4657,11 @@ packages:
   robust-predicates@3.0.2:
     resolution: {integrity: sha512-IXgzBWvWQwE6PrDI05OvmXUIruQTcoMDzRsOd5CDvHCVLcLHMTSYvOK5Cm46kWqlV3yAbuSpBZdJ5oP5OUoStg==}
 
+  rolldown@1.2.7:
+    resolution: {integrity: sha512-g0EtLvBjTUB7jhyV0S/TCup3v/XSVl45vUIGbOGU4QPiyjTenCe4mKuFvW9fEgYmS2Fo42AUssRmNuMziXdrig==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    hasBin: true
+
   roughjs@4.6.6:
     resolution: {integrity: sha512-ZUz/69+SYpFN/g/lUlo2FXcIjRkSu3nDarreVdGGndHEBJ6cXPdKguS8JGxwj5HA5xIbVKSmLgr5b3AWxtRfvQ==}
 
@@ -4546,6 +4778,9 @@ packages:
     resolution: {integrity: sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==}
     engines: {node: '>= 0.4'}
 
+  siginfo@2.0.0:
+    resolution: {integrity: sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==}
+
   signal-exit@3.0.7:
     resolution: {integrity: sha512-wnD2ZE+l+SPC/uoS0vXeE9L1+0wuaMqKlfz9AMUo38JsyLSBWSFcHR1Rri62LZc12vLr1gb3jl7iwQhgwpAbGQ==}
 
@@ -4593,6 +4828,9 @@ packages:
   sprintf-js@1.1.3:
     resolution: {integrity: sha512-Oo+0REFV59/rz3gfJNKQiBlwfHaSESl1pcGyABQsnnIfWOFt6JNj5gCog2U6MLZ//IGYD+nA8nI+mTShREReaA==}
 
+  stackback@0.0.2:
+    resolution: {integrity: sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==}
+
   standard-as-callback@2.1.0:
     resolution: {integrity: sha512-qoRRSyROncaz1z0mvYqIE4lCd9p2R90i6GxW3uZv5ucSu8tU7B5HXUP1gG8pVZsYNVaXjk8ClXHPttLyxAL48A==}
 
@@ -4600,6 +4838,9 @@ packages:
     resolution: {integrity: sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==}
     engines: {node: '>= 0.8'}
 
+  std-env@4.2.0:
+    resolution: {integrity: sha512-oCUKSupKTHX53EyjDtuZQ64pjLJ6yYCtpmEw0goYxtjG9KpbRe8KAsl2tBUGU9DyMcJ0RwJ8GqJAFzMXcXW1Rw==}
+
   stop-iteration-iterator@1.1.0:
     resolution: {integrity: sha512-eLoXW/DHyl62zxY4SCaIgnRhuMr6ri4juEYARS8E6sCEqzKpOiE521Ucofdx+KnDZl5xmvGYaaKCk5FEOxJCoQ==}
     engines: {node: '>= 0.4'}
@@ -4731,6 +4972,10 @@ packages:
   tiny-invariant@1.3.3:
     resolution: {integrity: sha512-+FbBPE1o9QAYvviau/qC5SE3caw21q3xkvWKBtja5vgqOWIHHJ3ioaq1VPfn/Szqctz2bU/oYeKd9/z5BL+PVg==}
 
+  tinybench@6.1.4:
+    resolution: {integrity: sha512-9APumHG7r4yOk4X4WlkmE71aZcv1gvin1czO3OQ1U9iJcFA5Ja/ygyb0vPOVHTthFozUYs8CLoLUlM8grb2lTQ==}
+    engines: {node: '>=20.0.0'}
+
   tinycolor2@1.6.0:
     resolution: {integrity: sha512-XPaBkWQJdsf3pLKJV9p4qN/S+fm2Oj8AIPo1BTUhg5oxkvm9+SVEGFdhyOz7tTdUTfvxMiAs4sp6/eZO2Ew+pw==}
 
@@ -4738,10 +4983,18 @@ packages:
     resolution: {integrity: sha512-W/KYk+NFhkmsYpuHq5JykngiOCnxeVL8v8dFnqxSD8qEEdRfXk1SDM6JzNqcERbcGYj9tMrDQBYV9cjgnunFIg==}
     engines: {node: '>=18'}
 
+  tinyexec@1.3.0:
+    resolution: {integrity: sha512-QKAl9m8gWWGHV8jZcPeym6j+XULi6tOf1mT83WYJ4Lk2ytW/uwAWkrP0uFsdoYMdueVJ0qs26wZ+23xeB4ibNQ==}
+    engines: {node: '>=18'}
+
   tinyglobby@0.2.15:
     resolution: {integrity: sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ==}
     engines: {node: '>=12.0.0'}
 
+  tinyglobby@0.2.17:
+    resolution: {integrity: sha512-wXR/dYpcqKmfWpEdZjiKJOwCNFndD0DMnrW/cYjVGttEkBfVgcLFHoNrlj47mjOVic9yyNu65alsgF4NQyTa2g==}
+    engines: {node: '>=12.0.0'}
+
   tinygradient@1.1.5:
     resolution: {integrity: sha512-8nIfc2vgQ4TeLnk2lFj4tRLvvJwEfQuabdsmvDdQPT0xlk9TaNtpGd6nNRxXoK6vQhN6RSzj+Cnp5tTQmpxmbw==}
 
@@ -4985,6 +5238,90 @@ packages:
     resolution: {integrity: sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==}
     engines: {node: '>= 0.8'}
 
+  vite@8.2.2:
+    resolution: {integrity: sha512-cFKLV/PRgAUlIRm5WjMjJ86jrftzpqcgH+Us+DS8mI3CDNiH30Whrz8uHL3+MOLPAgqbMBAqWdAHAphOAM+z/Q==}
+    engines: {node: ^20.19.0 || >=22.12.0}
+    hasBin: true
+    peerDependencies:
+      '@types/node': ^20.19.0 || >=22.12.0
+      '@vitejs/devtools': ^0.4.0 || ^0.5.0
+      esbuild: ^0.27.0 || ^0.28.0
+      jiti: '>=1.21.0'
+      less: ^4.0.0
+      sass: ^1.70.0
+      sass-embedded: ^1.70.0
+      stylus: '>=0.54.8'
+      sugarss: ^5.0.0
+      terser: ^5.16.0
+      tsx: ^4.8.1
+      yaml: ^2.4.2
+    peerDependenciesMeta:
+      '@types/node':
+        optional: true
+      '@vitejs/devtools':
+        optional: true
+      esbuild:
+        optional: true
+      jiti:
+        optional: true
+      less:
+        optional: true
+      sass:
+        optional: true
+      sass-embedded:
+        optional: true
+      stylus:
+        optional: true
+      sugarss:
+        optional: true
+      terser:
+        optional: true
+      tsx:
+        optional: true
+      yaml:
+        optional: true
+
+  vitest@5.0.0:
+    resolution: {integrity: sha512-gpsMNoRhMjMktVxPtstOH4/PJuPyovVaMDr4oDilXaGH1EcqM2OE96SoHT2VIQ6fTGtTjqmHDrEu2X9RQiXf8Q==}
+    engines: {node: ^22.12.0 || ^24.0.0 || >=26.0.0}
+    hasBin: true
+    peerDependencies:
+      '@edge-runtime/vm': '*'
+      '@opentelemetry/api': ^1.9.0
+      '@types/node': ^22.0.0 || >=24.0.0
+      '@vitest/browser-playwright': 5.0.0
+      '@vitest/browser-preview': 5.0.0
+      '@vitest/browser-webdriverio': ^5.0.0-beta.5 || >=5.0.0
+      '@vitest/coverage-istanbul': 5.0.0
+      '@vitest/coverage-v8': 5.0.0
+      '@vitest/ui': 5.0.0
+      happy-dom: '*'
+      jsdom: '*'
+      vite: ^6.4.0 || ^7.0.0 || ^8.0.0
+    peerDependenciesMeta:
+      '@edge-runtime/vm':
+        optional: true
+      '@opentelemetry/api':
+        optional: true
+      '@types/node':
+        optional: true
+      '@vitest/browser-playwright':
+        optional: true
+      '@vitest/browser-preview':
+        optional: true
+      '@vitest/browser-webdriverio':
+        optional: true
+      '@vitest/coverage-istanbul':
+        optional: true
+      '@vitest/coverage-v8':
+        optional: true
+      '@vitest/ui':
+        optional: true
+      happy-dom:
+        optional: true
+      jsdom:
+        optional: true
+
   vscode-jsonrpc@8.2.0:
     resolution: {integrity: sha512-C+r0eKJUIfiDIfwJhria30+TYWPtuHJXHtI7J0YlOmKAo7ogxP20T0zxB7HZQIFhIyvoBPwWskjxrvAtfjyZfA==}
     engines: {node: '>=14.0.0'}
@@ -5045,6 +5382,11 @@ packages:
     engines: {node: '>= 8'}
     hasBin: true
 
+  why-is-node-running@2.3.0:
+    resolution: {integrity: sha512-hUrmaWBdVDcxvYqnyh09zunKzROWjbZTiNy8dBEjkS7ehEDQibXJ7XvlmtbwuTclUiIyN+CyXQD4Vmko8fNm8w==}
+    engines: {node: '>=8'}
+    hasBin: true
+
   word-wrap@1.2.5:
     resolution: {integrity: sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==}
     engines: {node: '>=0.10.0'}
@@ -5598,6 +5940,8 @@ snapshots:
       '@nodelib/fs.scandir': 2.1.5
       fastq: 1.19.1
 
+  '@oxc-project/types@0.148.0': {}
+
   '@pinojs/redact@0.4.0': {}
 
   '@prisma/client@6.19.2(prisma@6.19.2(typescript@5.9.3))(typescript@5.9.3)':
@@ -6422,6 +6766,53 @@ snapshots:
 
   '@radix-ui/rect@1.1.1': {}
 
+  '@rolldown/binding-android-arm-eabi@1.2.7':
+    optional: true
+
+  '@rolldown/binding-android-arm64@1.2.7':
+    optional: true
+
+  '@rolldown/binding-darwin-arm64@1.2.7':
+    optional: true
+
+  '@rolldown/binding-darwin-x64@1.2.7':
+    optional: true
+
+  '@rolldown/binding-freebsd-x64@1.2.7':
+    optional: true
+
+  '@rolldown/binding-linux-arm-gnueabihf@1.2.7':
+    optional: true
+
+  '@rolldown/binding-linux-arm64-gnu@1.2.7':
+    optional: true
+
+  '@rolldown/binding-linux-arm64-musl@1.2.7':
+    optional: true
+
+  '@rolldown/binding-linux-ppc64-gnu@1.2.7':
+    optional: true
+
+  '@rolldown/binding-linux-s390x-gnu@1.2.7':
+    optional: true
+
+  '@rolldown/binding-linux-x64-gnu@1.2.7':
+    optional: true
+
+  '@rolldown/binding-linux-x64-musl@1.2.7':
+    optional: true
+
+  '@rolldown/binding-openharmony-arm64@1.2.7':
+    optional: true
+
+  '@rolldown/binding-win32-arm64-msvc@1.2.7':
+    optional: true
+
+  '@rolldown/binding-win32-x64-msvc@1.2.7':
+    optional: true
+
+  '@rolldown/pluginutils@1.0.1': {}
+
   '@scarf/scarf@1.4.0': {}
 
   '@standard-schema/spec@1.1.0': {}
@@ -6592,6 +6983,11 @@ snapshots:
       '@types/connect': 3.4.38
       '@types/node': 20.19.31
 
+  '@types/chai@5.2.3':
+    dependencies:
+      '@types/deep-eql': 4.0.2
+      assertion-error: 2.0.1
+
   '@types/connect@3.4.38':
     dependencies:
       '@types/node': 20.19.31
@@ -6717,6 +7113,8 @@ snapshots:
       '@types/d3-transition': 3.0.9
       '@types/d3-zoom': 3.0.8
 
+  '@types/deep-eql@4.0.2': {}
+
   '@types/estree@1.0.8': {}
 
   '@types/express-rate-limit@6.0.2(express@4.22.1)':
@@ -6939,6 +7337,17 @@ snapshots:
       '@typescript-eslint/types': 8.54.0
       eslint-visitor-keys: 4.2.1
 
+  '@vitest/mocker@5.0.0(vite@8.2.2(@types/node@20.19.31)(jiti@2.6.1))':
+    dependencies:
+      '@jridgewell/trace-mapping': 0.3.31
+      '@vitest/spy': 5.0.0
+      estree-walker: 3.0.3
+      magic-string: 1.2.3
+    optionalDependencies:
+      vite: 8.2.2(@types/node@20.19.31)(jiti@2.6.1)
+
+  '@vitest/spy@5.0.0': {}
+
   abort-controller@3.0.0:
     dependencies:
       event-target-shim: 5.0.1
@@ -7075,6 +7484,8 @@ snapshots:
       get-intrinsic: 1.3.0
       is-array-buffer: 3.0.5
 
+  assertion-error@2.0.1: {}
+
   ast-types@0.13.4:
     dependencies:
       tslib: 2.8.1
@@ -7250,6 +7661,8 @@ snapshots:
 
   caniuse-lite@1.0.30001760: {}
 
+  chai@6.2.2: {}
+
   chalk@2.4.2:
     dependencies:
       ansi-styles: 3.2.1
@@ -7875,6 +8288,8 @@ snapshots:
       iterator.prototype: 1.1.5
       safe-array-concat: 1.1.3
 
+  es-module-lexer@2.3.2: {}
+
   es-object-atoms@1.1.1:
     dependencies:
       es-errors: 1.3.0
@@ -8025,6 +8440,10 @@ snapshots:
 
   estraverse@5.3.0: {}
 
+  estree-walker@3.0.3:
+    dependencies:
+      '@types/estree': 1.0.8
+
   esutils@2.0.3: {}
 
   etag@1.8.1: {}
@@ -8049,6 +8468,8 @@ snapshots:
       signal-exit: 3.0.7
       strip-final-newline: 2.0.0
 
+  expect-type@1.4.0: {}
+
   express-rate-limit@8.7.0(express@4.22.1):
     dependencies:
       debug: 4.4.3
@@ -8165,6 +8586,10 @@ snapshots:
     optionalDependencies:
       picomatch: 4.0.3
 
+  fdir@6.5.0(picomatch@4.0.7):
+    optionalDependencies:
+      picomatch: 4.0.7
+
   figures@3.2.0:
     dependencies:
       escape-string-regexp: 1.0.5
@@ -8810,36 +9235,69 @@ snapshots:
   lightningcss-android-arm64@1.30.2:
     optional: true
 
+  lightningcss-android-arm64@1.33.0:
+    optional: true
+
   lightningcss-darwin-arm64@1.30.2:
     optional: true
 
+  lightningcss-darwin-arm64@1.33.0:
+    optional: true
+
   lightningcss-darwin-x64@1.30.2:
     optional: true
 
+  lightningcss-darwin-x64@1.33.0:
+    optional: true
+
   lightningcss-freebsd-x64@1.30.2:
     optional: true
 
+  lightningcss-freebsd-x64@1.33.0:
+    optional: true
+
   lightningcss-linux-arm-gnueabihf@1.30.2:
     optional: true
 
+  lightningcss-linux-arm-gnueabihf@1.33.0:
+    optional: true
+
   lightningcss-linux-arm64-gnu@1.30.2:
     optional: true
 
+  lightningcss-linux-arm64-gnu@1.33.0:
+    optional: true
+
   lightningcss-linux-arm64-musl@1.30.2:
     optional: true
 
+  lightningcss-linux-arm64-musl@1.33.0:
+    optional: true
+
   lightningcss-linux-x64-gnu@1.30.2:
     optional: true
 
+  lightningcss-linux-x64-gnu@1.33.0:
+    optional: true
+
   lightningcss-linux-x64-musl@1.30.2:
     optional: true
 
+  lightningcss-linux-x64-musl@1.33.0:
+    optional: true
+
   lightningcss-win32-arm64-msvc@1.30.2:
     optional: true
 
+  lightningcss-win32-arm64-msvc@1.33.0:
+    optional: true
+
   lightningcss-win32-x64-msvc@1.30.2:
     optional: true
 
+  lightningcss-win32-x64-msvc@1.33.0:
+    optional: true
+
   lightningcss@1.30.2:
     dependencies:
       detect-libc: 2.1.2
@@ -8856,6 +9314,22 @@ snapshots:
       lightningcss-win32-arm64-msvc: 1.30.2
       lightningcss-win32-x64-msvc: 1.30.2
 
+  lightningcss@1.33.0:
+    dependencies:
+      detect-libc: 2.1.2
+    optionalDependencies:
+      lightningcss-android-arm64: 1.33.0
+      lightningcss-darwin-arm64: 1.33.0
+      lightningcss-darwin-x64: 1.33.0
+      lightningcss-freebsd-x64: 1.33.0
+      lightningcss-linux-arm-gnueabihf: 1.33.0
+      lightningcss-linux-arm64-gnu: 1.33.0
+      lightningcss-linux-arm64-musl: 1.33.0
+      lightningcss-linux-x64-gnu: 1.33.0
+      lightningcss-linux-x64-musl: 1.33.0
+      lightningcss-win32-arm64-msvc: 1.33.0
+      lightningcss-win32-x64-msvc: 1.33.0
+
   lines-and-columns@1.2.4: {}
 
   locate-path@6.0.0:
@@ -8921,6 +9395,10 @@ snapshots:
     dependencies:
       '@jridgewell/sourcemap-codec': 1.5.5
 
+  magic-string@1.2.3:
+    dependencies:
+      '@jridgewell/sourcemap-codec': 1.5.5
+
   make-cancellable-promise@2.0.0: {}
 
   make-error@1.3.6: {}
@@ -9026,6 +9504,8 @@ snapshots:
 
   nanoid@3.3.11: {}
 
+  nanoid@3.3.18: {}
+
   natural-compare@1.4.0: {}
 
   negotiator@0.6.3: {}
@@ -9139,6 +9619,8 @@ snapshots:
       define-properties: 1.2.1
       es-object-atoms: 1.1.1
 
+  obug@2.1.4: {}
+
   ohash@2.0.11: {}
 
   on-exit-leak-free@2.1.2: {}
@@ -9294,6 +9776,8 @@ snapshots:
 
   picomatch@4.0.3: {}
 
+  picomatch@4.0.7: {}
+
   pino-abstract-transport@3.0.0:
     dependencies:
       split2: 4.2.0
@@ -9364,6 +9848,12 @@ snapshots:
       picocolors: 1.1.1
       source-map-js: 1.2.1
 
+  postcss@8.5.28:
+    dependencies:
+      nanoid: 3.3.18
+      picocolors: 1.1.1
+      source-map-js: 1.2.1
+
   postcss@8.5.6:
     dependencies:
       nanoid: 3.3.11
@@ -9686,6 +10176,27 @@ snapshots:
 
   robust-predicates@3.0.2: {}
 
+  rolldown@1.2.7:
+    dependencies:
+      '@oxc-project/types': 0.148.0
+      '@rolldown/pluginutils': 1.0.1
+    optionalDependencies:
+      '@rolldown/binding-android-arm-eabi': 1.2.7
+      '@rolldown/binding-android-arm64': 1.2.7
+      '@rolldown/binding-darwin-arm64': 1.2.7
+      '@rolldown/binding-darwin-x64': 1.2.7
+      '@rolldown/binding-freebsd-x64': 1.2.7
+      '@rolldown/binding-linux-arm-gnueabihf': 1.2.7
+      '@rolldown/binding-linux-arm64-gnu': 1.2.7
+      '@rolldown/binding-linux-arm64-musl': 1.2.7
+      '@rolldown/binding-linux-ppc64-gnu': 1.2.7
+      '@rolldown/binding-linux-s390x-gnu': 1.2.7
+      '@rolldown/binding-linux-x64-gnu': 1.2.7
+      '@rolldown/binding-linux-x64-musl': 1.2.7
+      '@rolldown/binding-openharmony-arm64': 1.2.7
+      '@rolldown/binding-win32-arm64-msvc': 1.2.7
+      '@rolldown/binding-win32-x64-msvc': 1.2.7
+
   roughjs@4.6.6:
     dependencies:
       hachure-fill: 0.5.2
@@ -9866,6 +10377,8 @@ snapshots:
       side-channel-map: 1.0.1
       side-channel-weakmap: 1.0.2
 
+  siginfo@2.0.0: {}
+
   signal-exit@3.0.7: {}
 
   signal-exit@4.1.0: {}
@@ -9908,10 +10421,14 @@ snapshots:
 
   sprintf-js@1.1.3: {}
 
+  stackback@0.0.2: {}
+
   standard-as-callback@2.1.0: {}
 
   statuses@2.0.2: {}
 
+  std-env@4.2.0: {}
+
   stop-iteration-iterator@1.1.0:
     dependencies:
       es-errors: 1.3.0
@@ -10077,15 +10594,24 @@ snapshots:
 
   tiny-invariant@1.3.3: {}
 
+  tinybench@6.1.4: {}
+
   tinycolor2@1.6.0: {}
 
   tinyexec@1.0.2: {}
 
+  tinyexec@1.3.0: {}
+
   tinyglobby@0.2.15:
     dependencies:
       fdir: 6.5.0(picomatch@4.0.3)
       picomatch: 4.0.3
 
+  tinyglobby@0.2.17:
+    dependencies:
+      fdir: 6.5.0(picomatch@4.0.7)
+      picomatch: 4.0.7
+
   tinygradient@1.1.5:
     dependencies:
       '@types/tinycolor2': 1.4.6
@@ -10345,6 +10871,39 @@ snapshots:
 
   vary@1.1.2: {}
 
+  vite@8.2.2(@types/node@20.19.31)(jiti@2.6.1):
+    dependencies:
+      lightningcss: 1.33.0
+      picomatch: 4.0.7
+      postcss: 8.5.28
+      rolldown: 1.2.7
+      tinyglobby: 0.2.17
+    optionalDependencies:
+      '@types/node': 20.19.31
+      fsevents: 2.3.3
+      jiti: 2.6.1
+
+  vitest@5.0.0(@types/node@20.19.31)(vite@8.2.2(@types/node@20.19.31)(jiti@2.6.1)):
+    dependencies:
+      '@types/chai': 5.2.3
+      '@vitest/mocker': 5.0.0(vite@8.2.2(@types/node@20.19.31)(jiti@2.6.1))
+      chai: 6.2.2
+      es-module-lexer: 2.3.2
+      expect-type: 1.4.0
+      magic-string: 1.2.3
+      obug: 2.1.4
+      picomatch: 4.0.7
+      std-env: 4.2.0
+      tinybench: 6.1.4
+      tinyexec: 1.3.0
+      tinyglobby: 0.2.17
+      vite: 8.2.2(@types/node@20.19.31)(jiti@2.6.1)
+      why-is-node-running: 2.3.0
+    optionalDependencies:
+      '@types/node': 20.19.31
+    transitivePeerDependencies:
+      - msw
+
   vscode-jsonrpc@8.2.0: {}
 
   vscode-languageserver-protocol@3.17.5:
@@ -10426,6 +10985,11 @@ snapshots:
     dependencies:
       isexe: 2.0.0
 
+  why-is-node-running@2.3.0:
+    dependencies:
+      siginfo: 2.0.0
+      stackback: 0.0.2
+
   word-wrap@1.2.5: {}
 
   wordwrap@1.0.0: {}
diff --git a/turbo.json b/turbo.json
index d6a7fe0..c9a19db 100644
--- a/turbo.json
+++ b/turbo.json
@@ -10,6 +10,9 @@
     "lint": {
       "dependsOn": ["^lint"]
     },
+    "test": {
+      "cache": false
+    },
     "check-types": {
       "dependsOn": ["^check-types"]
     },

From 5929d5b40d704402e6d2353a2ce5fabb35abf137 Mon Sep 17 00:00:00 2001
From: caya8205-2 <yaandere200@gmail.com>
Date: Mon, 7 Sep 2026 08:55:36 +0700
Subject: [PATCH 10/11] feat(ci): run typecheck and unit tests on push and PR

- Add test.yml workflow (install, check-types, unit tests)
- Add check-types script to web-api covering src and tests
- Add check-types alias to web-app for uniform turbo task
- Fix missing mermaid type declarations in web-app
---
 .github/workflows/test.yml                 | 34 ++++++++++++++++++++++
 apps/web-api/package.json                  |  3 +-
 apps/web-api/tests/token-blacklist.test.ts | 14 +++++----
 apps/web-api/tsconfig.check.json           | 11 +++++++
 apps/web-app/package.json                  |  4 ++-
 package.json                               |  1 +
 pnpm-lock.yaml                             | 11 +++++++
 7 files changed, 71 insertions(+), 7 deletions(-)
 create mode 100644 .github/workflows/test.yml
 create mode 100644 apps/web-api/tsconfig.check.json

diff --git a/.github/workflows/test.yml b/.github/workflows/test.yml
new file mode 100644
index 0000000..9963f03
--- /dev/null
+++ b/.github/workflows/test.yml
@@ -0,0 +1,34 @@
+name: Test
+
+on:
+  push:
+    branches: ["main", "migrasi-db", "development"]
+  pull_request:
+    branches: ["main", "migrasi-db", "development"]
+
+jobs:
+  test:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+
+      - name: Setup pnpm
+        uses: pnpm/action-setup@v4
+        with:
+          version: 10.4.1
+
+      - name: Setup Node
+        uses: actions/setup-node@v4
+        with:
+          node-version: 22
+          cache: pnpm
+
+      - name: Install dependencies
+        run: pnpm install --frozen-lockfile
+
+      - name: Type check
+        run: pnpm check-types
+
+      - name: Unit tests
+        run: pnpm test
diff --git a/apps/web-api/package.json b/apps/web-api/package.json
index 0b52de8..5737708 100644
--- a/apps/web-api/package.json
+++ b/apps/web-api/package.json
@@ -4,7 +4,8 @@
   "scripts": {
     "dev": "ts-node-dev --respawn --transpile-only --ignore-watch node_modules src/server.ts",
     "build": "tsc",
-    "test": "vitest run"
+    "test": "vitest run",
+    "check-types": "tsc --noEmit -p tsconfig.check.json"
   },
   "dependencies": {
     "@prisma/client": "^6.0.0",
diff --git a/apps/web-api/tests/token-blacklist.test.ts b/apps/web-api/tests/token-blacklist.test.ts
index c08a965..ac3e763 100644
--- a/apps/web-api/tests/token-blacklist.test.ts
+++ b/apps/web-api/tests/token-blacklist.test.ts
@@ -1,10 +1,14 @@
-import { describe, it, expect, beforeEach } from "vitest";
+import { describe, it, expect, beforeAll, beforeEach } from "vitest";
+import type { tokenBlacklist as TokenBlacklist } from "../src/utils/token-blacklist";
 
-// Paksa jalur in-memory: string kosong tetap kosong walau dotenv
-// me-load ulang REDIS_URL dari file .env lokal saat import
-process.env.REDIS_URL = "";
+let tokenBlacklist: typeof TokenBlacklist;
 
-const { tokenBlacklist } = await import("../src/utils/token-blacklist");
+beforeAll(async () => {
+  // Paksa jalur in-memory: string kosong tetap kosong walau dotenv
+  // me-load ulang REDIS_URL dari file .env lokal saat import
+  process.env.REDIS_URL = "";
+  ({ tokenBlacklist } = await import("../src/utils/token-blacklist"));
+});
 
 describe("tokenBlacklist (in-memory fallback)", () => {
   beforeEach(async () => {
diff --git a/apps/web-api/tsconfig.check.json b/apps/web-api/tsconfig.check.json
new file mode 100644
index 0000000..0dd49ad
--- /dev/null
+++ b/apps/web-api/tsconfig.check.json
@@ -0,0 +1,11 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "noEmit": true,
+    "rootDir": ".",
+    "declaration": false,
+    "declarationMap": false,
+    "sourceMap": false
+  },
+  "include": ["src", "tests", "vitest.config.ts"]
+}
diff --git a/apps/web-app/package.json b/apps/web-app/package.json
index ed61276..81b8d73 100644
--- a/apps/web-app/package.json
+++ b/apps/web-app/package.json
@@ -9,7 +9,8 @@
     "start": "next start",
     "lint": "next lint",
     "lint:fix": "next lint --fix",
-    "typecheck": "tsc --noEmit"
+    "typecheck": "tsc --noEmit",
+    "check-types": "tsc --noEmit"
   },
   "dependencies": {
     "@workspace/ui": "workspace:*",
@@ -24,6 +25,7 @@
   },
   "devDependencies": {
     "@tailwindcss/postcss": "^4.1.18",
+    "@types/mermaid": "^9.2.0",
     "@types/node": "^25.1.0",
     "@types/react": "^19.2.10",
     "@types/react-dom": "^19.2.3",
diff --git a/package.json b/package.json
index 4f794ac..08b334a 100644
--- a/package.json
+++ b/package.json
@@ -7,6 +7,7 @@
     "dev": "turbo dev",
     "lint": "turbo lint",
     "test": "turbo run test",
+    "check-types": "turbo run check-types",
     "format": "prettier --write \"**/*.{ts,tsx,md}\""
   },
   "devDependencies": {
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e2e653a..2d89b3a 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -206,6 +206,9 @@ importers:
       '@tailwindcss/postcss':
         specifier: ^4.1.18
         version: 4.1.18
+      '@types/mermaid':
+        specifier: ^9.2.0
+        version: 9.2.0
       '@types/node':
         specifier: ^25.1.0
         version: 25.2.0
@@ -2004,6 +2007,10 @@ packages:
   '@types/jsonwebtoken@9.0.10':
     resolution: {integrity: sha512-asx5hIG9Qmf/1oStypjanR7iKTv0gXQ1Ov/jfrX6kS/EO0OFni8orbmGCn0672NHR3kXHwpAwR+B368ZGN/2rA==}
 
+  '@types/mermaid@9.2.0':
+    resolution: {integrity: sha512-AlvLWYer6u4BkO4QzMkHo0t9RkvVIgqggVZmO+5snUiuX2caTKqtdqygX6GeE1VQa/TnXw9WoH0spcmHtG0inQ==}
+    deprecated: This is a stub types definition. mermaid provides its own type definitions, so you do not need this installed.
+
   '@types/mime@1.3.5':
     resolution: {integrity: sha512-/pyBZWSLD2n0dcHE3hq8s8ZvcETHtEuF+3E7XVt0Ig2nvsVQXdghHVcEkIWjy9A0wKfTn97a/PSDYohKIlnP/w==}
 
@@ -7163,6 +7170,10 @@ snapshots:
       '@types/ms': 2.1.0
       '@types/node': 25.2.0
 
+  '@types/mermaid@9.2.0':
+    dependencies:
+      mermaid: 11.12.3
+
   '@types/mime@1.3.5': {}
 
   '@types/minimatch@6.0.0':

From 2661f86f6a23f9c9aed3ec432dd745ed102bf78e Mon Sep 17 00:00:00 2001
From: caya8205-2 <yaandere200@gmail.com>
Date: Mon, 7 Sep 2026 09:37:34 +0700
Subject: [PATCH 11/11] docs: update readme backend + nambah MIT license

---
 LICENSE                | 21 ++++++++++
 README.md              |  6 ++-
 apps/web-api/README.md | 95 +++++++++++++++++++++++++++++++-----------
 3 files changed, 96 insertions(+), 26 deletions(-)
 create mode 100644 LICENSE

diff --git a/LICENSE b/LICENSE
new file mode 100644
index 0000000..312d9d5
--- /dev/null
+++ b/LICENSE
@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 yudha556 & caya8502
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
diff --git a/README.md b/README.md
index 15dd016..2d5bfe3 100644
--- a/README.md
+++ b/README.md
@@ -86,4 +86,8 @@ Planify terbuka untuk kontribusi. Untuk menambahkan fitur baru atau memperbaiki
 4. Push branch: git push origin fitur-baru
 5. Buat Pull Request
 
-![alt text](<ChatGPT Image 4 Feb 2026, 01.04.59.png>)
\ No newline at end of file
+![alt text](<ChatGPT Image 4 Feb 2026, 01.04.59.png>)
+
+# Lisensi
+
+[MIT](LICENSE)
\ No newline at end of file
diff --git a/apps/web-api/README.md b/apps/web-api/README.md
index afb31c3..787516b 100644
--- a/apps/web-api/README.md
+++ b/apps/web-api/README.md
@@ -2,39 +2,84 @@
 
 **Backend API untuk Planify** 🚀
 
-Planify API menyediakan endpoint untuk berinteraksi dengan AI engine, menerima input dari user, dan menghasilkan dokumen proyek lengkap. API ini digunakan oleh frontend `apps/web` untuk memproses data proyek dan memanggil AI engine.
+REST API buat generate dokumen proyek berbasis AI: autentikasi user,
+generate brief + diagram (Groq), sistem koin, export PDF/Markdown,
+manajemen project, dan riwayat aktivitas. Datanya di Supabase.
 
 ---
 
-## 🛠️ Teknologi
-
-- Node.js + TypeScript  
-- Framework: [Express / Fastify / Next.js API Routes] (sesuaikan implementasi)  
-- Monorepo: Turborepo + pnpm  
-- AI Engine Integration (LLM / OpenAI API)
-
----
-# Cara Jalanin API
+## Cara Jalanin
 
 ```bash
-# Masuk ke folder API
-cd apps/api
-
-# Install dependencies
+# Dari root repo
 pnpm install
 
-# Jalankan server
+# Jalanin API (http://localhost:4000)
+pnpm --filter web-api dev
+
+# Atau masuk ke foldernya dulu
+cd apps/web-api
 pnpm dev
 ```
 
-# Struktur Folder 
+| Script | Buat apa |
+|--------|----------|
+| `pnpm dev` | Jalanin server (hot-reload) |
+| `pnpm build` | Compile TypeScript ke `dist/` |
+| `pnpm test` | Jalanin unit test (Vitest, 40 test) |
+| `pnpm check-types` | Cek type error (`tsc --noEmit`, src + tests) |
+
+Dari root repo juga bisa: `pnpm test` dan `pnpm check-types`
+(jalan via Turbo ke semua package yang punya script itu).
+
+---
+
+## Environment Variables
+
+Copy `.env.example` jadi `.env`, terus isi:
+
+| Var | Buat apa |
+|-----|----------|
+| `PORT` / `NODE_ENV` / `JWT_SECRET` | Server + auth (wajib, tanpa default di production) |
+| `SUPABASE_URL` / `SUPABASE_SERVICE_ROLE_KEY` | Database + auth |
+| `GROQ_API_KEY` | AI engine |
+| `CORS_ORIGIN` | Domain frontend yang dibolehin |
+| `REDIS_URL` | Blacklist token (opsional, fallback ke in-memory) |
+
+---
+
+## Endpoint
+
+Base URL: `http://localhost:4000/api/v1` (endpoint lama `/api/...`
+masih jalan tapi deprecated).
+
+Dokumentasi lengkap: [`API-Endpoint-Docs.md`](./API-Endpoint-Docs.md),
+atau buka Swagger UI di `/api/docs` pas server jalan.
+
+---
+
+## Struktur Folder
+
 ```bash
-api/
-├─ routes/            # Semua route API (generate, suggest, dll)
-├─ controllers/       # Logic untuk memproses request
-├─ services/          # Integrasi AI engine, helper functions
-├─ middlewares/       # Middleware (auth, logging, error handling)
-├─ utils/             # Utility functions
-├─ package.json       # Dependencies & scripts
-└─ tsconfig.json      # TypeScript configuration
-```
\ No newline at end of file
+src/
+├─ app.ts              # Setup Express (helmet, cors, rate-limit, dsb)
+├─ server.ts           # Entry point + graceful shutdown
+├─ config/             # env, supabase, redis
+├─ routes/             # Definisi route per fitur + routes/v1 (agregator versi)
+├─ controllers/        # Handler request/response
+├─ services/           # Bisnis logic (auth, ai, coin, pdf, markdown, ...)
+├─ middlewares/        # auth, rate-limit, validation, error handler
+├─ validators/         # Schema Zod per endpoint
+├─ utils/              # logger, app-error, token-blacklist, async-handler
+├─ docs/               # Setup Swagger
+└─ types/              # Deklarasi tipe tambahan
+tests/                 # Unit test (Vitest)
+```
+
+---
+
+## Keamanan (ringkas)
+
+Rate limiting, Helmet headers, validasi Zod di semua endpoint tulis,
+CORS terbatas, JWT secret wajib di production, blacklist token via Redis,
+logging JSON per-request, limit body 1MB, XSS + HPP guard.
\ No newline at end of file