69 lines
2.2 KiB
TypeScript
69 lines
2.2 KiB
TypeScript
// app/nodes/[clientId]/page.tsx
|
|
"use client";
|
|
|
|
import React, { useEffect } from 'react'; // Import useEffect
|
|
import { useParams, useRouter } from 'next/navigation';
|
|
import { useAuth } from '@/context/AuthContext';
|
|
import { useHeader } from '@/context/HeaderContext'; // Import useHeader
|
|
import IndividualClientPage from '@/components/IndividualClientPage';
|
|
import LoginPage from '@/components/LoginPage';
|
|
import { UserRoles } from '@/types';
|
|
|
|
const ClientDetailPage: React.FC = () => {
|
|
const router = useRouter();
|
|
const params = useParams();
|
|
const { user, loading, token, hasPermission, logout } = useAuth();
|
|
const { setHeaderConfig } = useHeader();
|
|
|
|
// Use useEffect to set header configuration on mount and clean up on unmount
|
|
useEffect(() => {
|
|
setHeaderConfig({ showBackButton: true });
|
|
|
|
return () => {
|
|
setHeaderConfig({ showBackButton: false });
|
|
};
|
|
}, [setHeaderConfig]); // Dependency array: ensure effect runs if setHeaderConfig changes (unlikely)
|
|
|
|
|
|
if (loading) {
|
|
return <div className="flex items-center justify-center min-h-screen bg-background text-foreground">Loading Authentication...</div>;
|
|
}
|
|
|
|
const clientId = params?.clientId;
|
|
|
|
if (!clientId) {
|
|
return (
|
|
<div className="flex items-center justify-center min-h-screen bg-background text-foreground">
|
|
Client ID not found in URL.
|
|
</div>
|
|
);
|
|
}
|
|
|
|
const clientIdentifier = Array.isArray(clientId) ? clientId[0] : clientId;
|
|
|
|
if (!user || !token || !hasPermission(UserRoles.MOD)) {
|
|
return (
|
|
<div className="min-h-screen bg-background text-foreground font-sans">
|
|
<main className="p-6">
|
|
{!user ? (
|
|
<LoginPage />
|
|
) : (
|
|
<div className="text-center text-destructive text-lg">
|
|
You do not have permission to view this page. Your role: {user.role}. Required: {UserRoles.MOD}.
|
|
</div>
|
|
)}
|
|
</main>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="min-h-screen bg-background text-foreground font-sans">
|
|
<main className="p-6">
|
|
<IndividualClientPage clientId={clientIdentifier} token={token} logoutUser={logout} />
|
|
</main>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default ClientDetailPage; |