buying guide header display fix

This commit is contained in:
makearmy 2025-10-15 18:23:06 -04:00
parent 22bc048475
commit 3c76ab69e5

View file

@ -5,7 +5,8 @@ import { useSearchParams, useRouter } from "next/navigation";
import ReactMarkdown from "react-markdown"; import ReactMarkdown from "react-markdown";
const API_URL = process.env.NEXT_PUBLIC_API_BASE_URL!; const API_URL = process.env.NEXT_PUBLIC_API_BASE_URL!;
const ASSET_URL = process.env.NEXT_PUBLIC_ASSET_URL!; const ASSET_BASE =
process.env.NEXT_PUBLIC_ASSET_URL || "https://forms.lasereverything.net";
type Score = { id: string | number; cat: string; value: number | string; body?: string }; type Score = { id: string | number; cat: string; value: number | string; body?: string };
type LinkItem = { id?: string | number; text?: string; url: string; target?: string }; type LinkItem = { id?: string | number; text?: string; url: string; target?: string };
@ -21,7 +22,7 @@ type Entry = {
rec_text?: string; rec_text?: string;
updates?: string; updates?: string;
video_review_url?: string; video_review_url?: string;
header?: { id?: string }; header?: { id?: string; filename_disk?: string };
date_updated?: string | number; date_updated?: string | number;
links?: LinkItem[]; links?: LinkItem[];
scores?: Score[]; scores?: Score[];
@ -45,7 +46,7 @@ export default function BuyingGuideProductClient() {
setError(null); setError(null);
try { try {
const res = await fetch( const res = await fetch(
`${API_URL}/items/bg_entries/${productId}?fields=*,links.id,links.text,links.url,links.target,scores.id,scores.cat,scores.value,scores.body,header.id,date_updated`, `${API_URL}/items/bg_entries/${productId}?fields=*,links.id,links.text,links.url,links.target,scores.id,scores.cat,scores.value,scores.body,header.id,header.filename_disk,date_updated`,
{ cache: "no-store" } { cache: "no-store" }
); );
if (!res.ok) throw new Error(await res.text()); if (!res.ok) throw new Error(await res.text());
@ -69,9 +70,12 @@ export default function BuyingGuideProductClient() {
return (sum / entry.scores.length).toFixed(1); return (sum / entry.scores.length).toFixed(1);
}, [entry]); }, [entry]);
// Prefer the public filename_disk path (like the list view).
const headerUrl = const headerUrl =
entry?.header?.id entry?.header?.filename_disk
? `${ASSET_URL}/assets/${entry.header.id}?cache-buster=${entry.date_updated}&key=system-large-contain` ? `${ASSET_BASE}/assets/${entry.header.filename_disk}`
: entry?.header?.id
? `${ASSET_BASE}/assets/${entry.header.id}?cache-buster=${entry.date_updated}&key=system-large-contain`
: null; : null;
if (!productId) return null; // switcher guards this, but be defensive if (!productId) return null; // switcher guards this, but be defensive
@ -105,7 +109,11 @@ export default function BuyingGuideProductClient() {
{/* Header Banner */} {/* Header Banner */}
{headerUrl && ( {headerUrl && (
<div className="w-full h-64 relative overflow-hidden rounded-xl shadow"> <div className="w-full h-64 relative overflow-hidden rounded-xl shadow">
<img src={headerUrl} alt="Header Image" className="object-cover w-full h-full rounded-xl" /> <img
src={headerUrl}
alt="Header Image"
className="object-cover w-full h-full rounded-xl"
/>
</div> </div>
)} )}
@ -153,7 +161,9 @@ export default function BuyingGuideProductClient() {
> >
{link.text || link.url} {link.text || link.url}
</a> </a>
{link.target && <span className="text-sm text-gray-500"> ({link.target})</span>} {link.target && (
<span className="text-sm text-gray-500"> ({link.target})</span>
)}
</li> </li>
))} ))}
</ul> </ul>