frontend/src/app/login/page.tsx

@@ -1,12 +1,12 @@
 'use client';
 
-import { useEffect } from 'react';
+import { useEffect, Suspense } from 'react';
 import { signIn, signOut, useSession } from 'next-auth/react';
 import { useRouter, useSearchParams } from 'next/navigation';
 import { Card, CardHeader, CardTitle, CardContent, CardFooter } from '@/components/ui/card';
 import { Button } from '@/components/ui/button';
 
-export default function LoginPage() {
+function LoginContent() {
   const { status } = useSession();
   const router = useRouter();
   const searchParams = useSearchParams();
@@ -29,28 +29,36 @@ export default function LoginPage() {
     });
   };
 
+  return (
+    <Card className="w-96">
+      <CardHeader>
+        <CardTitle className="text-2xl text-center">WorkClub Manager</CardTitle>
+      </CardHeader>
+      <CardContent className="space-y-3">
+        <Button onClick={handleSignIn} className="w-full">
+          Sign in with Keycloak
+        </Button>
+        <Button variant="outline" onClick={handleSwitchAccount} className="w-full">
+          Use different credentials
+        </Button>
+      </CardContent>
+      {hasError && (
+        <CardFooter>
+          <p className="text-sm text-muted-foreground text-center w-full">
+            Having trouble? Try &quot;Use different credentials&quot; to clear your session.
+          </p>
+        </CardFooter>
+      )}
+    </Card>
+  );
+}
+
+export default function LoginPage() {
   return (
     <div className="flex items-center justify-center min-h-screen bg-gray-50">
-      <Card className="w-96">
+      <Suspense fallback={<Card className="w-96 p-6 text-center">Loading...</Card>}>
-        <CardHeader>
+        <LoginContent />
-          <CardTitle className="text-2xl text-center">WorkClub Manager</CardTitle>
+      </Suspense>
-        </CardHeader>
-        <CardContent className="space-y-3">
-          <Button onClick={handleSignIn} className="w-full">
-            Sign in with Keycloak
-          </Button>
-          <Button variant="outline" onClick={handleSwitchAccount} className="w-full">
-            Use different credentials
-          </Button>
-        </CardContent>
-        {hasError && (
-          <CardFooter>
-            <p className="text-sm text-muted-foreground text-center w-full">
-              Having trouble? Try &quot;Use different credentials&quot; to clear your session.
-            </p>
-          </CardFooter>
-        )}
-      </Card>
     </div>
   );
 }

frontend/src/hooks/useShifts.ts

@@ -111,7 +111,6 @@ export function useSignUpShift() {
         method: 'POST',
       });
       if (!res.ok) throw new Error('Failed to sign up');
-      return res.json();
     },
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: ['shifts', activeClubId] });