import { cssBundleHref } from "@remix-run/css-bundle"; import type { LinksFunction, V2_MetaFunction } from "@remix-run/node"; import { isRouteErrorResponse, Links, LiveReload, Meta, Outlet, Scripts, ScrollRestoration, useRouteError } from "@remix-run/react"; import type { ReactNode } from "react"; import stylesheet from "~/tailwind.css"; export const links: LinksFunction = () => [ { rel: "stylesheet", href: stylesheet }, ...(cssBundleHref ? [{ rel: "stylesheet", href: cssBundleHref }] : []) ]; export const meta: V2_MetaFunction = () => [{ title: "Awesome Radio" }]; export type DocumentProps = { children: ReactNode; title?: string; } export function Document({ title, children }: DocumentProps) { return ( {title ? {title} : null} {children} ); } export default function App() { return ( ); } export function ErrorBoundary() { const error = useRouteError(); console.error(error); if (isRouteErrorResponse(error)) { const title = `${error.status} - ${error.statusText}`; return (

{title}

); } if (error instanceof Error) { return (

Yikes!

{error.message}

Stack Trace

{error.stack}
); } return (

Sorry, something went wrong...

); }