Files
contentstack-imagevault/remix/app/root.tsx

73 lines
1.6 KiB
TypeScript

import {
Links,
Meta,
Outlet,
Scripts,
ScrollRestoration,
useRouteError,
} from "@remix-run/react"
import { SDKLoadingError } from "~/hooks/useApp"
export function Layout({ children }: { children: React.ReactNode }) {
return (
<html lang="en">
<head>
<meta charSet="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<Meta />
<link
rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&display=swap"
/>
<link
rel="stylesheet"
href="https://www.unpkg.com/@contentstack/venus-components@2.2.3/build/main.css"
/>
<Links />
</head>
<body>
{children}
<ScrollRestoration />
<Scripts />
</body>
</html>
)
}
export default function App() {
return <Outlet />
}
export function HydrateFallback() {
return <p>Loading...</p>
}
export function ErrorBoundary() {
const error = useRouteError()
console.error(error)
return (
<html lang="en">
<head>
<title>Oh no!</title>
<Meta />
<Links />
</head>
<body>
{error instanceof SDKLoadingError ? (
<div>
<h2>Unable to load Contentstack SDK</h2>
<p>Make sure you have proper configuration in Contentstack.</p>
</div>
) : (
<div>
<h2>Something went wrong</h2>
<p>Check the console for the error.</p>
</div>
)}
<Scripts />
</body>
</html>
)
}