Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.hana.leafphp.dev/llms.txt

Use this file to discover all available pages before exploring further.

Hana router provides default error pages for 404 and 500 errors, however, we recommend updating them with your own custom pages

​
404 Pages

When a user enters a route that doesn’t exist in your app, Hana will look for a _404 file, and render the component exported from that file.
src/pages/_404.tsx
const NotFound: React.FC = () => {
  return <div>404 - Not Found</div>;
};

export default NotFound;

​
General Error Pages

When an error is thrown within your application, Hana will catch the error and display whatever component is in your _error file.
src/pages/_error.tsx
import { useRouteError } from "@hanabira/router";

export default function ErrorPage() {
  const error: any = useRouteError();
  console.log(error, 'error');

  return <div>Error</div>;
}
Usually your application will only have one error page, however, Hana allows you to create error pages scoped to only particular folders. For example, you can have a _error.tsx file in the pages/users directory that will be used for all errors that occur on routes in the /users directory. 
|- pages
  |- index.tsx
  |- _error.tsx
  |- users
    |- _error.tsx
Considering the directory structure above, the _error.tsx file in the pages/users directory will be used for all errors that occur on routes in the /users directory. The _error.tsx file in the pages directory will be used for all other errors.