fix(building-passport): handle properties with no UPRN

Opening the building passport of an unmatched property 500'd: the whole page is
UPRN-keyed and getSpatialData did BigInt(propertyMeta.uprn) with a null uprn
("Cannot convert null to a BigInt"). Since a property with no UPRN has no
spatial data, installed measures, or EPC to show, render a clear "not matched
yet" state with a link back to the portfolio instead of crashing.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Jun-te Kim 2026-07-07 10:38:28 +00:00
parent 23fba68727
commit 369485058b

View file

@ -6,8 +6,10 @@ import {
SparklesIcon,
BuildingOfficeIcon,
ShieldCheckIcon,
ExclamationTriangleIcon,
} from "@heroicons/react/24/outline";
import { CheckCircleIcon, XCircleIcon } from "@heroicons/react/24/solid";
import Link from "next/link";
import {
getPropertyMeta,
getConditionReport,
@ -67,6 +69,43 @@ export default async function BuildingPassportHome(props: {
}) {
const params = await props.params;
const propertyMeta = await getPropertyMeta(params.propertyId);
// A property with no UPRN isn't matched to an Ordnance Survey address yet, so
// the whole UPRN-keyed passport (spatial data, installed measures, EPC) has
// nothing to show — and getSpatialData(BigInt(null)) would 500. Surface a
// clear "not matched" state and link back to the portfolio instead.
if (!propertyMeta.uprn) {
return (
<div className="max-w-3xl mx-auto px-6 py-16">
<div className="rounded-2xl border border-amber-200 bg-amber-50 p-8 text-center shadow-sm">
<ExclamationTriangleIcon className="mx-auto h-10 w-10 text-amber-500" />
<h1 className="mt-4 text-lg font-bold text-amber-900">
Not matched to a UPRN yet
</h1>
<p className="mx-auto mt-1 max-w-md text-sm text-amber-700">
{propertyMeta.address ? (
<>
<span className="font-medium">{propertyMeta.address}</span>{" "}
hasn&apos;t{" "}
</>
) : (
"This property hasn't "
)}
been matched to an Ordnance Survey address, so its building passport
isn&apos;t available yet. Match it to a UPRN from the portfolio to
unlock the passport.
</p>
<Link
href={`/portfolio/${params.slug}`}
className="mt-6 inline-flex items-center gap-1.5 rounded-lg bg-amber-600 px-4 py-2 text-sm font-semibold text-white transition-opacity hover:opacity-90"
>
Back to portfolio
</Link>
</div>
</div>
);
}
const conditionReport = await getConditionReport(params.propertyId);
const spatial = await getSpatialData(propertyMeta.uprn);
const installedMeasures = await getInstalledMeasuresByUprn(Number(propertyMeta.uprn));