CityCards/CityCards-Website
6
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add optional operators to prevent crashing when no cards for a city

Browse Source
This commit is contained in:
aryabenade
2026-04-24 13:52:56 +05:30
parent c0a2c448e5
commit ecd2fb2719
1 changed files with 17 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
src/pages/PassesPage.tsx
View File

@@ -227,10 +227,10 @@ export function PassesPage({
<CardHeader className="text-center pb-4 pt-8 flex-shrink-0">
<CardTitle className="font-merchant text-2xl leading-tight mb-3 text-gray-900">
{cards[0].title}
{cards[0]?.title}
</CardTitle>
<CardDescription className="font-poppins text-sm text-gray-600 leading-relaxed font-normal min-h-[48px] flex items-center justify-center px-4">
{cards[0].description}
{cards[0]?.description}
</CardDescription>
</CardHeader>
@@ -238,23 +238,23 @@ export function PassesPage({
<div className="px-6 pb-6 flex-shrink-0">
<div className="flex items-baseline justify-center gap-2 mb-2">
<span className="text-5xl font-bold text-gray-900 font-poppins">
${cards[0].adultPrice}
${cards[0]?.adultPrice}
</span>
<span className="text-gray-500 font-poppins text-base">
/ {passTypes[0].period}
</span>
</div>
<div className="h-5 flex items-center justify-center">
{cards[0].adultPrice && (
{cards[0]?.adultPrice && (
<div className="text-sm text-gray-500 font-poppins">
{/* Strikethrough price = originalPrice + $5 */}
<span className="line-through mr-2">
${parseFloat(cards[0].adultPrice) + 5}
${parseFloat(cards[0]?.adultPrice) + 5}
</span>
<span className="text-green-600 font-medium">
Save{" "}
{Math.round(
((5) / (parseFloat(cards[0].adultPrice) + 5)) * 100
((5) / (parseFloat(cards[0]?.adultPrice) + 5)) * 100
)}
%
</span>
@@ -299,14 +299,14 @@ export function PassesPage({
{/* Unlimited Pass Card */}
<div className="relative h-full">
<Card
className={`relative h-full flex flex-col transition-all duration-300 cursor-pointer ${selectedPass === passTypes[1].id
className={`relative h-full flex flex-col transition-all duration-300 cursor-pointer ${selectedPass === passTypes[1]?.id
? "ring-2 ring-red-500 shadow-lg" // 🔴 red border when selected
: "border-gray-200 shadow-md hover:shadow-lg hover:border-primary/30"
}`}
onClick={() => setSelectedPass(passTypes[1].id)}
onClick={() => setSelectedPass(passTypes[1]?.id)}
>
{passTypes[1].popular && (
{passTypes[1]?.popular && (
<div className="absolute -top-3 left-1/2 transform -translate-x-1/2 z-10">
<Badge className="bg-gradient-to-r from-yellow-400 to-orange-500 text-black px-6 py-1.5 font-semibold shadow-lg font-poppins">
Most Popular
@@ -320,30 +320,30 @@ export function PassesPage({
<CardHeader className="text-center pb-4 pt-8 flex-shrink-0">
<CardTitle className="font-merchant text-2xl leading-tight mb-3 text-gray-900">
{cards[1].title}
{cards[1]?.title}
</CardTitle>
<CardDescription className="font-poppins text-sm text-gray-600 leading-relaxed font-normal min-h-[48px] flex items-center justify-center px-4">
{cards[1].description}
{cards[1]?.description}
</CardDescription>
</CardHeader>
{/* Pricing */}
<div className="px-6 pb-6 flex-shrink-0">
<div className="flex items-baseline justify-center gap-2 mb-2">
<span className="text-5xl font-bold text-gray-900 font-poppins">${cards[1].adultPrice}</span>
<span className="text-gray-500 font-poppins text-base">/ {passTypes[1].period}</span>
<span className="text-5xl font-bold text-gray-900 font-poppins">${cards[1]?.adultPrice}</span>
<span className="text-gray-500 font-poppins text-base">/ {passTypes[1]?.period}</span>
</div>
<div className="h-5 flex items-center justify-center">
{cards[1].adultPrice && (
{cards[1]?.adultPrice && (
<div className="text-sm text-gray-500 font-poppins">
{/* Strikethrough price = originalPrice + $5 */}
<span className="line-through mr-2">
${parseFloat(cards[1].adultPrice) + 5}
${parseFloat(cards[1]?.adultPrice) + 5}
</span>
<span className="text-green-600 font-medium">
Save{" "}
{Math.round(
((5) / (parseFloat(cards[1].adultPrice) + 5)) * 100
((5) / (parseFloat(cards[1]?.adultPrice) + 5)) * 100
)}
%
</span>
@@ -355,7 +355,7 @@ export function PassesPage({
<CardContent className="pt-0 pb-6 px-6 flex-grow flex flex-col">
<div className="flex-grow mb-6">
<div className="space-y-3">
{passTypes[1].features.map((feature, index) => (
{passTypes[1]?.features.map((feature, index) => (
<div key={index} className="flex items-start gap-3">
<Check className="w-4 h-4 text-green-500 mt-1 flex-shrink-0" />
<span className="text-sm text-gray-700 font-poppins leading-relaxed font-normal">{feature}</span>