fix: login → SuperOAuth root page (redirectUrl), drop LoginPage interne

frontend/src/App.tsx

@@ -2,7 +2,6 @@ import { useState, useEffect } from 'react';
 import { BrowserRouter, Routes, Route } from 'react-router-dom';
 import Layout from './components/layout/Layout';
 import HomePage from './pages/HomePage';
-import LoginPage from './pages/LoginPage';
 import CallbackPage from './pages/CallbackPage';
 import VideoPage from './pages/VideoPage';
 import PlaylistsPage from './pages/PlaylistsPage';
@@ -27,7 +26,6 @@ function App() {
       <Routes>
         <Route element={<Layout theme={theme} onToggleTheme={toggleTheme} />}>
           <Route path="/" element={<HomePage />} />
-          <Route path="/login" element={<LoginPage />} />
           <Route path="/video/:id" element={<VideoPage />} />
           <Route path="/playlists" element={<PlaylistsPage />} />
           <Route path="/playlists/:id" element={<PlaylistPage />} />

frontend/src/components/layout/Header.tsx

@@ -10,6 +10,8 @@ interface HeaderProps {
 }
 
 export default function Header({ theme, onToggleTheme, user, onLogout }: HeaderProps) {
+  const loginUrl = `${import.meta.env.VITE_SUPEROAUTH_URL}?redirectUrl=${encodeURIComponent(window.location.origin + '/callback')}`;
+
   async function handleLogout() {
     await apiFetch('/auth/logout', { method: 'POST' }).catch(() => {});
     onLogout();
@@ -62,12 +64,12 @@ export default function Header({ theme, onToggleTheme, user, onLogout }: HeaderP
               </button>
             </div>
           ) : (
-            <Link
+            <a
-              to="/login"
+              href={loginUrl}
               className="rounded border border-od-border px-3 py-1 font-mono text-xs text-od-muted hover:border-od-accent hover:text-od-accent transition-colors"
             >
               Connexion
-            </Link>
+            </a>
           )}
         </div>
 

frontend/src/pages/LoginPage.tsx

@@ -1,40 +0,0 @@
-import { Link } from 'react-router-dom';
-
-const PROVIDERS = [
-  { id: 'discord',  label: 'Discord',  icon: '◈' },
-  { id: 'github',   label: 'GitHub',   icon: '◉' },
-  { id: 'google',   label: 'Google',   icon: '◎' },
-  { id: 'twitch',   label: 'Twitch',   icon: '◆' },
-] as const;
-
-export default function LoginPage() {
-  const callbackUrl = encodeURIComponent(`${window.location.origin}/callback`);
-  const base = import.meta.env.VITE_SUPEROAUTH_URL;
-
-  return (
-    <div className="flex flex-col items-center gap-8 pt-20">
-      <div className="flex flex-col items-center gap-2">
-        <span className="font-mono text-xs font-bold tracking-widest text-od-accent">OD</span>
-        <h1 className="text-xl font-semibold text-od-text">Connexion</h1>
-        <p className="text-sm text-od-muted">Choisis ton provider pour continuer</p>
-      </div>
-
-      <div className="flex w-full max-w-xs flex-col gap-3">
-        {PROVIDERS.map(({ id, label, icon }) => (
-          <a
-            key={id}
-            href={`${base}/api/v1/auth/oauth/${id}?redirectUrl=${callbackUrl}`}
-            className="flex items-center gap-3 rounded border border-od-border bg-od-surface px-4 py-3 text-sm text-od-text transition-colors hover:border-od-accent hover:text-od-accent"
-          >
-            <span className="font-mono text-od-muted">{icon}</span>
-            {label}
-          </a>
-        ))}
-      </div>
-
-      <Link to="/" className="font-mono text-xs text-od-muted hover:text-od-text transition-colors">
-        ← Retour
-      </Link>
-    </div>
-  );
-}