feat: integrate auth

.claude/settings.local.json

@@ -10,7 +10,8 @@
       "Bash(ren page.tsx page-original.tsx)",
       "Bash(ren:*)",
       "Bash(npx supabase:*)",
-      "Bash(libs/service/src/types/supabase.ts)"
+      "Bash(libs/service/src/types/supabase.ts)",
+      "Bash(npx nx build:*)"
     ],
     "deny": [],
     "ask": []

apps/hackathon/src/app/auth/callback/page.tsx

@@ -1,11 +1,11 @@
 import { FC, ReactElement, useEffect, useState, useRef } from 'react';
 import { useNavigate } from 'react-router';
-import { useAuthStore, supabase } from '@imphnen-frontend-service/service';
+import { useGitHubCallback } from '@imphnen-frontend-service/service';
 import { toast } from 'sonner';
 
 const CallbackPage: FC = (): ReactElement => {
   const navigate = useNavigate();
-  const { setSession } = useAuthStore();
+  const { mutateAsync: exchangeGitHubCode } = useGitHubCallback();
   const [isProcessing, setIsProcessing] = useState(true);
   const [error, setError] = useState<string | null>(null);
   const hasRunRef = useRef(false);
@@ -13,134 +13,33 @@ const CallbackPage: FC = (): ReactElement => {
   useEffect(() => {
     const handleCallback = async () => {
       if (hasRunRef.current) {
-        // console.log('[Callback] Already processed, skipping...');
         return;
       }
       hasRunRef.current = true;
+
       try {
-        // console.log('[Callback] Processing OAuth callback...');
+        // Get the code from URL query params
-        // console.log('[Callback] Current URL:', globalThis.location.href);
+        const urlParams = new URLSearchParams(globalThis.location.search);
+        const code = urlParams.get('code');
 
-        // Supabase client is configured with detectSessionInUrl: true
+        if (!code) {
-        // This means Supabase automatically detects and processes OAuth tokens from the URL hash
+          throw new Error('No authorization code received from GitHub');
-        // We just need to wait a moment for it to complete, then check for the session
-
-        // console.log('[Callback] Waiting for Supabase to process OAuth callback...');
-        await new Promise((resolve) => setTimeout(resolve, 1000));
-
-        // Get the session that Supabase automatically created from the URL hash
-        const {
-          data: { session: sessionData },
-          error: sessionError,
-        } = await supabase.auth.getSession();
-
-        if (sessionError) {
-          // console.error('[Callback] Session error:', sessionError);
-          throw new Error(sessionError.message || 'Failed to get session');
         }
 
-        if (!sessionData || !sessionData.user) {
+        // Exchange the code for tokens using backend API
-          throw new Error(
+        const result = await exchangeGitHubCode({ code });
-            'No session found after OAuth callback. Please try logging in again.'
-          );
-        }
 
-        // console.log('[Callback] Supabase session established:', {
-        //   userId: sessionData.user.id,
-        //   email: sessionData.user.email,
-        // });
-
-        // Create/update user in the users table (for foreign key constraints)
-        // console.log('[Callback] Creating/updating user record...');
-        const { data: userData, error: upsertError } = await supabase
-          .from('users')
-          .upsert(
-            {
-              id: sessionData.user.id,
-              email: sessionData.user.email || '',
-              fullname:
-                sessionData.user.user_metadata?.full_name ||
-                sessionData.user.user_metadata?.name ||
-                sessionData.user.email?.split('@')[0] ||
-                '',
-              avatar: sessionData.user.user_metadata?.avatar_url || '',
-              is_active: true,
-              updated_at: new Date().toISOString(),
-            },
-            {
-              onConflict: 'id',
-            }
-          )
-          .select()
-          .single();
-
-        if (upsertError) {
-          // console.warn('[Callback] Failed to create user record:', upsertError);
-          // Don't throw - continue with login even if user record creation fails
-        } else {
-          // console.log('[Callback] User record created/updated successfully');
-        }
-
-        // Store user-friendly data in Zustand for UI purposes
-        // Supabase now manages the actual auth session
-        // Use data from database if available, otherwise use OAuth metadata
-        const userRecord = userData || {
-          id: sessionData.user.id,
-          email: sessionData.user.email || '',
-          fullname:
-            sessionData.user.user_metadata?.full_name ||
-            sessionData.user.user_metadata?.name ||
-            sessionData.user.email?.split('@')[0] ||
-            '',
-          avatar: sessionData.user.user_metadata?.avatar_url || '',
-          phone_number: '',
-          birthdate: '',
-          gender: '',
-          is_active: true,
-        };
-
-        setSession({
-          token: {
-            access_token: sessionData.access_token,
-            refresh_token: sessionData.refresh_token || '',
-          },
-          user: {
-            id: userRecord.id,
-            email: userRecord.email,
-            fullname: userRecord.fullname,
-            phone_number: userRecord.phone_number || '',
-            avatar: userRecord.avatar || '',
-            birthdate: userRecord.birthdate || '',
-            gender: userRecord.gender || '',
-            is_active: userRecord.is_active,
-            location: userRecord.location,
-            bio: userRecord.bio,
-            skills: userRecord.skills,
-            role: {
-              id: '',
-              name: 'user',
-              permissions: [],
-              created_at: '',
-              updated_at: '',
-            },
-          },
-        });
-
-        // console.log('[Callback] Session stored successfully');
         toast.success('Login successful!');
         setIsProcessing(false);
 
         // Check if user has completed onboarding (has location)
-        // Use globalThis.location.replace for hard redirect to prevent history issues
+        if (result.user.location) {
-        if (userRecord.location) {
-          // console.log('[Callback] User has completed onboarding, redirecting to dashboard...');
           globalThis.location.replace('/dashboard');
         } else {
-          // console.log('[Callback] User needs onboarding, redirecting...');
           globalThis.location.replace('/onboarding/user');
         }
       } catch (err) {
-        // console.error('[Callback] Error:', err);
+        console.error('[Callback] Error:', err);
         setError((err as Error).message);
         setIsProcessing(false);
         toast.error('An error occurred during login');
@@ -153,21 +52,21 @@ const CallbackPage: FC = (): ReactElement => {
 
     handleCallback();
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []); // Run only once on mount
+  }, []);
 
   if (error) {
     return (
-      <div className="flex justify-center items-center min-h-screen bg-gray-50 px-4">
+      <div className="flex justify-center items-center min-h-screen bg-gray-50 dark:bg-gray-950 px-4">
-        <div className="bg-white w-full max-w-2xl p-8 rounded-2xl shadow-lg border border-red-200">
+        <div className="bg-white dark:bg-gray-900 w-full max-w-2xl p-8 rounded-2xl shadow-lg border border-red-200 dark:border-red-800">
           <div className="text-center mb-6">
             <div className="text-red-500 text-5xl mb-4">⚠️</div>
-            <h2 className="text-2xl font-bold text-gray-900 mb-2">
+            <h2 className="text-2xl font-bold text-gray-900 dark:text-white mb-2">
               GitHub Login Failed
             </h2>
-            <p className="text-red-600 mb-4 whitespace-pre-line">{error}</p>
+            <p className="text-red-600 dark:text-red-400 mb-4 whitespace-pre-line">{error}</p>
           </div>
 
-          <p className="text-gray-600 text-sm mt-6 text-center">
+          <p className="text-gray-600 dark:text-gray-400 text-sm mt-6 text-center">
             Redirecting to login page in 3 seconds...
           </p>
         </div>

apps/hackathon/src/app/auth/login/page.tsx

@@ -1,9 +1,7 @@
 import { useState } from 'react';
 import {
   useGitHubAuth,
-  useEmailAuth,
+  useLogin,
-  supabase,
-  useAuthStore,
 } from '@imphnen-frontend-service/service';
 import { GithubOutlined } from '@ant-design/icons';
 import { useNavigate, Link } from 'react-router';
@@ -12,14 +10,10 @@ import { Icon } from '@iconify/react';
 import { ThemeToggle } from '../../../components/theme-toggle';
 
 export default function LoginPage() {
-  // console.log('[LoginPage] Rendering...');
-
   const navigate = useNavigate();
-  const { setSession } = useAuthStore();
   const { signInWithGitHub } = useGitHubAuth();
-  const { signInWithEmail } = useEmailAuth();
+  const loginMutation = useLogin();
   const [isGithubLoading, setIsGithubLoading] = useState(false);
-  const [isEmailLoading, setIsEmailLoading] = useState(false);
   const [email, setEmail] = useState('');
   const [password, setPassword] = useState('');
   const [error, setError] = useState<string | null>(null);
@@ -34,52 +28,12 @@ export default function LoginPage() {
     }
 
     try {
-      setIsEmailLoading(true);
+      const result = await loginMutation.mutateAsync({ email, password });
-      // console.log('[Login] Attempting email login...');
-
-      const result = await signInWithEmail(email, password);
-      // console.log('[Login] Email login successful:', result);
-
-      // Get user data from database
-      const { data: userData } = await supabase
-        .from('users')
-        .select('*')
-        .eq('id', result.user.id)
-        .single();
-
-      // Store session in Zustand
-      setSession({
-        token: {
-          access_token: result.session.access_token,
-          refresh_token: result.session.refresh_token || '',
-        },
-        user: {
-          id: result.user.id,
-          email: result.user.email || '',
-          fullname:
-            userData?.fullname || result.user.user_metadata?.full_name || '',
-          phone_number: userData?.phone_number || '',
-          avatar: userData?.avatar || '',
-          birthdate: userData?.birthdate || '',
-          gender: userData?.gender || '',
-          is_active: userData?.is_active || true,
-          location: userData?.location,
-          bio: userData?.bio,
-          skills: userData?.skills,
-          role: {
-            id: '',
-            name: 'user',
-            permissions: [],
-            created_at: '',
-            updated_at: '',
-          },
-        },
-      });
 
       toast.success('Login successful!');
 
       // Redirect based on onboarding status
-      if (userData?.location) {
+      if (result.user.location) {
         navigate('/dashboard');
       } else {
         navigate('/onboarding/user');
@@ -87,29 +41,25 @@ export default function LoginPage() {
     } catch (err) {
       console.error('[Login] Email login failed:', err);
       setError((err as Error).message || 'Login failed');
-      setIsEmailLoading(false);
     }
   };
 
   const handleGithubLogin = async () => {
     try {
       setIsGithubLoading(true);
-      // console.log('[Login] Initiating GitHub OAuth...');
 
       const result = await signInWithGitHub();
-      // console.log('[Login] OAuth result:', result);
 
       // Check if we got a redirect URL
       if (result?.url) {
-        // console.log('[Login] Redirecting to GitHub OAuth:', result.url);
-        // Manually redirect immediately
         globalThis.location.href = result.url;
       } else {
-        // console.error('[Login] No OAuth URL returned');
         setIsGithubLoading(false);
+        setError('Failed to get GitHub OAuth URL');
       }
-    } catch (error) {
+    } catch (err) {
-      // console.error('[Login] GitHub login failed');
+      console.error('[Login] GitHub login failed:', err);
+      setError((err as Error).message || 'GitHub login failed');
       setIsGithubLoading(false);
     }
   };
@@ -157,7 +107,7 @@ export default function LoginPage() {
               value={email}
               onChange={(e) => setEmail(e.target.value)}
               placeholder="your@email.com"
-              disabled={isEmailLoading}
+              disabled={loginMutation.isPending}
               className="w-full px-4 py-2.5 border border-gray-300 dark:border-gray-600 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent bg-white dark:bg-gray-800 text-gray-900 dark:text-white placeholder:text-gray-400 dark:placeholder:text-gray-500 disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed"
               required
             />
@@ -184,7 +134,7 @@ export default function LoginPage() {
               value={password}
               onChange={(e) => setPassword(e.target.value)}
               placeholder="••••••••"
-              disabled={isEmailLoading}
+              disabled={loginMutation.isPending}
               className="w-full px-4 py-2.5 border border-gray-300 dark:border-gray-600 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent bg-white dark:bg-gray-800 text-gray-900 dark:text-white placeholder:text-gray-400 dark:placeholder:text-gray-500 disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed"
               required
             />
@@ -192,10 +142,10 @@ export default function LoginPage() {
 
           <button
             type="submit"
-            disabled={isEmailLoading}
+            disabled={loginMutation.isPending}
             className="w-full py-3 bg-primary-600 text-white rounded-lg font-semibold hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2 dark:focus:ring-offset-gray-900 disabled:bg-gray-400 dark:disabled:bg-gray-600 disabled:cursor-not-allowed transition-colors cursor-pointer"
           >
-            {isEmailLoading ? 'Signing in...' : 'Sign in with Email'}
+            {loginMutation.isPending ? 'Signing in...' : 'Sign in with Email'}
           </button>
         </form>
 

apps/hackathon/src/app/auth/signup/page.tsx

@@ -1,9 +1,7 @@
 import { useState } from 'react';
 import {
   useGitHubAuth,
-  useEmailAuth,
+  useSignup,
-  supabase,
-  useAuthStore,
 } from '@imphnen-frontend-service/service';
 import { GithubOutlined } from '@ant-design/icons';
 import { useNavigate } from 'react-router';
@@ -13,11 +11,9 @@ import { ThemeToggle } from '../../../components/theme-toggle';
 
 export default function SignupPage() {
   const navigate = useNavigate();
-  const { setSession } = useAuthStore();
   const { signInWithGitHub } = useGitHubAuth();
-  const { signUpWithEmail } = useEmailAuth();
+  const signupMutation = useSignup();
   const [isGithubLoading, setIsGithubLoading] = useState(false);
-  const [isEmailLoading, setIsEmailLoading] = useState(false);
   const [fullname, setFullname] = useState('');
   const [email, setEmail] = useState('');
   const [password, setPassword] = useState('');
@@ -44,95 +40,31 @@ export default function SignupPage() {
     }
 
     try {
-      setIsEmailLoading(true);
+      await signupMutation.mutateAsync({ email, password, fullname });
-      // console.log('[Signup] Attempting email signup...');
 
-      const result = await signUpWithEmail(email, password, fullname);
+      toast.success('Account created successfully!');
-      // console.log('[Signup] Email signup successful:', result);
+      navigate('/onboarding/user');
-
-      if (!result.user) {
-        throw new Error('Signup failed - no user returned');
-      }
-
-      // Create user record in database
-      const { error: upsertError } = await supabase.from('users').upsert(
-        {
-          id: result.user.id,
-          email: result.user.email || '',
-          fullname: fullname,
-          is_active: true,
-          updated_at: new Date().toISOString(),
-        },
-        {
-          onConflict: 'id',
-        }
-      );
-
-      if (upsertError) {
-        console.warn('[Signup] Failed to create user record');
-      }
-
-      // If session is available (email confirmation disabled), store it
-      if (result.session) {
-        setSession({
-          token: {
-            access_token: result.session.access_token,
-            refresh_token: result.session.refresh_token || '',
-          },
-          user: {
-            id: result.user.id,
-            email: result.user.email || '',
-            fullname: fullname,
-            phone_number: '',
-            avatar: '',
-            birthdate: '',
-            gender: '',
-            is_active: true,
-            role: {
-              id: '',
-              name: 'user',
-              permissions: [],
-              created_at: '',
-              updated_at: '',
-            },
-          },
-        });
-
-        toast.success('Account created successfully!');
-        navigate('/onboarding/user');
-      } else {
-        // Email confirmation is enabled
-        toast.success(
-          'Account created! Please check your email to verify your account.'
-        );
-        setTimeout(() => {
-          navigate('/auth/login');
-        }, 2000);
-      }
     } catch (err) {
-      // console.error('[Signup] Email signup failed:', err);
+      console.error('[Signup] Email signup failed:', err);
       setError((err as Error).message || 'Signup failed');
-      setIsEmailLoading(false);
     }
   };
 
   const handleGithubLogin = async () => {
     try {
       setIsGithubLoading(true);
-      // console.log('[Signup] Initiating GitHub OAuth...');
 
       const result = await signInWithGitHub();
-      // console.log('[Signup] OAuth result:', result);
 
       if (result?.url) {
-        // console.log('[Signup] Redirecting to GitHub OAuth:', result.url);
         globalThis.location.href = result.url;
       } else {
-        // console.error('[Signup] No OAuth URL returned');
         setIsGithubLoading(false);
+        setError('Failed to get GitHub OAuth URL');
       }
-    } catch (error) {
+    } catch (err) {
-      // console.error('[Signup] GitHub login failed:', error);
+      console.error('[Signup] GitHub login failed:', err);
+      setError((err as Error).message || 'GitHub login failed');
       setIsGithubLoading(false);
     }
   };
@@ -180,7 +112,7 @@ export default function SignupPage() {
               value={fullname}
               onChange={(e) => setFullname(e.target.value)}
               placeholder="John Doe"
-              disabled={isEmailLoading}
+              disabled={signupMutation.isPending}
               className="w-full px-4 py-2.5 border border-gray-300 dark:border-gray-600 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent bg-white dark:bg-gray-800 text-gray-900 dark:text-white placeholder:text-gray-400 dark:placeholder:text-gray-500 disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed"
               required
             />
@@ -199,7 +131,7 @@ export default function SignupPage() {
               value={email}
               onChange={(e) => setEmail(e.target.value)}
               placeholder="your@email.com"
-              disabled={isEmailLoading}
+              disabled={signupMutation.isPending}
               className="w-full px-4 py-2.5 border border-gray-300 dark:border-gray-600 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent bg-white dark:bg-gray-800 text-gray-900 dark:text-white placeholder:text-gray-400 dark:placeholder:text-gray-500 disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed"
               required
             />
@@ -218,7 +150,7 @@ export default function SignupPage() {
               value={password}
               onChange={(e) => setPassword(e.target.value)}
               placeholder="••••••••"
-              disabled={isEmailLoading}
+              disabled={signupMutation.isPending}
               className="w-full px-4 py-2.5 border border-gray-300 dark:border-gray-600 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent bg-white dark:bg-gray-800 text-gray-900 dark:text-white placeholder:text-gray-400 dark:placeholder:text-gray-500 disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed"
               required
             />
@@ -237,7 +169,7 @@ export default function SignupPage() {
               value={confirmPassword}
               onChange={(e) => setConfirmPassword(e.target.value)}
               placeholder="••••••••"
-              disabled={isEmailLoading}
+              disabled={signupMutation.isPending}
               className="w-full px-4 py-2.5 border border-gray-300 dark:border-gray-600 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 focus:border-transparent bg-white dark:bg-gray-800 text-gray-900 dark:text-white placeholder:text-gray-400 dark:placeholder:text-gray-500 disabled:bg-gray-100 dark:disabled:bg-gray-700 disabled:cursor-not-allowed"
               required
             />
@@ -245,10 +177,10 @@ export default function SignupPage() {
 
           <button
             type="submit"
-            disabled={isEmailLoading}
+            disabled={signupMutation.isPending}
             className="w-full py-3 bg-primary-600 text-white rounded-lg font-semibold hover:bg-primary-700 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2 dark:focus:ring-offset-gray-900 disabled:bg-gray-400 dark:disabled:bg-gray-600 disabled:cursor-not-allowed transition-colors cursor-pointer"
           >
-            {isEmailLoading ? 'Creating account...' : 'Create Account'}
+            {signupMutation.isPending ? 'Creating account...' : 'Create Account'}
           </button>
         </form>
 

libs/service/src/api/hackathon.ts

@@ -0,0 +1,55 @@
+import axios from 'axios';
+import { useAuthStore } from '../hooks/auth';
+
+// Hackathon Backend API Base URL
+const HACKATHON_API_URL = 'https://api.hackathon.imphnen.dev/api/v1';
+
+// Create axios instance for hackathon backend
+export const hackathonApi = axios.create({
+  baseURL: HACKATHON_API_URL,
+  headers: {
+    'Content-Type': 'application/json',
+  },
+});
+
+// Add auth token interceptor
+hackathonApi.interceptors.request.use(
+  (config) => {
+    const { session } = useAuthStore.getState();
+    if (session?.token) {
+      config.headers.Authorization = `Bearer ${session.token}`;
+    }
+    return config;
+  },
+  (error) => {
+    return Promise.reject(new Error(error.message || 'Request failed'));
+  }
+);
+
+// Error handling interceptor
+hackathonApi.interceptors.response.use(
+  (response) => response,
+  (error) => {
+    // Handle 401 - clear session and redirect to login
+    if (error.response?.status === 401) {
+      useAuthStore.getState().clearSession();
+      if (typeof window !== 'undefined') {
+        window.location.href = '/auth/login';
+      }
+    }
+
+    // If backend sends a message, use it
+    const backendMsg = error?.response?.data?.message;
+    if (backendMsg && typeof backendMsg === 'string') {
+      return Promise.reject(new Error(backendMsg));
+    }
+
+    return Promise.reject(new Error(error.message || 'Request failed'));
+  }
+);
+
+// API Response wrapper type
+export interface HackathonApiResponse<T> {
+  data: T;
+  message?: string;
+}

libs/service/src/api/index.ts

@@ -5,6 +5,7 @@ export * from './gacha';
 export * from './users';
 export * from './mentors';
 export * from './upload';
+export * from './hackathon';
 
 // Common API response wrapper interface
 export interface ApiResponse<T> {

libs/service/src/hooks/auth/index.ts

@@ -1,57 +1,278 @@
-import { supabase } from '../../supabase';
+import { useMutation, useQuery } from '@tanstack/react-query';
-import { useMutation } from '@tanstack/react-query';
+import { hackathonApi, HackathonApiResponse } from '../../api/hackathon';
-import * as authApi from '../../api/auth';
+import { useAuthStore } from './use-auth-store';
 
 export * from './use-auth-store';
 
-// React Query hooks for auth API
+// Types matching backend response
-export const usePostLogin = () => {
+interface TokenInfo {
+  access_token: string;
+  refresh_token: string;
+}
+
+interface User {
+  id: string;
+  email: string;
+  fullname: string;
+  phone_number?: string;
+  avatar?: string;
+  birthdate?: string;
+  gender?: string;
+  is_active: boolean;
+  location?: string;
+  bio?: string;
+  skills?: string[];
+  role_id?: string;
+  created_at: string;
+  updated_at?: string;
+}
+
+interface AuthResponse {
+  token: TokenInfo;
+  user: User;
+}
+
+interface SessionResponse {
+  user: User;
+}
+
+interface MessageResponse {
+  message: string;
+}
+
+// Login request type
+interface LoginRequest {
+  email: string;
+  password: string;
+}
+
+// Signup request type
+interface SignupRequest {
+  email: string;
+  password: string;
+  fullname: string;
+}
+
+// GitHub auth request type
+interface GitHubAuthRequest {
+  code: string;
+}
+
+// Forgot password request type
+interface ForgotPasswordRequest {
+  email: string;
+}
+
+// Reset password request type
+interface ResetPasswordRequest {
+  access_token: string;
+  new_password: string;
+}
+
+// Backend API-based auth hooks
+
+// Email/Password Login
+export const useLogin = () => {
+  const { setSession } = useAuthStore();
+
   return useMutation({
-    mutationFn: authApi.postLogin,
+    mutationFn: async (data: LoginRequest) => {
+      const response = await hackathonApi.post<HackathonApiResponse<AuthResponse>>(
+        '/auth/login',
+        data
+      );
+      return response.data.data;
+    },
+    onSuccess: (data) => {
+      setSession({
+        token: data.token,
+        user: {
+          id: data.user.id,
+          email: data.user.email,
+          fullname: data.user.fullname,
+          phone_number: data.user.phone_number || '',
+          avatar: data.user.avatar || '',
+          birthdate: data.user.birthdate || '',
+          gender: data.user.gender || '',
+          is_active: data.user.is_active,
+          location: data.user.location,
+          bio: data.user.bio,
+          skills: data.user.skills,
+          role: {
+            id: '',
+            name: 'user',
+            permissions: [],
+            created_at: '',
+            updated_at: '',
+          },
+        },
+      });
+    },
   });
 };
 
-export const usePostRegister = () => {
+// Email/Password Signup
+export const useSignup = () => {
+  const { setSession } = useAuthStore();
+
   return useMutation({
-    mutationFn: authApi.postRegister,
+    mutationFn: async (data: SignupRequest) => {
+      const response = await hackathonApi.post<HackathonApiResponse<AuthResponse>>(
+        '/auth/signup',
+        data
+      );
+      return response.data.data;
+    },
+    onSuccess: (data) => {
+      setSession({
+        token: data.token,
+        user: {
+          id: data.user.id,
+          email: data.user.email,
+          fullname: data.user.fullname,
+          phone_number: data.user.phone_number || '',
+          avatar: data.user.avatar || '',
+          birthdate: data.user.birthdate || '',
+          gender: data.user.gender || '',
+          is_active: data.user.is_active,
+          location: data.user.location,
+          bio: data.user.bio,
+          skills: data.user.skills,
+          role: {
+            id: '',
+            name: 'user',
+            permissions: [],
+            created_at: '',
+            updated_at: '',
+          },
+        },
+      });
+    },
   });
 };
 
-export const usePostVerifyEmail = () => {
+// GitHub OAuth - exchange code for token
+export const useGitHubCallback = () => {
+  const { setSession } = useAuthStore();
+
   return useMutation({
-    mutationFn: authApi.postVerifyEmail,
+    mutationFn: async (data: GitHubAuthRequest) => {
+      const response = await hackathonApi.post<HackathonApiResponse<AuthResponse>>(
+        '/auth/github',
+        data
+      );
+      return response.data.data;
+    },
+    onSuccess: (data) => {
+      setSession({
+        token: data.token,
+        user: {
+          id: data.user.id,
+          email: data.user.email,
+          fullname: data.user.fullname,
+          phone_number: data.user.phone_number || '',
+          avatar: data.user.avatar || '',
+          birthdate: data.user.birthdate || '',
+          gender: data.user.gender || '',
+          is_active: data.user.is_active,
+          location: data.user.location,
+          bio: data.user.bio,
+          skills: data.user.skills,
+          role: {
+            id: '',
+            name: 'user',
+            permissions: [],
+            created_at: '',
+            updated_at: '',
+          },
+        },
+      });
+    },
   });
 };
 
-export const usePostSendOtp = () => {
+// Get current session (protected)
-  return useMutation({
+export const useSession = () => {
-    mutationFn: authApi.postSendOtp,
+  const { session } = useAuthStore();
+
+  return useQuery({
+    queryKey: ['auth-session'],
+    queryFn: async () => {
+      const response = await hackathonApi.get<HackathonApiResponse<SessionResponse>>(
+        '/auth/session'
+      );
+      return response.data.data;
+    },
+    enabled: !!session?.token,
   });
 };
 
-export const useGoogleCallback = () => {
+// Forgot password
+export const useForgotPassword = () => {
   return useMutation({
-    mutationFn: ({ code, state }: { code: string; state: string }) =>
+    mutationFn: async (data: ForgotPasswordRequest) => {
-      authApi.postGoogleCallback(code, state),
+      const response = await hackathonApi.post<HackathonApiResponse<MessageResponse>>(
+        '/auth/forgot-password',
+        data
+      );
+      return response.data.data;
+    },
   });
 };
 
-// Supabase GitHub OAuth hook
+// Reset password
+export const useResetPassword = () => {
+  return useMutation({
+    mutationFn: async (data: ResetPasswordRequest) => {
+      const response = await hackathonApi.post<HackathonApiResponse<MessageResponse>>(
+        '/auth/reset-password',
+        data
+      );
+      return response.data.data;
+    },
+  });
+};
+
+// Sign out (clears local session)
+export const useSignOut = () => {
+  const { clearSession } = useAuthStore();
+
+  return useMutation({
+    mutationFn: async () => {
+      // No backend call needed - just clear local session
+      clearSession();
+      return { success: true };
+    },
+  });
+};
+
+// GitHub OAuth URL helper
+// The frontend needs to redirect to GitHub with the client_id
+// After GitHub redirects back with a code, use useGitHubCallback
+export const getGitHubOAuthUrl = (clientId: string, redirectUri: string) => {
+  const params = new URLSearchParams({
+    client_id: clientId,
+    redirect_uri: redirectUri,
+    scope: 'read:user user:email',
+  });
+  return `https://github.com/login/oauth/authorize?${params.toString()}`;
+};
+
+// Backward compatibility hooks - these wrap the new backend API
+
+// GitHub OAuth hook (backward compatible)
 export const useGitHubAuth = () => {
   const signInWithGitHub = async () => {
-    const { data, error } = await supabase.auth.signInWithOAuth({
+    // Get GitHub client ID from environment
-      provider: 'github',
+    const clientId = import.meta.env.VITE_GITHUB_CLIENT_ID || '';
-      options: {
+    if (!clientId) {
-        redirectTo: `${globalThis.location.origin}/auth/callback`,
+      throw new Error('GitHub Client ID not configured. Set VITE_GITHUB_CLIENT_ID environment variable.');
-      },
-    });
-
-    if (error) {
-      throw error;
     }
 
-    // Return the OAuth URL for debugging
+    const redirectUri = `${globalThis.location.origin}/auth/callback`;
-    return data;
+    const url = getGitHubOAuthUrl(clientId, redirectUri);
+
+    return { url };
   };
 
   return {
@@ -59,45 +280,36 @@ export const useGitHubAuth = () => {
   };
 };
 
-// Supabase Email/Password authentication hook
+// Email/Password auth hook (backward compatible)
 export const useEmailAuth = () => {
+  const loginMutation = useLogin();
+  const signupMutation = useSignup();
+  const { clearSession } = useAuthStore();
+
   const signInWithEmail = async (email: string, password: string) => {
-    const { data, error } = await supabase.auth.signInWithPassword({
+    const result = await loginMutation.mutateAsync({ email, password });
-      email,
+    return {
-      password,
+      user: result.user,
-    });
+      session: {
-
+        access_token: result.token.access_token,
-    if (error) {
+        refresh_token: result.token.refresh_token,
-      throw error;
+      },
-    }
+    };
-
-    return data;
   };
 
   const signUpWithEmail = async (email: string, password: string, fullname: string) => {
-    const { data, error } = await supabase.auth.signUp({
+    const result = await signupMutation.mutateAsync({ email, password, fullname });
-      email,
+    return {
-      password,
+      user: result.user,
-      options: {
+      session: {
-        data: {
+        access_token: result.token.access_token,
-          full_name: fullname,
+        refresh_token: result.token.refresh_token,
-        },
       },
-    });
+    };
-
-    if (error) {
-      throw error;
-    }
-
-    return data;
   };
 
   const signOut = async () => {
-    const { error } = await supabase.auth.signOut();
+    clearSession();
-
-    if (error) {
-      throw error;
-    }
   };
 
   return {
@@ -106,3 +318,58 @@ export const useEmailAuth = () => {
     signOut,
   };
 };
+
+// Legacy hooks for old API compatibility (deprecated)
+
+/** @deprecated Use useLogin instead */
+export const usePostLogin = () => {
+  return useMutation({
+    mutationFn: async (data: LoginRequest) => {
+      const response = await hackathonApi.post<HackathonApiResponse<AuthResponse>>(
+        '/auth/login',
+        data
+      );
+      return { data: response.data.data };
+    },
+  });
+};
+
+/** @deprecated Use useSignup instead */
+export const usePostRegister = () => {
+  return useMutation({
+    mutationFn: async (data: SignupRequest) => {
+      const response = await hackathonApi.post<HackathonApiResponse<AuthResponse>>(
+        '/auth/signup',
+        data
+      );
+      return { data: response.data.data };
+    },
+  });
+};
+
+/** @deprecated Not needed with new backend */
+export const usePostVerifyEmail = () => {
+  return useMutation({
+    mutationFn: async () => {
+      throw new Error('Email verification not required with new backend');
+    },
+  });
+};
+
+/** @deprecated Not needed with new backend */
+export const usePostSendOtp = () => {
+  return useMutation({
+    mutationFn: async () => {
+      throw new Error('OTP not required with new backend');
+    },
+  });
+};
+
+/** @deprecated Use useGitHubCallback instead */
+export const useGoogleCallback = () => {
+  return useMutation({
+    mutationFn: async () => {
+      throw new Error('Google OAuth not supported. Use GitHub OAuth instead.');
+    },
+  });
+};

libs/service/src/hooks/messages/index.ts

@@ -1,7 +1,6 @@
 import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
-import { supabase } from '../../supabase';
+import { hackathonApi, HackathonApiResponse } from '../../api/hackathon';
 import { useAuthStore } from '../auth';
-import { useEffect } from 'react';
 
 export type Message = {
   id: string;
@@ -24,101 +23,22 @@ export const messageKeys = {
   team: (teamId: string) => [...messageKeys.all, 'team', teamId] as const,
 };
 
-// Fetch messages for a team
+// Fetch messages for a team with polling
 export const useTeamMessages = (teamId: string) => {
-  const queryClient = useQueryClient();
+  return useQuery({
-
-  const query = useQuery({
     queryKey: messageKeys.team(teamId),
     queryFn: async () => {
-      const { data: messages, error } = await supabase
+      const response = await hackathonApi.get<HackathonApiResponse<Message[]>>(
-        .from('team_messages')
+        `/chat/teams/${teamId}`
-        .select(`
+      );
-          id,
+      return response.data.data || [];
-          team_id,
-          user_id,
-          message,
-          created_at,
-          updated_at,
-          user:users(id, fullname, avatar, email)
-        `)
-        .eq('team_id', teamId)
-        .order('created_at', { ascending: true });
-
-      if (error) {
-        console.error('Failed to fetch messages:', error);
-        throw new Error(error.message || 'Failed to fetch messages');
-      }
-
-      return messages as Message[];
     },
     enabled: !!teamId,
+    // Poll every 3 seconds for new messages
+    refetchInterval: 3000,
+    // Keep refetching even when window loses focus
+    refetchIntervalInBackground: true,
   });
-
-  // Subscribe to realtime updates
-  useEffect(() => {
-    if (!teamId) return;
-
-    const channel = supabase
-      .channel(`team_messages:${teamId}`)
-      .on(
-        'postgres_changes',
-        {
-          event: 'INSERT',
-          schema: 'public',
-          table: 'team_messages',
-          filter: `team_id=eq.${teamId}`,
-        },
-        async (payload) => {
-          console.log('[Realtime] New message:', payload);
-
-          // Fetch the full message with user data
-          const { data: newMessage } = await supabase
-            .from('team_messages')
-            .select(`
-              id,
-              team_id,
-              user_id,
-              message,
-              created_at,
-              updated_at,
-              user:users(id, fullname, avatar, email)
-            `)
-            .eq('id', payload.new.id)
-            .single();
-
-          if (newMessage) {
-            queryClient.setQueryData<Message[]>(
-              messageKeys.team(teamId),
-              (old) => [...(old || []), newMessage as Message]
-            );
-          }
-        }
-      )
-      .on(
-        'postgres_changes',
-        {
-          event: 'DELETE',
-          schema: 'public',
-          table: 'team_messages',
-          filter: `team_id=eq.${teamId}`,
-        },
-        (payload) => {
-          console.log('[Realtime] Message deleted:', payload);
-          queryClient.setQueryData<Message[]>(
-            messageKeys.team(teamId),
-            (old) => old?.filter((msg) => msg.id !== payload.old.id) || []
-          );
-        }
-      )
-      .subscribe();
-
-    return () => {
-      supabase.removeChannel(channel);
-    };
-  }, [teamId, queryClient]);
-
-  return query;
 };
 
 // Send a message
@@ -132,26 +52,15 @@ export const useSendMessage = (teamId: string) => {
         throw new Error('You must be logged in to send messages');
       }
 
-      const { data, error } = await supabase
+      const response = await hackathonApi.post<HackathonApiResponse<Message>>(
-        .from('team_messages')
+        `/chat/teams/${teamId}`,
-        .insert({
+        { message }
-          team_id: teamId,
+      );
-          user_id: session.user.id,
-          message,
-        })
-        .select()
-        .single();
 
-      if (error) {
+      return response.data.data;
-        console.error('Failed to send message:', error);
-        throw new Error(error.message || 'Failed to send message');
-      }
-
-      return data;
     },
     onSuccess: () => {
-      // Realtime will handle adding the message to the list
+      // Invalidate to trigger immediate refetch
-      // But we can invalidate to ensure consistency
       queryClient.invalidateQueries({ queryKey: messageKeys.team(teamId) });
     },
   });
@@ -163,18 +72,9 @@ export const useDeleteMessage = (teamId: string) => {
 
   return useMutation({
     mutationFn: async (messageId: string) => {
-      const { error } = await supabase
+      await hackathonApi.delete(`/chat/messages/${messageId}`);
-        .from('team_messages')
-        .delete()
-        .eq('id', messageId);
-
-      if (error) {
-        console.error('Failed to delete message:', error);
-        throw new Error(error.message || 'Failed to delete message');
-      }
     },
     onSuccess: () => {
-      // Realtime will handle removing the message from the list
       queryClient.invalidateQueries({ queryKey: messageKeys.team(teamId) });
     },
   });

libs/service/src/hooks/teams/index.ts

@@ -1,6 +1,5 @@
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
-import * as teamsApi from '../../api/teams';
+import { hackathonApi, HackathonApiResponse } from '../../api/hackathon';
-import { supabase, getAuthenticatedClient } from '../../supabase';
 import { useAuthStore } from '../auth';
 import type {
   TCreateTeamRequest,
@@ -24,6 +23,89 @@ export const teamKeys = {
   myInvitations: () => [...teamKeys.all, 'my-invitations'] as const,
 };
 
+// API response types
+interface TeamMember {
+  id: string;
+  team_id: string;
+  user_id: string;
+  role: string;
+  status: string;
+  joined_at: string;
+  user?: {
+    id: string;
+    email: string;
+    fullname: string;
+    avatar: string;
+  };
+}
+
+interface Team {
+  id: string;
+  name: string;
+  logo?: string;
+  banner?: string;
+  description?: string;
+  city?: string;
+  visibility: string;
+  leader_id: string;
+  created_at: string;
+  leader?: {
+    id: string;
+    email: string;
+    fullname: string;
+    avatar: string;
+  };
+  members?: TeamMember[];
+  member_count?: number;
+  has_submission?: boolean;
+}
+
+interface JoinRequest {
+  id: string;
+  team_id: string;
+  user_id: string;
+  message?: string;
+  status: string;
+  created_at: string;
+  user?: {
+    id: string;
+    email: string;
+    fullname: string;
+    avatar: string;
+  };
+}
+
+interface Invitation {
+  id: string;
+  team_id: string;
+  inviter_id: string;
+  invitee_email: string;
+  invitee_id?: string;
+  status: string;
+  created_at: string;
+  team?: Team;
+  inviter?: {
+    id: string;
+    fullname: string;
+    email: string;
+    avatar: string;
+  };
+}
+
+interface Submission {
+  id: string;
+  team_id: string;
+  project_name: string;
+  description?: string;
+  repository_url?: string;
+  demo_url?: string;
+  video_url?: string;
+  presentation_url?: string;
+  status: string;
+  submitted_at?: string;
+  created_at: string;
+}
+
 // Team CRUD Hooks
 export const useTeams = (params?: {
   page?: number;
@@ -35,49 +117,16 @@ export const useTeams = (params?: {
   return useQuery({
     queryKey: teamKeys.list(params),
     queryFn: async () => {
-      try {
+      const queryParams = new URLSearchParams();
-        // Supabase client now has auth context from setSession()
+      if (params?.search) queryParams.append('search', params.search);
-        let query = supabase.from('teams').select(`
+      if (params?.city) queryParams.append('city', params.city);
-          *,
+      if (params?.visibility) queryParams.append('visibility', params.visibility);
-          members:team_members(id)
-        `);
 
-        // Filter by visibility
+      const response = await hackathonApi.get<HackathonApiResponse<Team[]>>(
-        if (params?.visibility) {
+        `/teams/browse${queryParams.toString() ? `?${queryParams.toString()}` : ''}`
-          query = query.eq('visibility', params.visibility);
+      );
-        }
 
-        // Filter by city
+      return { data: response.data.data || [] };
-        if (params?.city) {
-          query = query.eq('city', params.city);
-        }
-
-        // Search by name
-        if (params?.search) {
-          query = query.ilike('name', `%${params.search}%`);
-        }
-
-        // Pagination
-        if (params?.page && params?.limit) {
-          const from = (params.page - 1) * params.limit;
-          const to = from + params.limit - 1;
-          query = query.range(from, to);
-        }
-
-        const { data, error } = await query;
-
-        if (error) {
-          // If error is 401/403, it means RLS policies need to be set up
-          // Return empty array for now
-          console.warn('Teams query error (RLS policies may need to be configured):', error);
-          return { data: [] };
-        }
-
-        return { data: data || [] };
-      } catch (err) {
-        console.error('Failed to fetch teams:', err);
-        return { data: [] };
-      }
     },
   });
 };
@@ -86,45 +135,8 @@ export const useTeamById = (teamId: string, enabled = true) => {
   return useQuery({
     queryKey: teamKeys.detail(teamId),
     queryFn: async () => {
-      // Supabase client now has auth context from setSession()
+      const response = await hackathonApi.get<HackathonApiResponse<Team>>(`/teams/${teamId}`);
-      const { data: team, error } = await supabase
+      return { data: response.data.data };
-        .from('teams')
-        .select(`
-          *,
-          leader:users!leader_id(id, email, fullname, avatar),
-          members:team_members(
-            id,
-            role,
-            status,
-            joined_at,
-            user:users(id, email, fullname, avatar)
-          )
-        `)
-        .eq('id', teamId)
-        .single();
-
-      if (error) {
-        console.error('Failed to fetch team:', error);
-        throw new Error(error.message || 'Failed to fetch team');
-      }
-
-      // Count active members
-      const activeMemberCount = team?.members?.filter((m: any) => m.status === 'active').length || 0;
-
-      // Check if team has a submission
-      const { data: submission } = await supabase
-        .from('project_submissions')
-        .select('id')
-        .eq('team_id', teamId)
-        .maybeSingle();
-
-      return {
-        data: {
-          ...team,
-          member_count: activeMemberCount,
-          has_submission: !!submission,
-        },
-      };
     },
     enabled: enabled && !!teamId,
   });
@@ -140,50 +152,16 @@ export const useCreateTeam = () => {
         throw new Error('You must be logged in to create a team');
       }
 
-      // Supabase client now has auth context from setSession()
+      const response = await hackathonApi.post<HackathonApiResponse<Team>>('/teams', {
-      const { data: team, error: teamError } = await supabase
+        name: data.name,
-        .from('teams')
+        logo: data.logo,
-        .insert({
+        banner: data.banner,
-          name: data.name,
+        description: data.description,
-          logo: data.logo,
+        city: data.city,
-          banner: data.banner,
+        visibility: data.visibility,
-          description: data.description,
+      });
-          city: data.city,
-          visibility: data.visibility,
-          leader_id: session.user.id,
-        })
-        .select()
-        .single();
 
-      if (teamError) {
+      return { data: response.data.data };
-        console.error('Failed to create team:', teamError);
-        throw new Error(teamError.message || 'Failed to create team');
-      }
-
-      // Insert team creator as leader in team_members table
-      const { error: memberError } = await supabase
-        .from('team_members')
-        .insert({
-          team_id: team.id,
-          user_id: session.user.id,
-          role: 'leader',
-          status: 'active',
-        });
-
-      if (memberError) {
-        // If duplicate key error (23505), it means leader is already a member (possibly by trigger)
-        // This is acceptable, so we can ignore it
-        if (memberError.code === '23505') {
-          console.log('Team leader already exists in team_members (likely added by trigger)');
-        } else {
-          // For other errors, clean up and throw
-          console.error('Failed to add team leader as member:', memberError);
-          await supabase.from('teams').delete().eq('id', team.id);
-          throw new Error('Failed to set up team membership');
-        }
-      }
-
-      return { data: team };
     },
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: teamKeys.lists() });
@@ -202,27 +180,16 @@ export const useUpdateTeam = (teamId: string) => {
         throw new Error('You must be logged in to update a team');
       }
 
-      // Supabase client now has auth context from setSession()
+      const response = await hackathonApi.put<HackathonApiResponse<Team>>(`/teams/${teamId}`, {
-      const { data: team, error } = await supabase
+        name: data.name,
-        .from('teams')
+        logo: data.logo,
-        .update({
+        banner: data.banner,
-          name: data.name,
+        description: data.description,
-          logo: data.logo,
+        city: data.city,
-          banner: data.banner,
+        visibility: data.visibility,
-          description: data.description,
+      });
-          city: data.city,
-          visibility: data.visibility,
-        })
-        .eq('id', teamId)
-        .select()
-        .single();
 
-      if (error) {
+      return { data: response.data.data };
-        console.error('Failed to update team:', error);
-        throw new Error(error.message || 'Failed to update team');
-      }
-
-      return { data: team };
     },
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: teamKeys.detail(teamId) });
@@ -231,32 +198,13 @@ export const useUpdateTeam = (teamId: string) => {
   });
 };
 
-// Team Members Hooks
+// Team Members Hooks - using team detail endpoint which includes members
 export const useTeamMembers = (teamId: string, enabled = true) => {
   return useQuery({
     queryKey: teamKeys.members(teamId),
     queryFn: async () => {
-      // Supabase client now has auth context from setSession()
+      const response = await hackathonApi.get<HackathonApiResponse<Team>>(`/teams/${teamId}`);
-      const { data: members, error } = await supabase
+      return { data: response.data.data?.members || [] };
-        .from('team_members')
-        .select(`
-          id,
-          team_id,
-          user_id,
-          role,
-          status,
-          joined_at,
-          user:users(id, email, fullname, avatar)
-        `)
-        .eq('team_id', teamId)
-        .order('joined_at', { ascending: true });
-
-      if (error) {
-        console.error('Failed to fetch team members:', error);
-        throw new Error(error.message || 'Failed to fetch team members');
-      }
-
-      return { data: members || [] };
     },
     enabled: enabled && !!teamId,
   });
@@ -272,24 +220,12 @@ export const useInviteMember = (teamId: string) => {
         throw new Error('You must be logged in to invite a member');
       }
 
-      // Insert invitation into team_invitations table
+      const response = await hackathonApi.post<HackathonApiResponse<Invitation>>(
-      const { data: invitation, error } = await supabase
+        `/teams/${teamId}/invite`,
-        .from('team_invitations')
+        { invitee_email: data.email }
-        .insert({
+      );
-          team_id: teamId,
-          inviter_id: session.user.id,
-          invitee_email: data.email,
-          status: 'pending',
-        })
-        .select()
-        .single();
 
-      if (error) {
+      return { data: response.data.data };
-        console.error('Failed to create invitation:', error);
-        throw new Error(error.message || 'Failed to send invitation');
-      }
-
-      return { data: invitation };
     },
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: teamKeys.members(teamId) });
@@ -301,8 +237,11 @@ export const useManageMember = (teamId: string) => {
   const queryClient = useQueryClient();
 
   return useMutation({
-    mutationFn: ({ userId, data }: { userId: string; data: any }) =>
+    mutationFn: async ({ userId, data }: { userId: string; data: { role?: string; status?: string } }) => {
-      teamsApi.manageMember(teamId, userId, data),
+      // This endpoint may not exist in the backend yet
+      // For now, we'll throw an error indicating it's not implemented
+      throw new Error('Manage member functionality not yet implemented in backend');
+    },
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: teamKeys.members(teamId) });
       queryClient.invalidateQueries({ queryKey: teamKeys.detail(teamId) });
@@ -320,38 +259,7 @@ export const useRemoveMember = (teamId: string) => {
         throw new Error('You must be logged in to remove a member');
       }
 
-      // Verify the current user is the team leader
+      await hackathonApi.delete(`/teams/${teamId}/members/${userId}`);
-      const { data: team, error: teamError } = await supabase
-        .from('teams')
-        .select('leader_id')
-        .eq('id', teamId)
-        .single();
-
-      if (teamError || !team) {
-        throw new Error('Team not found');
-      }
-
-      if (team.leader_id !== session.user.id) {
-        throw new Error('Only the team leader can remove members');
-      }
-
-      // Cannot remove the leader
-      if (userId === team.leader_id) {
-        throw new Error('Cannot remove the team leader');
-      }
-
-      // Delete the team member record
-      const { error: deleteError } = await supabase
-        .from('team_members')
-        .delete()
-        .eq('team_id', teamId)
-        .eq('user_id', userId);
-
-      if (deleteError) {
-        console.error('Failed to remove member:', deleteError);
-        throw new Error(deleteError.message || 'Failed to remove member');
-      }
-
       return { success: true };
     },
     onSuccess: () => {
@@ -372,24 +280,12 @@ export const useJoinTeam = () => {
         throw new Error('You must be logged in to join a team');
       }
 
-      // Insert join request into team_join_requests table
+      const response = await hackathonApi.post<HackathonApiResponse<JoinRequest>>(
-      const { data: joinRequest, error } = await supabase
+        `/join-requests/teams/${teamId}`,
-        .from('team_join_requests')
+        { message: data.message }
-        .insert({
+      );
-          team_id: teamId,
-          user_id: session.user.id,
-          message: data.message,
-          status: 'pending',
-        })
-        .select()
-        .single();
 
-      if (error) {
+      return { data: response.data.data };
-        console.error('Failed to create join request:', error);
-        throw new Error(error.message || 'Failed to send join request');
-      }
-
-      return { data: joinRequest };
     },
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: teamKeys.lists() });
@@ -401,28 +297,10 @@ export const useTeamJoinRequests = (teamId: string, enabled = true) => {
   return useQuery({
     queryKey: teamKeys.joinRequests(teamId),
     queryFn: async () => {
-      // Fetch join requests with user information
+      const response = await hackathonApi.get<HackathonApiResponse<JoinRequest[]>>(
-      const { data: requests, error } = await supabase
+        `/join-requests/teams/${teamId}/pending`
-        .from('team_join_requests')
+      );
-        .select(`
+      return { data: response.data.data || [] };
-          id,
-          team_id,
-          user_id,
-          message,
-          status,
-          created_at,
-          user:users(id, email, fullname, avatar)
-        `)
-        .eq('team_id', teamId)
-        .eq('status', 'pending')
-        .order('created_at', { ascending: false });
-
-      if (error) {
-        console.error('Failed to fetch join requests:', error);
-        throw new Error(error.message || 'Failed to fetch join requests');
-      }
-
-      return { data: requests || [] };
     },
     enabled: enabled && !!teamId,
   });
@@ -438,76 +316,14 @@ export const useRespondToJoinRequest = (teamId: string) => {
         throw new Error('You must be logged in to respond to join requests');
       }
 
-      // First, get the join request details
+      // Backend uses 'accept' instead of 'approve'
-      const { data: joinRequest, error: fetchError } = await supabase
+      const backendAction = action === 'approve' ? 'accept' : 'reject';
-        .from('team_join_requests')
-        .select('id, team_id, user_id, status')
-        .eq('id', requestId)
-        .single();
 
-      if (fetchError || !joinRequest) {
+      await hackathonApi.post(`/join-requests/${requestId}/respond`, {
-        throw new Error('Join request not found');
+        action: backendAction,
-      }
+      });
 
-      if (joinRequest.status !== 'pending') {
+      return { success: true, action };
-        throw new Error('Join request has already been processed');
-      }
-
-      if (action === 'approve') {
-        // Update join request status
-        const { error: updateError } = await supabase
-          .from('team_join_requests')
-          .update({ status: 'accepted' })
-          .eq('id', requestId);
-
-        if (updateError) {
-          throw new Error('Failed to update join request: ' + updateError.message);
-        }
-
-        // Add user as team member
-        const { error: memberError } = await supabase
-          .from('team_members')
-          .insert({
-            team_id: joinRequest.team_id,
-            user_id: joinRequest.user_id,
-            role: 'member',
-            status: 'active',
-          });
-
-        if (memberError) {
-          // If member creation fails, rollback join request update
-          await supabase
-            .from('team_join_requests')
-            .update({ status: 'pending' })
-            .eq('id', requestId);
-
-          // Parse Supabase error for user-friendly message
-          let errorMsg = memberError.message;
-          if (errorMsg.includes('Team already has 5 members') || errorMsg.includes('Team cannot have more than 5 members')) {
-            errorMsg = 'Team is full! Maximum 5 members allowed.';
-          } else if (errorMsg.includes('already in a team') || errorMsg.includes('User is already in a team')) {
-            errorMsg = 'This user is already in another team.';
-          } else if (errorMsg.includes('Bulk insert')) {
-            errorMsg = 'Invalid operation detected.';
-          }
-
-          throw new Error(errorMsg);
-        }
-
-        return { success: true, action: 'accepted' };
-      } else {
-        // Reject join request
-        const { error: updateError } = await supabase
-          .from('team_join_requests')
-          .update({ status: 'rejected' })
-          .eq('id', requestId);
-
-        if (updateError) {
-          throw new Error('Failed to update join request: ' + updateError.message);
-        }
-
-        return { success: true, action: 'rejected' };
-      }
     },
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: teamKeys.joinRequests(teamId) });
@@ -524,49 +340,10 @@ export const useMyInvitations = () => {
   return useQuery({
     queryKey: teamKeys.myInvitations(),
     queryFn: async () => {
-      if (!session?.user?.email) {
+      const response = await hackathonApi.get<HackathonApiResponse<Invitation[]>>('/invitations/my');
-        return { data: [] };
+      return { data: response.data.data || [] };
-      }
-
-      // Query team_invitations where invitee_email matches current user's email
-      const { data: invitations, error } = await supabase
-        .from('team_invitations')
-        .select(`
-          id,
-          team_id,
-          inviter_id,
-          invitee_email,
-          invitee_id,
-          status,
-          created_at,
-          team:teams(
-            id,
-            name,
-            logo,
-            banner,
-            description,
-            city,
-            visibility,
-            leader_id
-          ),
-          inviter:users!team_invitations_inviter_id_fkey(
-            id,
-            fullname,
-            email,
-            avatar
-          )
-        `)
-        .eq('invitee_email', session.user.email)
-        .eq('status', 'pending');
-
-      if (error) {
-        console.error('Failed to fetch invitations:', error);
-        return { data: [] };
-      }
-
-      return { data: invitations || [] };
     },
-    enabled: !!session?.user?.email,
+    enabled: !!session?.user?.id,
   });
 };
 
@@ -580,75 +357,9 @@ export const useRespondToInvitation = () => {
         throw new Error('User not authenticated');
       }
 
-      // First, get the invitation details
+      await hackathonApi.post(`/invitations/${invitationId}/respond`, { action });
-      const { data: invitation, error: fetchError } = await supabase
-        .from('team_invitations')
-        .select('id, team_id, invitee_email, status')
-        .eq('id', invitationId)
-        .single();
 
-      if (fetchError || !invitation) {
+      return { success: true, action };
-        throw new Error('Invitation not found');
-      }
-
-      if (invitation.status !== 'pending') {
-        throw new Error('Invitation has already been responded to');
-      }
-
-      if (action === 'accept') {
-        // Update invitation status and set invitee_id
-        const { error: updateError } = await supabase
-          .from('team_invitations')
-          .update({
-            status: 'accepted',
-            invitee_id: session.user.id,
-          })
-          .eq('id', invitationId);
-
-        if (updateError) {
-          throw new Error('Failed to update invitation: ' + updateError.message);
-        }
-
-        // Create team_members record
-        const { error: memberError } = await supabase
-          .from('team_members')
-          .insert({
-            team_id: invitation.team_id,
-            user_id: session.user.id,
-            role: 'member',
-            status: 'active',
-          });
-
-        if (memberError) {
-          // If member creation fails, rollback invitation update
-          await supabase
-            .from('team_invitations')
-            .update({
-              status: 'pending',
-              invitee_id: null,
-            })
-            .eq('id', invitationId);
-
-          throw new Error('Failed to add member to team: ' + memberError.message);
-        }
-
-        return { success: true, action: 'accepted' };
-      } else {
-        // Reject invitation
-        const { error: updateError } = await supabase
-          .from('team_invitations')
-          .update({
-            status: 'rejected',
-            invitee_id: session.user.id,
-          })
-          .eq('id', invitationId);
-
-        if (updateError) {
-          throw new Error('Failed to update invitation: ' + updateError.message);
-        }
-
-        return { success: true, action: 'rejected' };
-      }
     },
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: teamKeys.myInvitations() });
@@ -665,39 +376,8 @@ export const useMyTeams = () => {
   return useQuery({
     queryKey: teamKeys.myTeams(),
     queryFn: async () => {
-      if (!session?.user?.id) {
+      const response = await hackathonApi.get<HackathonApiResponse<Team[]>>('/teams/my');
-        return { data: [] };
+      return { data: response.data.data || [] };
-      }
-
-      // Query team_members to find teams where user is a member
-      const { data: memberships, error: membershipsError } = await supabase
-        .from('team_members')
-        .select(`
-          team_id,
-          team:teams(
-            id,
-            name,
-            logo,
-            banner,
-            description,
-            city,
-            visibility,
-            leader_id,
-            created_at
-          )
-        `)
-        .eq('user_id', session.user.id)
-        .eq('status', 'active');
-
-      if (membershipsError) {
-        console.error('Failed to fetch user teams:', membershipsError);
-        return { data: [] };
-      }
-
-      // Extract teams from memberships
-      const teams = memberships?.map((m: any) => m.team).filter(Boolean) || [];
-
-      return { data: teams };
     },
     enabled: !!session?.user?.id,
   });
@@ -709,7 +389,45 @@ export const useSubmitProject = (teamId: string) => {
 
   return useMutation({
     mutationFn: async (data: TSubmitProjectRequest) => {
-      return await teamsApi.submitProject(teamId, data);
+      // First, check if submission exists
+      try {
+        const existingResponse = await hackathonApi.get<HackathonApiResponse<Submission | null>>(
+          `/submissions/teams/${teamId}`
+        );
+
+        if (existingResponse.data.data?.id) {
+          // Update existing submission
+          const response = await hackathonApi.put<HackathonApiResponse<Submission>>(
+            `/submissions/${existingResponse.data.data.id}`,
+            {
+              project_name: data.project_name,
+              description: data.description,
+              repository_url: data.repository_url,
+              demo_url: data.demo_url,
+              video_url: data.video_url,
+              presentation_url: data.presentation_url,
+            }
+          );
+          return { data: response.data.data };
+        }
+      } catch {
+        // No existing submission, create new one
+      }
+
+      // Create new submission
+      const response = await hackathonApi.post<HackathonApiResponse<Submission>>(
+        `/submissions/teams/${teamId}`,
+        {
+          project_name: data.project_name,
+          description: data.description,
+          repository_url: data.repository_url,
+          demo_url: data.demo_url,
+          video_url: data.video_url,
+          presentation_url: data.presentation_url,
+        }
+      );
+
+      return { data: response.data.data };
     },
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: teamKeys.submission(teamId) });
@@ -722,8 +440,10 @@ export const useTeamSubmission = (teamId: string, enabled = true) => {
   return useQuery({
     queryKey: teamKeys.submission(teamId),
     queryFn: async () => {
-      const submission = await teamsApi.getTeamSubmission(teamId);
+      const response = await hackathonApi.get<HackathonApiResponse<Submission | null>>(
-      return { data: submission };
+        `/submissions/teams/${teamId}`
+      );
+      return { data: response.data.data };
     },
     enabled: enabled && !!teamId,
   });
@@ -732,10 +452,17 @@ export const useTeamSubmission = (teamId: string, enabled = true) => {
 // Leave Team Hook
 export const useLeaveTeam = () => {
   const queryClient = useQueryClient();
+  const { session } = useAuthStore();
 
   return useMutation({
     mutationFn: async (teamId: string) => {
-      return await teamsApi.leaveTeam(teamId);
+      if (!session?.user?.id) {
+        throw new Error('You must be logged in to leave a team');
+      }
+
+      // Use the remove member endpoint with current user's ID
+      await hackathonApi.delete(`/teams/${teamId}/members/${session.user.id}`);
+      return { success: true };
     },
     onSuccess: () => {
       queryClient.invalidateQueries({ queryKey: teamKeys.myTeams() });
@@ -744,44 +471,13 @@ export const useLeaveTeam = () => {
   });
 };
 
-// Get Teams by User ID
+// Get Teams by User ID - uses /users/{user_id}/teams
 export const useTeamsByUserId = (userId: string) => {
   return useQuery({
     queryKey: ['teams-by-user', userId],
     queryFn: async () => {
-      if (!userId) {
+      const response = await hackathonApi.get<HackathonApiResponse<Team[]>>(`/users/${userId}/teams`);
-        return { data: [] };
+      return { data: response.data.data || [] };
-      }
-
-      // Query team_members to find teams where user is a member
-      const { data: memberships, error: membershipsError } = await supabase
-        .from('team_members')
-        .select(`
-          team_id,
-          team:teams(
-            id,
-            name,
-            logo,
-            banner,
-            description,
-            city,
-            visibility,
-            leader_id,
-            created_at
-          )
-        `)
-        .eq('user_id', userId)
-        .eq('status', 'active');
-
-      if (membershipsError) {
-        console.error('Failed to fetch user teams:', membershipsError);
-        return { data: [] };
-      }
-
-      // Extract teams from memberships
-      const teams = memberships?.map((m: any) => m.team).filter(Boolean) || [];
-
-      return { data: teams };
     },
     enabled: !!userId,
   });

libs/service/src/hooks/upload/index.ts

@@ -1,8 +1,27 @@
 import { useMutation } from '@tanstack/react-query';
-import { supabase, getAuthenticatedClient } from '../../supabase';
+import { hackathonApi, HackathonApiResponse } from '../../api/hackathon';
 import { useAuthStore } from '../auth';
 
-// Supabase Storage-based upload hooks
+// Upload response type from backend
+interface UploadResponse {
+  url: string;
+}
+
+// Helper function to convert File to base64
+const fileToBase64 = (file: File): Promise<string> => {
+  return new Promise((resolve, reject) => {
+    const reader = new FileReader();
+    reader.readAsDataURL(file);
+    reader.onload = () => {
+      // Remove the data:image/xxx;base64, prefix
+      const base64 = (reader.result as string).split(',')[1];
+      resolve(base64);
+    };
+    reader.onerror = (error) => reject(error);
+  });
+};
+
+// Backend API-based upload hooks
 
 export const useUploadFile = () => {
   const { session } = useAuthStore();
@@ -14,30 +33,18 @@ export const useUploadFile = () => {
         throw new Error('You must be logged in to upload files');
       }
 
-      // Generate a unique file name
+      const base64Data = await fileToBase64(file);
-      const fileExt = file.name.split('.').pop();
-      const fileName = `${session.user.id}-${Date.now()}.${fileExt}`;
-      const filePath = `teams/${fileName}`;
 
-      // Supabase client now has auth context from setSession()
+      const response = await hackathonApi.post<HackathonApiResponse<UploadResponse>>(
-      const { error } = await supabase.storage
+        '/upload/team',
-        .from('hackathon-uploads')
+        {
-        .upload(filePath, file, {
+          filename: file.name,
-          cacheControl: '3600',
+          content_type: file.type,
-          upsert: true,
+          data: base64Data,
-        });
+        }
+      );
 
-      if (error) {
+      return { data: { url: response.data.data.url } };
-        console.error('Failed to upload file:', error);
-        throw new Error(error.message || 'Failed to upload file');
-      }
-
-      // Get public URL
-      const { data: publicUrlData } = supabase.storage
-        .from('hackathon-uploads')
-        .getPublicUrl(filePath);
-
-      return { data: { url: publicUrlData.publicUrl } };
     },
   });
 };
@@ -52,34 +59,131 @@ export const useUploadAvatar = () => {
         throw new Error('You must be logged in to upload avatar');
       }
 
-      // Generate a unique file name
+      // Validate file type
-      const fileExt = file.name.split('.').pop();
+      const allowedTypes = ['image/jpeg', 'image/jpg', 'image/png', 'image/webp', 'image/gif'];
-      const fileName = `${session.user.id}-${Date.now()}.${fileExt}`;
+      if (!allowedTypes.includes(file.type)) {
-      const filePath = `avatars/${fileName}`;
+        throw new Error('Invalid file type. Allowed types: JPEG, PNG, WebP, GIF');
-
-      // Supabase client now has auth context from setSession()
-      const { error } = await supabase.storage
-        .from('hackathon-uploads')
-        .upload(filePath, file, {
-          cacheControl: '3600',
-          upsert: true,
-        });
-
-      if (error) {
-        console.error('Failed to upload avatar:', error);
-        throw new Error(error.message || 'Failed to upload avatar');
       }
 
-      // Get public URL
+      // Validate file size (max 5MB)
-      const { data: publicUrlData } = supabase.storage
+      const maxSize = 5 * 1024 * 1024;
-        .from('hackathon-uploads')
+      if (file.size > maxSize) {
-        .getPublicUrl(filePath);
+        throw new Error('File too large. Maximum size: 5MB');
+      }
 
-      return { data: { url: publicUrlData.publicUrl } };
+      const base64Data = await fileToBase64(file);
+
+      const response = await hackathonApi.post<HackathonApiResponse<UploadResponse>>(
+        '/upload/avatar',
+        {
+          filename: file.name,
+          content_type: file.type,
+          data: base64Data,
+        }
+      );
+
+      return { data: { url: response.data.data.url } };
     },
   });
 };
 
+export const useUploadTeamFile = () => {
+  const { session } = useAuthStore();
+
+  return useMutation({
+    mutationKey: ['upload-team-file'],
+    mutationFn: async (file: File) => {
+      if (!session?.user?.id) {
+        throw new Error('You must be logged in to upload files');
+      }
+
+      // Validate file type
+      const allowedTypes = [
+        'image/jpeg',
+        'image/jpg',
+        'image/png',
+        'image/webp',
+        'image/gif',
+        'application/pdf',
+      ];
+      if (!allowedTypes.includes(file.type)) {
+        throw new Error('Invalid file type. Allowed types: JPEG, PNG, WebP, GIF, PDF');
+      }
+
+      // Validate file size (max 20MB)
+      const maxSize = 20 * 1024 * 1024;
+      if (file.size > maxSize) {
+        throw new Error('File too large. Maximum size: 20MB');
+      }
+
+      const base64Data = await fileToBase64(file);
+
+      const response = await hackathonApi.post<HackathonApiResponse<UploadResponse>>(
+        '/upload/team',
+        {
+          filename: file.name,
+          content_type: file.type,
+          data: base64Data,
+        }
+      );
+
+      return { data: { url: response.data.data.url } };
+    },
+  });
+};
+
+export const useUploadSubmission = () => {
+  const { session } = useAuthStore();
+
+  return useMutation({
+    mutationKey: ['upload-submission'],
+    mutationFn: async (file: File) => {
+      if (!session?.user?.id) {
+        throw new Error('You must be logged in to upload submissions');
+      }
+
+      // Validate file type
+      const allowedTypes = [
+        'image/jpeg',
+        'image/jpg',
+        'image/png',
+        'image/webp',
+        'image/gif',
+        'application/pdf',
+        'application/zip',
+        'application/x-zip-compressed',
+        'video/mp4',
+        'video/webm',
+      ];
+      if (!allowedTypes.includes(file.type)) {
+        throw new Error(
+          'Invalid file type. Allowed types: Images, PDF, ZIP, MP4, WebM'
+        );
+      }
+
+      // Validate file size (max 50MB)
+      const maxSize = 50 * 1024 * 1024;
+      if (file.size > maxSize) {
+        throw new Error('File too large. Maximum size: 50MB');
+      }
+
+      const base64Data = await fileToBase64(file);
+
+      const response = await hackathonApi.post<HackathonApiResponse<UploadResponse>>(
+        '/upload/submission',
+        {
+          filename: file.name,
+          content_type: file.type,
+          data: base64Data,
+        }
+      );
+
+      return { data: { url: response.data.data.url } };
+    },
+  });
+};
+
+// Keep useUploadCV for compatibility, using team upload endpoint
 export const useUploadCV = () => {
   const { session } = useAuthStore();
 
@@ -90,30 +194,29 @@ export const useUploadCV = () => {
         throw new Error('You must be logged in to upload CV');
       }
 
-      // Generate a unique file name
+      // Validate file type
-      const fileExt = file.name.split('.').pop();
+      if (file.type !== 'application/pdf') {
-      const fileName = `${session.user.id}-${Date.now()}.${fileExt}`;
+        throw new Error('CV must be a PDF file');
-      const filePath = `cvs/${fileName}`;
-
-      // Supabase client now has auth context from setSession()
-      const { error } = await supabase.storage
-        .from('hackathon-uploads')
-        .upload(filePath, file, {
-          cacheControl: '3600',
-          upsert: true,
-        });
-
-      if (error) {
-        console.error('Failed to upload CV:', error);
-        throw new Error(error.message || 'Failed to upload CV');
       }
 
-      // Get public URL
+      // Validate file size (max 20MB)
-      const { data: publicUrlData } = supabase.storage
+      const maxSize = 20 * 1024 * 1024;
-        .from('hackathon-uploads')
+      if (file.size > maxSize) {
-        .getPublicUrl(filePath);
+        throw new Error('File too large. Maximum size: 20MB');
+      }
 
-      return { data: { url: publicUrlData.publicUrl } };
+      const base64Data = await fileToBase64(file);
+
+      const response = await hackathonApi.post<HackathonApiResponse<UploadResponse>>(
+        '/upload/team',
+        {
+          filename: file.name,
+          content_type: file.type,
+          data: base64Data,
+        }
+      );
+
+      return { data: { url: response.data.data.url } };
     },
   });
 };

libs/service/src/hooks/users/index.ts

@@ -1,17 +1,41 @@
 import { useQuery, useMutation, useQueryClient } from '@tanstack/react-query';
-import { userService } from '../../api/users';
+import { hackathonApi, HackathonApiResponse } from '../../api/hackathon';
-import { supabase, getAuthenticatedClient } from '../../supabase';
 import { useAuthStore } from '../auth';
 
-// Supabase-based user hooks
+// User type
+interface User {
+  id: string;
+  email: string;
+  fullname: string;
+  bio?: string;
+  location?: string;
+  avatar?: string;
+  skills?: string[];
+  created_at: string;
+  updated_at?: string;
+}
+
+// Update user request type
+interface UpdateUserRequest {
+  fullname?: string;
+  bio?: string;
+  location?: string;
+  avatar?: string;
+  skills?: string[];
+}
+
+// Backend API-based user hooks
 
 export const useUserMe = () => {
+  const { session } = useAuthStore();
+
   return useQuery({
     queryKey: ['user-me'],
     queryFn: async () => {
-      const user = await userService.getUserMe();
+      const response = await hackathonApi.get<HackathonApiResponse<User>>('/users/me');
-      return { data: user };
+      return { data: response.data.data };
     },
+    enabled: !!session?.user?.id,
   });
 };
 
@@ -19,8 +43,8 @@ export const useUserById = (id: string) => {
   return useQuery({
     queryKey: ['user-by-id', id],
     queryFn: async () => {
-      const user = await userService.getUserById(id);
+      const response = await hackathonApi.get<HackathonApiResponse<User>>(`/users/${id}`);
-      return { data: user };
+      return { data: response.data.data };
     },
     enabled: !!id,
   });
@@ -32,35 +56,24 @@ export const useUpdateUserMe = () => {
 
   return useMutation({
     mutationKey: ['update-user-me'],
-    mutationFn: async (data: any) => {
+    mutationFn: async (data: UpdateUserRequest) => {
       if (!session?.user?.id) {
         throw new Error('You must be logged in to update profile');
       }
 
-      // Supabase client now has auth context from setSession()
+      const response = await hackathonApi.put<HackathonApiResponse<User>>('/users/me', {
-      const { data: updatedUser, error } = await supabase
+        fullname: data.fullname,
-        .from('users')
+        bio: data.bio,
-        .update({
+        location: data.location,
-          fullname: data.fullname,
+        avatar: data.avatar,
-          bio: data.bio,
+        skills: data.skills,
-          location: data.location,
+      });
-          avatar: data.avatar,
-          skills: data.skills,
-          updated_at: new Date().toISOString(),
-        })
-        .eq('id', session.user.id)
-        .select()
-        .single();
 
-      if (error) {
+      return { data: response.data.data };
-        console.error('Failed to update user profile:', error);
-        throw new Error(error.message || 'Failed to update profile');
-      }
-      return { data: updatedUser };
     },
     onSuccess: (result) => {
       // Update Zustand session store with new user data
-      if (session && result.data) {
+      if (session?.user && result.data) {
         setSession({
           token: session.token,
           user: {
@@ -83,9 +96,11 @@ export const useUpdateUserById = () => {
 
   return useMutation({
     mutationKey: ['update-user-by-id'],
-    mutationFn: async ({ id, data }: { id: string; data: any }) => {
+    mutationFn: async ({ id, data }: { id: string; data: UpdateUserRequest }) => {
-      const updated = await userService.updateUserById(id, data);
+      // Note: This might not be supported by backend (only /users/me for updates)
-      return { data: updated };
+      // Keeping for API compatibility but it will likely fail
+      const response = await hackathonApi.put<HackathonApiResponse<User>>(`/users/${id}`, data);
+      return { data: response.data.data };
     },
     onSuccess: (_, variables) => {
       queryClient.invalidateQueries({ queryKey: ['user-by-id', variables.id] });
@@ -95,19 +110,10 @@ export const useUpdateUserById = () => {
 
 export const useUserDetailsById = (userId: string) => {
   return useQuery({
-    queryKey: ['user-supabase', userId],
+    queryKey: ['user-details', userId],
     queryFn: async () => {
-      const { data, error } = await supabase
+      const response = await hackathonApi.get<HackathonApiResponse<User>>(`/users/${userId}`);
-        .from('users')
+      return { data: response.data.data };
-        .select('*')
-        .eq('id', userId)
-        .single();
-
-      if (error) {
-        throw new Error(error.message || 'Failed to fetch user');
-      }
-
-      return { data };
     },
     enabled: !!userId,
   });

libs/service/src/types/teams/index.ts

@@ -125,6 +125,7 @@ export type TSubmitProjectRequest = {
   description: string;
   repository_url: string;
   demo_url?: string;
+  video_url?: string;
   presentation_url?: string;
   screenshots?: string[];
 };