From 34bab532be3c8285f6f2c6565ee875d01d4e78ba Mon Sep 17 00:00:00 2001
From: Tetardtek <kvnn64@gmail.com>
Date: Sat, 14 Mar 2026 10:04:20 +0100
Subject: [PATCH] =?UTF-8?q?fix:=20login=20=E2=86=92=20SuperOAuth=20root=20?=
 =?UTF-8?q?page=20(redirectUrl),=20drop=20LoginPage=20interne?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/App.tsx                      |  2 --
 frontend/src/components/layout/Header.tsx |  8 +++--
 frontend/src/pages/LoginPage.tsx          | 40 -----------------------
 3 files changed, 5 insertions(+), 45 deletions(-)
 delete mode 100644 frontend/src/pages/LoginPage.tsx

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 2e2a157..280f133 100644
--- a/frontend/src/App.tsx
+++ b/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 />} />
diff --git a/frontend/src/components/layout/Header.tsx b/frontend/src/components/layout/Header.tsx
index 952461f..873bc3e 100644
--- a/frontend/src/components/layout/Header.tsx
+++ b/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
-              to="/login"
+            <a
+              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>
 
diff --git a/frontend/src/pages/LoginPage.tsx b/frontend/src/pages/LoginPage.tsx
deleted file mode 100644
index f91166d..0000000
--- a/frontend/src/pages/LoginPage.tsx
+++ /dev/null
@@ -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>
-  );
-}