Removed useless stuff

ui/src/App.tsx

@@ -8,6 +8,7 @@ import { LandingPage } from "./pages/landing";
 import { ProtectedRoute } from "./components/ProtectedRoute";
 import { TabloPage } from "./pages/tablo";
 import { SessionProvider } from "./contexts/SessionContext";
+import { GoogleSigninPage } from "./pages/google-signin";
 
 export const App = () => {
   return (
@@ -29,14 +30,7 @@ export const App = () => {
                   </ProtectedRoute>
                 }
               />
-              <Route
-                path="/tablo/:id"
-                element={
-                  <ProtectedRoute>
-                    <TabloPage />
-                  </ProtectedRoute>
-                }
-              />
+              <Route path="/login-with-google" element={<GoogleSigninPage />} />
               <Route path="/landing" element={<LandingPage />} />
               <Route path="/login" element={<LoginPage />} />
               <Route path="/signup" element={<SignUpPage />} />

ui/src/components/header.tsx

@@ -1,16 +1,11 @@
-import { Button } from "./button";
-import { Switch } from "./switch";
+import { Button } from "../ui-library/button";
+import { Switch } from "../ui-library/switch";
 import { twMerge } from "tailwind-merge";
 import logo from "../assets/icon.jpg";
-import { useState } from "react";
-import { ConnectionForm } from "./connection-form";
-import { SignUpForm } from "./signup-form";
 import { Link, useNavigate } from "react-router-dom";
 import { useTheme } from "../contexts/ThemeContext";
 
 export function Header() {
-  const [showConnectionForm, setShowConnectionForm] = useState(false);
-  const [showSignUpForm, setShowSignUpForm] = useState(false);
   const navigate = useNavigate();
   const { theme, setTheme } = useTheme();
 
@@ -127,12 +122,6 @@ export function Header() {
           </nav>
         </div>
       </header>
-      {showConnectionForm && (
-        <ConnectionForm onClose={() => setShowConnectionForm(false)} />
-      )}
-      {showSignUpForm && (
-        <SignUpForm onClose={() => setShowSignUpForm(false)} />
-      )}
     </>
   );
 }

ui/src/hooks/auth.ts

@@ -1,4 +1,4 @@
-import { useMutation, useQuery } from "@tanstack/react-query";
+import { useMutation } from "@tanstack/react-query";
 import { useNavigate } from "react-router-dom";
 import { useState } from "react";
 import { match } from "ts-pattern";
@@ -8,7 +8,6 @@ import {
   Session,
   createClient,
 } from "@supabase/supabase-js";
-import { queryClient } from "../lib/api";
 
 export type User = SupabaseUser & {
   user_metadata: {
@@ -139,7 +138,7 @@ export function useLoginGoogle() {
       const { data, error } = await supabase.auth.signInWithOAuth({
         provider: "google",
         options: {
-          redirectTo: "http://localhost:5173/",
+          redirectTo: "http://localhost:5173/login-with-google",
         },
       });
       if (error) throw error;
@@ -149,32 +148,11 @@ export function useLoginGoogle() {
   return { loginWithGoogle: mutate };
 }
 
-export function useGetCurrentUser() {
-  const { data: user } = useQuery({
-    queryKey: ["currentUser"],
-    queryFn: async () => {
-      const { data } = await supabase.auth.getSession();
-      if (!data.session) {
-        throw new Error("No session found");
-      }
-      return data.session?.user;
-    },
-    retryDelay: 1000,
-    refetchInterval: 1000 * 60 * 10,
-  });
-  return { user: user as User | null };
-}
 export function useLogout() {
-  const navigate = useNavigate();
   return useMutation({
     mutationFn: async () => {
       const { error } = await supabase.auth.signOut();
       if (error) throw error;
     },
-    onSuccess: () => {
-      console.log("logout");
-      queryClient.invalidateQueries({ queryKey: ["currentUser"] });
-      navigate("/login");
-    },
   });
 }

ui/src/pages/google-signin.tsx

@@ -0,0 +1,12 @@
+import { useEffect } from "react";
+import { useNavigate } from "react-router-dom";
+
+export const GoogleSigninPage = () => {
+  const navigate = useNavigate();
+  useEffect(() => {
+    setTimeout(() => {
+      navigate("/");
+    }, 100);
+  }, [navigate]);
+  return <></>;
+};

ui/src/pages/landing.tsx

@@ -1,8 +1,8 @@
 import { Button } from "../ui-library/button";
-import { Header } from "../ui-library/header";
 import { twMerge } from "tailwind-merge";
 
 import logo from "../assets/icon.jpg";
+import { Header } from "../components/header";
 
 export const LandingPage = () => {
   return (

ui/src/pages/tablo.tsx

@@ -1,18 +1,18 @@
 import { SignOutButton } from "../components/SignOutButton";
 import { useSession } from "../contexts/SessionContext";
+import { Header } from "../components/header";
 
 export const TabloPage = () => {
   const { session } = useSession();
   return (
     <div className="min-h-screen">
-      <header className="bg-white dark:bg-gray-800 shadow">
-        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 flex justify-between items-center">
-          <h1 className="text-2xl font-bold text-gray-900 dark:text-white">
-            Tablo
-          </h1>
-          <SignOutButton />
-        </div>
-      </header>
+      <Header />
+      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-4 flex justify-between items-center">
+        <h1 className="text-2xl font-bold text-gray-900 dark:text-white">
+          Tablo
+        </h1>
+        <SignOutButton />
+      </div>
       <main className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6">
         <div className="container mx-auto px-4 py-8">
           <div className="flex justify-between items-center mb-8">

ui/src/ui-library/connection-form.tsx

@@ -1,137 +0,0 @@
-import { Button } from "./button";
-import { twMerge } from "tailwind-merge";
-import { useState } from "react";
-
-interface ConnectionFormProps {
-  onClose: () => void;
-}
-
-export function ConnectionForm({ onClose }: ConnectionFormProps) {
-  const [email, setEmail] = useState("");
-  const [password, setPassword] = useState("");
-
-  const handleSubmit = (e: React.FormEvent) => {
-    e.preventDefault();
-    // TODO: Implement connection logic
-    console.log("Connection attempt with:", { email, password });
-  };
-
-  return (
-    <div className="fixed inset-0 bg-black/50 backdrop-blur-sm flex items-center justify-center z-50">
-      <div
-        className={twMerge(
-          "bg-white dark:bg-slate-800 rounded-2xl p-8 w-full max-w-md",
-          "shadow-xl border border-slate-200 dark:border-slate-700"
-        )}
-      >
-        <div className="flex justify-between items-center mb-6">
-          <h2 className="text-2xl font-bold text-slate-900 dark:text-white">
-            Connexion
-          </h2>
-          <button
-            onClick={onClose}
-            className="text-slate-500 hover:text-slate-700 dark:text-slate-400 dark:hover:text-slate-200"
-          >
-            <svg
-              className="w-6 h-6"
-              fill="none"
-              stroke="currentColor"
-              viewBox="0 0 24 24"
-            >
-              <path
-                strokeLinecap="round"
-                strokeLinejoin="round"
-                strokeWidth="2"
-                d="M6 18L18 6M6 6l12 12"
-              />
-            </svg>
-          </button>
-        </div>
-
-        <form onSubmit={handleSubmit} className="space-y-4">
-          <div>
-            <label
-              htmlFor="email"
-              className="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-1"
-            >
-              Email
-            </label>
-            <input
-              type="email"
-              id="email"
-              value={email}
-              onChange={(e) => setEmail(e.target.value)}
-              className={twMerge(
-                "w-full px-4 py-2 rounded-lg border border-slate-300 dark:border-slate-600",
-                "bg-white dark:bg-slate-700 text-slate-900 dark:text-white",
-                "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-              )}
-              required
-            />
-          </div>
-
-          <div>
-            <label
-              htmlFor="password"
-              className="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-1"
-            >
-              Mot de passe
-            </label>
-            <input
-              type="password"
-              id="password"
-              value={password}
-              onChange={(e) => setPassword(e.target.value)}
-              className={twMerge(
-                "w-full px-4 py-2 rounded-lg border border-slate-300 dark:border-slate-600",
-                "bg-white dark:bg-slate-700 text-slate-900 dark:text-white",
-                "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-              )}
-              required
-            />
-          </div>
-
-          <div className="flex items-center justify-between">
-            <label className="flex items-center">
-              <input
-                type="checkbox"
-                className="rounded border-slate-300 dark:border-slate-600 text-blue-500 focus:ring-blue-500"
-              />
-              <span className="ml-2 text-sm text-slate-700 dark:text-slate-300">
-                Se souvenir de moi
-              </span>
-            </label>
-            <a
-              href="#"
-              className="text-sm text-blue-600 hover:text-blue-700 dark:text-blue-400 dark:hover:text-blue-300"
-            >
-              Mot de passe oublié ?
-            </a>
-          </div>
-
-          <Button
-            type="submit"
-            className={twMerge(
-              "w-full bg-blue-950 text-white hover:bg-blue-900",
-              "transition-colors"
-            )}
-          >
-            Se connecter
-          </Button>
-        </form>
-
-        <div className="mt-6 text-center">
-          <p className="text-sm text-slate-600 dark:text-slate-400">
-            Pas encore de compte ?{" "}
-            <a
-              href="#"
-              className="text-blue-600 hover:text-blue-700 dark:text-blue-400 dark:hover:text-blue-300"
-            >
-              S'inscrire
-            </a>
-          </p>
-        </div>
-      </div>
-    </div>
-  );
-}

ui/src/ui-library/signup-form.tsx

@@ -1,242 +0,0 @@
-import { Button } from "./button";
-import { twMerge } from "tailwind-merge";
-import { useState } from "react";
-
-interface SignUpFormProps {
-  onClose: () => void;
-}
-
-export function SignUpForm({ onClose }: SignUpFormProps) {
-  const [formData, setFormData] = useState({
-    firstName: "",
-    lastName: "",
-    email: "",
-    password: "",
-    confirmPassword: "",
-    company: "",
-  });
-
-  const handleSubmit = (e: React.FormEvent) => {
-    e.preventDefault();
-    // TODO: Implement sign up logic
-    console.log("Sign up attempt with:", formData);
-  };
-
-  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
-    const { name, value } = e.target;
-    setFormData((prev) => ({ ...prev, [name]: value }));
-  };
-
-  return (
-    <div className="fixed inset-0 bg-black/50 backdrop-blur-sm flex items-center justify-center z-50">
-      <div
-        className={twMerge(
-          "bg-white dark:bg-slate-800 rounded-2xl p-8 w-full max-w-md",
-          "shadow-xl border border-slate-200 dark:border-slate-700"
-        )}
-      >
-        <div className="flex justify-between items-center mb-6">
-          <h2 className="text-2xl font-bold text-slate-900 dark:text-white">
-            Créer un compte
-          </h2>
-          <button
-            onClick={onClose}
-            className="text-slate-500 hover:text-slate-700 dark:text-slate-400 dark:hover:text-slate-200"
-          >
-            <svg
-              className="w-6 h-6"
-              fill="none"
-              stroke="currentColor"
-              viewBox="0 0 24 24"
-            >
-              <path
-                strokeLinecap="round"
-                strokeLinejoin="round"
-                strokeWidth="2"
-                d="M6 18L18 6M6 6l12 12"
-              />
-            </svg>
-          </button>
-        </div>
-
-        <form onSubmit={handleSubmit} className="space-y-4">
-          <div className="grid grid-cols-2 gap-4">
-            <div>
-              <label
-                htmlFor="firstName"
-                className="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-1"
-              >
-                Prénom
-              </label>
-              <input
-                type="text"
-                id="firstName"
-                name="firstName"
-                value={formData.firstName}
-                onChange={handleChange}
-                className={twMerge(
-                  "w-full px-4 py-2 rounded-lg border border-slate-300 dark:border-slate-600",
-                  "bg-white dark:bg-slate-700 text-slate-900 dark:text-white",
-                  "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-                )}
-                required
-              />
-            </div>
-            <div>
-              <label
-                htmlFor="lastName"
-                className="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-1"
-              >
-                Nom
-              </label>
-              <input
-                type="text"
-                id="lastName"
-                name="lastName"
-                value={formData.lastName}
-                onChange={handleChange}
-                className={twMerge(
-                  "w-full px-4 py-2 rounded-lg border border-slate-300 dark:border-slate-600",
-                  "bg-white dark:bg-slate-700 text-slate-900 dark:text-white",
-                  "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-                )}
-                required
-              />
-            </div>
-          </div>
-
-          <div>
-            <label
-              htmlFor="company"
-              className="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-1"
-            >
-              Entreprise
-            </label>
-            <input
-              type="text"
-              id="company"
-              name="company"
-              value={formData.company}
-              onChange={handleChange}
-              className={twMerge(
-                "w-full px-4 py-2 rounded-lg border border-slate-300 dark:border-slate-600",
-                "bg-white dark:bg-slate-700 text-slate-900 dark:text-white",
-                "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-              )}
-              required
-            />
-          </div>
-
-          <div>
-            <label
-              htmlFor="email"
-              className="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-1"
-            >
-              Email
-            </label>
-            <input
-              type="email"
-              id="email"
-              name="email"
-              value={formData.email}
-              onChange={handleChange}
-              className={twMerge(
-                "w-full px-4 py-2 rounded-lg border border-slate-300 dark:border-slate-600",
-                "bg-white dark:bg-slate-700 text-slate-900 dark:text-white",
-                "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-              )}
-              required
-            />
-          </div>
-
-          <div>
-            <label
-              htmlFor="password"
-              className="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-1"
-            >
-              Mot de passe
-            </label>
-            <input
-              type="password"
-              id="password"
-              name="password"
-              value={formData.password}
-              onChange={handleChange}
-              className={twMerge(
-                "w-full px-4 py-2 rounded-lg border border-slate-300 dark:border-slate-600",
-                "bg-white dark:bg-slate-700 text-slate-900 dark:text-white",
-                "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-              )}
-              required
-            />
-          </div>
-
-          <div>
-            <label
-              htmlFor="confirmPassword"
-              className="block text-sm font-medium text-slate-700 dark:text-slate-300 mb-1"
-            >
-              Confirmer le mot de passe
-            </label>
-            <input
-              type="password"
-              id="confirmPassword"
-              name="confirmPassword"
-              value={formData.confirmPassword}
-              onChange={handleChange}
-              className={twMerge(
-                "w-full px-4 py-2 rounded-lg border border-slate-300 dark:border-slate-600",
-                "bg-white dark:bg-slate-700 text-slate-900 dark:text-white",
-                "focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent"
-              )}
-              required
-            />
-          </div>
-
-          <div className="flex items-center">
-            <input
-              type="checkbox"
-              id="terms"
-              className="rounded border-slate-300 dark:border-slate-600 text-blue-500 focus:ring-blue-500"
-              required
-            />
-            <label
-              htmlFor="terms"
-              className="ml-2 text-sm text-slate-700 dark:text-slate-300"
-            >
-              J'accepte les{" "}
-              <a
-                href="#"
-                className="text-blue-600 hover:text-blue-700 dark:text-blue-400 dark:hover:text-blue-300"
-              >
-                conditions d'utilisation
-              </a>
-            </label>
-          </div>
-
-          <Button
-            type="submit"
-            className={twMerge(
-              "w-full bg-blue-950 text-white hover:bg-blue-900",
-              "transition-colors"
-            )}
-          >
-            Créer mon compte
-          </Button>
-        </form>
-
-        <div className="mt-6 text-center">
-          <p className="text-sm text-slate-600 dark:text-slate-400">
-            Déjà un compte ?{" "}
-            <a
-              href="#"
-              className="text-blue-600 hover:text-blue-700 dark:text-blue-400 dark:hover:text-blue-300"
-            >
-              Se connecter
-            </a>
-          </p>
-        </div>
-      </div>
-    </div>
-  );
-}