diff --git a/app/routes/j/$id.tsx b/app/routes/j/$id.tsx index 32bc22e3..1c44c9bd 100644 --- a/app/routes/j/$id.tsx +++ b/app/routes/j/$id.tsx @@ -3,7 +3,7 @@ import { LoaderFunction, MetaFunction, Outlet, - redirect, + redirect, ThrownResponse, useCatch, useLoaderData, useLocation, useParams, @@ -62,19 +62,17 @@ export const loader: LoaderFunction = async ({ params, request }) => { }); if (!jsonResponse.ok) { - console.log( - `Failed to fetch ${doc.url}: ${jsonResponse.status} (${jsonResponse.statusText})` - ); + const jsonResponseText = await jsonResponse.text(); + const error = `Failed to fetch ${doc.url}. HTTP status: ${jsonResponse.status} (${jsonResponseText}})`; + console.error(error); - throw new Response(jsonResponse.statusText, { + throw new Response(error, { status: jsonResponse.status, }); } const json = await jsonResponse.json(); - console.log(`Fetched ${doc.url} with json, returning...`); - return { doc, json, @@ -166,7 +164,7 @@ export const meta: MetaFunction = ({ }) => { let title = "JSON Hero"; - if (data) { + if (data?.doc?.title) { title += ` - ${data.doc.title}`; } @@ -250,7 +248,10 @@ export default function JsonDocumentRoute() { } export function CatchBoundary() { + const error = useCatch(); const params = useParams(); + console.log("error", error) + return (