We finally fixed the sign in and sign out stuff with our client components not updating
This commit is contained in:
parent
28569c4f4e
commit
969e101d21
@ -49,9 +49,14 @@ const ProfilePage = () => {
|
||||
confirmPassword: string;
|
||||
}) => {
|
||||
try {
|
||||
await resetPassword(values);
|
||||
} catch {
|
||||
toast.error('Error resetting password!: ');
|
||||
const result = await resetPassword(values);
|
||||
if (!result.success) {
|
||||
toast.error(`Error resetting password: ${result.error}`)
|
||||
}
|
||||
} catch (error) {
|
||||
toast.error(
|
||||
`Error resetting password!: ${error as string ?? 'Unknown error'}`
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -1,13 +1,31 @@
|
||||
'use client';
|
||||
import Link from 'next/link';
|
||||
import { getUser, signIn } from '@/lib/actions';
|
||||
import { FormMessage, type Message, SubmitButton } from '@/components/default';
|
||||
import { signIn } from '@/lib/actions';
|
||||
import { SubmitButton } from '@/components/default';
|
||||
import { Input, Label } from '@/components/ui';
|
||||
import { redirect } from 'next/navigation';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { useAuth } from '@/components/context/auth';
|
||||
import { useEffect } from 'react';
|
||||
|
||||
const Login = () => {
|
||||
const router = useRouter();
|
||||
const { isAuthenticated, refreshUserData } = useAuth();
|
||||
|
||||
// Redirect if already authenticated
|
||||
useEffect(() => {
|
||||
if (isAuthenticated) {
|
||||
router.push('/');
|
||||
}
|
||||
}, [isAuthenticated, router]);
|
||||
|
||||
const handleSignIn = async (formData: FormData) => {
|
||||
const result = await signIn(formData);
|
||||
if (result?.success) {
|
||||
await refreshUserData();
|
||||
router.push('/');
|
||||
}
|
||||
};
|
||||
|
||||
const Login = async (props: { searchParams: Promise<Message> }) => {
|
||||
const searchParams = await props.searchParams;
|
||||
const user = await getUser();
|
||||
if (user.success) redirect('/profile');
|
||||
return (
|
||||
<form className='flex-1 flex flex-col min-w-64'>
|
||||
<h1 className='text-2xl font-medium'>Sign in</h1>
|
||||
@ -35,12 +53,12 @@ const Login = async (props: { searchParams: Promise<Message> }) => {
|
||||
placeholder='Your password'
|
||||
required
|
||||
/>
|
||||
<SubmitButton pendingText='Signing In...' formAction={signIn}>
|
||||
<SubmitButton pendingText='Signing In...' formAction={handleSignIn}>
|
||||
Sign in
|
||||
</SubmitButton>
|
||||
<FormMessage message={searchParams} />
|
||||
</div>
|
||||
</form>
|
||||
);
|
||||
};
|
||||
|
||||
export default Login;
|
||||
|
@ -1,8 +1,23 @@
|
||||
'use client';
|
||||
|
||||
import React, { createContext, useContext, useState, useEffect, type ReactNode } from 'react';
|
||||
import { getUser, getProfile, updateProfile as updateProfileAction, getSignedUrl } from '@/lib/actions';
|
||||
import { type User, type Profile, createClient } from '@/utils/supabase';
|
||||
import React, {
|
||||
type ReactNode,
|
||||
createContext,
|
||||
useContext,
|
||||
useEffect,
|
||||
useState,
|
||||
} from 'react';
|
||||
import {
|
||||
getProfile,
|
||||
getSignedUrl,
|
||||
getUser,
|
||||
updateProfile as updateProfileAction,
|
||||
} from '@/lib/actions';
|
||||
import {
|
||||
type User,
|
||||
type Profile,
|
||||
createClient,
|
||||
} from '@/utils/supabase';
|
||||
import { toast } from 'sonner';
|
||||
|
||||
type AuthContextType = {
|
||||
@ -41,30 +56,29 @@ export const AuthProvider = ({ children }: { children: ReactNode }) => {
|
||||
}
|
||||
|
||||
setUser(userResponse.data);
|
||||
|
||||
|
||||
// Get profile data
|
||||
const profileResponse = await getProfile();
|
||||
|
||||
if (!profileResponse.success) {
|
||||
setProfile(null);
|
||||
setAvatarUrl(null);
|
||||
return;
|
||||
}
|
||||
|
||||
|
||||
setProfile(profileResponse.data);
|
||||
|
||||
|
||||
// Get avatar URL if available
|
||||
if (profileResponse.data.avatar_url) {
|
||||
const avatarResponse = await getSignedUrl({
|
||||
bucket: 'avatars',
|
||||
url: profileResponse.data.avatar_url,
|
||||
});
|
||||
|
||||
if (avatarResponse.success) {
|
||||
setAvatarUrl(avatarResponse.data);
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error fetching user data:', error);
|
||||
toast.error('Failed to load user data');
|
||||
} finally {
|
||||
setIsLoading(false);
|
||||
@ -73,8 +87,9 @@ export const AuthProvider = ({ children }: { children: ReactNode }) => {
|
||||
|
||||
useEffect(() => {
|
||||
const supabase = createClient();
|
||||
|
||||
fetchUserData().catch((error) => {
|
||||
console.error('Error fetching user data:', error);
|
||||
console.error('💥 Initial fetch error:', error);
|
||||
});
|
||||
|
||||
const {
|
||||
@ -90,13 +105,8 @@ export const AuthProvider = ({ children }: { children: ReactNode }) => {
|
||||
}
|
||||
});
|
||||
|
||||
const intervalId = setInterval(() => {
|
||||
void fetchUserData();
|
||||
}, 1 * 60 * 1000);
|
||||
|
||||
return () => {
|
||||
subscription.unsubscribe();
|
||||
clearInterval(intervalId);
|
||||
};
|
||||
}, []);
|
||||
|
||||
@ -140,6 +150,7 @@ export const AuthProvider = ({ children }: { children: ReactNode }) => {
|
||||
};
|
||||
|
||||
const refreshUserData = async () => {
|
||||
console.log('Manual refresh triggered');
|
||||
await fetchUserData();
|
||||
};
|
||||
|
||||
|
@ -13,14 +13,20 @@ import {
|
||||
DropdownMenuTrigger,
|
||||
} from '@/components/ui';
|
||||
import { useAuth } from '@/components/context/auth';
|
||||
import { useRouter } from 'next/navigation';
|
||||
import { signOut } from '@/lib/actions';
|
||||
import { User } from 'lucide-react';
|
||||
|
||||
const AvatarDropdown = () => {
|
||||
const { profile, avatarUrl, isLoading } = useAuth();
|
||||
const { profile, avatarUrl, isLoading, refreshUserData } = useAuth();
|
||||
const router = useRouter();
|
||||
|
||||
const handleSignOut = async () => {
|
||||
await signOut();
|
||||
const result = await signOut();
|
||||
if (result?.success) {
|
||||
await refreshUserData();
|
||||
router.push('/sign-in');
|
||||
}
|
||||
};
|
||||
|
||||
const getInitials = (name: string | null | undefined): string => {
|
||||
|
@ -7,7 +7,6 @@ import { headers } from 'next/headers';
|
||||
import { redirect } from 'next/navigation';
|
||||
import type { User } from '@/utils/supabase';
|
||||
import type { Result } from './index';
|
||||
import { revalidatePath } from 'next/cache';
|
||||
|
||||
export const signUp = async (formData: FormData) => {
|
||||
const name = formData.get('name') as string;
|
||||
@ -47,7 +46,9 @@ export const signUp = async (formData: FormData) => {
|
||||
}
|
||||
};
|
||||
|
||||
export const signIn = async (formData: FormData) => {
|
||||
export const signIn = async (
|
||||
formData: FormData,
|
||||
): Promise<Result<null>> => {
|
||||
const email = formData.get('email') as string;
|
||||
const password = formData.get('password') as string;
|
||||
const supabase = await createServerClient();
|
||||
@ -56,11 +57,10 @@ export const signIn = async (formData: FormData) => {
|
||||
email,
|
||||
password,
|
||||
});
|
||||
|
||||
if (error) {
|
||||
return encodedRedirect('error', '/sign-in', error.message);
|
||||
return { success: false, error: error.message };
|
||||
} else {
|
||||
return redirect('/');
|
||||
return { success: true, data: null };
|
||||
}
|
||||
};
|
||||
|
||||
@ -98,43 +98,27 @@ export const forgotPassword = async (formData: FormData) => {
|
||||
};
|
||||
|
||||
|
||||
export const resetPassword = async (
|
||||
formData: FormData | {password: string, confirmPassword: string}
|
||||
) => {
|
||||
let password = '';
|
||||
let confirmPassword = '';
|
||||
|
||||
if (formData instanceof FormData) {
|
||||
password = formData.get('password') as string;
|
||||
confirmPassword = formData.get('confirmPassword') as string;
|
||||
} else {
|
||||
password = formData.password;
|
||||
confirmPassword = formData.confirmPassword;
|
||||
}
|
||||
|
||||
export const resetPassword = async ({
|
||||
password,
|
||||
confirmPassword,
|
||||
}: {
|
||||
password: string,
|
||||
confirmPassword: string
|
||||
}): Promise<Result<null>> => {
|
||||
if (!password || !confirmPassword) {
|
||||
encodedRedirect(
|
||||
'error',
|
||||
'/reset-password',
|
||||
'Password and confirm password are required',
|
||||
);
|
||||
return { success: false, error: 'Password and confirm password are required!' };
|
||||
}
|
||||
|
||||
const supabase = await createServerClient();
|
||||
|
||||
if (password !== confirmPassword) {
|
||||
encodedRedirect('error', '/reset-password', 'Passwords do not match');
|
||||
return { success: false, error: 'Passwords do not match!' };
|
||||
}
|
||||
|
||||
const { error } = await supabase.auth.updateUser({
|
||||
password: password,
|
||||
password,
|
||||
});
|
||||
|
||||
if (error) {
|
||||
encodedRedirect('error', '/reset-password', 'Password update failed');
|
||||
return { success: false, error: `Password update failed: ${error.message}` };
|
||||
}
|
||||
|
||||
encodedRedirect('success', '/reset-password', 'Password updated');
|
||||
return { success: true, data: null };
|
||||
};
|
||||
|
||||
|
||||
@ -165,10 +149,11 @@ export const resetPasswordFromEmail = async (formData: FormData) => {
|
||||
encodedRedirect('success', '/reset-password', 'Password updated');
|
||||
};
|
||||
|
||||
export const signOut = async () => {
|
||||
export const signOut = async (): Promise<Result<null>> => {
|
||||
const supabase = await createServerClient();
|
||||
await supabase.auth.signOut();
|
||||
return redirect('/sign-in');
|
||||
const { error } = await supabase.auth.signOut();
|
||||
if (error) return { success: false, error: error.message }
|
||||
return { success: true, data: null };
|
||||
};
|
||||
|
||||
export const getUser = async (): Promise<Result<User>> => {
|
||||
|
Loading…
x
Reference in New Issue
Block a user