Daniel/webshop
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: enforce admin role checks in layouts and navbar navigation
All checks were successful
Staging Build / build (push) Successful in 2m16s
Details

Browse Source
This commit is contained in:
DanielS
2026-06-24 00:05:16 +02:00
parent 7b22889e23
commit f19fda5494
3 changed files with 120 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
shop/app/admin/layout.tsx
View File

@@ -1,11 +1,28 @@
import Link from 'next/link'
import { LayoutDashboard, Package, Settings, Users, LogOut, LayoutGrid, ShoppingCart } from 'lucide-react'
export default function AdminLayout({
import { redirect } from 'next/navigation'
import { createClient } from '@/lib/supabase/server'
export default async function AdminLayout({
children,
}: {
children: React.ReactNode
}) {
const supabase = await createClient()
const { data: { user } } = await supabase.auth.getUser()
if (!user) redirect('/auth/login')
const { data: userData } = await supabase
.from('users')
.select('role')
.eq('id', user.id)
.single()
if (!userData || userData.role !== 'admin') {
redirect('/')
}
return (
<div className="flex min-h-screen bg-[#020617] text-white">
{/* Sidebar */}

13
shop/components/Navbar.tsx
View File

@@ -38,12 +38,23 @@ export async function Navbar() {
);
let user = null;
let role = "partner";
try {
const { data } = await supabase.auth.getUser();
user = data.user;
if (user) {
const { data: dbUser } = await supabase
.from("users")
.select("role")
.eq("id", user.id)
.single();
if (dbUser) {
role = dbUser.role;
}
}
} catch (error) {
console.error("Fehler beim Abrufen des Users in Navbar:", error);
}
return <NavbarClient user={user} />;
return <NavbarClient user={user} role={role} />;
}

113
shop/components/NavbarClient.tsx
View File

@@ -10,11 +10,13 @@ import { Button } from "@/components/ui/button";
interface NavbarClientProps {
user: User | null;
role?: string;
}
export function NavbarClient({ user }: NavbarClientProps) {
export function NavbarClient({ user, role = "partner" }: NavbarClientProps) {
const router = useRouter();
const [currentUser, setCurrentUser] = useState<User | null>(user);
const [userRole, setUserRole] = useState<string>(role);
const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
const [open, setOpen] = useState(false);
@@ -53,8 +55,24 @@ export function NavbarClient({ user }: NavbarClientProps) {
useEffect(() => {
const {
data: { subscription },
} = supabase.auth.onAuthStateChange((event, session) => {
} = supabase.auth.onAuthStateChange(async (event, session) => {
setCurrentUser(session?.user ?? null);
if (session?.user) {
try {
const { data } = await supabase
.from("users")
.select("role")
.eq("id", session.user.id)
.single();
if (data) {
setUserRole(data.role);
}
} catch {
setUserRole("partner");
}
} else {
setUserRole("partner");
}
});
return () => {
@@ -131,20 +149,48 @@ export function NavbarClient({ user }: NavbarClientProps) {
<div className="px-3 py-1.5 text-[11px] truncate border-b text-slate-400 border-slate-100 dark:border-white/5 mb-1">
{currentUser.email}
</div>
<Link
href="/account-kunden"
onClick={() => setOpen(false)}
className="block px-3 py-2 text-sm rounded-lg font-medium hover:bg-slate-100 dark:hover:bg-white/5"
>
Account Einstellungen
</Link>
<Link
href="/my-customers"
onClick={() => setOpen(false)}
className="block px-3 py-2 text-sm rounded-lg font-medium hover:bg-slate-100 dark:hover:bg-white/5"
>
Kundenliste
</Link>
{userRole === "admin" ? (
<>
<Link
href="/admin"
onClick={() => setOpen(false)}
className="block px-3 py-2 text-sm rounded-lg font-medium hover:bg-slate-100 dark:hover:bg-white/5"
>
Dashboard
</Link>
<Link
href="/admin/einstellungen"
onClick={() => setOpen(false)}
className="block px-3 py-2 text-sm rounded-lg font-medium hover:bg-slate-100 dark:hover:bg-white/5"
>
Admin Einstellungen
</Link>
<Link
href="/admin/users"
onClick={() => setOpen(false)}
className="block px-3 py-2 text-sm rounded-lg font-medium hover:bg-slate-100 dark:hover:bg-white/5"
>
Benutzerverwaltung
</Link>
</>
) : (
<>
<Link
href="/account-kunden"
onClick={() => setOpen(false)}
className="block px-3 py-2 text-sm rounded-lg font-medium hover:bg-slate-100 dark:hover:bg-white/5"
>
Account Einstellungen
</Link>
<Link
href="/my-customers"
onClick={() => setOpen(false)}
className="block px-3 py-2 text-sm rounded-lg font-medium hover:bg-slate-100 dark:hover:bg-white/5"
>
Kundenliste
</Link>
</>
)}
<hr className="my-1 border-slate-100 dark:border-white/5" />
<button
onClick={handleSignOut}
@@ -205,13 +251,34 @@ export function NavbarClient({ user }: NavbarClientProps) {
<>
<div className="h-px bg-white/5 my-1" />
<div className="text-xs text-slate-500 px-1">Mein Account ({currentUser.email})</div>
<Link
className="text-lg font-medium text-slate-300 hover:text-white transition-colors py-2"
href="/my-customers"
onClick={() => setIsMobileMenuOpen(false)}
>
Account Kunden
</Link>
{userRole === "admin" ? (
<>
<Link
className="text-lg font-medium text-slate-300 hover:text-white transition-colors py-2"
href="/admin"
onClick={() => setIsMobileMenuOpen(false)}
>
Dashboard
</Link>
<Link
className="text-lg font-medium text-slate-300 hover:text-white transition-colors py-2"
href="/admin/einstellungen"
onClick={() => setIsMobileMenuOpen(false)}
>
Admin Einstellungen
</Link>
</>
) : (
<>
<Link
className="text-lg font-medium text-slate-300 hover:text-white transition-colors py-2"
href="/my-customers"
onClick={() => setIsMobileMenuOpen(false)}
>
Kundenliste
</Link>
</>
)}
</>
)}