fix(news): resolve null destructuring type errors in article page

.catch(() => null) unioned the query result with null, so destructuring
the first row failed typecheck (TS2488). Return an empty array on failure
instead and drop unused connection/desc imports.
This commit is contained in:
openhands committed 2026-08-05 11:10:16 +02:00
1 parent dc8fb8a6ed
commit 694a24c791
1 file changed
+16 -18
+16 -18
View File
@@ -1,5 +1,4 @@
import { connection } from "next/server";
import { and, asc, desc, eq, inArray } from "drizzle-orm";
import { and, asc, eq, inArray } from "drizzle-orm";
import type { Metadata } from "next";
import Link from "next/link";
import { notFound } from "next/navigation";
@@ -26,7 +25,6 @@ import { sanitize } from "@/lib/sanitize";
// See: https://nextjs.org/docs/app/guides/migrating-to-cache-components
export const instant = false;
type SearchParams = Promise<{
comment?: string;
reaction?: string;
@@ -64,7 +62,7 @@ export async function generateMetadata({
.from(WebsiteArticles)
.where(eq(WebsiteArticles.slug, slug))
.limit(1)
.catch(() => null);
.catch(() => []);
if (!article) return { title: "Article" };
return {
title: article.title,
@@ -116,7 +114,7 @@ export default async function ArticlePage({
.from(WebsiteArticles)
.where(eq(WebsiteArticles.slug, slug))
.limit(1)
.catch(() => null);
.catch(() => []);
return row ?? null;
},
60,
@@ -200,24 +198,24 @@ export default async function ArticlePage({
: null;
return (
<main style={{ display: "grid", gap: "1.5rem" }}>
{comment === "posted" ? (
<main style={{ display: "grid", gap: "1.5rem" }}>
{comment === "posted" ? (
<div role="status" style={feedbackStyle("success")}>
{t("success.posted")}
</div>
) : null}
{reaction === "1" ? (
{reaction === "1" ? (
<div role="status" style={feedbackStyle("success")}>
{t("success.reaction")}
</div>
) : null}
{errorMessage ? (
{errorMessage ? (
<div role="alert" style={feedbackStyle("error")}>
{errorMessage}
</div>
) : null}
<ContentCard
<ContentCard
icon="📰"
title={article.title}
subtitle={
@@ -231,11 +229,11 @@ export default async function ArticlePage({
>
{article.image ? (
// eslint-disable-next-line @next/next/no-img-element
(<img
<img
src={article.image}
alt=""
style={{ width: "100%", borderRadius: 10, margin: "0 0 1rem" }}
/>)
/>
) : null}
{/* Article body is rich HTML (atom uses TinyMCE) — sanitised server-side. */}
<SanitizedHtml
@@ -244,8 +242,8 @@ export default async function ArticlePage({
/>
</ContentCard>
{/* ── Reactions ─────────────────────────────────────────── */}
<ContentCard
{/* ── Reactions ─────────────────────────────────────────── */}
<ContentCard
icon="💬"
title={t("reactionsTitle")}
subtitle={t("reactionsSubtitle")}
@@ -319,8 +317,8 @@ export default async function ArticlePage({
)}
</ContentCard>
{/* ── Comments ──────────────────────────────────────────── */}
<ContentCard
{/* ── Comments ──────────────────────────────────────────── */}
<ContentCard
icon="🗨️"
title={t("commentsTitle")}
subtitle={
@@ -394,6 +392,6 @@ export default async function ArticlePage({
</p>
)}
</ContentCard>
</main>
);
</main>
);
}