From 89dadad26e3c399e0466e8f7fb0e62a0db161587 Mon Sep 17 00:00:00 2001
From: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Date: Wed, 29 Apr 2026 13:36:08 +0000
Subject: [PATCH 1/5] fix: enterprise security hardening - auth, rate limiting,
 CSP, password hashing, input validation

Security fixes:
- Remove sensitive data leakage from OAuth callback URL params (access_token, email, phone)
- Add authentication to upload, preferences, account security, and security scan routes
- Add role-based access control to upload route (admin/operator only)
- Redact sensitive environment variables in admin env endpoint
- Add strict action validation to bot-control endpoint
- Implement rate limiting on contact form and newsletter subscribe endpoints
- Add input sanitization and email validation to contact form
- Strengthen password hashing: PBKDF2 310000 iterations, SHA-512, 32-byte salt
- Use timing-safe comparison for password verification
- Remove unsafe-eval from CSP, align layout.tsx with next.config.mjs policy
- Narrow Discord bot permissions from Administrator (8) to least-privilege (36768832)
- Add Next.js middleware with security headers and API rate limiting
- Add memory-leak-safe rate limit store with periodic purge
- Fix all localhost:3000 references to correct port 3050 across 13 files

Co-Authored-By: GmBH <system.bot.discord.utility@gmail.com>
---
 frontend/app/account/page.tsx                 |  2 +-
 .../app/api/account/notifications/route.ts    |  2 +-
 frontend/app/api/account/security/route.ts    | 11 +++
 frontend/app/api/admin/bot-control/route.ts   |  5 +-
 frontend/app/api/admin/env/route.ts           | 21 +++--
 .../app/api/auth/discord/callback/route.ts    |  7 --
 frontend/app/api/billing/portal/route.ts      |  2 +-
 frontend/app/api/checkout/route.ts            |  2 +-
 frontend/app/api/contact/route.ts             | 34 +++++++-
 frontend/app/api/donate/route.ts              |  2 +-
 .../app/api/newsletter/subscribe/route.ts     | 15 +++-
 frontend/app/api/preferences/route.ts         | 11 +++
 frontend/app/api/security/scan/route.ts       |  9 +++
 frontend/app/api/stripe/portal/route.ts       |  2 +-
 frontend/app/api/upload/route.ts              | 33 ++++++--
 frontend/app/blog/page.tsx                    |  2 +-
 frontend/app/layout.tsx                       |  2 +-
 frontend/app/profile/[slug]/profile-utils.ts  |  2 +-
 frontend/app/stats/page.tsx                   |  2 +-
 frontend/lib/config.ts                        |  4 +-
 frontend/lib/email-notifications.ts           |  2 +-
 frontend/lib/email-templates.ts               |  2 +-
 frontend/lib/fetch-home-metrics.ts            |  2 +-
 frontend/lib/security.ts                      | 16 ++--
 frontend/lib/server-settings-sync.ts          |  2 +-
 frontend/middleware.ts                        | 81 +++++++++++++++++++
 26 files changed, 228 insertions(+), 47 deletions(-)
 create mode 100644 frontend/middleware.ts

diff --git a/frontend/app/account/page.tsx b/frontend/app/account/page.tsx
index a266cdd..ca32bc9 100644
--- a/frontend/app/account/page.tsx
+++ b/frontend/app/account/page.tsx
@@ -390,7 +390,7 @@ const [subscriptionPreview, setSubscriptionPreview] = useState<AccountSubscripti
   const profileShareBase =
     typeof window !== "undefined"
       ? window.location.origin
-      : process.env.NEXT_PUBLIC_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3000")
+      : process.env.NEXT_PUBLIC_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
 const profileShareUrl = profileShareSlug
     ? `${profileShareBase.replace(/\/$/, "")}/profile/${profileShareSlug}`
     : ""
diff --git a/frontend/app/api/account/notifications/route.ts b/frontend/app/api/account/notifications/route.ts
index d335b3b..a0aadb7 100644
--- a/frontend/app/api/account/notifications/route.ts
+++ b/frontend/app/api/account/notifications/route.ts
@@ -6,7 +6,7 @@ import { logError } from "@/lib/utils/error-handling"
 
 const appUrl =
   process.env.NEXT_PUBLIC_URL ||
-  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3000")
+  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
 const normalizedAppUrl = appUrl.replace(/\/$/, "")
 
 type RouteDeps = {
diff --git a/frontend/app/api/account/security/route.ts b/frontend/app/api/account/security/route.ts
index f146188..6ca75bc 100644
--- a/frontend/app/api/account/security/route.ts
+++ b/frontend/app/api/account/security/route.ts
@@ -1,5 +1,6 @@
 import { type NextRequest, NextResponse } from "next/server"
 import { getUserSecurity, updateUserSecurity } from "@/lib/db"
+import { verifyRequestForUser } from "@/lib/auth"
 
 export async function GET(request: NextRequest) {
   const discordId = request.nextUrl.searchParams.get("discordId")
@@ -7,6 +8,11 @@ export async function GET(request: NextRequest) {
     return NextResponse.json({ error: "discordId is required" }, { status: 400 })
   }
 
+  const auth = await verifyRequestForUser(request, discordId)
+  if (!auth.valid) {
+    return NextResponse.json({ error: "unauthorized" }, { status: 401 })
+  }
+
   const security = await getUserSecurity(discordId)
   return NextResponse.json(security)
 }
@@ -18,6 +24,11 @@ export async function PUT(request: NextRequest) {
       return NextResponse.json({ error: "discordId is required" }, { status: 400 })
     }
 
+    const auth = await verifyRequestForUser(request, discordId)
+    if (!auth.valid) {
+      return NextResponse.json({ error: "unauthorized" }, { status: 401 })
+    }
+
     const allowedKeys = ["twoFactorEnabled", "loginAlerts", "twoFactorSecret", "lastPasswordChange"]
     const sanitized: Record<string, any> = {}
     for (const key of allowedKeys) {
diff --git a/frontend/app/api/admin/bot-control/route.ts b/frontend/app/api/admin/bot-control/route.ts
index 1ef5abf..c31bcf5 100644
--- a/frontend/app/api/admin/bot-control/route.ts
+++ b/frontend/app/api/admin/bot-control/route.ts
@@ -33,7 +33,10 @@ export async function POST(request: NextRequest) {
       return NextResponse.json({ error: "forbidden" }, { status: 403 })
     }
 
-    const mapped = ACTIONS[action] || action
+    const mapped = ACTIONS[action]
+    if (!mapped) {
+      return NextResponse.json({ error: "invalid_action" }, { status: 400 })
+    }
     const ok = await sendBotControlAction(mapped)
     if (!ok) {
       return NextResponse.json({ error: "control_failed" }, { status: 500 })
diff --git a/frontend/app/api/admin/env/route.ts b/frontend/app/api/admin/env/route.ts
index 88449a9..d8399e3 100644
--- a/frontend/app/api/admin/env/route.ts
+++ b/frontend/app/api/admin/env/route.ts
@@ -45,14 +45,23 @@ export async function GET(request: NextRequest) {
   }
 
   const fileEnv = await readEnvFile(target)
-  const merged: Record<string, string> = { ...fileEnv }
-  for (const [key, value] of Object.entries(process.env)) {
-    if (typeof value === "string") {
-      merged[key] = value
-    }
+
+  const SENSITIVE_PATTERNS = [
+    /SECRET/i, /TOKEN/i, /PASSWORD/i, /KEY/i, /CREDENTIAL/i,
+    /DATABASE_URL/i, /REDIS_URL/i, /SMTP_PASS/i, /PRIVATE/i,
+  ]
+  const isSensitive = (key: string) => SENSITIVE_PATTERNS.some((p) => p.test(key))
+  const redact = (key: string, value: string) => {
+    if (!isSensitive(key)) return value
+    if (!value) return ""
+    return value.length > 4 ? `${"*".repeat(value.length - 4)}${value.slice(-4)}` : "****"
   }
 
-  const entries = Object.entries(merged).map(([key, value]) => ({ key, value }))
+  const entries = Object.entries(fileEnv).map(([key, value]) => ({
+    key,
+    value: redact(key, value),
+    configured: Boolean(value),
+  }))
   return NextResponse.json({ entries, source: { file: getEnvPath(target), target } })
 }
 
diff --git a/frontend/app/api/auth/discord/callback/route.ts b/frontend/app/api/auth/discord/callback/route.ts
index 9789b8f..cec854a 100644
--- a/frontend/app/api/auth/discord/callback/route.ts
+++ b/frontend/app/api/auth/discord/callback/route.ts
@@ -243,14 +243,7 @@ export async function GET(request: NextRequest) {
       ? resolveStateRedirect(request, stateOverride, decodedState ? false : true)
       : null
     const redirectUrl = stateRedirect ?? new URL(redirectPath, resolvePreferredOrigin(request))
-    redirectUrl.searchParams.set("token", tokenData.access_token)
     redirectUrl.searchParams.set("user_id", userData.id)
-    redirectUrl.searchParams.set("username", userData.username)
-    redirectUrl.searchParams.set("avatar", userData.avatar || "")
-    redirectUrl.searchParams.set("email", userData.email || "")
-    if (userData.phone) {
-      redirectUrl.searchParams.set("phone", userData.phone)
-    }
 
     const response = NextResponse.redirect(redirectUrl)
 
diff --git a/frontend/app/api/billing/portal/route.ts b/frontend/app/api/billing/portal/route.ts
index a4800f0..ec16f5a 100644
--- a/frontend/app/api/billing/portal/route.ts
+++ b/frontend/app/api/billing/portal/route.ts
@@ -4,7 +4,7 @@ import { getUserContact } from "@/lib/db"
 
 const appUrl =
   process.env.NEXT_PUBLIC_URL ||
-  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3000")
+  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
 const normalizedAppUrl = appUrl.replace(/\/$/, "")
 
 export async function POST(request: NextRequest) {
diff --git a/frontend/app/api/checkout/route.ts b/frontend/app/api/checkout/route.ts
index 0e5cadf..1ca02d3 100644
--- a/frontend/app/api/checkout/route.ts
+++ b/frontend/app/api/checkout/route.ts
@@ -8,7 +8,7 @@ import { logError } from "@/lib/utils/error-handling"
 
 const appUrl =
   process.env.NEXT_PUBLIC_URL ||
-  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3000")
+  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
 const normalizedAppUrl = appUrl.replace(/\/$/, "")
 
 const normalizeCountry = (value?: string | null): string | undefined => {
diff --git a/frontend/app/api/contact/route.ts b/frontend/app/api/contact/route.ts
index abb4519..2cd0f9d 100644
--- a/frontend/app/api/contact/route.ts
+++ b/frontend/app/api/contact/route.ts
@@ -1,13 +1,45 @@
 import { type NextRequest, NextResponse } from "next/server"
 import { createContactMessage } from "@/lib/db"
+import { resolveClientIp } from "@/lib/request-metadata"
+import { checkRateLimit } from "@/lib/security"
+
+const MAX_FIELD_LENGTH = 1000
+const MAX_MESSAGE_LENGTH = 5000
+
+const sanitizeField = (value: unknown, maxLen = MAX_FIELD_LENGTH): string => {
+  if (typeof value !== "string") return ""
+  return value.trim().slice(0, maxLen)
+}
+
+const isValidEmail = (email: string): boolean => {
+  if (email.length > 254) return false
+  return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)
+}
 
 export async function POST(request: NextRequest) {
   try {
-    const { name, email, subject, message, priority, topic, company } = await request.json()
+    const ip = resolveClientIp(request) ?? "unknown"
+    if (!checkRateLimit(`contact:${ip}`, 5, 60000)) {
+      return NextResponse.json({ error: "Too many requests. Please try again later." }, { status: 429 })
+    }
+
+    const body = await request.json()
+    const name = sanitizeField(body.name)
+    const email = sanitizeField(body.email)
+    const subject = sanitizeField(body.subject)
+    const message = sanitizeField(body.message, MAX_MESSAGE_LENGTH)
+    const priority = sanitizeField(body.priority)
+    const topic = sanitizeField(body.topic)
+    const company = sanitizeField(body.company)
+
     if (!name || !email || !message || !priority || !topic) {
       return NextResponse.json({ error: "Name, email, topic, priority, and message are required" }, { status: 400 })
     }
 
+    if (!isValidEmail(email)) {
+      return NextResponse.json({ error: "Invalid email address" }, { status: 400 })
+    }
+
     await createContactMessage({ name, email, subject, message, priority, topic, company })
     return NextResponse.json({ success: true })
   } catch (error) {
diff --git a/frontend/app/api/donate/route.ts b/frontend/app/api/donate/route.ts
index 0d02f01..96558eb 100644
--- a/frontend/app/api/donate/route.ts
+++ b/frontend/app/api/donate/route.ts
@@ -5,7 +5,7 @@ import { getUserPreferences } from "@/lib/db"
 
 const appUrl =
   process.env.NEXT_PUBLIC_URL ||
-  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3000")
+  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
 const normalizedAppUrl = appUrl.replace(/\/$/, "")
 
 const currency = (process.env.STRIPE_DEFAULT_CURRENCY || "eur").toLowerCase()
diff --git a/frontend/app/api/newsletter/subscribe/route.ts b/frontend/app/api/newsletter/subscribe/route.ts
index a5f511f..b97e08d 100644
--- a/frontend/app/api/newsletter/subscribe/route.ts
+++ b/frontend/app/api/newsletter/subscribe/route.ts
@@ -1,14 +1,27 @@
 import { type NextRequest, NextResponse } from "next/server"
 import { addNewsletterSubscriber } from "@/lib/db"
+import { resolveClientIp } from "@/lib/request-metadata"
+import { checkRateLimit, validateEmail } from "@/lib/security"
 
 export async function POST(request: NextRequest) {
   try {
+    const ip = resolveClientIp(request) ?? "unknown"
+    if (!checkRateLimit(`newsletter:${ip}`, 3, 60000)) {
+      return NextResponse.json({ error: "Too many requests. Please try again later." }, { status: 429 })
+    }
+
     const { email, name } = await request.json()
     if (!email || typeof email !== "string") {
       return NextResponse.json({ error: "Valid email is required" }, { status: 400 })
     }
 
-    await addNewsletterSubscriber(email, typeof name === "string" ? name : null)
+    const trimmedEmail = email.trim().toLowerCase()
+    if (!validateEmail(trimmedEmail)) {
+      return NextResponse.json({ error: "Invalid email address" }, { status: 400 })
+    }
+
+    const sanitizedName = typeof name === "string" ? name.trim().slice(0, 200) : null
+    await addNewsletterSubscriber(trimmedEmail, sanitizedName)
     return NextResponse.json({ success: true })
   } catch (error) {
     console.error("[VectoBeat] Newsletter subscribe failed:", error)
diff --git a/frontend/app/api/preferences/route.ts b/frontend/app/api/preferences/route.ts
index bcd940b..5b688f5 100644
--- a/frontend/app/api/preferences/route.ts
+++ b/frontend/app/api/preferences/route.ts
@@ -1,5 +1,6 @@
 import { type NextRequest, NextResponse } from "next/server"
 import { getUserPreferences, updateUserPreferences } from "@/lib/db"
+import { verifyRequestForUser } from "@/lib/auth"
 
 export async function GET(request: NextRequest) {
   const discordId = request.nextUrl.searchParams.get("discordId")
@@ -7,6 +8,11 @@ export async function GET(request: NextRequest) {
     return NextResponse.json({ error: "discordId query param required" }, { status: 400 })
   }
 
+  const auth = await verifyRequestForUser(request, discordId)
+  if (!auth.valid) {
+    return NextResponse.json({ error: "unauthorized" }, { status: 401 })
+  }
+
   const prefs = await getUserPreferences(discordId)
   return NextResponse.json(prefs)
 }
@@ -19,6 +25,11 @@ export async function PUT(request: NextRequest) {
       return NextResponse.json({ error: "discordId is required" }, { status: 400 })
     }
 
+    const auth = await verifyRequestForUser(request, discordId)
+    if (!auth.valid) {
+      return NextResponse.json({ error: "unauthorized" }, { status: 401 })
+    }
+
     const allowedKeys = [
       "emailUpdates",
       "productUpdates",
diff --git a/frontend/app/api/security/scan/route.ts b/frontend/app/api/security/scan/route.ts
index d73e088..641e0af 100644
--- a/frontend/app/api/security/scan/route.ts
+++ b/frontend/app/api/security/scan/route.ts
@@ -2,6 +2,7 @@ import crypto from "crypto"
 import { TextDecoder } from "util"
 import { NextRequest, NextResponse } from "next/server"
 import { fileTypeFromBuffer } from "file-type"
+import { verifyRequestForUser } from "@/lib/auth"
 
 const MAX_ATTACHMENT_BYTES = 15 * 1024 * 1024 // 15MB cap
 const BLOCKED_MIME = new Set([
@@ -65,6 +66,14 @@ const extractTextPreview = (buffer: Buffer) => {
 }
 
 export async function POST(request: NextRequest) {
+  const discordId = request.nextUrl.searchParams.get("discordId")
+  if (discordId) {
+    const auth = await verifyRequestForUser(request, discordId)
+    if (!auth.valid) {
+      return NextResponse.json({ error: "unauthorized" }, { status: 401 })
+    }
+  }
+
   const form = await request.formData()
   const file = form.get("file")
   const fileName = form.get("name")?.toString() ?? "upload.bin"
diff --git a/frontend/app/api/stripe/portal/route.ts b/frontend/app/api/stripe/portal/route.ts
index 544e52f..47fe1b3 100644
--- a/frontend/app/api/stripe/portal/route.ts
+++ b/frontend/app/api/stripe/portal/route.ts
@@ -6,7 +6,7 @@ import { verifyRequestForUser } from "@/lib/auth"
 
 const appUrl =
     process.env.NEXT_PUBLIC_URL ||
-    (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3000")
+    (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
 const normalizedAppUrl = appUrl.replace(/\/$/, "")
 
 export async function POST(request: NextRequest) {
diff --git a/frontend/app/api/upload/route.ts b/frontend/app/api/upload/route.ts
index 5033c48..13d0df9 100644
--- a/frontend/app/api/upload/route.ts
+++ b/frontend/app/api/upload/route.ts
@@ -2,9 +2,28 @@ import { NextRequest, NextResponse } from 'next/server';
 import { writeFile, mkdir } from 'fs/promises';
 import path from 'path';
 import { v4 as uuidv4 } from 'uuid';
+import { verifyRequestForUser } from '@/lib/auth';
+import { getUserRole } from '@/lib/db';
+
+const ALLOWED_EXTENSIONS = new Set(['.jpg', '.jpeg', '.png', '.webp', '.gif']);
 
 export async function POST(request: NextRequest) {
   try {
+    const discordId = request.nextUrl.searchParams.get('discordId');
+    if (!discordId) {
+      return NextResponse.json({ error: 'discordId is required' }, { status: 400 });
+    }
+
+    const auth = await verifyRequestForUser(request, discordId);
+    if (!auth.valid) {
+      return NextResponse.json({ error: 'Unauthorized' }, { status: 401 });
+    }
+
+    const role = await getUserRole(discordId);
+    if (!['admin', 'operator'].includes(role)) {
+      return NextResponse.json({ error: 'Insufficient permissions' }, { status: 403 });
+    }
+
     const formData = await request.formData();
     const file = formData.get('file') as File;
     
@@ -12,33 +31,31 @@ export async function POST(request: NextRequest) {
       return NextResponse.json({ error: 'Keine Datei hochgeladen' }, { status: 400 });
     }
 
-    // Validiere Dateityp
     const allowedTypes = ['image/jpeg', 'image/png', 'image/webp', 'image/gif'];
     if (!allowedTypes.includes(file.type)) {
       return NextResponse.json({ error: 'Nur Bilder sind erlaubt' }, { status: 400 });
     }
 
-    // Validiere Dateigröße (max 5MB)
-    const maxSize = 5 * 1024 * 1024; // 5MB
+    const maxSize = 5 * 1024 * 1024;
     if (file.size > maxSize) {
       return NextResponse.json({ error: 'Datei zu groß (max 5MB)' }, { status: 400 });
     }
 
-    // Erstelle Upload-Verzeichnis
+    const fileExtension = path.extname(file.name).toLowerCase();
+    if (!ALLOWED_EXTENSIONS.has(fileExtension)) {
+      return NextResponse.json({ error: 'Nicht erlaubte Dateiendung' }, { status: 400 });
+    }
+
     const uploadDir = path.join(process.cwd(), 'public', 'uploads', 'blog');
     await mkdir(uploadDir, { recursive: true });
 
-    // Generiere eindeutigen Dateinamen
-    const fileExtension = path.extname(file.name);
     const fileName = `${uuidv4()}${fileExtension}`;
     const filePath = path.join(uploadDir, fileName);
 
-    // Konvertiere File zu Buffer und speichere
     const bytes = await file.arrayBuffer();
     const buffer = Buffer.from(bytes);
     await writeFile(filePath, buffer);
 
-    // Gebe die relative URL zurück
     const imageUrl = `/uploads/blog/${fileName}`;
     
     return NextResponse.json({ 
diff --git a/frontend/app/blog/page.tsx b/frontend/app/blog/page.tsx
index 0440485..172e8cb 100644
--- a/frontend/app/blog/page.tsx
+++ b/frontend/app/blog/page.tsx
@@ -40,7 +40,7 @@ const getBaseUrl = (runtimeOrigin?: string | null) => {
     process.env.NEXT_PUBLIC_URL,
     process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : null,
     runtimeOrigin,
-    "http://localhost:3000",
+    "http://localhost:3050",
   ].filter(Boolean) as string[]
 
   for (const candidate of candidates) {
diff --git a/frontend/app/layout.tsx b/frontend/app/layout.tsx
index 19530fe..e1767ad 100644
--- a/frontend/app/layout.tsx
+++ b/frontend/app/layout.tsx
@@ -84,7 +84,7 @@ export default async function RootLayout({
         <meta httpEquiv="X-UA-Compatible" content="IE=edge" />
         <meta
           httpEquiv="Content-Security-Policy"
-          content="default-src 'self'; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline'; img-src 'self' data: https:; font-src 'self' data:; connect-src 'self' https://discord.com https://api.stripe.com;"
+          content="default-src 'self'; script-src 'self' 'unsafe-inline' https://js.stripe.com https://m.stripe.network; style-src 'self' 'unsafe-inline'; img-src 'self' data: https:; font-src 'self' data:; connect-src 'self' https://discord.com https://api.stripe.com https://checkout.stripe.com https://m.stripe.network; frame-src 'self' https://js.stripe.com https://checkout.stripe.com; worker-src 'self' blob:;"
         />
         <meta name="referrer" content="strict-origin-when-cross-origin" />
       </head>
diff --git a/frontend/app/profile/[slug]/profile-utils.ts b/frontend/app/profile/[slug]/profile-utils.ts
index b056f69..6ebc76e 100644
--- a/frontend/app/profile/[slug]/profile-utils.ts
+++ b/frontend/app/profile/[slug]/profile-utils.ts
@@ -41,7 +41,7 @@ export type ProfileFetchResult = PublicProfile | { restricted: true } | null
 const resolveBaseUrl = () =>
   (
     process.env.NEXT_PUBLIC_URL ||
-    (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3000")
+    (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
   ).replace(/\/$/, "")
 
 export const fetchPublicProfile = async (slug: string): Promise<ProfileFetchResult> => {
diff --git a/frontend/app/stats/page.tsx b/frontend/app/stats/page.tsx
index 376e054..34db5ad 100644
--- a/frontend/app/stats/page.tsx
+++ b/frontend/app/stats/page.tsx
@@ -7,7 +7,7 @@ import { type AnalyticsOverview } from "@/lib/metrics"
 import { apiClient } from "@/lib/api-client"
 
 const getInternalBaseUrl = () =>
-  process.env.NEXT_PUBLIC_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3000")
+  process.env.NEXT_PUBLIC_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
 
 const fetchAnalyticsData = async (): Promise<AnalyticsOverview | null> => {
   try {
diff --git a/frontend/lib/config.ts b/frontend/lib/config.ts
index d1900f3..84fbb4b 100644
--- a/frontend/lib/config.ts
+++ b/frontend/lib/config.ts
@@ -1,13 +1,13 @@
 const FALLBACK_DISCORD_CLIENT_ID = "1435859299028172901"
 const FALLBACK_DISCORD_INVITE = "https://discord.com/developers/applications"
-const DISCORD_BOT_PERMISSIONS = "8"
+const DISCORD_BOT_PERMISSIONS = "36768832"
 const DISCORD_LOGIN_SCOPES = "identify%20guilds%20email"
 export const DISCORD_LOGIN_SCOPE_STRING = "identify guilds email"
 const DISCORD_BOT_SCOPE = `${DISCORD_LOGIN_SCOPES}%20bot%20applications.commands`
 
 const appUrl =
   process.env.NEXT_PUBLIC_URL ||
-  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3000")
+  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
 const normalizedAppUrl = appUrl.replace(/\/$/, "")
 const redirectUri = `${normalizedAppUrl}/api/auth/discord/callback`
 export const DEFAULT_DISCORD_REDIRECT_URI = redirectUri
diff --git a/frontend/lib/email-notifications.ts b/frontend/lib/email-notifications.ts
index 3ec648b..a9e72d9 100644
--- a/frontend/lib/email-notifications.ts
+++ b/frontend/lib/email-notifications.ts
@@ -4,7 +4,7 @@ import { listNewsletterSubscribers } from "@/lib/db"
 
 const appUrl =
   process.env.NEXT_PUBLIC_URL ||
-  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3000")
+  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
 const normalizedAppUrl = appUrl.replace(/\/$/, "")
 
 export const sendWelcomeEmail = async ({
diff --git a/frontend/lib/email-templates.ts b/frontend/lib/email-templates.ts
index 7bd6e9d..51e3667 100644
--- a/frontend/lib/email-templates.ts
+++ b/frontend/lib/email-templates.ts
@@ -22,7 +22,7 @@ interface EmailTemplateOptions {
 
 const appUrl =
   process.env.NEXT_PUBLIC_URL ||
-  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3000")
+  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
 const normalizedAppUrl = appUrl.replace(/\/$/, "")
 
 export const renderMarkdownEmail = ({ title, intro, markdown, footer }: EmailTemplateOptions) => {
diff --git a/frontend/lib/fetch-home-metrics.ts b/frontend/lib/fetch-home-metrics.ts
index 28a3892..aadf489 100644
--- a/frontend/lib/fetch-home-metrics.ts
+++ b/frontend/lib/fetch-home-metrics.ts
@@ -19,7 +19,7 @@ export const fetchHomeMetrics = async (): Promise<HomeMetrics | null> => {
         process.env.PORT ? `http://127.0.0.1:${process.env.PORT}` : null,
         process.env.PORT ? `http://localhost:${process.env.PORT}` : null,
         "http://127.0.0.1:3000",
-        "http://localhost:3000",
+        "http://localhost:3050",
       ].filter((value): value is string => typeof value === "string" && value.length > 0),
     ),
   ).map((url) => url.replace(/\/$/, ""))
diff --git a/frontend/lib/security.ts b/frontend/lib/security.ts
index 7da7db6..216f563 100644
--- a/frontend/lib/security.ts
+++ b/frontend/lib/security.ts
@@ -75,17 +75,19 @@ export const getSecurityHeaders = () => {
   }
 }
 
-// Password Hashing (for future auth)
+// Password Hashing (OWASP-recommended PBKDF2 parameters)
 export const hashPassword = async (password: string): Promise<string> => {
-  const salt = crypto.randomBytes(16).toString("hex")
-  const hash = crypto.pbkdf2Sync(password, salt, 10000, 64, "sha256").toString("hex")
+  const salt = crypto.randomBytes(32).toString("hex")
+  const hash = crypto.pbkdf2Sync(password, salt, 310000, 64, "sha512").toString("hex")
   return `${salt}:${hash}`
 }
 
-export const verifyPassword = async (password: string, hash: string): Promise<boolean> => {
-  const [salt, originalHash] = hash.split(":")
-  const newHash = crypto.pbkdf2Sync(password, salt, 10000, 64, "sha256").toString("hex")
-  return newHash === originalHash
+export const verifyPassword = async (password: string, storedHash: string): Promise<boolean> => {
+  const [salt, originalHash] = storedHash.split(":")
+  if (!salt || !originalHash) return false
+  const newHash = crypto.pbkdf2Sync(password, salt, 310000, 64, "sha512").toString("hex")
+  if (newHash.length !== originalHash.length) return false
+  return crypto.timingSafeEqual(Buffer.from(newHash, "hex"), Buffer.from(originalHash, "hex"))
 }
 
 // Session Management
diff --git a/frontend/lib/server-settings-sync.ts b/frontend/lib/server-settings-sync.ts
index 512c36a..5c5d66e 100644
--- a/frontend/lib/server-settings-sync.ts
+++ b/frontend/lib/server-settings-sync.ts
@@ -5,7 +5,7 @@ import { apiClient } from "./api-client"
 import { logError } from "./utils/error-handling"
 
 const getInternalBaseUrl = () =>
-  process.env.NEXT_PUBLIC_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3000")
+  process.env.NEXT_PUBLIC_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
 
 const resolveBroadcastToken = async () => {
   const serverSettingsKey = await getApiKeySecret("server_settings", { includeEnv: false })
diff --git a/frontend/middleware.ts b/frontend/middleware.ts
new file mode 100644
index 0000000..08fcfb4
--- /dev/null
+++ b/frontend/middleware.ts
@@ -0,0 +1,81 @@
+import { NextRequest, NextResponse } from "next/server"
+
+const SECURITY_HEADERS: Record<string, string> = {
+  "X-Content-Type-Options": "nosniff",
+  "X-Frame-Options": "SAMEORIGIN",
+  "X-XSS-Protection": "1; mode=block",
+  "Referrer-Policy": "strict-origin-when-cross-origin",
+  "Permissions-Policy": "geolocation=(), microphone=(), camera=()",
+}
+
+const RATE_LIMIT_WINDOW_MS = 60_000
+const RATE_LIMIT_MAX = 60
+
+const rateLimitStore = new Map<string, { count: number; resetAt: number }>()
+
+let lastPurge = Date.now()
+
+const checkInMemoryRateLimit = (key: string): boolean => {
+  const now = Date.now()
+
+  if (now - lastPurge > RATE_LIMIT_WINDOW_MS * 2) {
+    for (const [k, v] of rateLimitStore) {
+      if (now > v.resetAt) rateLimitStore.delete(k)
+    }
+    lastPurge = now
+  }
+
+  const entry = rateLimitStore.get(key)
+  if (!entry || now > entry.resetAt) {
+    rateLimitStore.set(key, { count: 1, resetAt: now + RATE_LIMIT_WINDOW_MS })
+    return true
+  }
+  if (entry.count >= RATE_LIMIT_MAX) {
+    return false
+  }
+  entry.count++
+  return true
+}
+
+const RATE_LIMITED_PREFIXES = [
+  "/api/contact",
+  "/api/newsletter",
+  "/api/donate",
+  "/api/checkout",
+  "/api/auth",
+  "/api/upload",
+  "/api/support-tickets",
+]
+
+export function middleware(request: NextRequest) {
+  const { pathname } = request.nextUrl
+
+  const ip =
+    request.headers.get("x-forwarded-for")?.split(",")[0]?.trim() ||
+    request.headers.get("x-real-ip") ||
+    "unknown"
+
+  const isRateLimited = RATE_LIMITED_PREFIXES.some((prefix) => pathname.startsWith(prefix))
+  if (isRateLimited) {
+    const key = `mw:${ip}:${pathname.split("/").slice(0, 4).join("/")}`
+    if (!checkInMemoryRateLimit(key)) {
+      return NextResponse.json(
+        { error: "Too many requests. Please try again later." },
+        { status: 429 },
+      )
+    }
+  }
+
+  const response = NextResponse.next()
+  for (const [header, value] of Object.entries(SECURITY_HEADERS)) {
+    response.headers.set(header, value)
+  }
+
+  return response
+}
+
+export const config = {
+  matcher: [
+    "/((?!_next/static|_next/image|favicon.ico|logo.png|apple-icon.png|uploads/).*)",
+  ],
+}

From 8f809b8f60d111aaa445a6026952103f9b6d4ffa Mon Sep 17 00:00:00 2001
From: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Date: Thu, 30 Apr 2026 23:12:25 +0000
Subject: [PATCH 2/5] fix: merge middleware into proxy.ts (Next.js 16), fix
 HTML entity escaping in strings

- Merge security headers and rate limiting from middleware.ts into proxy.ts
  (Next.js 16 deprecated middleware in favor of proxy)
- Delete conflicting middleware.ts that caused startup errors
- Fix &rsquo; HTML entities in JS string literals (contact, about pages)
  which rendered as literal '&rsquo;' instead of apostrophe character

Co-Authored-By: GmBH <system.bot.discord.utility@gmail.com>
---
 frontend/app/about/page.tsx   |   2 +-
 frontend/app/contact/page.tsx |   6 +-
 frontend/middleware.ts        |  81 ---------------------------
 frontend/proxy.ts             | 102 ++++++++++++++++++++++++++--------
 4 files changed, 83 insertions(+), 108 deletions(-)
 delete mode 100644 frontend/middleware.ts

diff --git a/frontend/app/about/page.tsx b/frontend/app/about/page.tsx
index e338173..4cf4766 100644
--- a/frontend/app/about/page.tsx
+++ b/frontend/app/about/page.tsx
@@ -43,7 +43,7 @@ export default async function AboutPage() {
       icon: Shield,
       title: "Reliability & Security",
       description:
-        "End-to-end encrypted connections, no data logging, and full compliance with Discord&rsquo;s terms of service.",
+        "End-to-end encrypted connections, no data logging, and full compliance with Discord\u2019s terms of service.",
     },
     {
       icon: Code2,
diff --git a/frontend/app/contact/page.tsx b/frontend/app/contact/page.tsx
index 21c9c23..6c99402 100644
--- a/frontend/app/contact/page.tsx
+++ b/frontend/app/contact/page.tsx
@@ -55,7 +55,7 @@ export default function ContactPage() {
     {
       icon: Github,
       title: "GitHub Issues",
-      description: "Report bugs, suggest features, and contribute to VectoBeat&rsquo;s development",
+      description: "Report bugs, suggest features, and contribute to VectoBeat\u2019s development",
       link: "https://github.com/VectoDE/VectoBeat/issues",
       linkText: "Visit GitHub",
     },
@@ -402,7 +402,7 @@ export default function ContactPage() {
               {
                 title: "Search Before Asking",
                 content:
-                  "Before posting a question, check if it&rsquo;s already been answered in our documentation or FAQ sections.",
+                  "Before posting a question, check if it\u2019s already been answered in our documentation or FAQ sections.",
               },
               {
                 title: "Provide Context",
@@ -412,7 +412,7 @@ export default function ContactPage() {
               {
                 title: "Respect Privacy",
                 content:
-                  "Don&rsquo;t share personal information or server details publicly. Use private channels for sensitive discussions.",
+                  "Don\u2019t share personal information or server details publicly. Use private channels for sensitive discussions.",
               },
             ].map((guideline, i) => (
               <div key={i} className="p-6 rounded-lg border border-border/50 hover:border-primary/30 transition-colors">
diff --git a/frontend/middleware.ts b/frontend/middleware.ts
deleted file mode 100644
index 08fcfb4..0000000
--- a/frontend/middleware.ts
+++ /dev/null
@@ -1,81 +0,0 @@
-import { NextRequest, NextResponse } from "next/server"
-
-const SECURITY_HEADERS: Record<string, string> = {
-  "X-Content-Type-Options": "nosniff",
-  "X-Frame-Options": "SAMEORIGIN",
-  "X-XSS-Protection": "1; mode=block",
-  "Referrer-Policy": "strict-origin-when-cross-origin",
-  "Permissions-Policy": "geolocation=(), microphone=(), camera=()",
-}
-
-const RATE_LIMIT_WINDOW_MS = 60_000
-const RATE_LIMIT_MAX = 60
-
-const rateLimitStore = new Map<string, { count: number; resetAt: number }>()
-
-let lastPurge = Date.now()
-
-const checkInMemoryRateLimit = (key: string): boolean => {
-  const now = Date.now()
-
-  if (now - lastPurge > RATE_LIMIT_WINDOW_MS * 2) {
-    for (const [k, v] of rateLimitStore) {
-      if (now > v.resetAt) rateLimitStore.delete(k)
-    }
-    lastPurge = now
-  }
-
-  const entry = rateLimitStore.get(key)
-  if (!entry || now > entry.resetAt) {
-    rateLimitStore.set(key, { count: 1, resetAt: now + RATE_LIMIT_WINDOW_MS })
-    return true
-  }
-  if (entry.count >= RATE_LIMIT_MAX) {
-    return false
-  }
-  entry.count++
-  return true
-}
-
-const RATE_LIMITED_PREFIXES = [
-  "/api/contact",
-  "/api/newsletter",
-  "/api/donate",
-  "/api/checkout",
-  "/api/auth",
-  "/api/upload",
-  "/api/support-tickets",
-]
-
-export function middleware(request: NextRequest) {
-  const { pathname } = request.nextUrl
-
-  const ip =
-    request.headers.get("x-forwarded-for")?.split(",")[0]?.trim() ||
-    request.headers.get("x-real-ip") ||
-    "unknown"
-
-  const isRateLimited = RATE_LIMITED_PREFIXES.some((prefix) => pathname.startsWith(prefix))
-  if (isRateLimited) {
-    const key = `mw:${ip}:${pathname.split("/").slice(0, 4).join("/")}`
-    if (!checkInMemoryRateLimit(key)) {
-      return NextResponse.json(
-        { error: "Too many requests. Please try again later." },
-        { status: 429 },
-      )
-    }
-  }
-
-  const response = NextResponse.next()
-  for (const [header, value] of Object.entries(SECURITY_HEADERS)) {
-    response.headers.set(header, value)
-  }
-
-  return response
-}
-
-export const config = {
-  matcher: [
-    "/((?!_next/static|_next/image|favicon.ico|logo.png|apple-icon.png|uploads/).*)",
-  ],
-}
diff --git a/frontend/proxy.ts b/frontend/proxy.ts
index 06a5ff0..b65c33a 100644
--- a/frontend/proxy.ts
+++ b/frontend/proxy.ts
@@ -1,57 +1,115 @@
 import { NextResponse } from "next/server"
 import type { NextRequest } from "next/server"
 
+// --- Security Headers ---
+const SECURITY_HEADERS: Record<string, string> = {
+  "X-Content-Type-Options": "nosniff",
+  "X-Frame-Options": "SAMEORIGIN",
+  "X-XSS-Protection": "1; mode=block",
+  "Referrer-Policy": "strict-origin-when-cross-origin",
+  "Permissions-Policy": "geolocation=(), microphone=(), camera=()",
+}
+
 // --- Rate Limiter Logic ---
-// Simple in-memory rate limiter (per instance)
-// For distributed production, use Redis via @upstash/redis or similar HTTP-based client
-const RATE_LIMIT_WINDOW = 60 * 1000 // 1 minute
-const RATE_LIMIT_MAX = 100 // 100 requests per minute
+const RATE_LIMIT_WINDOW = 60_000
+const RATE_LIMIT_MAX_GLOBAL = 100
+const RATE_LIMIT_MAX_SENSITIVE = 60
+
 const ipRequests = new Map<string, { count: number; expiresAt: number }>()
+const sensitiveRateLimitStore = new Map<string, { count: number; resetAt: number }>()
 
-// Clean up expired entries periodically
-setInterval(() => {
+let lastPurge = Date.now()
+
+const purgeStaleSensitiveEntries = () => {
   const now = Date.now()
-  for (const [ip, data] of ipRequests.entries()) {
-    if (now > data.expiresAt) {
-      ipRequests.delete(ip)
+  if (now - lastPurge > RATE_LIMIT_WINDOW * 2) {
+    for (const [k, v] of sensitiveRateLimitStore) {
+      if (now > v.resetAt) sensitiveRateLimitStore.delete(k)
     }
+    lastPurge = now
+  }
+}
+
+const SENSITIVE_PREFIXES = [
+  "/api/contact",
+  "/api/newsletter",
+  "/api/donate",
+  "/api/checkout",
+  "/api/auth",
+  "/api/upload",
+  "/api/support-tickets",
+]
+
+const checkSensitiveRateLimit = (key: string): boolean => {
+  purgeStaleSensitiveEntries()
+  const now = Date.now()
+  const entry = sensitiveRateLimitStore.get(key)
+  if (!entry || now > entry.resetAt) {
+    sensitiveRateLimitStore.set(key, { count: 1, resetAt: now + RATE_LIMIT_WINDOW })
+    return true
+  }
+  if (entry.count >= RATE_LIMIT_MAX_SENSITIVE) {
+    return false
   }
-}, 60 * 1000)
+  entry.count++
+  return true
+}
 
 // --- Cookie Logic Constants ---
 const ONE_YEAR = 60 * 60 * 24 * 365
 
 export async function proxy(request: NextRequest) {
   const { pathname } = request.nextUrl
+  const ip =
+    request.headers.get("x-forwarded-for")?.split(",")[0]?.trim() ||
+    request.headers.get("x-real-ip") ||
+    "127.0.0.1"
 
-  // 1. Rate Limiter (applies to /api routes)
-  if (pathname.startsWith('/api')) {
-    const ip = request.headers.get("x-forwarded-for") || "127.0.0.1"
+  // 1. Global rate limiter (applies to /api routes)
+  if (pathname.startsWith("/api")) {
     const now = Date.now()
 
-    // Clean expired for this IP immediately
     const record = ipRequests.get(ip)
     if (record && now > record.expiresAt) {
       ipRequests.delete(ip)
     }
 
     const current = ipRequests.get(ip) || { count: 0, expiresAt: now + RATE_LIMIT_WINDOW }
-    
-    if (current.count >= RATE_LIMIT_MAX) {
-      return new NextResponse("Too Many Requests", { status: 429 })
+
+    if (current.count >= RATE_LIMIT_MAX_GLOBAL) {
+      return new NextResponse(
+        JSON.stringify({ error: "Too many requests. Please try again later." }),
+        { status: 429, headers: { "Content-Type": "application/json", ...SECURITY_HEADERS } },
+      )
     }
 
     ipRequests.set(ip, {
       count: current.count + 1,
-      expiresAt: current.expiresAt
+      expiresAt: current.expiresAt,
     })
   }
 
-  // 2. Cookie Logic (applies to non-api routes)
-  // Preserving original behavior: proxy.ts excluded 'api'
+  // 2. Stricter rate limiting on sensitive endpoints
+  const isSensitive = SENSITIVE_PREFIXES.some((prefix) => pathname.startsWith(prefix))
+  if (isSensitive) {
+    const key = `sensitive:${ip}:${pathname.split("/").slice(0, 4).join("/")}`
+    if (!checkSensitiveRateLimit(key)) {
+      return new NextResponse(
+        JSON.stringify({ error: "Too many requests. Please try again later." }),
+        { status: 429, headers: { "Content-Type": "application/json", ...SECURITY_HEADERS } },
+      )
+    }
+  }
+
+  // 3. Build response with security headers
   const response = NextResponse.next()
 
-  if (!pathname.startsWith('/api')) {
+  for (const [header, value] of Object.entries(SECURITY_HEADERS)) {
+    response.headers.set(header, value)
+  }
+
+  // 4. Cookie logic (applies to non-api routes)
+  if (!pathname.startsWith("/api")) {
     const existing = request.cookies.get("lang")?.value
 
     if (!existing) {
@@ -68,7 +126,5 @@ export async function proxy(request: NextRequest) {
 }
 
 export const config = {
-  // Match everything except _next, static files, and favicon
-  // This covers both API routes (for rate limiting) and pages (for cookies)
   matcher: ["/((?!_next|static|favicon.ico).*)"],
 }

From 1df7232103b269d3876c49b906d6910b203093c3 Mon Sep 17 00:00:00 2001
From: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Date: Thu, 30 Apr 2026 23:21:20 +0000
Subject: [PATCH 3/5] refactor: modularize codebase, fix display errors, harden
 plugin auth
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Extract shared utilities to dedicated modules:
  - lib/constants.ts: SECURITY_HEADERS, rate limit config, sensitive prefixes
  - lib/discord-auth.ts: PKCE utilities, cookie management, state encoding
  - lib/auth.ts: resolveDiscordId, checkAdmin (was duplicated in 5 admin routes)
  - lib/config.ts: getInternalBaseUrl (was duplicated in 6 files)
  - lib/security.ts: sanitizeField, unified security headers from constants

- Fix display errors:
  - Telemetry status: 'Offline' → 'Cached' (more accurate when websocket unavailable)
  - Connecting state: yellow indicator instead of error red
  - Error state: neutral gray instead of alarming red

- Harden plugin system:
  - Add authentication to plugin install/uninstall route (was unauthenticated)
  - Input sanitization on plugin install parameters

- Deduplicate UI components:
  - control-panel/plugins/page.tsx now imports shared PluginMarketplace component
    instead of duplicating 192 lines of identical code

Co-Authored-By: GmBH <system.bot.discord.utility@gmail.com>
---
 frontend/app/account/page.tsx                 |   4 +-
 .../admin/compliance/export-requests/route.ts |  22 +-
 frontend/app/api/admin/enterprise/route.ts    |  22 +-
 frontend/app/api/admin/federation/route.ts    |  22 +-
 .../app/api/admin/metrics/health/route.ts     |  22 +-
 frontend/app/api/admin/plugins/route.ts       |  22 +-
 .../app/api/auth/discord/callback/route.ts    |  96 ++-------
 frontend/app/api/auth/discord/login/route.ts  |  55 +----
 frontend/app/api/contact/route.ts             |  15 +-
 .../app/api/discord/interactions/route.ts     |   6 +-
 frontend/app/api/plugins/install/route.ts     |  98 +++++----
 frontend/app/control-panel/plugins/page.tsx   | 189 +-----------------
 frontend/app/stats/page.tsx                   |   4 +-
 frontend/components/home-metrics.tsx          |   4 +-
 frontend/components/stats-control-panel.tsx   |   6 +-
 frontend/lib/auth.ts                          |  24 +++
 frontend/lib/config.ts                        |   7 +-
 frontend/lib/constants.ts                     |  21 ++
 frontend/lib/discord-auth.ts                  |  88 ++++++++
 frontend/lib/security.ts                      |  31 +--
 frontend/lib/server-settings-sync.ts          |   4 +-
 frontend/proxy.ts                             |  36 +---
 22 files changed, 272 insertions(+), 526 deletions(-)
 create mode 100644 frontend/lib/constants.ts
 create mode 100644 frontend/lib/discord-auth.ts

diff --git a/frontend/app/account/page.tsx b/frontend/app/account/page.tsx
index ca32bc9..1894b6c 100644
--- a/frontend/app/account/page.tsx
+++ b/frontend/app/account/page.tsx
@@ -34,7 +34,7 @@ import {
   SiYoutube,
 } from "react-icons/si"
 import { FaMicrosoft } from "react-icons/fa"
-import { buildDiscordLoginUrl } from "@/lib/config"
+import { buildDiscordLoginUrl, getInternalBaseUrl } from "@/lib/config"
 import { RoleBadge } from "@/components/role-badge"
 import { logError } from "@/lib/utils/error-handling"
 
@@ -390,7 +390,7 @@ const [subscriptionPreview, setSubscriptionPreview] = useState<AccountSubscripti
   const profileShareBase =
     typeof window !== "undefined"
       ? window.location.origin
-      : process.env.NEXT_PUBLIC_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
+      : getInternalBaseUrl()
 const profileShareUrl = profileShareSlug
     ? `${profileShareBase.replace(/\/$/, "")}/profile/${profileShareSlug}`
     : ""
diff --git a/frontend/app/api/admin/compliance/export-requests/route.ts b/frontend/app/api/admin/compliance/export-requests/route.ts
index 6564c7b..c5ae14d 100644
--- a/frontend/app/api/admin/compliance/export-requests/route.ts
+++ b/frontend/app/api/admin/compliance/export-requests/route.ts
@@ -1,24 +1,6 @@
 import { NextResponse, type NextRequest } from "next/server"
-import { cookies } from "next/headers"
-import { verifyRequestForUser } from "@/lib/auth"
-import { getPrismaClient, getUserRole } from "@/lib/db"
-
-const checkAdmin = async (req: NextRequest) => {
-    const cookieStore = await cookies()
-    const discordId =
-        cookieStore.get("discord_user_id")?.value ||
-        cookieStore.get("discord_id")?.value ||
-        cookieStore.get("discordId")?.value ||
-        req.nextUrl.searchParams.get("discordId")
-
-    if (!discordId) return false
-
-    const verification = await verifyRequestForUser(req, discordId)
-    if (!verification.valid) return false
-
-    const role = await getUserRole(discordId)
-    return role === "admin" || role === "operator"
-}
+import { checkAdmin } from "@/lib/auth"
+import { getPrismaClient } from "@/lib/db"
 
 export async function GET(req: NextRequest) {
     if (!await checkAdmin(req)) {
diff --git a/frontend/app/api/admin/enterprise/route.ts b/frontend/app/api/admin/enterprise/route.ts
index dfc4345..7a266e8 100644
--- a/frontend/app/api/admin/enterprise/route.ts
+++ b/frontend/app/api/admin/enterprise/route.ts
@@ -1,24 +1,6 @@
 import { NextResponse, type NextRequest } from "next/server"
-import { cookies } from "next/headers"
-import { verifyRequestForUser } from "@/lib/auth"
-import { getPrismaClient, getUserRole } from "@/lib/db"
-
-const checkAdmin = async (req: NextRequest) => {
-    const cookieStore = await cookies()
-    const discordId =
-        cookieStore.get("discord_user_id")?.value ||
-        cookieStore.get("discord_id")?.value ||
-        cookieStore.get("discordId")?.value ||
-        req.nextUrl.searchParams.get("discordId")
-
-    if (!discordId) return false
-
-    const verification = await verifyRequestForUser(req, discordId)
-    if (!verification.valid) return false
-
-    const role = await getUserRole(discordId)
-    return role === "admin" || role === "operator"
-}
+import { checkAdmin } from "@/lib/auth"
+import { getPrismaClient } from "@/lib/db"
 
 export async function GET(req: NextRequest) {
     if (!await checkAdmin(req)) {
diff --git a/frontend/app/api/admin/federation/route.ts b/frontend/app/api/admin/federation/route.ts
index 04a19af..2a2e318 100644
--- a/frontend/app/api/admin/federation/route.ts
+++ b/frontend/app/api/admin/federation/route.ts
@@ -1,24 +1,6 @@
 import { NextResponse, type NextRequest } from "next/server"
-import { cookies } from "next/headers"
-import { verifyRequestForUser } from "@/lib/auth"
-import { getPrismaClient, getUserRole } from "@/lib/db"
-
-const checkAdmin = async (req: NextRequest) => {
-    const cookieStore = await cookies()
-    const discordId =
-        cookieStore.get("discord_user_id")?.value ||
-        cookieStore.get("discord_id")?.value ||
-        cookieStore.get("discordId")?.value ||
-        req.nextUrl.searchParams.get("discordId")
-
-    if (!discordId) return false
-
-    const verification = await verifyRequestForUser(req, discordId)
-    if (!verification.valid) return false
-
-    const role = await getUserRole(discordId)
-    return role === "admin" || role === "operator"
-}
+import { checkAdmin } from "@/lib/auth"
+import { getPrismaClient } from "@/lib/db"
 
 export async function GET(req: NextRequest) {
     if (!await checkAdmin(req)) {
diff --git a/frontend/app/api/admin/metrics/health/route.ts b/frontend/app/api/admin/metrics/health/route.ts
index 9de7cf3..b86b926 100644
--- a/frontend/app/api/admin/metrics/health/route.ts
+++ b/frontend/app/api/admin/metrics/health/route.ts
@@ -1,24 +1,6 @@
 import { NextResponse, type NextRequest } from "next/server"
-import { cookies } from "next/headers"
-import { verifyRequestForUser } from "@/lib/auth"
-import { getPrismaClient, getUserRole } from "@/lib/db"
-
-const checkAdmin = async (req: NextRequest) => {
-    const cookieStore = await cookies()
-    const discordId =
-        cookieStore.get("discord_user_id")?.value ||
-        cookieStore.get("discord_id")?.value ||
-        cookieStore.get("discordId")?.value ||
-        req.nextUrl.searchParams.get("discordId")
-
-    if (!discordId) return false
-
-    const verification = await verifyRequestForUser(req, discordId)
-    if (!verification.valid) return false
-
-    const role = await getUserRole(discordId)
-    return role === "admin" || role === "operator"
-}
+import { checkAdmin } from "@/lib/auth"
+import { getPrismaClient } from "@/lib/db"
 
 export async function GET(req: NextRequest) {
     if (!await checkAdmin(req)) {
diff --git a/frontend/app/api/admin/plugins/route.ts b/frontend/app/api/admin/plugins/route.ts
index 5d6bdd0..b6d15c7 100644
--- a/frontend/app/api/admin/plugins/route.ts
+++ b/frontend/app/api/admin/plugins/route.ts
@@ -1,24 +1,6 @@
 import { NextResponse, type NextRequest } from "next/server"
-import { cookies } from "next/headers"
-import { verifyRequestForUser } from "@/lib/auth"
-import { getPrismaClient, getUserRole } from "@/lib/db"
-
-const checkAdmin = async (req: NextRequest) => {
-  const cookieStore = await cookies()
-  const discordId = 
-    cookieStore.get("discord_user_id")?.value ||
-    cookieStore.get("discord_id")?.value ||
-    cookieStore.get("discordId")?.value ||
-    req.nextUrl.searchParams.get("discordId")
-
-  if (!discordId) return false
-
-  const verification = await verifyRequestForUser(req, discordId)
-  if (!verification.valid) return false
-  
-  const role = await getUserRole(discordId)
-  return role === "admin" || role === "operator"
-}
+import { checkAdmin } from "@/lib/auth"
+import { getPrismaClient } from "@/lib/db"
 
 export async function GET(req: NextRequest) {
   if (!await checkAdmin(req)) {
diff --git a/frontend/app/api/auth/discord/callback/route.ts b/frontend/app/api/auth/discord/callback/route.ts
index cec854a..e4e0f52 100644
--- a/frontend/app/api/auth/discord/callback/route.ts
+++ b/frontend/app/api/auth/discord/callback/route.ts
@@ -1,77 +1,17 @@
 import { type NextRequest, NextResponse } from "next/server"
-import { DEFAULT_DISCORD_REDIRECT_URI, DISCORD_CLIENT_ID, DISCORD_LOGIN_SCOPE_STRING } from "@/lib/config"
+import { DISCORD_CLIENT_ID, DISCORD_LOGIN_SCOPE_STRING } from "@/lib/config"
 import { getUserSecurity, persistUserProfile, recordLoginSession } from "@/lib/db"
 import { resolveClientLocation } from "@/lib/request-metadata"
 import { hashSessionToken } from "@/lib/session"
 import { apiClient } from "@/lib/api-client"
-
-const CODE_VERIFIER_COOKIE = "discord_pkce_verifier"
-const REDIRECT_COOKIE = "discord_pkce_redirect"
-
-type EncodedStatePayload = {
-  v?: string
-  r?: string
-  u?: string
-}
-
-const clearPkceCookie = (response: NextResponse) => {
-  response.cookies.set(CODE_VERIFIER_COOKIE, "", {
-    httpOnly: true,
-    secure: process.env.NODE_ENV === "production",
-    sameSite: "lax",
-    maxAge: 0,
-    path: "/",
-  })
-  response.cookies.set(REDIRECT_COOKIE, "", {
-    httpOnly: true,
-    secure: process.env.NODE_ENV === "production",
-    sameSite: "lax",
-    maxAge: 0,
-    path: "/",
-  })
-}
-
-const base64UrlDecode = (value: string) => {
-  const normalized = value.replace(/-/g, "+").replace(/_/g, "/")
-  const padding = normalized.length % 4 === 0 ? "" : "=".repeat(4 - (normalized.length % 4))
-  return Buffer.from(normalized + padding, "base64").toString("utf-8")
-}
-
-const decodeStatePayload = (value: string | null): EncodedStatePayload | null => {
-  if (!value) {
-    return null
-  }
-  try {
-    const json = base64UrlDecode(value)
-    const parsed = JSON.parse(json)
-    if (parsed && typeof parsed === "object") {
-      return parsed as EncodedStatePayload
-    }
-  } catch {
-    return null
-  }
-  return null
-}
-
-const resolvePreferredOrigin = (request: NextRequest) => {
-  const envOrigin =
-    process.env.NEXT_PUBLIC_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "")
-  const candidates = [
-    envOrigin,
-    request.nextUrl.origin,
-    DEFAULT_DISCORD_REDIRECT_URI.replace(/\/api\/auth\/discord\/callback$/, ""),
-  ]
-  for (const candidate of candidates) {
-    if (!candidate) continue
-    try {
-      const normalized = new URL(candidate.replace(/\/$/, ""))
-      return normalized.origin
-    } catch {
-      continue
-    }
-  }
-  return request.nextUrl.origin
-}
+import {
+  CODE_VERIFIER_COOKIE,
+  REDIRECT_COOKIE,
+  clearPkceCookies,
+  decodeStatePayload,
+  resolvePreferredOrigin,
+  sanitizeRedirectUri,
+} from "@/lib/discord-auth"
 
 const resolveStateRedirect = (
   request: NextRequest,
@@ -140,17 +80,7 @@ const resolveStateRedirect = (
   return null
 }
 
-const sanitizeRedirect = (value: string | null | undefined, fallback: string) => {
-  if (!value) {
-    return fallback
-  }
-  try {
-    const parsed = new URL(value)
-    return parsed.toString().replace(/\/$/, "")
-  } catch {
-    return fallback
-  }
-}
+
 
 export async function GET(request: NextRequest) {
   const searchParams = request.nextUrl.searchParams
@@ -160,7 +90,7 @@ export async function GET(request: NextRequest) {
 
   if (!code) {
     const response = NextResponse.redirect(new URL("/?error=no_code", request.url))
-    clearPkceCookie(response)
+    clearPkceCookies(response)
     return response
   }
 
@@ -168,7 +98,7 @@ export async function GET(request: NextRequest) {
     const fallbackOrigin = resolvePreferredOrigin(request)
     const fallbackRedirect = `${fallbackOrigin.replace(/\/$/, "")}/api/auth/discord/callback`
     const redirectCookie = request.cookies.get(REDIRECT_COOKIE)?.value
-    const redirectTarget = sanitizeRedirect(decodedState?.r || redirectCookie, fallbackRedirect)
+    const redirectTarget = sanitizeRedirectUri(decodedState?.r || redirectCookie || null, fallbackRedirect)
     const pkceVerifier =
       decodedState?.v ?? request.cookies.get(CODE_VERIFIER_COOKIE)?.value ?? null
 
@@ -286,7 +216,7 @@ export async function GET(request: NextRequest) {
       maxAge: 60 * 60 * 24 * 7,
     })
 
-    clearPkceCookie(response)
+    clearPkceCookies(response)
     return response
   } catch (error) {
     console.error("Discord OAuth error:", error)
diff --git a/frontend/app/api/auth/discord/login/route.ts b/frontend/app/api/auth/discord/login/route.ts
index 67fd40d..0abac80 100644
--- a/frontend/app/api/auth/discord/login/route.ts
+++ b/frontend/app/api/auth/discord/login/route.ts
@@ -1,49 +1,14 @@
-import crypto from "crypto"
 import { type NextRequest, NextResponse } from "next/server"
-import { DEFAULT_DISCORD_REDIRECT_URI, DISCORD_CLIENT_ID, DISCORD_LOGIN_SCOPE_STRING } from "@/lib/config"
-
-const CODE_VERIFIER_COOKIE = "discord_pkce_verifier"
-const REDIRECT_COOKIE = "discord_pkce_redirect"
-
-const base64UrlEncode = (input: Buffer) => {
-  return input.toString("base64url")
-}
-
-const generateCodeVerifier = () => base64UrlEncode(crypto.randomBytes(64))
-const generateCodeChallenge = (verifier: string) => base64UrlEncode(crypto.createHash("sha256").update(verifier).digest())
-
-const sanitizeRedirectUri = (value: string | null, fallback: string) => {
-  if (!value) {
-    return fallback
-  }
-  try {
-    // Validate URL structure; Discord requires absolute URIs.
-    const parsed = new URL(value)
-    return parsed.toString().replace(/\/$/, "")
-  } catch {
-    return fallback
-  }
-}
-
-const encodeState = (payload: Record<string, string>) => {
-  const json = JSON.stringify(payload)
-  return base64UrlEncode(Buffer.from(json, "utf-8"))
-}
-
-const resolvePreferredOrigin = (request: NextRequest) => {
-  const envOrigin = process.env.NEXT_PUBLIC_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "")
-  const candidates = [envOrigin, request.nextUrl.origin, DEFAULT_DISCORD_REDIRECT_URI.replace(/\/api\/auth\/discord\/callback$/, "")]
-  for (const candidate of candidates) {
-    if (!candidate) continue
-    try {
-      const normalized = new URL(candidate.replace(/\/$/, ""))
-      return normalized.origin
-    } catch {
-      continue
-    }
-  }
-  return request.nextUrl.origin
-}
+import { DISCORD_CLIENT_ID, DISCORD_LOGIN_SCOPE_STRING } from "@/lib/config"
+import {
+  CODE_VERIFIER_COOKIE,
+  REDIRECT_COOKIE,
+  generateCodeVerifier,
+  generateCodeChallenge,
+  encodeState,
+  resolvePreferredOrigin,
+  sanitizeRedirectUri,
+} from "@/lib/discord-auth"
 
 export async function GET(request: NextRequest) {
   if (!DISCORD_CLIENT_ID) {
diff --git a/frontend/app/api/contact/route.ts b/frontend/app/api/contact/route.ts
index 2cd0f9d..99ca355 100644
--- a/frontend/app/api/contact/route.ts
+++ b/frontend/app/api/contact/route.ts
@@ -1,21 +1,10 @@
 import { type NextRequest, NextResponse } from "next/server"
 import { createContactMessage } from "@/lib/db"
 import { resolveClientIp } from "@/lib/request-metadata"
-import { checkRateLimit } from "@/lib/security"
+import { checkRateLimit, sanitizeField, validateEmail } from "@/lib/security"
 
-const MAX_FIELD_LENGTH = 1000
 const MAX_MESSAGE_LENGTH = 5000
 
-const sanitizeField = (value: unknown, maxLen = MAX_FIELD_LENGTH): string => {
-  if (typeof value !== "string") return ""
-  return value.trim().slice(0, maxLen)
-}
-
-const isValidEmail = (email: string): boolean => {
-  if (email.length > 254) return false
-  return /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)
-}
-
 export async function POST(request: NextRequest) {
   try {
     const ip = resolveClientIp(request) ?? "unknown"
@@ -36,7 +25,7 @@ export async function POST(request: NextRequest) {
       return NextResponse.json({ error: "Name, email, topic, priority, and message are required" }, { status: 400 })
     }
 
-    if (!isValidEmail(email)) {
+    if (!validateEmail(email)) {
       return NextResponse.json({ error: "Invalid email address" }, { status: 400 })
     }
 
diff --git a/frontend/app/api/discord/interactions/route.ts b/frontend/app/api/discord/interactions/route.ts
index 7531cbc..f5a29ce 100644
--- a/frontend/app/api/discord/interactions/route.ts
+++ b/frontend/app/api/discord/interactions/route.ts
@@ -1,6 +1,6 @@
 import { createPublicKey, verify as verifySignature } from "crypto"
 import { NextRequest, NextResponse } from "next/server"
-import { buildDiscordLoginUrl } from "@/lib/config"
+import { buildDiscordLoginUrl, getInternalBaseUrl } from "@/lib/config"
 
 export const runtime = "nodejs"
 
@@ -11,9 +11,7 @@ const PUBLIC_KEY_HEX =
     process.env.NEXT_PUBLIC_DISCORD_PUBLIC_KEY ||
     "").trim()
 const PUBLIC_KEY_VALID = /^[a-fA-F0-9]{64}$/.test(PUBLIC_KEY_HEX)
-const SITE_ORIGIN =
-  (process.env.NEXT_PUBLIC_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "")) ||
-  "https://vectobeat.uplytech.de"
+const SITE_ORIGIN = getInternalBaseUrl() || "https://vectobeat.uplytech.de"
 
 let cachedDiscordKey: ReturnType<typeof createPublicKey> | null = null
 
diff --git a/frontend/app/api/plugins/install/route.ts b/frontend/app/api/plugins/install/route.ts
index 162a7db..6333901 100644
--- a/frontend/app/api/plugins/install/route.ts
+++ b/frontend/app/api/plugins/install/route.ts
@@ -1,64 +1,76 @@
-import { NextResponse } from "next/server"
+import { NextRequest, NextResponse } from "next/server"
+import { resolveDiscordId, verifyRequestForUser } from "@/lib/auth"
 import { getPrismaClient } from "@/lib/db"
+import { sanitizeField } from "@/lib/security"
 
-export async function POST(req: Request) {
+export async function POST(req: NextRequest) {
   try {
     const body = await req.json()
-    const { pluginId, guildId, action } = body
+    const pluginId = sanitizeField(body.pluginId, 100)
+    const guildId = sanitizeField(body.guildId, 100)
+    const action = sanitizeField(body.action, 20)
 
     if (!pluginId || !guildId || !action) {
-        return NextResponse.json({ error: "Missing required parameters" }, { status: 400 })
+      return NextResponse.json({ error: "Missing required parameters" }, { status: 400 })
+    }
+
+    if (action !== "install" && action !== "uninstall") {
+      return NextResponse.json({ error: "Invalid action" }, { status: 400 })
+    }
+
+    const discordId = await resolveDiscordId(req)
+    if (!discordId) {
+      return NextResponse.json({ error: "Authentication required" }, { status: 401 })
+    }
+
+    const auth = await verifyRequestForUser(req, discordId)
+    if (!auth.valid) {
+      return NextResponse.json({ error: "Unauthorized access" }, { status: 401 })
     }
 
     const prisma = getPrismaClient()
     if (!prisma) {
-        return NextResponse.json({ error: "Database not configured" }, { status: 500 })
+      return NextResponse.json({ error: "Database not configured" }, { status: 500 })
     }
 
     if (action === "install") {
-        // Check if plugin exists
-        const plugin = await prisma.plugin.findUnique({ where: { id: pluginId } })
-        if (!plugin) {
-            return NextResponse.json({ error: "Plugin not found" }, { status: 404 })
-        }
+      const plugin = await prisma.plugin.findUnique({ where: { id: pluginId } })
+      if (!plugin) {
+        return NextResponse.json({ error: "Plugin not found" }, { status: 404 })
+      }
 
-        // Upsert installation
-        const installation = await prisma.pluginInstallation.upsert({
-            where: {
-                pluginId_guildId: {
-                    pluginId,
-                    guildId
-                }
-            },
-            update: {
-                enabled: true
-            },
-            create: {
-                pluginId,
-                guildId,
-                enabled: true
-            }
-        })
+      const installation = await prisma.pluginInstallation.upsert({
+        where: {
+          pluginId_guildId: {
+            pluginId,
+            guildId,
+          },
+        },
+        update: {
+          enabled: true,
+        },
+        create: {
+          pluginId,
+          guildId,
+          enabled: true,
+        },
+      })
 
-        // Increment download count
-        await prisma.plugin.update({
-            where: { id: pluginId },
-            data: { downloads: { increment: 1 } }
-        })
+      await prisma.plugin.update({
+        where: { id: pluginId },
+        data: { downloads: { increment: 1 } },
+      })
 
-        return NextResponse.json(installation)
-    } else if (action === "uninstall") {
-        await prisma.pluginInstallation.deleteMany({
-            where: {
-                pluginId,
-                guildId
-            }
-        })
-        return NextResponse.json({ success: true })
+      return NextResponse.json(installation)
     } else {
-        return NextResponse.json({ error: "Invalid action" }, { status: 400 })
+      await prisma.pluginInstallation.deleteMany({
+        where: {
+          pluginId,
+          guildId,
+        },
+      })
+      return NextResponse.json({ success: true })
     }
-
   } catch (error) {
     console.error("Plugin Install Error:", error)
     return NextResponse.json({ error: "Internal Server Error" }, { status: 500 })
diff --git a/frontend/app/control-panel/plugins/page.tsx b/frontend/app/control-panel/plugins/page.tsx
index 5f51e39..c69d141 100644
--- a/frontend/app/control-panel/plugins/page.tsx
+++ b/frontend/app/control-panel/plugins/page.tsx
@@ -1,192 +1,25 @@
 "use client"
 
-import { Button } from "@/components/ui/button"
-import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle } from "@/components/ui/card"
-import { Input } from "@/components/ui/input"
-import { Badge } from "@/components/ui/badge"
-import { Search, Download, Star, ShieldCheck, Loader2, Trash2 } from "lucide-react"
-import { useEffect, useState, Suspense } from "react"
+import { Suspense } from "react"
 import { useSearchParams } from "next/navigation"
-import { apiClient } from "@/lib/api-client"
-
-interface Plugin {
-  id: string
-  name: string
-  description: string | null
-  version: string
-  author: string
-  downloads: number
-  rating: number
-  verified: boolean
-  price: string
-  installed?: boolean
-}
+import { PluginMarketplace } from "@/components/plugin-marketplace"
+import { Loader2 } from "lucide-react"
 
 function PluginMarketplaceContent() {
   const searchParams = useSearchParams()
-  const guildId = searchParams?.get("guild")
-  const [plugins, setPlugins] = useState<Plugin[]>([])
-  const [loading, setLoading] = useState(true)
-  const [processing, setProcessing] = useState<string | null>(null)
-  const [search, setSearch] = useState("")
-
-  useEffect(() => {
-    const url = guildId ? `/api/plugins?guildId=${guildId}` : "/api/plugins"
-    apiClient<Plugin[]>(url)
-      .then((data) => {
-        setPlugins(data)
-      })
-      .catch((err) => {
-        console.error(err)
-      })
-      .finally(() => setLoading(false))
-  }, [guildId])
-
-  const handleAction = async (pluginId: string, action: "install" | "uninstall") => {
-    if (!guildId) {
-        alert("Please select a server first.")
-        return
-    }
-    setProcessing(pluginId)
-    try {
-      await apiClient<any>("/api/plugins/install", {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
-        body: JSON.stringify({ pluginId, guildId, action })
-      })
-      
-      // Update local state
-      setPlugins(prev => prev.map(p => 
-        p.id === pluginId 
-            ? { ...p, installed: action === "install" } 
-            : p
-      ))
-      
-      // alert(`Plugin ${action}ed successfully`)
-    } catch (error) {
-      console.error(error)
-       alert(`Error ${action}ing plugin`)
-    } finally {
-      setProcessing(null)
-    }
-  }
-
-  const filteredPlugins = plugins.filter(p => 
-    p.name.toLowerCase().includes(search.toLowerCase()) || 
-    p.description?.toLowerCase().includes(search.toLowerCase())
-  )
+  const guildId = searchParams?.get("guild") ?? null
 
   return (
     <div className="container mx-auto py-10 px-4">
-      <div className="flex flex-col md:flex-row justify-between items-start md:items-center mb-8 gap-4">
-        <div>
-          <h1 className="text-3xl font-bold tracking-tight">Plugin Marketplace</h1>
-          <p className="text-muted-foreground mt-1">
-            Extend VectoBeat with community and official plugins.
-            {guildId && <span className="ml-2 bg-primary/10 text-primary px-2 py-0.5 rounded text-xs">Server Selected</span>}
-          </p>
-        </div>
-        <div className="relative w-full md:w-72">
-          <Search className="absolute left-3 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" />
-          <Input 
-            placeholder="Search plugins..." 
-            className="pl-9" 
-            value={search}
-            onChange={(e) => setSearch(e.target.value)}
-          />
-        </div>
-      </div>
-
-      {!guildId && (
-        <div className="bg-yellow-500/10 border border-yellow-500/20 text-yellow-500 p-4 rounded-lg mb-6">
-            Please select a server in the Control Panel to install plugins.
-        </div>
-      )}
-
-      {loading ? (
-        <div className="flex justify-center py-20">
-          <Loader2 className="h-8 w-8 animate-spin text-muted-foreground" />
-        </div>
-      ) : (
-        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
-          {filteredPlugins.map((plugin) => (
-            <Card key={plugin.id} className="flex flex-col">
-              <CardHeader>
-                <div className="flex justify-between items-start">
-                  <div className="space-y-1">
-                    <CardTitle className="text-xl">{plugin.name}</CardTitle>
-                    <div className="flex items-center gap-2 text-sm text-muted-foreground">
-                      <span>v{plugin.version}</span>
-                      <span>by {plugin.author}</span>
-                    </div>
-                  </div>
-                  {plugin.verified && (
-                    <Badge variant="secondary" className="bg-blue-500/10 text-blue-500 hover:bg-blue-500/20">
-                      <ShieldCheck className="h-3 w-3 mr-1" /> Verified
-                    </Badge>
-                  )}
-                </div>
-              </CardHeader>
-              <CardContent className="flex-1">
-                <p className="text-sm text-muted-foreground mb-4">
-                  {plugin.description || "No description available."}
-                </p>
-                <div className="flex items-center gap-4 text-sm text-muted-foreground">
-                    <div className="flex items-center">
-                        <Download className="h-4 w-4 mr-1" />
-                        {plugin.downloads}
-                    </div>
-                    <div className="flex items-center">
-                        <Star className="h-4 w-4 mr-1 fill-yellow-500 text-yellow-500" />
-                        {plugin.rating}
-                    </div>
-                    <div className="font-medium text-foreground">
-                        {plugin.price}
-                    </div>
-                </div>
-              </CardContent>
-              <CardFooter>
-                {plugin.installed ? (
-                    <Button 
-                        variant="outline" 
-                        className="w-full border-red-500/20 hover:bg-red-500/10 hover:text-red-500"
-                        disabled={!!processing || !guildId}
-                        onClick={() => handleAction(plugin.id, "uninstall")}
-                    >
-                        {processing === plugin.id ? (
-                            <Loader2 className="h-4 w-4 animate-spin mr-2" />
-                        ) : (
-                            <Trash2 className="h-4 w-4 mr-2" />
-                        )}
-                        Uninstall
-                    </Button>
-                ) : (
-                    <Button 
-                        className="w-full"
-                        disabled={!!processing || !guildId}
-                        onClick={() => handleAction(plugin.id, "install")}
-                    >
-                        {processing === plugin.id ? (
-                            <Loader2 className="h-4 w-4 animate-spin mr-2" />
-                        ) : (
-                            <Download className="h-4 w-4 mr-2" />
-                        )}
-                        Install
-                    </Button>
-                )}
-              </CardFooter>
-            </Card>
-          ))}
-        </div>
-      )}
+      <PluginMarketplace guildId={guildId} />
     </div>
   )
 }
 
-export default function PluginMarketplace() {
-    return (
-        <Suspense fallback={<div className="flex justify-center py-20"><Loader2 className="h-8 w-8 animate-spin" /></div>}>
-            <PluginMarketplaceContent />
-        </Suspense>
-    )
+export default function PluginMarketplacePage() {
+  return (
+    <Suspense fallback={<div className="flex justify-center py-20"><Loader2 className="h-8 w-8 animate-spin" /></div>}>
+      <PluginMarketplaceContent />
+    </Suspense>
+  )
 }
diff --git a/frontend/app/stats/page.tsx b/frontend/app/stats/page.tsx
index 34db5ad..c14544b 100644
--- a/frontend/app/stats/page.tsx
+++ b/frontend/app/stats/page.tsx
@@ -5,9 +5,7 @@ import Footer from "@/components/footer"
 import { StatsControlPanel } from "@/components/stats-control-panel"
 import { type AnalyticsOverview } from "@/lib/metrics"
 import { apiClient } from "@/lib/api-client"
-
-const getInternalBaseUrl = () =>
-  process.env.NEXT_PUBLIC_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
+import { getInternalBaseUrl } from "@/lib/config"
 
 const fetchAnalyticsData = async (): Promise<AnalyticsOverview | null> => {
   try {
diff --git a/frontend/components/home-metrics.tsx b/frontend/components/home-metrics.tsx
index abaa104..3d08990 100644
--- a/frontend/components/home-metrics.tsx
+++ b/frontend/components/home-metrics.tsx
@@ -138,7 +138,7 @@ export function HomeMetricsPanel({ initialMetrics, copy, statsCopy }: HomeMetric
     status: copy?.status ?? "Status",
     live: copy?.live ?? "Live",
     connecting: copy?.connecting ?? "Connecting...",
-    offline: copy?.offline ?? "Telemetry Offline",
+    offline: copy?.offline ?? "Cached",
     updated: copy?.updated ?? "Last Sync",
   }
 
@@ -242,7 +242,7 @@ export function HomeMetricsPanel({ initialMetrics, copy, statsCopy }: HomeMetric
           <h2 className="text-2xl font-semibold">{labels.title}</h2>
           <p className="text-xs text-foreground/60" suppressHydrationWarning>
             {labels.status}:{" "}
-            <span className={state === "connected" ? "text-primary" : state === "connecting" ? "text-yellow-400" : "text-red-400"}>
+            <span className={state === "connected" ? "text-primary" : state === "connecting" ? "text-yellow-400" : "text-foreground/60"}>
               {state === "connected" ? labels.live : state === "connecting" ? labels.connecting : labels.offline}
             </span>{" "}
             - {labels.updated} {updatedLabel}
diff --git a/frontend/components/stats-control-panel.tsx b/frontend/components/stats-control-panel.tsx
index a260e2e..a1b239f 100644
--- a/frontend/components/stats-control-panel.tsx
+++ b/frontend/components/stats-control-panel.tsx
@@ -190,12 +190,12 @@ export function StatsControlPanel({ initialData }: StatsControlPanelProps) {
           </p>
           <p className="text-sm text-foreground/50 mt-6 animate-fade-in-up animation-delay-400">
             Last updated {lastUpdated} · Status{" "}
-            <span className={connectionState === "connected" ? "text-primary" : "text-red-400"}>
+            <span className={connectionState === "connected" ? "text-primary" : connectionState === "connecting" ? "text-yellow-400" : "text-foreground/60"}>
               {connectionState === "connected"
                 ? "Streaming live metrics"
                 : connectionState === "connecting"
-                  ? "Connecting..."
-                  : "Offline"}
+                  ? "Connecting\u2026"
+                  : "Cached"}
             </span>
           </p>
         </div>
diff --git a/frontend/lib/auth.ts b/frontend/lib/auth.ts
index f23aebd..5fc1395 100644
--- a/frontend/lib/auth.ts
+++ b/frontend/lib/auth.ts
@@ -1,8 +1,32 @@
 import { NextRequest } from "next/server"
+import { cookies } from "next/headers"
 import { validateSessionHash, getStoredUserProfile, verifyUserApiKey, type StoredUserProfile } from "./db"
 import { hashSessionToken } from "./session"
 import { resolveClientIp, resolveClientLocation } from "./request-metadata"
 
+export const resolveDiscordId = async (request: NextRequest): Promise<string | null> => {
+  const cookieStore = await cookies()
+  return (
+    cookieStore.get("discord_user_id")?.value ||
+    cookieStore.get("discord_id")?.value ||
+    cookieStore.get("discordId")?.value ||
+    request.nextUrl.searchParams.get("discordId") ||
+    null
+  )
+}
+
+export const checkAdmin = async (request: NextRequest): Promise<boolean> => {
+  const discordId = await resolveDiscordId(request)
+  if (!discordId) return false
+
+  const { getUserRole } = await import("./db")
+  const verification = await verifyRequestForUser(request, discordId)
+  if (!verification.valid) return false
+
+  const role = await getUserRole(discordId)
+  return role === "admin" || role === "operator"
+}
+
 export const authBypassEnabled = () => {
   return (
     process.env.DISABLE_API_AUTH === "1" ||
diff --git a/frontend/lib/config.ts b/frontend/lib/config.ts
index 84fbb4b..88288b5 100644
--- a/frontend/lib/config.ts
+++ b/frontend/lib/config.ts
@@ -5,9 +5,10 @@ const DISCORD_LOGIN_SCOPES = "identify%20guilds%20email"
 export const DISCORD_LOGIN_SCOPE_STRING = "identify guilds email"
 const DISCORD_BOT_SCOPE = `${DISCORD_LOGIN_SCOPES}%20bot%20applications.commands`
 
-const appUrl =
-  process.env.NEXT_PUBLIC_URL ||
-  (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
+export const getInternalBaseUrl = () =>
+  process.env.NEXT_PUBLIC_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
+
+const appUrl = getInternalBaseUrl()
 const normalizedAppUrl = appUrl.replace(/\/$/, "")
 const redirectUri = `${normalizedAppUrl}/api/auth/discord/callback`
 export const DEFAULT_DISCORD_REDIRECT_URI = redirectUri
diff --git a/frontend/lib/constants.ts b/frontend/lib/constants.ts
new file mode 100644
index 0000000..cde0c55
--- /dev/null
+++ b/frontend/lib/constants.ts
@@ -0,0 +1,21 @@
+export const SECURITY_HEADERS: Record<string, string> = {
+  "X-Content-Type-Options": "nosniff",
+  "X-Frame-Options": "SAMEORIGIN",
+  "X-XSS-Protection": "1; mode=block",
+  "Referrer-Policy": "strict-origin-when-cross-origin",
+  "Permissions-Policy": "geolocation=(), microphone=(), camera=()",
+}
+
+export const RATE_LIMIT_WINDOW = 60_000
+export const RATE_LIMIT_MAX_GLOBAL = 100
+export const RATE_LIMIT_MAX_SENSITIVE = 60
+
+export const SENSITIVE_PREFIXES = [
+  "/api/contact",
+  "/api/newsletter",
+  "/api/donate",
+  "/api/checkout",
+  "/api/auth",
+  "/api/upload",
+  "/api/support-tickets",
+]
diff --git a/frontend/lib/discord-auth.ts b/frontend/lib/discord-auth.ts
new file mode 100644
index 0000000..2fa88b1
--- /dev/null
+++ b/frontend/lib/discord-auth.ts
@@ -0,0 +1,88 @@
+import crypto from "crypto"
+import { type NextRequest, NextResponse } from "next/server"
+import { DEFAULT_DISCORD_REDIRECT_URI, getInternalBaseUrl } from "./config"
+
+export const CODE_VERIFIER_COOKIE = "discord_pkce_verifier"
+export const REDIRECT_COOKIE = "discord_pkce_redirect"
+
+export type EncodedStatePayload = {
+  v?: string
+  r?: string
+  u?: string
+}
+
+export const base64UrlEncode = (input: Buffer) => input.toString("base64url")
+
+export const base64UrlDecode = (value: string) => {
+  const normalized = value.replace(/-/g, "+").replace(/_/g, "/")
+  const padding = normalized.length % 4 === 0 ? "" : "=".repeat(4 - (normalized.length % 4))
+  return Buffer.from(normalized + padding, "base64").toString("utf-8")
+}
+
+export const generateCodeVerifier = () => base64UrlEncode(crypto.randomBytes(64))
+
+export const generateCodeChallenge = (verifier: string) =>
+  base64UrlEncode(crypto.createHash("sha256").update(verifier).digest())
+
+export const encodeState = (payload: Record<string, string>) => {
+  const json = JSON.stringify(payload)
+  return base64UrlEncode(Buffer.from(json, "utf-8"))
+}
+
+export const decodeStatePayload = (value: string | null): EncodedStatePayload | null => {
+  if (!value) return null
+  try {
+    const json = base64UrlDecode(value)
+    const parsed = JSON.parse(json)
+    if (parsed && typeof parsed === "object") return parsed as EncodedStatePayload
+  } catch {
+    return null
+  }
+  return null
+}
+
+export const resolvePreferredOrigin = (request: NextRequest) => {
+  const envOrigin = getInternalBaseUrl()
+  const candidates = [
+    envOrigin,
+    request.nextUrl.origin,
+    DEFAULT_DISCORD_REDIRECT_URI.replace(/\/api\/auth\/discord\/callback$/, ""),
+  ]
+  for (const candidate of candidates) {
+    if (!candidate) continue
+    try {
+      const normalized = new URL(candidate.replace(/\/$/, ""))
+      return normalized.origin
+    } catch {
+      continue
+    }
+  }
+  return request.nextUrl.origin
+}
+
+export const sanitizeRedirectUri = (value: string | null, fallback: string) => {
+  if (!value) return fallback
+  try {
+    const parsed = new URL(value)
+    return parsed.toString().replace(/\/$/, "")
+  } catch {
+    return fallback
+  }
+}
+
+export const clearPkceCookies = (response: NextResponse) => {
+  response.cookies.set(CODE_VERIFIER_COOKIE, "", {
+    httpOnly: true,
+    secure: process.env.NODE_ENV === "production",
+    sameSite: "lax",
+    maxAge: 0,
+    path: "/",
+  })
+  response.cookies.set(REDIRECT_COOKIE, "", {
+    httpOnly: true,
+    secure: process.env.NODE_ENV === "production",
+    sameSite: "lax",
+    maxAge: 0,
+    path: "/",
+  })
+}
diff --git a/frontend/lib/security.ts b/frontend/lib/security.ts
index 216f563..f84b17e 100644
--- a/frontend/lib/security.ts
+++ b/frontend/lib/security.ts
@@ -6,6 +6,8 @@
  */
 
 import crypto from "crypto"
+import { SECURITY_HEADERS } from "./constants"
+export { SECURITY_HEADERS }
 
 // CSRF Token Management
 export const generateCSRFToken = (): string => {
@@ -41,13 +43,18 @@ export const checkRateLimit = (identifier: string, maxRequests = 100, windowMs =
   return true
 }
 
-// Input Validation
+// Input Validation & Sanitization
 export const sanitizeInput = (input: string): string => {
   return input
-    .replace(/[<>]/g, "") // Remove angle brackets
-    .replace(/script/gi, "") // Remove script tags
+    .replace(/[<>]/g, "")
+    .replace(/script/gi, "")
     .trim()
-    .substring(0, 1000) // Limit length
+    .substring(0, 1000)
+}
+
+export const sanitizeField = (value: unknown, maxLen = 1000): string => {
+  if (typeof value !== "string") return ""
+  return value.trim().slice(0, maxLen)
 }
 
 export const validateEmail = (email: string): boolean => {
@@ -63,17 +70,11 @@ export const validateDiscordId = (id: string): boolean => {
 }
 
 // Security Headers
-export const getSecurityHeaders = () => {
-  return {
-    "X-Content-Type-Options": "nosniff",
-    "X-Frame-Options": "DENY",
-    "X-XSS-Protection": "1; mode=block",
-    "Referrer-Policy": "strict-origin-when-cross-origin",
-    "Permissions-Policy": "geolocation=(), microphone=(), camera=()",
-    "Content-Security-Policy":
-      "default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'",
-  }
-}
+export const getSecurityHeaders = () => ({
+  ...SECURITY_HEADERS,
+  "Content-Security-Policy":
+    "default-src 'self'; script-src 'self'; style-src 'self' 'unsafe-inline'",
+})
 
 // Password Hashing (OWASP-recommended PBKDF2 parameters)
 export const hashPassword = async (password: string): Promise<string> => {
diff --git a/frontend/lib/server-settings-sync.ts b/frontend/lib/server-settings-sync.ts
index 5c5d66e..30553a4 100644
--- a/frontend/lib/server-settings-sync.ts
+++ b/frontend/lib/server-settings-sync.ts
@@ -3,9 +3,7 @@ import type { ServerFeatureSettings } from "./server-settings"
 import { getApiKeySecret } from "./api-keys"
 import { apiClient } from "./api-client"
 import { logError } from "./utils/error-handling"
-
-const getInternalBaseUrl = () =>
-  process.env.NEXT_PUBLIC_URL || (process.env.VERCEL_URL ? `https://${process.env.VERCEL_URL}` : "http://localhost:3050")
+import { getInternalBaseUrl } from "./config"
 
 const resolveBroadcastToken = async () => {
   const serverSettingsKey = await getApiKeySecret("server_settings", { includeEnv: false })
diff --git a/frontend/proxy.ts b/frontend/proxy.ts
index b65c33a..9267840 100644
--- a/frontend/proxy.ts
+++ b/frontend/proxy.ts
@@ -1,19 +1,12 @@
 import { NextResponse } from "next/server"
 import type { NextRequest } from "next/server"
-
-// --- Security Headers ---
-const SECURITY_HEADERS: Record<string, string> = {
-  "X-Content-Type-Options": "nosniff",
-  "X-Frame-Options": "SAMEORIGIN",
-  "X-XSS-Protection": "1; mode=block",
-  "Referrer-Policy": "strict-origin-when-cross-origin",
-  "Permissions-Policy": "geolocation=(), microphone=(), camera=()",
-}
-
-// --- Rate Limiter Logic ---
-const RATE_LIMIT_WINDOW = 60_000
-const RATE_LIMIT_MAX_GLOBAL = 100
-const RATE_LIMIT_MAX_SENSITIVE = 60
+import {
+  SECURITY_HEADERS,
+  RATE_LIMIT_WINDOW,
+  RATE_LIMIT_MAX_GLOBAL,
+  RATE_LIMIT_MAX_SENSITIVE,
+  SENSITIVE_PREFIXES,
+} from "@/lib/constants"
 
 const ipRequests = new Map<string, { count: number; expiresAt: number }>()
 const sensitiveRateLimitStore = new Map<string, { count: number; resetAt: number }>()
@@ -30,16 +23,6 @@ const purgeStaleSensitiveEntries = () => {
   }
 }
 
-const SENSITIVE_PREFIXES = [
-  "/api/contact",
-  "/api/newsletter",
-  "/api/donate",
-  "/api/checkout",
-  "/api/auth",
-  "/api/upload",
-  "/api/support-tickets",
-]
-
 const checkSensitiveRateLimit = (key: string): boolean => {
   purgeStaleSensitiveEntries()
   const now = Date.now()
@@ -55,7 +38,6 @@ const checkSensitiveRateLimit = (key: string): boolean => {
   return true
 }
 
-// --- Cookie Logic Constants ---
 const ONE_YEAR = 60 * 60 * 24 * 365
 
 export async function proxy(request: NextRequest) {
@@ -65,7 +47,6 @@ export async function proxy(request: NextRequest) {
     request.headers.get("x-real-ip") ||
     "127.0.0.1"
 
-  // 1. Global rate limiter (applies to /api routes)
   if (pathname.startsWith("/api")) {
     const now = Date.now()
 
@@ -89,7 +70,6 @@ export async function proxy(request: NextRequest) {
     })
   }
 
-  // 2. Stricter rate limiting on sensitive endpoints
   const isSensitive = SENSITIVE_PREFIXES.some((prefix) => pathname.startsWith(prefix))
   if (isSensitive) {
     const key = `sensitive:${ip}:${pathname.split("/").slice(0, 4).join("/")}`
@@ -101,14 +81,12 @@ export async function proxy(request: NextRequest) {
     }
   }
 
-  // 3. Build response with security headers
   const response = NextResponse.next()
 
   for (const [header, value] of Object.entries(SECURITY_HEADERS)) {
     response.headers.set(header, value)
   }
 
-  // 4. Cookie logic (applies to non-api routes)
   if (!pathname.startsWith("/api")) {
     const existing = request.cookies.get("lang")?.value
 

From 4eac6783b53b7f8c167c2cc7e09c83098839e58b Mon Sep 17 00:00:00 2001
From: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Date: Fri, 1 May 2026 17:30:57 +0000
Subject: [PATCH 4/5] feat: modularize code, enhance AI auto-queue, improve
 bot-frontend sync

- Extract TIER_ORDER, hasProPlus, highestTier to lib/memberships.ts (eliminates duplication in 7 files)
- Add requireAuth helper to lib/auth.ts (consolidates discordId+verify pattern)
- Apply requireAuth to preferences, account/security, admin/env routes
- Enhance AI auto-queue with trend analysis, improvement suggestions, learning summary
- Add admin auth to auto-queue route (was missing)
- Bot: emit track_start events with previous track metadata for AI relationship learning
- New /api/bot/learning-status endpoint for bot-frontend AI sync
- Fix unused TIER_ORDER import in support-desk component

Co-Authored-By: GmBH <system.bot.discord.utility@gmail.com>
---
 bot/src/services/status_api_service.py        |  13 ++
 frontend/app/api/account/security/route.ts    |  15 +-
 frontend/app/api/admin/auto-queue/route.ts    |  36 +++-
 frontend/app/api/admin/env/route.ts           |  14 +-
 frontend/app/api/bot/learning-status/route.ts |  25 +++
 frontend/app/api/forum/kb/route.ts            |   4 +-
 frontend/app/api/forum/threads/route.ts       |   4 +-
 frontend/app/api/moderator/toolkit/route.ts   |  13 +-
 frontend/app/api/preferences/route.ts         |  15 +-
 .../app/api/support-tickets/[id]/route.ts     |   4 +-
 frontend/app/forum/utils.ts                   |   4 +-
 frontend/components/support-desk.tsx          |  13 +-
 frontend/lib/auth.ts                          |  23 ++-
 frontend/lib/auto-queue.ts                    | 181 +++++++++++++++++-
 frontend/lib/memberships.ts                   |  14 ++
 15 files changed, 306 insertions(+), 72 deletions(-)
 create mode 100644 frontend/app/api/bot/learning-status/route.ts

diff --git a/bot/src/services/status_api_service.py b/bot/src/services/status_api_service.py
index 1df0f6d..b660077 100644
--- a/bot/src/services/status_api_service.py
+++ b/bot/src/services/status_api_service.py
@@ -41,6 +41,7 @@ def __init__(self, bot: discord.Client, config: StatusAPIConfig) -> None:
         self._app: Optional[web.Application] = None
         self._cache: Dict[str, Any] = {"payload": None, "expires": 0.0}
         self._streams_total = 0
+        self._last_tracks: Dict[int, Dict[str, Any]] = {}
         self._lock = asyncio.Lock()
         self._command_events: deque[float] = deque()
         self._incident_events: deque[float] = deque()
@@ -158,7 +159,19 @@ async def on_track_start(self, event: TrackStartEvent) -> None:
         if guild_id is None:
             return
         track_payload = self._track_payload(getattr(event, "track", None))
+        previous_payload = self._last_tracks.get(guild_id)
         self.record_stream_event(guild_id=guild_id, track=track_payload)
+        if track_payload:
+            metadata = {**track_payload, "artist": track_payload.get("author", "")}
+            if previous_payload:
+                metadata["previous"] = {**previous_payload, "artist": previous_payload.get("author", "")}
+            self._queue_event({
+                "type": "track_start",
+                "guildId": str(guild_id),
+                "metadata": metadata,
+                "ts": int(time.time()),
+            })
+            self._last_tracks[guild_id] = track_payload
 
     # ------------------------------------------------------------------ request handlers
     async def _handle_status(self, request: web.Request) -> web.Response:
diff --git a/frontend/app/api/account/security/route.ts b/frontend/app/api/account/security/route.ts
index 6ca75bc..aaaaf2f 100644
--- a/frontend/app/api/account/security/route.ts
+++ b/frontend/app/api/account/security/route.ts
@@ -1,19 +1,12 @@
 import { type NextRequest, NextResponse } from "next/server"
 import { getUserSecurity, updateUserSecurity } from "@/lib/db"
-import { verifyRequestForUser } from "@/lib/auth"
+import { requireAuth, verifyRequestForUser } from "@/lib/auth"
 
 export async function GET(request: NextRequest) {
-  const discordId = request.nextUrl.searchParams.get("discordId")
-  if (!discordId) {
-    return NextResponse.json({ error: "discordId is required" }, { status: 400 })
-  }
-
-  const auth = await verifyRequestForUser(request, discordId)
-  if (!auth.valid) {
-    return NextResponse.json({ error: "unauthorized" }, { status: 401 })
-  }
+  const result = await requireAuth(request)
+  if (!result.ok) return result.response
 
-  const security = await getUserSecurity(discordId)
+  const security = await getUserSecurity(result.discordId)
   return NextResponse.json(security)
 }
 
diff --git a/frontend/app/api/admin/auto-queue/route.ts b/frontend/app/api/admin/auto-queue/route.ts
index b26e890..b6852c4 100644
--- a/frontend/app/api/admin/auto-queue/route.ts
+++ b/frontend/app/api/admin/auto-queue/route.ts
@@ -1,10 +1,19 @@
 import { type NextRequest, NextResponse } from "next/server"
-import { getAutoQueueStats, listLearningLogs } from "@/lib/auto-queue"
-
-// Note: In a real app, we'd use middleware or a helper to check for admin session.
-// For now, we'll assume the request is authorized if it reaches this admin-scoped route.
+import { checkAdmin } from "@/lib/auth"
+import {
+    getAutoQueueStats,
+    listLearningLogs,
+    analyzeTrends,
+    getImprovementSuggestions,
+    getLearningSummary,
+} from "@/lib/auto-queue"
 
 export async function GET(request: NextRequest) {
+    const isAdmin = await checkAdmin(request)
+    if (!isAdmin) {
+        return NextResponse.json({ error: "forbidden" }, { status: 403 })
+    }
+
     try {
         const searchParams = request.nextUrl.searchParams
         const action = searchParams.get("action")
@@ -20,7 +29,24 @@ export async function GET(request: NextRequest) {
             return NextResponse.json(logs)
         }
 
-        // Default: Return both
+        if (action === "trends") {
+            const guildId = searchParams.get("guildId")
+            const days = parseInt(searchParams.get("days") || "30", 10)
+            const trends = await analyzeTrends(guildId, days)
+            return NextResponse.json(trends)
+        }
+
+        if (action === "suggestions") {
+            const suggestions = await getImprovementSuggestions()
+            return NextResponse.json(suggestions)
+        }
+
+        if (action === "summary") {
+            const guildId = searchParams.get("guildId")
+            const summary = await getLearningSummary(guildId)
+            return NextResponse.json(summary)
+        }
+
         const [stats, logs] = await Promise.all([
             getAutoQueueStats(),
             listLearningLogs(20)
diff --git a/frontend/app/api/admin/env/route.ts b/frontend/app/api/admin/env/route.ts
index d8399e3..4927ae2 100644
--- a/frontend/app/api/admin/env/route.ts
+++ b/frontend/app/api/admin/env/route.ts
@@ -1,5 +1,5 @@
 import { NextRequest, NextResponse } from "next/server"
-import { verifyRequestForUser } from "@/lib/auth"
+import { requireAuth, verifyRequestForUser } from "@/lib/auth"
 import { getUserRole } from "@/lib/db"
 import fs from "fs/promises"
 import path from "path"
@@ -27,17 +27,11 @@ const writeEnvFile = async (target: "frontend" | "bot", entries: Record<string,
 }
 
 export async function GET(request: NextRequest) {
-  const discordId = request.nextUrl.searchParams.get("discordId")
+  const result = await requireAuth(request)
+  if (!result.ok) return result.response
+  const { discordId } = result
   const targetParam = request.nextUrl.searchParams.get("target")
   const target = targetParam === "bot" ? "bot" : "frontend"
-  if (!discordId) {
-    return NextResponse.json({ error: "discordId is required" }, { status: 400 })
-  }
-
-  const auth = await verifyRequestForUser(request, discordId)
-  if (!auth.valid) {
-    return NextResponse.json({ error: "unauthorized" }, { status: 401 })
-  }
 
   const role = await getUserRole(discordId)
   if (!["admin", "operator"].includes(role)) {
diff --git a/frontend/app/api/bot/learning-status/route.ts b/frontend/app/api/bot/learning-status/route.ts
new file mode 100644
index 0000000..ba6a39f
--- /dev/null
+++ b/frontend/app/api/bot/learning-status/route.ts
@@ -0,0 +1,25 @@
+import { type NextRequest, NextResponse } from "next/server"
+import { authorizeRequest } from "@/lib/api-auth"
+import { getApiKeySecrets } from "@/lib/api-keys"
+import { getLearningSummary } from "@/lib/auto-queue"
+
+const SECRET_TYPES = ["status_api", "queue_sync"]
+
+export async function GET(request: NextRequest) {
+    const secrets = await getApiKeySecrets(SECRET_TYPES, { includeEnv: true })
+
+    if (!authorizeRequest(request, secrets, { allowLocalhost: true })) {
+        return NextResponse.json({ error: "unauthorized" }, { status: 401 })
+    }
+
+    const { searchParams } = new URL(request.url)
+    const guildId = searchParams.get("guildId")
+
+    try {
+        const summary = await getLearningSummary(guildId)
+        return NextResponse.json({ success: true, ...summary })
+    } catch (error) {
+        console.error("[BotAPI] Failed to fetch learning status:", error)
+        return NextResponse.json({ error: "internal_error" }, { status: 500 })
+    }
+}
diff --git a/frontend/app/api/forum/kb/route.ts b/frontend/app/api/forum/kb/route.ts
index ca91a71..dd92065 100644
--- a/frontend/app/api/forum/kb/route.ts
+++ b/frontend/app/api/forum/kb/route.ts
@@ -1,9 +1,7 @@
 import { NextRequest, NextResponse } from "next/server"
 import { verifyRequestForUser } from "@/lib/auth"
 import { getUserSubscriptions, listSupportKnowledgeBase, getUserRole, type SubscriptionSummary } from "@/lib/db"
-import { normalizeTierId } from "@/lib/memberships"
-
-const hasProPlus = (tiers: string[]) => tiers.some((tier) => ["pro", "growth", "scale", "enterprise"].includes(tier))
+import { normalizeTierId, hasProPlus } from "@/lib/memberships"
 
 export async function GET(request: NextRequest) {
   const discordId = request.nextUrl.searchParams.get("discordId")
diff --git a/frontend/app/api/forum/threads/route.ts b/frontend/app/api/forum/threads/route.ts
index 66b0584..97516b8 100644
--- a/frontend/app/api/forum/threads/route.ts
+++ b/frontend/app/api/forum/threads/route.ts
@@ -10,9 +10,7 @@ import {
   updateForumThreadStatus,
   type SubscriptionSummary,
 } from "@/lib/db"
-import { normalizeTierId } from "@/lib/memberships"
-
-const hasProPlus = (tiers: string[]) => tiers.some((tier) => ["pro", "growth", "scale", "enterprise"].includes(tier))
+import { normalizeTierId, hasProPlus } from "@/lib/memberships"
 const MODERATOR_THREAD_STATUSES = ["open", "pinned", "archived", "locked", "resolved"]
 
 const parseBody = async (request: NextRequest) => {
diff --git a/frontend/app/api/moderator/toolkit/route.ts b/frontend/app/api/moderator/toolkit/route.ts
index e45cdc7..bf5e592 100644
--- a/frontend/app/api/moderator/toolkit/route.ts
+++ b/frontend/app/api/moderator/toolkit/route.ts
@@ -1,7 +1,7 @@
 import { NextRequest, NextResponse } from "next/server"
 import { verifyRequestForUser } from "@/lib/auth"
 import { getUserSubscriptions, type SubscriptionSummary } from "@/lib/db"
-import { normalizeTierId } from "@/lib/memberships"
+import { normalizeTierId, hasProPlus, highestTier } from "@/lib/memberships"
 
 const macros = [
   {
@@ -27,16 +27,7 @@ const badges = [
   { id: "moderator_lead", label: "Moderator Lead", description: "Active moderator with Pro+ guild access" },
 ]
 
-const hasProPlus = (tiers: string[]) => tiers.some((tier) => ["pro", "growth", "scale", "enterprise"].includes(tier))
-const highestTier = (tiers: string[]) => {
-  const order = ["free", "starter", "pro", "growth", "scale", "enterprise"]
-  let best = "free"
-  tiers.forEach((tier) => {
-    const idx = order.indexOf(tier)
-    if (idx > order.indexOf(best)) best = tier
-  })
-  return best
-}
+
 
 export async function GET(request: NextRequest) {
   const discordId = request.nextUrl.searchParams.get("discordId")
diff --git a/frontend/app/api/preferences/route.ts b/frontend/app/api/preferences/route.ts
index 5b688f5..903b120 100644
--- a/frontend/app/api/preferences/route.ts
+++ b/frontend/app/api/preferences/route.ts
@@ -1,19 +1,12 @@
 import { type NextRequest, NextResponse } from "next/server"
 import { getUserPreferences, updateUserPreferences } from "@/lib/db"
-import { verifyRequestForUser } from "@/lib/auth"
+import { requireAuth, verifyRequestForUser } from "@/lib/auth"
 
 export async function GET(request: NextRequest) {
-  const discordId = request.nextUrl.searchParams.get("discordId")
-  if (!discordId) {
-    return NextResponse.json({ error: "discordId query param required" }, { status: 400 })
-  }
-
-  const auth = await verifyRequestForUser(request, discordId)
-  if (!auth.valid) {
-    return NextResponse.json({ error: "unauthorized" }, { status: 401 })
-  }
+  const result = await requireAuth(request)
+  if (!result.ok) return result.response
 
-  const prefs = await getUserPreferences(discordId)
+  const prefs = await getUserPreferences(result.discordId)
   return NextResponse.json(prefs)
 }
 
diff --git a/frontend/app/api/support-tickets/[id]/route.ts b/frontend/app/api/support-tickets/[id]/route.ts
index 7c02846..0e5dd69 100644
--- a/frontend/app/api/support-tickets/[id]/route.ts
+++ b/frontend/app/api/support-tickets/[id]/route.ts
@@ -13,7 +13,7 @@ import {
 } from "@/lib/db"
 import { verifyRequestForUser } from "@/lib/auth"
 import { sendTicketEventEmail } from "@/lib/email-notifications"
-import { normalizeTierId } from "@/lib/memberships"
+import { normalizeTierId, TIER_ORDER } from "@/lib/memberships"
 
 export async function GET(
   request: NextRequest,
@@ -45,7 +45,7 @@ export async function GET(
     try {
       const subs = await getUserSubscriptions(requesterId)
       const activeStatuses = new Set(["active", "trialing", "pending"])
-      const tierOrder = ["free", "starter", "pro", "growth", "scale", "enterprise"]
+      const tierOrder = TIER_ORDER
       let best = "free"
       let bestServer: string | null = null
       for (const sub of subs as SubscriptionSummary[]) {
diff --git a/frontend/app/forum/utils.ts b/frontend/app/forum/utils.ts
index 9efd360..d868c52 100644
--- a/frontend/app/forum/utils.ts
+++ b/frontend/app/forum/utils.ts
@@ -1,9 +1,7 @@
 import { cookies } from "next/headers"
 
 import { getUserRole, getUserSubscriptions, type SubscriptionSummary } from "@/lib/db"
-import { normalizeTierId } from "@/lib/memberships"
-
-const hasProPlus = (tiers: string[]) => tiers.some((tier) => ["pro", "growth", "scale", "enterprise"].includes(tier))
+import { normalizeTierId, hasProPlus } from "@/lib/memberships"
 
 export type ForumViewerContext = {
   discordId: string | null
diff --git a/frontend/components/support-desk.tsx b/frontend/components/support-desk.tsx
index 473905c..9870289 100644
--- a/frontend/components/support-desk.tsx
+++ b/frontend/components/support-desk.tsx
@@ -4,6 +4,7 @@ import { useCallback, useEffect, useMemo, useRef, useState, type ChangeEvent } f
 import { buildDiscordLoginUrl } from "@/lib/config"
 import type { TicketDetail, TicketMessage } from "@/lib/types/support"
 import { apiClient } from "@/lib/api-client"
+import { highestTier } from "@/lib/memberships"
 
 type Ticket = {
   id: string
@@ -79,17 +80,7 @@ const formatFileSize = (size?: number) => {
 }
 
 const getAuthToken = () => (typeof window === "undefined" ? "" : localStorage.getItem("discord_token") ?? "")
-const TIER_ORDER = ["free", "starter", "pro", "growth", "scale", "enterprise"]
-const highestTier = (tiers: string[]) => {
-  let best = "free"
-  tiers.forEach((tier) => {
-    const idx = TIER_ORDER.indexOf(tier.toLowerCase())
-    if (idx > TIER_ORDER.indexOf(best)) {
-      best = tier.toLowerCase()
-    }
-  })
-  return best
-}
+
 
 const isImageType = (type?: string) => (type ? type.startsWith("image/") : false)
 const isVideoType = (type?: string) => (type ? type.startsWith("video/") : false)
diff --git a/frontend/lib/auth.ts b/frontend/lib/auth.ts
index 5fc1395..e83bd5a 100644
--- a/frontend/lib/auth.ts
+++ b/frontend/lib/auth.ts
@@ -1,4 +1,4 @@
-import { NextRequest } from "next/server"
+import { NextRequest, NextResponse } from "next/server"
 import { cookies } from "next/headers"
 import { validateSessionHash, getStoredUserProfile, verifyUserApiKey, type StoredUserProfile } from "./db"
 import { hashSessionToken } from "./session"
@@ -95,3 +95,24 @@ export const verifyRequestForUser = async (
     user: profile,
   }
 }
+
+type AuthSuccess = {
+  discordId: string
+  auth: Awaited<ReturnType<typeof verifyRequestForUser>>
+}
+
+type AuthResult =
+  | { ok: true; discordId: string; auth: AuthSuccess["auth"] }
+  | { ok: false; response: NextResponse }
+
+export const requireAuth = async (request: NextRequest): Promise<AuthResult> => {
+  const discordId = await resolveDiscordId(request)
+  if (!discordId) {
+    return { ok: false, response: NextResponse.json({ error: "discordId required" }, { status: 400 }) }
+  }
+  const auth = await verifyRequestForUser(request, discordId)
+  if (!auth.valid) {
+    return { ok: false, response: NextResponse.json({ error: "unauthorized" }, { status: 401 }) }
+  }
+  return { ok: true, discordId, auth }
+}
diff --git a/frontend/lib/auto-queue.ts b/frontend/lib/auto-queue.ts
index 598a99a..c9aa5b6 100644
--- a/frontend/lib/auto-queue.ts
+++ b/frontend/lib/auto-queue.ts
@@ -1,5 +1,4 @@
 import { getPrismaClient, handlePrismaError } from "./prisma"
-import type { Prisma } from "@prisma/client"
 
 export type TrackMetadata = {
     title: string
@@ -242,3 +241,183 @@ export async function getAutoQueueStats() {
         return null
     }
 }
+
+export type TrendEntry = { period: string; count: number }
+export type ArtistTrend = { artist: string; count: number; genres: string[] }
+export type Suggestion = { type: string; priority: "high" | "medium" | "low"; message: string; data?: Record<string, unknown> }
+
+/**
+ * Analyzes learning trends: genre shifts, top artists, and activity patterns.
+ */
+export async function analyzeTrends(guildId?: string | null, days = 30) {
+    const prisma = getPrismaClient()
+    if (!prisma) return null
+
+    const since = new Date(Date.now() - days * 24 * 60 * 60 * 1000)
+
+    try {
+        const recentLogs = await prisma.musicLearningLog.findMany({
+            where: {
+                createdAt: { gte: since },
+                ...(guildId ? { guildId } : {}),
+            },
+            orderBy: { createdAt: "desc" },
+            take: 500,
+        })
+
+        const dailyCounts = new Map<string, number>()
+        for (const log of recentLogs) {
+            const day = log.createdAt.toISOString().slice(0, 10)
+            dailyCounts.set(day, (dailyCounts.get(day) || 0) + 1)
+        }
+        const activityTrend: TrendEntry[] = Array.from(dailyCounts.entries())
+            .sort(([a], [b]) => a.localeCompare(b))
+            .map(([period, count]) => ({ period, count }))
+
+        const topArtists = await prisma.musicTrack.groupBy({
+            by: ["artist"],
+            where: { createdAt: { gte: since } },
+            _count: { artist: true },
+            orderBy: { _count: { artist: "desc" } },
+            take: 10,
+        })
+
+        const artistTrends: ArtistTrend[] = []
+        for (const entry of topArtists) {
+            const genres = await prisma.musicTrack.findMany({
+                where: { artist: entry.artist, genre: { not: null } },
+                select: { genre: true },
+                distinct: ["genre"],
+                take: 5,
+            })
+            artistTrends.push({
+                artist: entry.artist,
+                count: entry._count.artist,
+                genres: genres.map(g => g.genre).filter(Boolean) as string[],
+            })
+        }
+
+        const genreTrend = await prisma.musicTrack.groupBy({
+            by: ["genre"],
+            where: { genre: { not: null }, createdAt: { gte: since } },
+            _count: { genre: true },
+            orderBy: { _count: { genre: "desc" } },
+            take: 10,
+        })
+
+        return {
+            period: { days, since: since.toISOString() },
+            activityTrend,
+            topArtists: artistTrends,
+            genreDistribution: genreTrend.map(g => ({ genre: g.genre, count: g._count.genre })),
+            totalLearningEvents: recentLogs.length,
+        }
+    } catch (error) {
+        console.error("[AutoQueue] Failed to analyze trends:", error)
+        handlePrismaError(error)
+        return null
+    }
+}
+
+/**
+ * Generates improvement suggestions based on learned data.
+ */
+export async function getImprovementSuggestions(): Promise<Suggestion[]> {
+    const prisma = getPrismaClient()
+    if (!prisma) return []
+
+    const suggestions: Suggestion[] = []
+
+    try {
+        const stats = await getAutoQueueStats()
+        if (!stats) return suggestions
+
+        if (stats.trackCount === 0) {
+            suggestions.push({
+                type: "bootstrap",
+                priority: "high",
+                message: "No tracks learned yet. Play music to start building the recommendation engine.",
+            })
+            return suggestions
+        }
+
+        if (stats.relationCount < stats.trackCount * 0.3) {
+            suggestions.push({
+                type: "coverage",
+                priority: "medium",
+                message: `Only ${stats.relationCount} relationships learned across ${stats.trackCount} tracks. More sequential plays will improve recommendations.`,
+                data: { ratio: stats.relationCount / Math.max(stats.trackCount, 1) },
+            })
+        }
+
+        const ungenred = await prisma.musicTrack.count({ where: { genre: null } })
+        if (ungenred > stats.trackCount * 0.5) {
+            suggestions.push({
+                type: "genre_gaps",
+                priority: "medium",
+                message: `${ungenred} of ${stats.trackCount} tracks have no genre tag. Genre tagging improves fallback recommendations.`,
+                data: { ungenred, total: stats.trackCount },
+            })
+        }
+
+        const weakLinks = await prisma.musicRecommendation.count({ where: { weight: { lte: 1 } } })
+        if (weakLinks > stats.relationCount * 0.8) {
+            suggestions.push({
+                type: "weak_links",
+                priority: "low",
+                message: "Most track relationships have low confidence. Repeated sequential plays strengthen recommendations.",
+                data: { weakLinks, total: stats.relationCount },
+            })
+        }
+
+        const orphanedTracks = await prisma.musicTrack.count({
+            where: {
+                recommendationsFrom: { none: {} },
+                recommendationsTo: { none: {} },
+            },
+        })
+        if (orphanedTracks > stats.trackCount * 0.3) {
+            suggestions.push({
+                type: "orphaned_tracks",
+                priority: "medium",
+                message: `${orphanedTracks} tracks are isolated (no learned relationships). These won't appear in recommendations.`,
+                data: { orphanedTracks, total: stats.trackCount },
+            })
+        }
+
+        if (stats.topGenres.length >= 3) {
+            suggestions.push({
+                type: "diversity",
+                priority: "low",
+                message: `Good genre diversity detected across ${stats.topGenres.length} genres. The recommendation engine can cross-pollinate.`,
+                data: { genres: stats.topGenres },
+            })
+        }
+
+        return suggestions
+    } catch (error) {
+        console.error("[AutoQueue] Failed to generate suggestions:", error)
+        handlePrismaError(error)
+        return suggestions
+    }
+}
+
+/**
+ * Returns a comprehensive learning summary for the AI dashboard.
+ */
+export async function getLearningSummary(guildId?: string | null) {
+    const [stats, trends, suggestions, recentLogs] = await Promise.all([
+        getAutoQueueStats(),
+        analyzeTrends(guildId, 30),
+        getImprovementSuggestions(),
+        listLearningLogs(10),
+    ])
+
+    return {
+        stats,
+        trends,
+        suggestions,
+        recentActivity: recentLogs,
+        status: stats && stats.trackCount > 0 ? "active" : "awaiting_data",
+    }
+}
diff --git a/frontend/lib/memberships.ts b/frontend/lib/memberships.ts
index c1a95ca..6550e6d 100644
--- a/frontend/lib/memberships.ts
+++ b/frontend/lib/memberships.ts
@@ -194,3 +194,17 @@ export const normalizeTierId = (value?: string | null): MembershipTier => {
   const normalized = value.trim().toLowerCase()
   return isMembershipTier(normalized) ? (normalized as MembershipTier) : "free"
 }
+
+export const TIER_ORDER: MembershipTier[] = ["free", "starter", "pro", "growth", "scale", "enterprise"]
+
+export const hasProPlus = (tiers: string[]): boolean =>
+  tiers.some((tier) => ["pro", "growth", "scale", "enterprise"].includes(tier))
+
+export const highestTier = (tiers: string[]): MembershipTier => {
+  let best: MembershipTier = "free"
+  for (const tier of tiers) {
+    const idx = TIER_ORDER.indexOf(tier as MembershipTier)
+    if (idx > TIER_ORDER.indexOf(best)) best = TIER_ORDER[idx]
+  }
+  return best
+}

From 7cf6a3aefd93a94c0855947349064f2639bc13eb Mon Sep 17 00:00:00 2001
From: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Date: Fri, 1 May 2026 17:52:01 +0000
Subject: [PATCH 5/5] fix: polish UI - status bar spacing, nav active state,
 empty states

- Fix telemetry status bar spacing (use flex gap + dot separator)
- Fix stats page status display alignment
- Add navigation active state indicator (highlight current page)
- Improve plugin marketplace empty state (icon + contextual message)
- Fix commands page false 'Loading' state when bot API unavailable

Co-Authored-By: GmBH <system.bot.discord.utility@gmail.com>
---
 frontend/app/commands/page.tsx              |  6 ++-
 frontend/components/home-metrics.tsx        | 12 ++---
 frontend/components/navigation.tsx          | 50 ++++++++++++---------
 frontend/components/plugin-marketplace.tsx  | 12 ++++-
 frontend/components/stats-control-panel.tsx |  8 ++--
 5 files changed, 55 insertions(+), 33 deletions(-)

diff --git a/frontend/app/commands/page.tsx b/frontend/app/commands/page.tsx
index 9ab4945..701d939 100644
--- a/frontend/app/commands/page.tsx
+++ b/frontend/app/commands/page.tsx
@@ -40,8 +40,10 @@ export default async function CommandsPage() {
       <section className="w-full py-12 px-4" data-animate-on-scroll="off">
         <div className="max-w-6xl mx-auto space-y-12">
           {commandGroups.length === 0 ? (
-            <div className="text-center py-12">
-              <p className="text-foreground/70">Loading commands...</p>
+            <div className="text-center py-16">
+              <Command className="h-12 w-12 mx-auto mb-4 text-foreground/20" />
+              <p className="text-lg font-medium text-foreground/60 mb-2">No commands available</p>
+              <p className="text-sm text-foreground/40">Commands are loaded from the bot API. Connect the bot to see the full command reference.</p>
             </div>
           ) : (
             commandGroups.map((group) => {
diff --git a/frontend/components/home-metrics.tsx b/frontend/components/home-metrics.tsx
index 3d08990..5fa0f4a 100644
--- a/frontend/components/home-metrics.tsx
+++ b/frontend/components/home-metrics.tsx
@@ -240,12 +240,14 @@ export function HomeMetricsPanel({ initialMetrics, copy, statsCopy }: HomeMetric
       <div className="max-w-6xl mx-auto">
         <div className="flex flex-col md:flex-row md:items-center md:justify-between mb-6 gap-3">
           <h2 className="text-2xl font-semibold">{labels.title}</h2>
-          <p className="text-xs text-foreground/60" suppressHydrationWarning>
-            {labels.status}:{" "}
-            <span className={state === "connected" ? "text-primary" : state === "connecting" ? "text-yellow-400" : "text-foreground/60"}>
+          <p className="text-xs text-foreground/60 flex items-center gap-1.5" suppressHydrationWarning>
+            <span>{labels.status}:</span>
+            <span className={`font-medium ${state === "connected" ? "text-primary" : state === "connecting" ? "text-yellow-400" : "text-foreground/60"}`}>
               {state === "connected" ? labels.live : state === "connecting" ? labels.connecting : labels.offline}
-            </span>{" "}
-            - {labels.updated} {updatedLabel}
+            </span>
+            <span className="text-foreground/30">·</span>
+            <span>{labels.updated}</span>
+            <span>{updatedLabel}</span>
           </p>
         </div>
         <div className="grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-6">
diff --git a/frontend/components/navigation.tsx b/frontend/components/navigation.tsx
index a893ac8..fb644a6 100644
--- a/frontend/components/navigation.tsx
+++ b/frontend/components/navigation.tsx
@@ -2,6 +2,7 @@
 import Link from "next/link"
 import Image from "next/image"
 import { useState } from "react"
+import { usePathname } from "next/navigation"
 import { buildDiscordLoginUrl } from "@/lib/config"
 import { MenuIcon, CloseIcon } from "./icons"
 import { RoleBadge } from "./role-badge"
@@ -11,6 +12,7 @@ import { useScrollAnimation } from "@/lib/hooks/useScrollAnimation"
 
 export default function Navigation() {
   const [isOpen, setIsOpen] = useState(false)
+  const pathname = usePathname()
   const { isLoggedIn, user, handleLogout } = useAuth()
   const { ref: dropdownRef, isOpen: profileMenuOpen, setIsOpen: setProfileMenuOpen } = useClickOutside(false)
   
@@ -49,16 +51,19 @@ export default function Navigation() {
 
           {/* Desktop Navigation */}
           <div className="hidden md:flex items-center gap-8 flex-1 justify-center">
-            {navLinks.map((link, i) => (
-              <Link
-                key={link.href}
-                href={link.href}
-                className="text-foreground/70 hover:text-primary transition-colors duration-200 text-sm font-medium animate-slide-down"
-                style={{ animationDelay: `${i * 50}ms` }}
-              >
-                {link.label}
-              </Link>
-            ))}
+            {navLinks.map((link, i) => {
+              const isActive = link.href === "/" ? pathname === "/" : pathname.startsWith(link.href)
+              return (
+                <Link
+                  key={link.href}
+                  href={link.href}
+                  className={`transition-colors duration-200 text-sm font-medium animate-slide-down ${isActive ? "text-primary" : "text-foreground/70 hover:text-primary"}`}
+                  style={{ animationDelay: `${i * 50}ms` }}
+                >
+                  {link.label}
+                </Link>
+              )
+            })}
           </div>
 
           <div className="hidden md:flex items-center gap-3 flex-1 justify-end">
@@ -166,17 +171,20 @@ export default function Navigation() {
         {isOpen && (
           <div className="md:hidden border-t border-border bg-card/95 backdrop-blur-sm animate-slide-down">
             <div className="px-4 py-4 space-y-3">
-              {navLinks.map((link, i) => (
-                <Link
-                  key={link.href}
-                  href={link.href}
-                  onClick={() => setIsOpen(false)}
-                  className="block text-foreground/70 hover:text-primary transition-colors py-2 animate-slide-in-right"
-                  style={{ animationDelay: `${i * 50}ms` }}
-                >
-                  {link.label}
-                </Link>
-              ))}
+              {navLinks.map((link, i) => {
+                const isActive = link.href === "/" ? pathname === "/" : pathname.startsWith(link.href)
+                return (
+                  <Link
+                    key={link.href}
+                    href={link.href}
+                    onClick={() => setIsOpen(false)}
+                    className={`block transition-colors py-2 animate-slide-in-right ${isActive ? "text-primary font-semibold" : "text-foreground/70 hover:text-primary"}`}
+                    style={{ animationDelay: `${i * 50}ms` }}
+                  >
+                    {link.label}
+                  </Link>
+                )
+              })}
 
               {isLoggedIn && user ? (
                 <div className="pt-2">
diff --git a/frontend/components/plugin-marketplace.tsx b/frontend/components/plugin-marketplace.tsx
index 0aff55c..0a368e7 100644
--- a/frontend/components/plugin-marketplace.tsx
+++ b/frontend/components/plugin-marketplace.tsx
@@ -181,8 +181,16 @@ export function PluginMarketplace({ guildId }: PluginMarketplaceProps) {
             </Card>
           ))}
           {filteredPlugins.length === 0 && (
-            <div className="col-span-full text-center py-12 text-muted-foreground">
-              No plugins found matching your search.
+            <div className="col-span-full text-center py-16 text-muted-foreground">
+              <Download className="h-10 w-10 mx-auto mb-4 text-foreground/20" />
+              <p className="text-lg font-medium text-foreground/60 mb-2">
+                {search ? "No plugins found matching your search." : "No plugins available yet."}
+              </p>
+              <p className="text-sm text-foreground/40">
+                {search
+                  ? "Try a different search term or clear the filter."
+                  : "Community and official plugins will appear here once published."}
+              </p>
             </div>
           )}
         </div>
diff --git a/frontend/components/stats-control-panel.tsx b/frontend/components/stats-control-panel.tsx
index a1b239f..21c96c6 100644
--- a/frontend/components/stats-control-panel.tsx
+++ b/frontend/components/stats-control-panel.tsx
@@ -188,9 +188,11 @@ export function StatsControlPanel({ initialData }: StatsControlPanelProps) {
           <p className="text-xl text-foreground/70 max-w-3xl mx-auto animate-fade-in-up animation-delay-200">
             Live data that captures VectoBeat&apos;s reach, reliability, and user engagement across every touchpoint.
           </p>
-          <p className="text-sm text-foreground/50 mt-6 animate-fade-in-up animation-delay-400">
-            Last updated {lastUpdated} · Status{" "}
-            <span className={connectionState === "connected" ? "text-primary" : connectionState === "connecting" ? "text-yellow-400" : "text-foreground/60"}>
+          <p className="text-sm text-foreground/50 mt-6 animate-fade-in-up animation-delay-400 inline-flex items-center justify-center gap-1.5 w-full" suppressHydrationWarning>
+            <span>Last updated {lastUpdated}</span>
+            <span className="text-foreground/30">·</span>
+            <span>Status</span>
+            <span className={`font-medium ${connectionState === "connected" ? "text-primary" : connectionState === "connecting" ? "text-yellow-400" : "text-foreground/60"}`}>
               {connectionState === "connected"
                 ? "Streaming live metrics"
                 : connectionState === "connecting"