56 lines
2.2 KiB
TypeScript
56 lines
2.2 KiB
TypeScript
|
"use client";
|
||
|
|
|
||
|
|
import { useEffect, useState } from 'react';
|
||
|
|
import Link from 'next/link';
|
||
|
|
import { useRouter } from 'next/navigation';
|
||
|
|
import { useAuth } from '@/context/AuthContext';
|
||
|
|
import '@/styles/Auth.css';
|
||
|
|
|
||
|
|
export default function AdminPage() {
|
||
|
|
const { user, loading } = useAuth();
|
||
|
|
const router = useRouter();
|
||
|
|
const [isAuthorized, setIsAuthorized] = useState(false);
|
||
|
|
|
||
|
|
useEffect(() => {
|
||
|
|
if (!loading) {
|
||
|
|
if (!user || user.role !== 'admin') {
|
||
|
|
router.push('/login');
|
||
|
|
} else {
|
||
|
|
setIsAuthorized(true);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}, [user, loading, router]);
|
||
|
|
|
||
|
|
if (loading || !isAuthorized) {
|
||
|
|
return (
|
||
|
|
<div className="auth-page-container flex items-center justify-center min-h-screen">
|
||
|
|
<div className="text-xl font-bold">Laddar...</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="auth-page-container" style={{ paddingTop: '8rem' }}>
|
||
|
|
<div className="profile-card" style={{ width: '100%', maxWidth: '800px' }}>
|
||
|
|
<div className="flex justify-between items-center mb-10 border-b border-gray-100 pb-8">
|
||
|
|
<h2 className="auth-title" style={{ textAlign: 'left', marginBottom: 0 }}>Admin Dashboard</h2>
|
||
|
|
<Link href="/me" className="auth-button secondary" style={{ width: 'auto', padding: '0.8rem 1.5rem', fontSize: '0.75rem', minHeight: 'auto' }}>
|
||
|
|
TILLBAKA
|
||
|
|
</Link>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||
|
|
<Link href="/admin/products" className="admin-nav-card text-center">
|
||
|
|
<h4 className="font-black text-xl mb-4 uppercase">Produkter</h4>
|
||
|
|
<p className="text-sm leading-relaxed">Hantera butikens sortiment</p>
|
||
|
|
</Link>
|
||
|
|
<Link href="/admin/categories" className="admin-nav-card text-center">
|
||
|
|
<h4 className="font-black text-xl mb-4 uppercase">Kategorier</h4>
|
||
|
|
<p className="text-sm leading-relaxed">Hantera produktkategorier</p>
|
||
|
|
</Link>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|