refactor: connect frontend to backend by integrating SettingsContext and updating route handling for forum and bug reporting features

docker-compose.yml

@@ -19,15 +19,10 @@ services:
     restart: unless-stopped
     ports:
       - "3000:3000"
+    env_file:
+      - ./nest-backend/.env
     environment:
       DATABASE_URL: postgresql://nest_user:nest_password@db:5432/nest_db
-      JWT_SECRET: ${JWT_SECRET:-change_me_in_production}
-      PORT: 3000
-      ADMIN_USERNAME: ${ADMIN_USERNAME:-admin}
-      ADMIN_EMAIL: ${ADMIN_EMAIL:-admin@crowmate.fr}
-      ADMIN_PASSWORD: ${ADMIN_PASSWORD:-change_me}
-      FRONT_ORIGIN: ${FRONT_ORIGIN:-http://localhost:5173}
-      INTRA_ORIGIN: ${INTRA_ORIGIN:-http://localhost:5174}
     depends_on:
       db:
         condition: service_healthy
@@ -39,6 +34,8 @@ services:
     restart: unless-stopped
     ports:
       - "80:80"
+    environment:
+      API_URL: http://api:3000
     depends_on:
       - api
 

nest-backend/prisma/schema.prisma

@@ -221,6 +221,14 @@ model PollVote {
   @@id([userId, pollOptionId])
 }
 
+// ── Site Settings ──────────────────────────────────────────────────────────────
+
+model SiteSettings {
+  id           Int     @id @default(1)
+  forumEnabled Boolean @default(true)
+  bugsEnabled  Boolean @default(true)
+}
+
 // ── Team Members ───────────────────────────────────────────────────────────────
 
 model TeamMember {

nest-backend/src/app.ts

@@ -7,6 +7,7 @@ import bugsRouter from './routes/bugs.js';
 import feedRouter from './routes/feed.js';
 import eventsRouter from './routes/events.js';
 import teamRouter from './routes/team.js';
+import settingsRouter from './routes/settings.js';
 
 const app = express();
 
@@ -122,6 +123,7 @@ app.use('/api/bugs', bugsRouter);
 app.use('/api/feed', feedRouter);
 app.use('/api/events', eventsRouter);
 app.use('/api/team', teamRouter);
+app.use('/api/settings', settingsRouter);
 
 // 404
 app.use((_req, res) => res.status(404).json({ error: 'Not found' }));

nest-backend/src/routes/bugs.ts

@@ -100,7 +100,7 @@ router.get('/', async (req: Request, res: Response): Promise<void> => {
     prisma.bugReport.count({ where }),
   ]);
 
-  res.json({ bugs: bugs.map(formatBug), total, page, pages: Math.ceil(total / limit) });
+  res.json({ data: bugs.map(formatBug), total, page, pages: Math.ceil(total / limit) });
 });
 
 // GET /api/bugs/:id

nest-backend/src/routes/settings.ts

@@ -0,0 +1,44 @@
+import { Router } from 'express';
+import type { Request, Response } from 'express';
+import prisma from '../lib/prisma.js';
+import { authenticate, requireAdmin } from '../middleware/auth.js';
+
+const router = Router();
+
+function getOrCreateSettings() {
+  return prisma.siteSettings.upsert({
+    where: { id: 1 },
+    update: {},
+    create: { id: 1 },
+  });
+}
+
+// GET /api/settings — public
+router.get('/', async (_req: Request, res: Response): Promise<void> => {
+  const settings = await getOrCreateSettings();
+  res.json({ forumEnabled: settings.forumEnabled, bugsEnabled: settings.bugsEnabled });
+});
+
+// PATCH /api/settings — admin only
+router.patch('/', authenticate, requireAdmin, async (req: Request, res: Response): Promise<void> => {
+  const { forumEnabled, bugsEnabled } = req.body as { forumEnabled?: unknown; bugsEnabled?: unknown };
+
+  const data: { forumEnabled?: boolean; bugsEnabled?: boolean } = {};
+  if (typeof forumEnabled === 'boolean') data.forumEnabled = forumEnabled;
+  if (typeof bugsEnabled === 'boolean') data.bugsEnabled = bugsEnabled;
+
+  if (Object.keys(data).length === 0) {
+    res.status(400).json({ error: 'No valid fields to update' });
+    return;
+  }
+
+  const settings = await prisma.siteSettings.upsert({
+    where: { id: 1 },
+    update: data,
+    create: { id: 1, ...data },
+  });
+
+  res.json({ forumEnabled: settings.forumEnabled, bugsEnabled: settings.bugsEnabled });
+});
+
+export default router;

nest-front/Dockerfile

@@ -1,4 +1,4 @@
-FROM node:22-alpine AS build
+FROM node:25-alpine AS build
 
 WORKDIR /app
 

nest-front/src/App.tsx

@@ -1,6 +1,7 @@
 import { lazy, Suspense } from 'react';
 import { Routes, Route } from 'react-router-dom';
 import { AuthProvider } from './contexts/AuthContext';
+import { SettingsProvider, useSettings } from './contexts/SettingsContext';
 import { ProtectedRoute } from './components/shared/ProtectedRoute';
 import { PublicLayout } from './components/layout/PublicLayout';
 import { PageLoader } from './components/shared/PageLoader';
@@ -19,22 +20,24 @@ const LoginPage       = lazy(() => import('./pages/public/LoginPage'));
 const RegisterPage    = lazy(() => import('./pages/public/RegisterPage'));
 const NotFoundPage    = lazy(() => import('./pages/public/NotFoundPage'));
 
-// ── App ────────────────────────────────────────────────────────────────────────
+// ── Routes (needs SettingsContext) ────────────────────────────────────────────
+
+function AppRoutes() {
+  const { forumEnabled, bugsEnabled, loaded } = useSettings();
+
+  if (!loaded) return <PageLoader />;
 
-export default function App() {
   return (
-    <AuthProvider>
     <Suspense fallback={<PageLoader />}>
       <Routes>
-          {/* Public Routes */}
         <Route element={<PublicLayout />}>
           <Route index element={<HomePage />} />
           <Route path="studio" element={<StudioPage />} />
           <Route path="events" element={<EventsPage />} />
-            <Route path="forum" element={<ForumPage />} />
-            <Route path="forum/thread/:id" element={<ThreadPage />} />
-            <Route path="bugs" element={<BugReportPage />} />
-            <Route path="bugs/:id" element={<BugDetailPage />} />
+          <Route path="forum" element={forumEnabled ? <ForumPage /> : <NotFoundPage />} />
+          <Route path="forum/thread/:id" element={forumEnabled ? <ThreadPage /> : <NotFoundPage />} />
+          <Route path="bugs" element={bugsEnabled ? <BugReportPage /> : <NotFoundPage />} />
+          <Route path="bugs/:id" element={bugsEnabled ? <BugDetailPage /> : <NotFoundPage />} />
           <Route
             path="account"
             element={
@@ -49,6 +52,17 @@ export default function App() {
         </Route>
       </Routes>
     </Suspense>
+  );
+}
+
+// ── App ────────────────────────────────────────────────────────────────────────
+
+export default function App() {
+  return (
+    <AuthProvider>
+      <SettingsProvider>
+        <AppRoutes />
+      </SettingsProvider>
     </AuthProvider>
   );
 }

nest-front/src/components/shared/Footer.tsx

@@ -1,7 +1,9 @@
 import { Link } from 'react-router-dom';
+import { useSettings } from '../../contexts/SettingsContext';
 
 export function Footer() {
   const year = new Date().getFullYear();
+  const { forumEnabled, bugsEnabled } = useSettings();
 
   return (
     <footer
@@ -37,11 +39,11 @@ export function Footer() {
             <div className="section-label" style={{ marginBottom: '0.75rem' }}>Navigate</div>
             <ul style={{ listStyle: 'none', margin: 0, padding: 0, display: 'flex', flexDirection: 'column', gap: '0.4rem' }}>
               {[
-                { to: '/', label: 'Home' },
-                { to: '/studio', label: 'Studio' },
-                { to: '/forum', label: 'Forum' },
-                { to: '/bugs', label: 'Bug Reports' },
-              ].map(({ to, label }) => (
+                { to: '/',       label: 'Home',        show: true },
+                { to: '/studio', label: 'Studio',      show: true },
+                { to: '/forum',  label: 'Forum',       show: forumEnabled },
+                { to: '/bugs',   label: 'Bug Reports', show: bugsEnabled },
+              ].filter((item) => item.show).map(({ to, label }) => (
                 <li key={to}>
                   <Link
                     to={to}

nest-front/src/components/shared/Navbar.tsx

@@ -1,20 +1,28 @@
 import { useState, useCallback } from 'react';
 import { Link, NavLink, useNavigate } from 'react-router-dom';
 import { useAuth } from '../../contexts/AuthContext';
+import { useSettings } from '../../contexts/SettingsContext';
 
-const NAV_LINKS = [
-  { to: '/',       label: 'Home',   end: true },
-  { to: '/studio', label: 'Studio', end: false },
-  { to: '/events', label: 'Events', end: false },
-  { to: '/forum',  label: 'Forum',  end: false },
-  { to: '/bugs',   label: 'Bugs',   end: false },
+const BASE_NAV_LINKS = [
+  { to: '/',       label: 'Home',   end: true,  feature: null as null | 'forum' | 'bugs' },
+  { to: '/studio', label: 'Studio', end: false, feature: null },
+  { to: '/events', label: 'Events', end: false, feature: null },
+  { to: '/forum',  label: 'Forum',  end: false, feature: 'forum' as const },
+  { to: '/bugs',   label: 'Bugs',   end: false, feature: 'bugs'  as const },
 ];
 
 export function Navbar() {
   const { user, isAuthenticated, logout } = useAuth();
+  const { forumEnabled, bugsEnabled } = useSettings();
   const navigate = useNavigate();
   const [menuOpen, setMenuOpen] = useState(false);
 
+  const navLinks = BASE_NAV_LINKS.filter(({ feature }) => {
+    if (feature === 'forum') return forumEnabled;
+    if (feature === 'bugs')  return bugsEnabled;
+    return true;
+  });
+
   const handleLogout = useCallback(() => {
     logout();
     setMenuOpen(false);
@@ -85,7 +93,7 @@ export function Navbar() {
 
         {/* Desktop Nav */}
         <div className="hidden md:flex items-center gap-6">
-          {NAV_LINKS.map(({ to, label, end }) => (
+          {navLinks.map(({ to, label, end }) => (
             <NavLink key={to} to={to} end={end} style={navLinkStyle}>
               {label}
             </NavLink>
@@ -148,7 +156,7 @@ export function Navbar() {
           }}
         >
           <div style={{ display: 'flex', flexDirection: 'column', gap: '0.85rem' }}>
-            {NAV_LINKS.map(({ to, label, end }) => (
+            {navLinks.map(({ to, label, end }) => (
               <NavLink
                 key={to}
                 to={to}

nest-front/src/contexts/SettingsContext.tsx

@@ -0,0 +1,31 @@
+import React, { createContext, useContext, useEffect, useState } from 'react';
+import { settingsApi } from '../utils/api';
+
+interface SettingsContextValue {
+  forumEnabled: boolean;
+  bugsEnabled: boolean;
+  loaded: boolean;
+}
+
+const SettingsContext = createContext<SettingsContextValue>({
+  forumEnabled: true,
+  bugsEnabled: true,
+  loaded: false,
+});
+
+export function SettingsProvider({ children }: { children: React.ReactNode }) {
+  const [value, setValue] = useState<SettingsContextValue>({ forumEnabled: true, bugsEnabled: true, loaded: false });
+
+  useEffect(() => {
+    settingsApi
+      .get()
+      .then((s) => setValue({ forumEnabled: s.forumEnabled, bugsEnabled: s.bugsEnabled, loaded: true }))
+      .catch(() => setValue({ forumEnabled: true, bugsEnabled: true, loaded: true }));
+  }, []);
+
+  return <SettingsContext.Provider value={value}>{children}</SettingsContext.Provider>;
+}
+
+export function useSettings(): SettingsContextValue {
+  return useContext(SettingsContext);
+}

nest-front/src/pages/public/BugDetailPage.tsx

@@ -88,7 +88,7 @@ export default function BugDetailPage() {
   }, [id]);
 
   const alreadyVoted = useMemo(
-    () => !!user && !!bug && bug.meTooBugs.includes(user.id),
+    () => !!user && !!bug && (bug.meTooBugs ?? []).includes(user.id),
     [user, bug]
   );
   const isOwnReport = useMemo(
@@ -100,7 +100,7 @@ export default function BugDetailPage() {
     if (!user || !bug || alreadyVoted || isOwnReport) return;
     try {
       await bugsApi.toggleMeToo(bug.id);
-      setBug((prev) => prev ? { ...prev, meTooBugs: [...prev.meTooBugs, user.id] } : prev);
+      setBug((prev) => prev ? { ...prev, meTooBugs: [...(prev.meTooBugs ?? []), user.id] } : prev);
     } catch {
       // silently ignore
     }
@@ -137,7 +137,7 @@ export default function BugDetailPage() {
     return <Navigate to="/bugs" replace />;
   }
 
-  const metooCount = bug.meTooBugs.length;
+  const metooCount = (bug.meTooBugs ?? []).length;
 
   return (
     <div style={{ maxWidth: '860px', margin: '0 auto', padding: '3rem 1.5rem' }}>

nest-front/src/pages/public/BugReportPage.tsx

@@ -78,7 +78,7 @@ function BugCard({ bug, highlight }: BugCardProps) {
                 borderRadius: '3px',
               }}
             >
-              ▶ {bug.meTooBugs.length} {bug.meTooBugs.length === 1 ? 'user' : 'users'} have this
+              ▶ {(bug.meTooBugs ?? []).length} {(bug.meTooBugs ?? []).length === 1 ? 'user' : 'users'} have this
             </span>
           </div>
 
@@ -285,7 +285,7 @@ export default function BugReportPage() {
   const fetchBugs = useCallback(() => {
     setLoading(true);
     bugsApi.getBugs({ status: statusFilter, severity: severityFilter, limit: 100 })
-      .then((res) => setBugs(res.data))
+      .then((res) => setBugs(Array.isArray(res?.data) ? res.data : []))
       .catch(() => setBugs([]))
       .finally(() => setLoading(false));
   }, [statusFilter, severityFilter]);
@@ -295,7 +295,7 @@ export default function BugReportPage() {
   const { myBugs, otherBugs } = useMemo(() => {
     const my: BugReport[] = [];
     const other: BugReport[] = [];
-    bugs.forEach((b) => {
+    (bugs ?? []).forEach((b) => {
       if (user && b.submittedById === user.id) my.push(b);
       else other.push(b);
     });

nest-front/src/pages/public/StudioPage.tsx

@@ -1,15 +1,52 @@
-import { useEffect, useState } from 'react';
-import { teamApi } from '../../utils/api';
 import type { TeamMember } from '../../types';
 
-export default function StudioPage() {
-  const [members, setMembers] = useState<TeamMember[]>([]);
+const FALLBACK_MEMBERS: TeamMember[] = [
+  {
+    id: 'studio-1',
+    name: 'Thibault Pouch',
+    role: 'Game Dev • Lore / CI-CD',
+    bio: 'Works on game dev, game lore, CI/CD, assets, and the web platform.',
+    avatarInitials: 'TP',
+  },
+  {
+    id: 'studio-2',
+    name: 'Pierre Ryssen',
+    role: 'Game Dev • Assets / Web',
+    bio: 'Works on game dev, assets, and the web platform.',
+    avatarInitials: 'PR',
+  },
+  {
+    id: 'studio-3',
+    name: 'Antoine Papillon',
+    role: 'Game Dev • Gameplay',
+    bio: 'Focused on core game development for the project.',
+    avatarInitials: 'AP',
+  },
+  {
+    id: 'studio-4',
+    name: 'Clement Augustinowick',
+    role: 'Game Dev • Gameplay',
+    bio: 'Focused on core game development for the project.',
+    avatarInitials: 'CA',
+  },
+  {
+    id: 'studio-5',
+    name: 'Dany Lhoir',
+    role: 'Game Dev • Multiplayer / Security',
+    bio: 'Works on game dev, multiplayer systems, and cybersecurity.',
+    avatarInitials: 'DL',
+  },
+  {
+    id: 'studio-6',
+    name: 'Timote Koenig',
+    role: 'Game Dev • Assets / Planning',
+    bio: 'Works on game dev, assets, and project planning.',
+    avatarInitials: 'TK',
+  },
+];
 
-  useEffect(() => {
-    teamApi.getMembers()
-      .then(setMembers)
-      .catch(() => { /* show empty state */ });
-  }, []);
+export default function StudioPage() {
+  const members = FALLBACK_MEMBERS;
 
   return (
     <div style={{ maxWidth: '1000px', margin: '0 auto', padding: '4rem 1.5rem' }}>
@@ -41,9 +78,9 @@ export default function StudioPage() {
               marginBottom: '1rem',
             }}
           >
-            CrowMate Studio is an independent game studio founded in 2023 by a team of six developers
-            united by a shared obsession: games that are strange, atmospheric, and actually interesting.
-            We are headquartered somewhere in Europe and operate fully remote.
+            CrowMate Studio is an independent game studio founded in 2026 by a team of six developers
+            who are all new to game development and learning by building together. We are headquartered
+            somewhere in France and operate arround the globe.
           </p>
           <p
             style={{
@@ -60,6 +97,40 @@ export default function StudioPage() {
             you don't need a $200 million budget to make something that sticks.
           </p>
         </div>
+
+        <div
+          className="crt-box"
+          style={{ padding: '1.5rem 2rem', display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(160px, 1fr))', gap: '1rem' }}
+        >
+          {[
+            { label: 'TEAM SIZE', value: '6 PEOPLE' },
+            { label: 'FOUNDED', value: '2026' },
+            { label: 'CURRENT GAME', value: 'HEADLESS HAZARD' },
+          ].map(({ label, value }) => (
+            <div key={label}>
+              <div
+                style={{
+                  fontFamily: 'var(--font-mono)',
+                  color: 'var(--color-green)',
+                  fontSize: '0.72rem',
+                  letterSpacing: '0.08em',
+                  marginBottom: '0.45rem',
+                }}
+              >
+                {label}
+              </div>
+              <div
+                style={{
+                  fontFamily: 'var(--font-heading)',
+                  color: 'var(--color-text)',
+                  fontSize: '1rem',
+                }}
+              >
+                {value}
+              </div>
+            </div>
+          ))}
+        </div>
       </div>
 
       {/* History & Vision */}

nest-front/src/utils/api.ts

@@ -190,3 +190,11 @@ export const eventsApi = {
 export const teamApi = {
   getMembers: () => apiFetch<TeamMember[]>('/team'),
 };
+
+// ── Settings API ──────────────────────────────────────────────────────────────
+
+export type SiteSettings = { forumEnabled: boolean; bugsEnabled: boolean };
+
+export const settingsApi = {
+  get: () => apiFetch<SiteSettings>('/settings'),
+};

nest-intra/Dockerfile

@@ -1,4 +1,4 @@
-FROM node:22-alpine AS build
+FROM node:25-alpine AS build
 
 WORKDIR /app
 

nest-intra/nginx.conf

@@ -3,14 +3,15 @@ server {
     root /usr/share/nginx/html;
     index index.html;
 
-    # Use Docker's embedded DNS resolver; defer resolution to request time
-    resolver 127.0.0.11 valid=30s;
+    # Docker DNS; resolve API service name at request time.
+    resolver 127.0.0.11 ipv6=off valid=10s;
+    set $api_upstream http://api:3000;
 
     location /api/ {
-        set $api_upstream http://api:3000;
         proxy_pass $api_upstream;
         proxy_set_header Host $host;
         proxy_set_header X-Real-IP $remote_addr;
+        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
     }
 
     location / {

nest-intra/src/components/layout/IntranetLayout.tsx

@@ -8,7 +8,7 @@ const INTRANET_LINKS = [
   { to: '/intranet/feed',       label: 'Team Feed',   icon: '[~]', end: false },
   { to: '/intranet/events',     label: 'Events',      icon: '[E]', end: false },
   { to: '/intranet/users',      label: 'Users',       icon: '[U]', end: false },
-  { to: '/intranet/moderation', label: 'Moderation',  icon: '[M]', end: false },
+  { to: '/intranet/moderation', label: 'Forum Mod',   icon: '[M]', end: false },
   { to: '/intranet/services',   label: 'Services',    icon: '[S]', end: false },
 ];
 

nest-intra/src/pages/intranet/IntranetBugs.tsx

@@ -1,6 +1,7 @@
-import { useState, useMemo, useCallback } from 'react';
+import { useState, useMemo, useCallback, useEffect } from 'react';
 import { useAuth } from '../../contexts/AuthContext';
 import { formatDate, formatDateTime } from '../../utils/format';
+import { settingsApi } from '../../utils/api';
 import type { BugReport, BugSeverity, BugStatus, BugReportNote } from '../../types';
 
 function StatusBadge({ status }: { status: BugStatus }) {
@@ -26,6 +27,20 @@ export default function IntranetBugs() {
   const [severityFilter, setSeverityFilter] = useState<BugSeverity | 'all'>('all');
   const [assignedFilter, setAssignedFilter] = useState<string | 'all'>('all');
   const [noteText, setNoteText] = useState('');
+  const [isEnabled, setIsEnabled] = useState(true);
+  const [toggling, setToggling] = useState(false);
+
+  useEffect(() => {
+    settingsApi.get().then((s) => setIsEnabled(s.bugsEnabled)).catch(() => {});
+  }, []);
+
+  const handleToggle = useCallback((enabled: boolean) => {
+    setToggling(true);
+    settingsApi.update({ bugsEnabled: enabled })
+      .then(() => setIsEnabled(enabled))
+      .catch(() => {})
+      .finally(() => setToggling(false));
+  }, []);
 
   const openCount = bugs.filter((b) => b.status === 'open').length;
   const criticalCount = bugs.filter((b) => b.severity === 'critical').length;
@@ -72,14 +87,65 @@ export default function IntranetBugs() {
     setNoteText('');
   }, [noteText, user]);
 
+  if (!isEnabled) {
+    return (
+      <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', minHeight: '400px', textAlign: 'center' }}>
+        <div style={{ fontFamily: 'var(--font-mono)', color: 'var(--color-text-muted)', fontSize: '0.7rem', letterSpacing: '0.15em', marginBottom: '1rem' }}>
+          INTRANET / BUG REPORTS
+        </div>
+        <h1 style={{ fontFamily: 'var(--font-heading)', color: 'var(--color-red)', fontSize: '2rem', marginBottom: '0.5rem' }}>FUNCTIONALITY DISABLED</h1>
+        <p style={{ color: 'var(--color-text-muted)', marginBottom: '1.5rem' }}>Bug Reports feature is currently disabled</p>
+        <button
+          onClick={() => handleToggle(true)}
+          disabled={toggling}
+          style={{
+            background: 'var(--color-green)',
+            color: 'var(--color-bg)',
+            border: 'none',
+            padding: '0.6rem 1.2rem',
+            fontFamily: 'var(--font-mono)',
+            fontSize: '0.85rem',
+            cursor: toggling ? 'not-allowed' : 'pointer',
+            textTransform: 'uppercase',
+            letterSpacing: '0.08em',
+            opacity: toggling ? 0.6 : 1,
+          }}
+        >
+          Re-enable
+        </button>
+      </div>
+    );
+  }
+
   return (
     <div style={{ display: 'grid', gridTemplateColumns: selected ? '1fr 400px' : '1fr', gap: '1.5rem', alignItems: 'start' }}>
       {/* Left panel */}
       <div>
         <div style={{ marginBottom: '1.5rem' }}>
-          <div style={{ fontFamily: 'var(--font-mono)', color: 'var(--color-text-muted)', fontSize: '0.7rem', letterSpacing: '0.15em', marginBottom: '0.5rem' }}>
+          <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '0.5rem' }}>
+            <div style={{ fontFamily: 'var(--font-mono)', color: 'var(--color-text-muted)', fontSize: '0.7rem', letterSpacing: '0.15em' }}>
               INTRANET / BUG REPORTS
             </div>
+            <button
+              onClick={() => handleToggle(false)}
+              disabled={toggling}
+              style={{
+                background: 'transparent',
+                border: '1px solid var(--color-red)',
+                color: 'var(--color-red)',
+                padding: '0.3rem 0.7rem',
+                fontFamily: 'var(--font-mono)',
+                fontSize: '0.65rem',
+                cursor: toggling ? 'not-allowed' : 'pointer',
+                textTransform: 'uppercase',
+                letterSpacing: '0.08em',
+                opacity: toggling ? 0.6 : 1,
+              }}
+              title="Disable this feature"
+            >
+              [DISABLE]
+            </button>
+          </div>
           <h1 style={{ fontFamily: 'var(--font-heading)', color: 'var(--color-text)', fontSize: '1.8rem', marginBottom: '1rem' }}>BUG DASHBOARD</h1>
 
           {/* Stats */}

nest-intra/src/pages/intranet/IntranetDashboard.tsx

@@ -125,6 +125,8 @@ export default function IntranetDashboard() {
           <NavTile to="/intranet/feed" label="Team Feed" description="Internal staff activity feed. Post updates visible only to the team." icon="[~]" />
           <NavTile to="/intranet/users" label="User Management" description="View all registered users. Promote or ban accounts." icon="[U]" />
           <NavTile to="/intranet/moderation" label="Forum Moderation" description="Pin, lock, and delete threads and replies from the public forum." icon="[M]" />
+          <NavTile to="/intranet/events" label="Event Calendar" description="Manage upcoming events, deadlines, and team meetings." icon="[E]" />
+          <NavTile to="/intranet/services" label="Service Status" description="Redirection to all the services." icon="[S]" />
         </div>
       </div>
 

nest-intra/src/pages/intranet/IntranetModeration.tsx

@@ -1,5 +1,6 @@
-import { useState, useMemo, useCallback } from 'react';
+import { useState, useMemo, useCallback, useEffect } from 'react';
 import { formatDateTime } from '../../utils/format';
+import { settingsApi } from '../../utils/api';
 import type { ForumThread, ForumReply } from '../../types';
 
 export default function IntranetModeration() {
@@ -8,6 +9,20 @@ export default function IntranetModeration() {
   const [selectedThreadId, setSelectedThreadId] = useState<string | null>(null);
   const [search, setSearch] = useState('');
   const [activeTab, setActiveTab] = useState<'threads' | 'replies'>('threads');
+  const [isEnabled, setIsEnabled] = useState(true);
+  const [toggling, setToggling] = useState(false);
+
+  useEffect(() => {
+    settingsApi.get().then((s) => setIsEnabled(s.forumEnabled)).catch(() => {});
+  }, []);
+
+  const handleToggle = useCallback((enabled: boolean) => {
+    setToggling(true);
+    settingsApi.update({ forumEnabled: enabled })
+      .then(() => setIsEnabled(enabled))
+      .catch(() => {})
+      .finally(() => setToggling(false));
+  }, []);
 
   const filteredThreads = useMemo(() => {
     if (!search.trim()) return threads;
@@ -43,8 +58,38 @@ export default function IntranetModeration() {
   }, [replies]);
 
   return (
+    <div>
+      {!isEnabled ? (
+        <div style={{ display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', minHeight: '400px', textAlign: 'center' }}>
+          <div style={{ fontFamily: 'var(--font-mono)', color: 'var(--color-text-muted)', fontSize: '0.7rem', letterSpacing: '0.15em', marginBottom: '1rem' }}>
+            INTRANET / MODERATION
+          </div>
+          <h1 style={{ fontFamily: 'var(--font-heading)', color: 'var(--color-red)', fontSize: '2rem', marginBottom: '0.5rem' }}>FUNCTIONALITY DISABLED</h1>
+          <p style={{ color: 'var(--color-text-muted)', marginBottom: '1.5rem' }}>Forum Moderation feature is currently disabled</p>
+          <button
+            onClick={() => handleToggle(true)}
+            disabled={toggling}
+            style={{
+              background: 'var(--color-green)',
+              color: 'var(--color-bg)',
+              border: 'none',
+              padding: '0.6rem 1.2rem',
+              fontFamily: 'var(--font-mono)',
+              fontSize: '0.85rem',
+              cursor: toggling ? 'not-allowed' : 'pointer',
+              textTransform: 'uppercase',
+              letterSpacing: '0.08em',
+              opacity: toggling ? 0.6 : 1,
+            }}
+          >
+            Re-enable
+          </button>
+        </div>
+      ) : (
         <div>
       <div style={{ marginBottom: '1.75rem' }}>
+        <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
+          <div>
             <div style={{ fontFamily: 'var(--font-mono)', color: 'var(--color-text-muted)', fontSize: '0.7rem', letterSpacing: '0.15em', marginBottom: '0.5rem' }}>
               INTRANET / MODERATION
             </div>
@@ -53,6 +98,28 @@ export default function IntranetModeration() {
               {threads.length} threads &mdash; {replies.length} replies
             </p>
           </div>
+          <button
+            onClick={() => handleToggle(false)}
+            disabled={toggling}
+            style={{
+              background: 'transparent',
+              border: '1px solid var(--color-red)',
+              color: 'var(--color-red)',
+              padding: '0.3rem 0.7rem',
+              fontFamily: 'var(--font-mono)',
+              fontSize: '0.65rem',
+              cursor: toggling ? 'not-allowed' : 'pointer',
+              textTransform: 'uppercase',
+              letterSpacing: '0.08em',
+              height: 'fit-content',
+              opacity: toggling ? 0.6 : 1,
+            }}
+            title="Disable this feature"
+          >
+            [DISABLE]
+          </button>
+        </div>
+      </div>
 
       {/* Tabs */}
       <div style={{ display: 'flex', borderBottom: '1px solid var(--color-border)', marginBottom: '1.5rem', gap: 0 }}>
@@ -226,5 +293,7 @@ export default function IntranetModeration() {
         </div>
       )}
     </div>
+      )}
+    </div>
   );
 }

nest-intra/src/utils/api.ts

@@ -0,0 +1,35 @@
+import { getToken } from '../contexts/AuthContext';
+
+export const API_BASE = (import.meta.env.VITE_API_URL as string | undefined) ?? '/api';
+
+async function apiFetch<T>(path: string, options: RequestInit = {}): Promise<T> {
+  const token = getToken();
+  const headers: Record<string, string> = {
+    'Content-Type': 'application/json',
+    ...(options.headers as Record<string, string> ?? {}),
+  };
+  if (token) headers['Authorization'] = `Bearer ${token}`;
+
+  const res = await fetch(`${API_BASE}${path}`, { ...options, headers });
+
+  if (!res.ok) {
+    const body = await res.json().catch(() => ({})) as { error?: unknown };
+    const message = typeof body.error === 'string' ? body.error : `Request failed (${res.status})`;
+    throw new Error(message);
+  }
+
+  if (res.status === 204) return undefined as T;
+  return res.json() as Promise<T>;
+}
+
+export type SiteSettings = { forumEnabled: boolean; bugsEnabled: boolean };
+
+export const settingsApi = {
+  get: () => apiFetch<SiteSettings>('/settings'),
+
+  update: (data: Partial<SiteSettings>) =>
+    apiFetch<SiteSettings>('/settings', {
+      method: 'PATCH',
+      body: JSON.stringify(data),
+    }),
+};