fix: add null safety to SteamReviews component
This commit is contained in:
@@ -91,9 +91,11 @@ export function SteamReviews({ gameId, steamAppId, className }: SteamReviewsProp
|
|||||||
if (!data?.query_summary) return null;
|
if (!data?.query_summary) return null;
|
||||||
|
|
||||||
const { query_summary: summary } = data;
|
const { query_summary: summary } = data;
|
||||||
|
const totalReviews = summary.total_reviews ?? 0;
|
||||||
|
const totalPositive = summary.total_positive ?? 0;
|
||||||
const positivePercent =
|
const positivePercent =
|
||||||
summary.total_reviews > 0
|
totalReviews > 0
|
||||||
? Math.round((summary.total_positive / summary.total_reviews) * 100)
|
? Math.round((totalPositive / totalReviews) * 100)
|
||||||
: 0;
|
: 0;
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -103,7 +105,7 @@ export function SteamReviews({ gameId, steamAppId, className }: SteamReviewsProp
|
|||||||
<div>
|
<div>
|
||||||
<h3 className="text-lg font-semibold">Steam Reviews</h3>
|
<h3 className="text-lg font-semibold">Steam Reviews</h3>
|
||||||
<p className="text-sm text-zinc-400">
|
<p className="text-sm text-zinc-400">
|
||||||
{summary.review_score_desc} — {positivePercent}% positive ({summary.total_reviews.toLocaleString()} reviews)
|
{summary.review_score_desc ?? "No reviews"} — {positivePercent}% positive ({totalReviews.toLocaleString()} reviews)
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<a
|
<a
|
||||||
@@ -118,7 +120,7 @@ export function SteamReviews({ gameId, steamAppId, className }: SteamReviewsProp
|
|||||||
|
|
||||||
{/* Review cards */}
|
{/* Review cards */}
|
||||||
<div className="space-y-3">
|
<div className="space-y-3">
|
||||||
{data.reviews.map((review) => (
|
{(data.reviews ?? []).map((review) => (
|
||||||
<div
|
<div
|
||||||
key={review.recommendationid}
|
key={review.recommendationid}
|
||||||
className="rounded-lg border border-zinc-800 bg-zinc-900/50 p-4"
|
className="rounded-lg border border-zinc-800 bg-zinc-900/50 p-4"
|
||||||
@@ -138,7 +140,7 @@ export function SteamReviews({ gameId, steamAppId, className }: SteamReviewsProp
|
|||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<span className="text-xs text-zinc-500">
|
<span className="text-xs text-zinc-500">
|
||||||
{Math.floor(review.author.playtime_forever / 60)}h played
|
{Math.floor((review.author?.playtime_forever ?? 0) / 60)}h played
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<p className="text-sm text-zinc-300 line-clamp-4">{review.review}</p>
|
<p className="text-sm text-zinc-300 line-clamp-4">{review.review}</p>
|
||||||
|
|||||||
Reference in New Issue
Block a user