import {
Links,
Meta,
Outlet,
Scripts,
ScrollRestoration,
isRouteErrorResponse,
} from "react-router"
import { AlertTriangle, Home, RotateCcw } from "lucide-react"
import type { Route } from "./+types/root"
import "./app.css"
import { humanErrorMessage, humanErrorTitle } from "~/lib/errors"
import { Button, buttonVariants } from "~/components/ui/button"
import { ToastProvider } from "@crema/notification-ui"
import { CommandBusProvider } from "@crema/action-bus"
// CREMA:PROVIDERS-IMPORTS
export function Layout({ children }: { children: React.ReactNode }) {
return (
{children}
)
}
export default function App() {
return (
/* CREMA:PROVIDERS-WRAP-OPEN */
/* CREMA:PROVIDERS-WRAP-CLOSE */
)
}
export function ErrorBoundary({ error }: Route.ErrorBoundaryProps) {
const title = humanErrorTitle(error)
const message = humanErrorMessage(error)
const is404 = isRouteErrorResponse(error) && error.status === 404
// Stack traces are a developer affordance — never leak them to users in
// production, and even in dev keep them tucked below the human copy.
const stack =
import.meta.env.DEV && error instanceof Error ? error.stack : undefined
return (
{is404 ? "Page not found" : title}
{message}
Go home
{stack ? (
{stack}
) : null}
)
}