From fa90dd61f5e15f9af4a91bf0854c5d57c2978562 Mon Sep 17 00:00:00 2001
From: Arthur Belleville <arthur.belleville@datadoghq.com>
Date: Tue, 24 Jun 2025 21:20:24 +0200
Subject: [PATCH] Fix errors

---
 api/src/user.ts                          |  1 -
 ui/src/components/LoadingSpinner.tsx     | 10 ++++++++++
 ui/src/components/ProtectedRoute.tsx     | 13 ++-----------
 ui/src/components/SignOutButton.test.tsx |  2 +-
 ui/src/providers/UserStoreProvider.tsx   | 24 +++++++++++++++---------
 5 files changed, 28 insertions(+), 22 deletions(-)
 create mode 100644 ui/src/components/LoadingSpinner.tsx

diff --git a/api/src/user.ts b/api/src/user.ts
index 199d756..c530aed 100644
--- a/api/src/user.ts
+++ b/api/src/user.ts
@@ -22,7 +22,6 @@ userRouter.get("/get-stream-token", async (c) => {
       disableCache: true,
     }
   );
-  console.log({ user_id });
   const token = serverClient.createToken(user_id);
 
   return c.json({
diff --git a/ui/src/components/LoadingSpinner.tsx b/ui/src/components/LoadingSpinner.tsx
new file mode 100644
index 0000000..8beaca1
--- /dev/null
+++ b/ui/src/components/LoadingSpinner.tsx
@@ -0,0 +1,10 @@
+export const LoadingSpinner = () => {
+  return (
+    <div className="flex items-center justify-center min-h-screen">
+      <div
+        role="status"
+        className="animate-spin rounded-full h-16 w-16 border-t-2 border-b-2 border-emerald-500"
+      />
+    </div>
+  );
+};
diff --git a/ui/src/components/ProtectedRoute.tsx b/ui/src/components/ProtectedRoute.tsx
index e6204a2..fc1a607 100644
--- a/ui/src/components/ProtectedRoute.tsx
+++ b/ui/src/components/ProtectedRoute.tsx
@@ -2,6 +2,7 @@ import { useEffect, useState } from "react";
 import { Navigate, Outlet } from "react-router-dom";
 import { match } from "ts-pattern";
 import { useSession } from "@ui/contexts/SessionContext";
+import { LoadingSpinner } from "./LoadingSpinner";
 
 interface ProtectedRouteProps {
   fallback?: string;
@@ -9,7 +10,6 @@ interface ProtectedRouteProps {
 
 export const ProtectedRoute = ({ fallback }: ProtectedRouteProps) => {
   const { session } = useSession();
-  console.log({ session });
   const [isLoading, setIsLoading] = useState(true);
 
   useEffect(() => {
@@ -41,16 +41,7 @@ export const ProtectedRoute = ({ fallback }: ProtectedRouteProps) => {
   return (
     <>
       {match(status)
-        .with("loading", () => (
-          <div>
-            <div className="flex items-center justify-center min-h-screen">
-              <div
-                role="status"
-                className="animate-spin rounded-full h-16 w-16 border-t-2 border-b-2 border-emerald-500"
-              />
-            </div>
-          </div>
-        ))
+        .with("loading", () => <LoadingSpinner />)
         .with("should-land-user", () => <Navigate to="/landing" replace />)
         .with("should-redirect", () => (
           <Navigate to={fallback ?? "/login"} replace />
diff --git a/ui/src/components/SignOutButton.test.tsx b/ui/src/components/SignOutButton.test.tsx
index 1dd13f6..9f13dc9 100644
--- a/ui/src/components/SignOutButton.test.tsx
+++ b/ui/src/components/SignOutButton.test.tsx
@@ -45,7 +45,7 @@ describe("SignOutButton", () => {
     renderWithRouter(<SignOutButton />);
 
     // Click the button
-    fireEvent.click(screen.getByRole("button", { name: /Déconnexion/i }));
+    fireEvent.click(screen.getByRole("button", { name: /Se déconnecter/i }));
 
     // Check if logout was called
     expect(mockLogout).toHaveBeenCalled();
diff --git a/ui/src/providers/UserStoreProvider.tsx b/ui/src/providers/UserStoreProvider.tsx
index 41511c5..bf6b552 100644
--- a/ui/src/providers/UserStoreProvider.tsx
+++ b/ui/src/providers/UserStoreProvider.tsx
@@ -5,6 +5,7 @@ import { useQuery } from "@tanstack/react-query";
 import { Tables } from "@ui/types/database.types";
 import { useSession } from "@ui/contexts/SessionContext";
 import { api } from "@ui/lib/api";
+import { LoadingSpinner } from "@ui/components/LoadingSpinner";
 
 type User = Tables<"profiles"> & {
   streamToken: string | null;
@@ -23,14 +24,19 @@ export const UserStoreProvider = ({
     queryFn: async () => {
       const { data, error } = await supabase.from("profiles").select("*");
       if (error) throw error;
-      const {
-        data: { token },
-      } = await api.get("/api/v1/users/get-stream-token", {
-        headers: {
-          Authorization: `Bearer ${session?.access_token}`,
-        },
-      });
-      console.log({ token, data });
+      let token = null;
+      try {
+        const {
+          data: { token: streamToken },
+        } = await api.get("/api/v1/users/get-stream-token", {
+          headers: {
+            Authorization: `Bearer ${session?.access_token}`,
+          },
+        });
+        token = streamToken;
+      } catch (error) {
+        console.error("Failed to get stream token:", error);
+      }
       return {
         ...data[0],
         streamToken: token,
@@ -39,7 +45,7 @@ export const UserStoreProvider = ({
   });
 
   if (isPending) {
-    return <div>Loading...</div>;
+    return <LoadingSpinner />;
   }
 
   if (!data) {