loading, error and not found pages.

by default they all have min-h-svh height so they fill up the entire viewport.

Loading page

You need to replace the logo svg with your own. don't forget to pass the className prop to your Logo component.

Error page

in Dev mode, the error message will be the error message from the error object (props.error.message) and in production, it will be the default error message.

Not Found page

Installation

npx shadcn@latest add https://mhl5.vercel.app/r/FallbackPages.json

Usage

import { NotFoundPage } from "@/components/ui/FallbackPages";

export default function NotFoundPage() {
  return <NotFoundPage />;
}