45 lines
1.6 KiB
TypeScript
45 lines
1.6 KiB
TypeScript
'use client';
|
|
|
|
import React, { useState, useEffect } from 'react';
|
|
import { useRouter } from 'next/navigation';
|
|
import { onAuthStateChanged, User } from 'firebase/auth';
|
|
import { firebaseAuth } from '../../../lib/firebase-client';
|
|
import { GroupRidesManagement } from '../../../components/group-rides/group-rides-management';
|
|
|
|
export default function GroupRidesManageRoute() {
|
|
const router = useRouter();
|
|
const [currentUser, setCurrentUser] = useState<User | null>(firebaseAuth?.currentUser ?? null);
|
|
const [authChecked, setAuthChecked] = useState(Boolean(firebaseAuth?.currentUser));
|
|
|
|
useEffect(() => {
|
|
const unsubscribe = onAuthStateChanged(firebaseAuth, (user) => {
|
|
setCurrentUser(user);
|
|
setAuthChecked(true);
|
|
if (!user) {
|
|
router.replace('/login?redirect=/group-rides/manage');
|
|
}
|
|
});
|
|
return () => unsubscribe();
|
|
}, [router]);
|
|
|
|
// If auth is still checking or user is not logged in (and redirecting), show clean loading skeleton
|
|
if (!authChecked || !currentUser) {
|
|
return (
|
|
<div
|
|
className="flagship-page min-h-screen bg-surface text-on-surface flex flex-col justify-center items-center px-4 py-16"
|
|
data-testid="manage-auth-loading"
|
|
>
|
|
<div className="flex flex-col items-center gap-4 text-center">
|
|
<div className="w-12 h-12 rounded-full border-2 border-primary-container border-t-transparent animate-spin" />
|
|
<span className="font-mono text-xs text-on-surface-variant">
|
|
Verifying rider credentials & permissions...
|
|
</span>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return <GroupRidesManagement currentUser={currentUser} />;
|
|
}
|
|
|