fix: audit critique - sécurité, UX mobile et qualité de code

messages/en.json

@@ -343,6 +343,7 @@
     "noValidPlayers": "No valid players.",
     "noValidClubs": "No valid teams.",
     "noValidYears": "No valid years.",
-    "updateFailed": "Update failed."
+    "updateFailed": "Update failed.",
+    "payloadTooLarge": "Request body too large."
   }
 }

messages/fr.json

@@ -343,6 +343,7 @@
     "noValidPlayers": "Aucun joueur valide.",
     "noValidClubs": "Aucun club valide.",
     "noValidYears": "Aucune année valide.",
-    "updateFailed": "Échec de la mise à jour."
+    "updateFailed": "Échec de la mise à jour.",
+    "payloadTooLarge": "Corps de requête trop volumineux."
   }
 }

src/app/(app)/collection/loading.tsx

@@ -0,0 +1,19 @@
+export default function CollectionLoading() {
+  return (
+    <div className="space-y-6 animate-pulse">
+      <div className="space-y-2">
+        <div className="h-8 w-40 rounded bg-muted" />
+        <div className="h-4 w-56 rounded bg-muted" />
+      </div>
+      <div className="h-10 rounded-md bg-muted" />
+      <div className="space-y-2">
+        {Array.from({ length: 8 }).map((_, i) => (
+          <div
+            key={i}
+            className="h-14 rounded-lg border border-border bg-card"
+          />
+        ))}
+      </div>
+    </div>
+  );
+}

src/app/(app)/loading.tsx

@@ -0,0 +1,19 @@
+export default function AppLoading() {
+  return (
+    <div className="min-w-0 space-y-6 sm:space-y-8 animate-pulse">
+      <div className="min-w-0 space-y-2">
+        <div className="h-8 w-48 rounded bg-muted" />
+        <div className="h-4 w-64 rounded bg-muted" />
+      </div>
+      <div className="grid grid-cols-2 gap-4 sm:grid-cols-3 lg:grid-cols-6">
+        {Array.from({ length: 6 }).map((_, i) => (
+          <div
+            key={i}
+            className="h-24 rounded-lg border border-border bg-card"
+          />
+        ))}
+      </div>
+      <div className="h-64 rounded-lg border border-border bg-card" />
+    </div>
+  );
+}

src/app/(app)/player/loading.tsx

@@ -0,0 +1,18 @@
+export default function PlayersLoading() {
+  return (
+    <div className="space-y-6 animate-pulse">
+      <div className="space-y-2">
+        <div className="h-8 w-32 rounded bg-muted" />
+        <div className="h-4 w-48 rounded bg-muted" />
+      </div>
+      <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
+        {Array.from({ length: 6 }).map((_, i) => (
+          <div
+            key={i}
+            className="h-28 rounded-lg border border-border bg-card"
+          />
+        ))}
+      </div>
+    </div>
+  );
+}

src/app/api/auth/bootstrap/route.ts

@@ -12,8 +12,12 @@ import { hashPassword } from "@/lib/password";
 import { bootstrapFirstUser, type UserRecord } from "@/lib/users-store";
 import { authMisconfiguredResponse } from "@/lib/auth-config";
 import { checkRateLimit, getClientIp } from "@/lib/rate-limit";
+import { rejectCrossSiteMutation } from "@/lib/request-guard";
 
 export async function POST(request: NextRequest) {
+  const crossSite = rejectCrossSiteMutation(request);
+  if (crossSite) return crossSite;
+
   const misconfigured = authMisconfiguredResponse(request);
   if (misconfigured) return misconfigured;
 

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

@@ -7,7 +7,7 @@ import {
   SESSION_MAX_AGE_SEC,
 } from "@/lib/auth-session";
 import { loginSchema } from "@/lib/auth-validation";
-import { verifyPassword } from "@/lib/password";
+import { dummyVerify, verifyPassword } from "@/lib/password";
 import {
   checkRateLimit,
   getClientIp,
@@ -16,8 +16,12 @@ import {
 } from "@/lib/rate-limit";
 import { findUserByUsername } from "@/lib/users-store";
 import { authMisconfiguredResponse } from "@/lib/auth-config";
+import { rejectCrossSiteMutation } from "@/lib/request-guard";
 
 export async function POST(request: NextRequest) {
+  const crossSite = rejectCrossSiteMutation(request);
+  if (crossSite) return crossSite;
+
   const misconfigured = authMisconfiguredResponse(request);
   if (misconfigured) return misconfigured;
 
@@ -66,7 +70,10 @@ export async function POST(request: NextRequest) {
   }
 
   const user = findUserByUsername(username);
-  if (!user || !verifyPassword(password, user.passwordHash)) {
+  const passwordValid = user
+    ? verifyPassword(password, user.passwordHash)
+    : (dummyVerify(password), false);
+  if (!user || !passwordValid) {
     const failed = checkRateLimit(failureKey, {
       limit: 5,
       windowMs: 15 * 60 * 1000,

src/app/api/cards/route.ts

@@ -10,7 +10,10 @@ import {
   formatZodError,
 } from "@/lib/card-schema";
 import { getRequestTranslator } from "@/i18n/request";
-import { rejectCrossSiteMutation } from "@/lib/request-guard";
+import {
+  rejectCrossSiteMutation,
+  rejectOversizedBody,
+} from "@/lib/request-guard";
 
 export const dynamic = "force-dynamic";
 
@@ -26,6 +29,8 @@ export async function POST(request: NextRequest) {
   if (gate instanceof NextResponse) return gate;
   const crossSite = rejectCrossSiteMutation(request);
   if (crossSite) return crossSite;
+  const oversized = rejectOversizedBody(request);
+  if (oversized) return oversized;
   const t = getRequestTranslator(request);
 
   let body: unknown;
@@ -70,6 +75,8 @@ export async function PUT(request: NextRequest) {
   if (gate instanceof NextResponse) return gate;
   const crossSite = rejectCrossSiteMutation(request);
   if (crossSite) return crossSite;
+  const oversized = rejectOversizedBody(request);
+  if (oversized) return oversized;
   const t = getRequestTranslator(request);
 
   let body: unknown;
@@ -105,8 +112,15 @@ export async function DELETE(request: NextRequest) {
   const crossSite = rejectCrossSiteMutation(request);
   if (crossSite) return crossSite;
   const t = getRequestTranslator(request);
-  const { searchParams } = new URL(request.url);
-  const id = searchParams.get("id");
+
+  let id: string | null = null;
+  try {
+    const body = (await request.json()) as { id?: unknown };
+    id = typeof body.id === "string" ? body.id.trim() : null;
+  } catch {
+    const { searchParams } = new URL(request.url);
+    id = searchParams.get("id");
+  }
 
   if (!id) {
     return NextResponse.json(

src/app/api/health/route.ts

@@ -3,5 +3,8 @@ import { getDataHealth } from "@/lib/data";
 
 export async function GET() {
   const health = getDataHealth();
-  return NextResponse.json({ ok: health.ok }, { status: health.ok ? 200 : 503 });
+  return NextResponse.json(
+    { status: health.ok ? "healthy" : "degraded" },
+    { status: health.ok ? 200 : 503 }
+  );
 }

src/app/api/references/route.ts

@@ -20,7 +20,10 @@ import {
 } from "@/lib/reference-schema";
 import { getRequestTranslator } from "@/i18n/request";
 import type { Translator } from "@/i18n/translator";
-import { rejectCrossSiteMutation } from "@/lib/request-guard";
+import {
+  rejectCrossSiteMutation,
+  rejectOversizedBody,
+} from "@/lib/request-guard";
 
 export async function GET(request: NextRequest) {
   const gate = requireAuth(request);
@@ -143,6 +146,8 @@ export async function PATCH(request: NextRequest) {
   if (gate instanceof NextResponse) return gate;
   const crossSite = rejectCrossSiteMutation(request);
   if (crossSite) return crossSite;
+  const oversized = rejectOversizedBody(request);
+  if (oversized) return oversized;
   const t = getRequestTranslator(request);
 
   let body: unknown;

src/app/globals.css

@@ -124,9 +124,17 @@
   }
   body {
     @apply bg-background text-foreground;
+    -webkit-tap-highlight-color: transparent;
+    -webkit-text-size-adjust: 100%;
   }
   html {
     @apply font-sans scroll-smooth;
+    touch-action: manipulation;
+  }
+  input,
+  select,
+  textarea {
+    font-size: 16px;
   }
 }
 

src/app/layout.tsx

@@ -1,9 +1,17 @@
-import type { Metadata } from "next";
+import type { Metadata, Viewport } from "next";
 import { connection } from "next/server";
 import { LocaleProvider } from "@/i18n/client";
 import { getTranslations } from "@/i18n/server";
 import "./globals.css";
 
+export const viewport: Viewport = {
+  width: "device-width",
+  initialScale: 1,
+  maximumScale: 1,
+  viewportFit: "cover",
+  themeColor: "#0a0a0a",
+};
+
 export async function generateMetadata(): Promise<Metadata> {
   const { t } = await getTranslations();
   return {