AccessDenied
403/404 error page with back and home navigation
Preview
Access Denied
You don't have permission to view this resource.
Usage
import { AccessDenied, NotFound } from "@/components/ui/access-denied"
import { useRouter } from "next/navigation"
function ForbiddenPage() {
const router = useRouter()
return (
<AccessDenied
title="Access Denied"
message="You don't have permission to view this page."
onBack={() => router.back()}
onHome={() => router.push("/")}
/>
)
}
function MissingPage() {
const router = useRouter()
return (
<NotFound
resourceType="tender"
onBack={() => router.back()}
onHome={() => router.push("/")}
/>
)
}Exports two components: AccessDenied for permission errors and NotFound (a wrapper around AccessDenied) for missing resources. Both show a centered icon, title, message, and optional back/home buttons.
Install
npx shadcn add @bonsai/access-denied