13 Commits

Author SHA1 Message Date
Thibault Pouch
792816c6c8 refactor: connect frontend to backend by integrating SettingsContext and updating route handling for forum and bug reporting features 2026-03-17 16:44:06 +01:00
Thibault Pouch
a46dfde6d2 feat: add SettingsContext for managing forum and bug reporting settings 2026-03-17 16:43:45 +01:00
Thibault Pouch
e8cd7e9562 refactor: enable conditional rendering of forum and bug report links in Navbar and Footer based on settings 2026-03-17 16:43:35 +01:00
Thibault Pouch
2e42d67196 refactor: update response structure for bugs endpoint to use 'data' key 2026-03-17 16:43:27 +01:00
Thibault Pouch
53740dc694 feat: implement settings API for toggling forum and bug reporting features 2026-03-17 11:44:14 +01:00
Thibault Pouch
f9012bd123 feat: integrate settings API to manage forum and bug reporting availability 2026-03-17 11:44:05 +01:00
Thibault Pouch
f481a6fc4e feat: add settings route for managing forum and bug feature toggles 2026-03-17 11:43:50 +01:00
Thibault Pouch
f926951e22 feat: add SiteSettings model to manage forum and bug feature toggles 2026-03-17 11:43:41 +01:00
Thibault Pouch
513bfbda96 feat: update front service port mapping from 5173 to 80 2026-03-12 11:30:55 +01:00
Thibault Pouch
c2135bbb5d feat: implement fallback team members and enhance StudioPage layout with team information 2026-03-12 11:30:51 +01:00
Thibault Pouch
e86eee8744 git : Merge branch 'main' into feat/connect-front-to-backend 2026-03-12 11:13:38 +01:00
Thibault Pouch
8e877c8651 feat: add functionality toggle for Intranet Bugs and Moderation features with enable/disable buttons 2026-03-12 10:59:07 +01:00
Thibault Pouch
77d57fb354 feat: update Dockerfiles to use Node 25-alpine and enhance nginx configuration for API proxying 2026-03-12 10:59:01 +01:00
21 changed files with 439 additions and 81 deletions

View File

@@ -19,15 +19,10 @@ services:
restart: unless-stopped restart: unless-stopped
ports: ports:
- "3000:3000" - "3000:3000"
env_file:
- ./nest-backend/.env
environment: environment:
DATABASE_URL: postgresql://nest_user:nest_password@db:5432/nest_db 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: depends_on:
db: db:
condition: service_healthy condition: service_healthy
@@ -39,6 +34,8 @@ services:
restart: unless-stopped restart: unless-stopped
ports: ports:
- "80:80" - "80:80"
environment:
API_URL: http://api:3000
depends_on: depends_on:
- api - api

View File

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

View File

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

View File

@@ -100,7 +100,7 @@ router.get('/', async (req: Request, res: Response): Promise<void> => {
prisma.bugReport.count({ where }), 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 // GET /api/bugs/:id

View File

@@ -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;

View File

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

View File

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

View File

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

View File

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

View File

@@ -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);
}

View File

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

View File

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

View File

@@ -1,15 +1,52 @@
import { useEffect, useState } from 'react';
import { teamApi } from '../../utils/api';
import type { TeamMember } from '../../types'; import type { TeamMember } from '../../types';
export default function StudioPage() { const FALLBACK_MEMBERS: TeamMember[] = [
const [members, setMembers] = useState<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(() => { export default function StudioPage() {
teamApi.getMembers() const members = FALLBACK_MEMBERS;
.then(setMembers)
.catch(() => { /* show empty state */ });
}, []);
return ( return (
<div style={{ maxWidth: '1000px', margin: '0 auto', padding: '4rem 1.5rem' }}> <div style={{ maxWidth: '1000px', margin: '0 auto', padding: '4rem 1.5rem' }}>
@@ -41,9 +78,9 @@ export default function StudioPage() {
marginBottom: '1rem', marginBottom: '1rem',
}} }}
> >
CrowMate Studio is an independent game studio founded in 2023 by a team of six developers CrowMate Studio is an independent game studio founded in 2026 by a team of six developers
united by a shared obsession: games that are strange, atmospheric, and actually interesting. who are all new to game development and learning by building together. We are headquartered
We are headquartered somewhere in Europe and operate fully remote. somewhere in France and operate arround the globe.
</p> </p>
<p <p
style={{ style={{
@@ -60,6 +97,40 @@ export default function StudioPage() {
you don't need a $200 million budget to make something that sticks. you don't need a $200 million budget to make something that sticks.
</p> </p>
</div> </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> </div>
{/* History & Vision */} {/* History & Vision */}

View File

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

View File

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

View File

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

View File

@@ -8,7 +8,7 @@ const INTRANET_LINKS = [
{ to: '/intranet/feed', label: 'Team Feed', icon: '[~]', end: false }, { to: '/intranet/feed', label: 'Team Feed', icon: '[~]', end: false },
{ to: '/intranet/events', label: 'Events', icon: '[E]', end: false }, { to: '/intranet/events', label: 'Events', icon: '[E]', end: false },
{ to: '/intranet/users', label: 'Users', icon: '[U]', 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 }, { to: '/intranet/services', label: 'Services', icon: '[S]', end: false },
]; ];

View File

@@ -1,6 +1,7 @@
import { useState, useMemo, useCallback } from 'react'; import { useState, useMemo, useCallback, useEffect } from 'react';
import { useAuth } from '../../contexts/AuthContext'; import { useAuth } from '../../contexts/AuthContext';
import { formatDate, formatDateTime } from '../../utils/format'; import { formatDate, formatDateTime } from '../../utils/format';
import { settingsApi } from '../../utils/api';
import type { BugReport, BugSeverity, BugStatus, BugReportNote } from '../../types'; import type { BugReport, BugSeverity, BugStatus, BugReportNote } from '../../types';
function StatusBadge({ status }: { status: BugStatus }) { function StatusBadge({ status }: { status: BugStatus }) {
@@ -26,6 +27,20 @@ export default function IntranetBugs() {
const [severityFilter, setSeverityFilter] = useState<BugSeverity | 'all'>('all'); const [severityFilter, setSeverityFilter] = useState<BugSeverity | 'all'>('all');
const [assignedFilter, setAssignedFilter] = useState<string | 'all'>('all'); const [assignedFilter, setAssignedFilter] = useState<string | 'all'>('all');
const [noteText, setNoteText] = useState(''); 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 openCount = bugs.filter((b) => b.status === 'open').length;
const criticalCount = bugs.filter((b) => b.severity === 'critical').length; const criticalCount = bugs.filter((b) => b.severity === 'critical').length;
@@ -72,14 +87,65 @@ export default function IntranetBugs() {
setNoteText(''); setNoteText('');
}, [noteText, user]); }, [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 ( return (
<div style={{ display: 'grid', gridTemplateColumns: selected ? '1fr 400px' : '1fr', gap: '1.5rem', alignItems: 'start' }}> <div style={{ display: 'grid', gridTemplateColumns: selected ? '1fr 400px' : '1fr', gap: '1.5rem', alignItems: 'start' }}>
{/* Left panel */} {/* Left panel */}
<div> <div>
<div style={{ marginBottom: '1.5rem' }}> <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 INTRANET / BUG REPORTS
</div> </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> <h1 style={{ fontFamily: 'var(--font-heading)', color: 'var(--color-text)', fontSize: '1.8rem', marginBottom: '1rem' }}>BUG DASHBOARD</h1>
{/* Stats */} {/* Stats */}

View File

@@ -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/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/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/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>
</div> </div>

View File

@@ -1,5 +1,6 @@
import { useState, useMemo, useCallback } from 'react'; import { useState, useMemo, useCallback, useEffect } from 'react';
import { formatDateTime } from '../../utils/format'; import { formatDateTime } from '../../utils/format';
import { settingsApi } from '../../utils/api';
import type { ForumThread, ForumReply } from '../../types'; import type { ForumThread, ForumReply } from '../../types';
export default function IntranetModeration() { export default function IntranetModeration() {
@@ -8,6 +9,20 @@ export default function IntranetModeration() {
const [selectedThreadId, setSelectedThreadId] = useState<string | null>(null); const [selectedThreadId, setSelectedThreadId] = useState<string | null>(null);
const [search, setSearch] = useState(''); const [search, setSearch] = useState('');
const [activeTab, setActiveTab] = useState<'threads' | 'replies'>('threads'); 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(() => { const filteredThreads = useMemo(() => {
if (!search.trim()) return threads; if (!search.trim()) return threads;
@@ -43,8 +58,38 @@ export default function IntranetModeration() {
}, [replies]); }, [replies]);
return ( 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>
<div style={{ marginBottom: '1.75rem' }}> <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' }}> <div style={{ fontFamily: 'var(--font-mono)', color: 'var(--color-text-muted)', fontSize: '0.7rem', letterSpacing: '0.15em', marginBottom: '0.5rem' }}>
INTRANET / MODERATION INTRANET / MODERATION
</div> </div>
@@ -53,6 +98,28 @@ export default function IntranetModeration() {
{threads.length} threads &mdash; {replies.length} replies {threads.length} threads &mdash; {replies.length} replies
</p> </p>
</div> </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 */} {/* Tabs */}
<div style={{ display: 'flex', borderBottom: '1px solid var(--color-border)', marginBottom: '1.5rem', gap: 0 }}> <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> </div>
)}
</div>
); );
} }

View File

@@ -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),
}),
};