feat: Redirect authenticated users from auth pages and enable event-driven profile data refresh in the settings sidebar.
This commit is contained in:
@@ -1,8 +1,64 @@
|
|||||||
|
'use client';
|
||||||
|
|
||||||
|
import { useSession } from 'next-auth/react';
|
||||||
|
import { useRouter } from 'next/navigation';
|
||||||
|
import { useEffect } from 'react';
|
||||||
|
|
||||||
export default function AuthLayout({
|
export default function AuthLayout({
|
||||||
children,
|
children,
|
||||||
}: {
|
}: {
|
||||||
children: React.ReactNode;
|
children: React.ReactNode;
|
||||||
}) {
|
}) {
|
||||||
|
const { data: session, status } = useSession();
|
||||||
|
const router = useRouter();
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
if (status === 'loading') return;
|
||||||
|
|
||||||
|
// Redirect authenticated users away from auth pages
|
||||||
|
if (session) {
|
||||||
|
const userRole = (session.user as any)?.role;
|
||||||
|
if (userRole === 'AGENT') {
|
||||||
|
router.replace('/agent/dashboard');
|
||||||
|
} else {
|
||||||
|
router.replace('/user/dashboard');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}, [session, status, router]);
|
||||||
|
|
||||||
|
// Show loading spinner while checking authentication
|
||||||
|
if (status === 'loading') {
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen flex items-center justify-center bg-gradient-to-b from-[#c4d9d4] to-[#f0f5fc]">
|
||||||
|
<div className="text-center">
|
||||||
|
<img
|
||||||
|
src="/assets/logo.svg"
|
||||||
|
alt="RE-Quest"
|
||||||
|
className="h-8 mx-auto mb-4"
|
||||||
|
/>
|
||||||
|
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-[#00293d] mx-auto"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Show loading while redirecting authenticated users
|
||||||
|
if (session) {
|
||||||
|
return (
|
||||||
|
<div className="min-h-screen flex items-center justify-center bg-gradient-to-b from-[#c4d9d4] to-[#f0f5fc]">
|
||||||
|
<div className="text-center">
|
||||||
|
<img
|
||||||
|
src="/assets/logo.svg"
|
||||||
|
alt="RE-Quest"
|
||||||
|
className="h-8 mx-auto mb-4"
|
||||||
|
/>
|
||||||
|
<div className="animate-spin rounded-full h-8 w-8 border-b-2 border-[#00293d] mx-auto"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Only render auth pages for unauthenticated users
|
||||||
return (
|
return (
|
||||||
<div className="min-h-screen flex items-center justify-center bg-gradient-to-b from-[#c4d9d4] to-[#f0f5fc] py-12 px-4">
|
<div className="min-h-screen flex items-center justify-center bg-gradient-to-b from-[#c4d9d4] to-[#f0f5fc] py-12 px-4">
|
||||||
<div className="w-full max-w-[510px]">
|
<div className="w-full max-w-[510px]">
|
||||||
|
|||||||
@@ -189,20 +189,13 @@ export function ProfileSettingsForm({
|
|||||||
// Clean up local preview URL only after successful presigned URL
|
// Clean up local preview URL only after successful presigned URL
|
||||||
URL.revokeObjectURL(localPreviewUrl);
|
URL.revokeObjectURL(localPreviewUrl);
|
||||||
|
|
||||||
// Update the session to reflect the new avatar
|
|
||||||
await updateSession({
|
|
||||||
...session,
|
|
||||||
user: {
|
|
||||||
...session?.user,
|
|
||||||
image: presignedUrl,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
// Dispatch event to notify header to refresh profile data
|
// Dispatch event to notify header to refresh profile data
|
||||||
window.dispatchEvent(new Event('profile-updated'));
|
window.dispatchEvent(new Event('profile-updated'));
|
||||||
} catch {
|
} catch {
|
||||||
// If presigned URL fails, keep the local preview (don't revoke it)
|
// If presigned URL fails, keep the local preview (don't revoke it)
|
||||||
console.warn('Could not get presigned URL, using local preview');
|
console.warn('Could not get presigned URL, using local preview');
|
||||||
|
// Still dispatch event to refresh header
|
||||||
|
window.dispatchEvent(new Event('profile-updated'));
|
||||||
}
|
}
|
||||||
|
|
||||||
setSuccessMessage('Profile picture updated successfully!');
|
setSuccessMessage('Profile picture updated successfully!');
|
||||||
@@ -254,15 +247,6 @@ export function ProfileSettingsForm({
|
|||||||
}
|
}
|
||||||
setAvatarUrl(null);
|
setAvatarUrl(null);
|
||||||
|
|
||||||
// Update session
|
|
||||||
await updateSession({
|
|
||||||
...session,
|
|
||||||
user: {
|
|
||||||
...session?.user,
|
|
||||||
image: null,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
|
|
||||||
// Dispatch event to notify header to refresh profile data
|
// Dispatch event to notify header to refresh profile data
|
||||||
window.dispatchEvent(new Event('profile-updated'));
|
window.dispatchEvent(new Event('profile-updated'));
|
||||||
|
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
'use client';
|
'use client';
|
||||||
|
|
||||||
import { useState, useEffect } from 'react';
|
import { useState, useEffect, useCallback } from 'react';
|
||||||
import Image from 'next/image';
|
import Image from 'next/image';
|
||||||
import Link from 'next/link';
|
import Link from 'next/link';
|
||||||
import { usePathname } from 'next/navigation';
|
import { usePathname } from 'next/navigation';
|
||||||
@@ -31,51 +31,66 @@ export function SettingsSidebar({
|
|||||||
avatarUrl: session?.user?.image || null,
|
avatarUrl: session?.user?.image || null,
|
||||||
});
|
});
|
||||||
|
|
||||||
useEffect(() => {
|
const fetchProfile = useCallback(async () => {
|
||||||
const fetchProfile = async () => {
|
try {
|
||||||
try {
|
const role = (session?.user as any)?.role;
|
||||||
const role = (session?.user as any)?.role;
|
let avatarUrl: string | null = null;
|
||||||
let avatarUrl = session?.user?.image || null;
|
let name = session?.user?.name || 'User';
|
||||||
let name = session?.user?.name || 'User';
|
let title = 'User';
|
||||||
let title = 'User';
|
|
||||||
|
|
||||||
if (role === 'AGENT') {
|
if (role === 'AGENT') {
|
||||||
const profile = await agentsService.getMyProfile();
|
const profile = await agentsService.getMyProfile();
|
||||||
name = `${profile.firstName || ''} ${profile.lastName || ''}`.trim() || name;
|
name = `${profile.firstName || ''} ${profile.lastName || ''}`.trim() || name;
|
||||||
title = profile.agentType?.name || 'Real Estate Agent';
|
title = profile.agentType?.name || 'Real Estate Agent';
|
||||||
|
|
||||||
if (profile.avatar) {
|
if (profile.avatar) {
|
||||||
try {
|
try {
|
||||||
avatarUrl = await uploadService.getPresignedDownloadUrl(profile.avatar);
|
avatarUrl = await uploadService.getPresignedDownloadUrl(profile.avatar);
|
||||||
} catch {
|
} catch {
|
||||||
avatarUrl = profile.avatar;
|
avatarUrl = profile.avatar;
|
||||||
}
|
|
||||||
}
|
|
||||||
} else if (role === 'USER') {
|
|
||||||
const profile = await usersService.getMyProfile();
|
|
||||||
name = `${profile.firstName || ''} ${profile.lastName || ''}`.trim() || name;
|
|
||||||
title = 'Member';
|
|
||||||
|
|
||||||
if (profile.avatar) {
|
|
||||||
try {
|
|
||||||
avatarUrl = await uploadService.getPresignedDownloadUrl(profile.avatar);
|
|
||||||
} catch {
|
|
||||||
avatarUrl = profile.avatar;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
} else if (role === 'USER') {
|
||||||
|
const profile = await usersService.getMyProfile();
|
||||||
|
name = `${profile.firstName || ''} ${profile.lastName || ''}`.trim() || name;
|
||||||
|
title = 'Member';
|
||||||
|
|
||||||
setProfileData({ name, title, avatarUrl });
|
if (profile.avatar) {
|
||||||
} catch (err) {
|
try {
|
||||||
console.error('Failed to fetch profile for sidebar:', err);
|
avatarUrl = await uploadService.getPresignedDownloadUrl(profile.avatar);
|
||||||
// Keep session data as fallback
|
} catch {
|
||||||
|
avatarUrl = profile.avatar;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
|
||||||
|
|
||||||
|
setProfileData({ name, title, avatarUrl });
|
||||||
|
} catch (err) {
|
||||||
|
console.error('Failed to fetch profile for sidebar:', err);
|
||||||
|
// Keep session data as fallback
|
||||||
|
}
|
||||||
|
}, [session]);
|
||||||
|
|
||||||
|
// Fetch profile on mount
|
||||||
|
useEffect(() => {
|
||||||
if (session) {
|
if (session) {
|
||||||
fetchProfile();
|
fetchProfile();
|
||||||
}
|
}
|
||||||
}, [session]);
|
}, [session, fetchProfile]);
|
||||||
|
|
||||||
|
// Listen for profile update events to refresh the sidebar
|
||||||
|
useEffect(() => {
|
||||||
|
const handleProfileUpdate = () => {
|
||||||
|
if (session) {
|
||||||
|
fetchProfile();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
window.addEventListener('profile-updated', handleProfileUpdate);
|
||||||
|
return () => {
|
||||||
|
window.removeEventListener('profile-updated', handleProfileUpdate);
|
||||||
|
};
|
||||||
|
}, [session, fetchProfile]);
|
||||||
|
|
||||||
const navItems: NavItem[] = [
|
const navItems: NavItem[] = [
|
||||||
{
|
{
|
||||||
|
|||||||
Reference in New Issue
Block a user