chore: added proper error handling to now page 86e30397
Steve · 2026-01-09 07:39 1 file(s) · +35 −23
packages/client/src/pages/now/[slug].astro +35 −23
24 24
let contentHTML = "";
25 25
let publishedAt = "";
26 26
let atUri = "";
27 +
let errorMessage = "";
28 +
let isError = false;
27 29
28 30
try {
29 31
	let documentFound = false;
98 100
	}
99 101
100 102
	if (!documentFound) {
101 -
		return new Response(null, {
102 -
			status: 404,
103 -
			statusText: "Not Found",
104 -
		});
103 +
		Astro.response.status = 404;
104 +
		isError = true;
105 +
		title = "Not Found";
106 +
		errorMessage = "The post you're looking for doesn't exist.";
105 107
	}
106 108
} catch (err) {
107 109
	console.error("Error fetching post:", err);
108 -
	return new Response(null, {
109 -
		status: 500,
110 -
		statusText: "Internal Server Error",
111 -
	});
110 +
	Astro.response.status = 500;
111 +
	isError = true;
112 +
	title = "Error";
113 +
	errorMessage = "Something went wrong while loading this post.";
112 114
}
113 115
114 116
const meta = {
120 122
121 123
<PageLayout meta={meta}>
122 124
	<article>
123 -
		<h1 class="text-2xl font-bold mb-2">{title}</h1>
124 -
		<time class="text-sm text-gray-400">{publishedAt}</time>
125 -
		<div class="prose prose-invert max-w-none my-4">
126 -
			<Fragment set:html={contentHTML} />
127 -
		</div>
128 -
		<p class="text-xs text-gray-400 mt-4 break-all">{atUri}</p>
129 -
		<div class="mt-12 flex items-center justify-between">
130 -
			<a class="style-link" href="/now">&larr; Now</a>
131 -
			<button
132 -
				id="share-btn"
133 -
				class="text-sm text-gray-500 hover:text-gray-700 transition-colors"
134 -
			>
135 -
				Share
136 -
			</button>
137 -
		</div>
125 +
		{isError ? (
126 +
			<>
127 +
				<h1 class="text-2xl font-bold mb-4">{title}</h1>
128 +
				<p class="text-gray-400 mb-8">{errorMessage}</p>
129 +
				<a class="style-link" href="/now">&larr; Back to Now</a>
130 +
			</>
131 +
		) : (
132 +
			<>
133 +
				<h1 class="text-2xl font-bold mb-2">{title}</h1>
134 +
				<time class="text-sm text-gray-400">{publishedAt}</time>
135 +
				<div class="prose prose-invert max-w-none my-4">
136 +
					<Fragment set:html={contentHTML} />
137 +
				</div>
138 +
				<p class="text-xs text-gray-400 mt-4 break-all">{atUri}</p>
139 +
				<div class="mt-12 flex items-center justify-between">
140 +
					<a class="style-link" href="/now">&larr; Now</a>
141 +
					<button
142 +
						id="share-btn"
143 +
						class="text-sm text-gray-500 hover:text-gray-700 transition-colors"
144 +
					>
145 +
						Share
146 +
					</button>
147 +
				</div>
148 +
			</>
149 +
		)}
138 150
	</article>
139 151
</PageLayout>
140 152