From 1fa0b4d300e3678ca532455164500491af586aea Mon Sep 17 00:00:00 2001
From: Tero Halla-aho <thallaa@gmail.com>
Date: Sun, 7 Dec 2025 00:29:38 +0200
Subject: [PATCH] Treat invalid calendar URLs as missing availability

---
 app/api/listings/route.ts    | 11 +++++++++-
 app/listings/[slug]/page.tsx | 39 +++++++++++++++++++++++++++---------
 2 files changed, 40 insertions(+), 10 deletions(-)

diff --git a/app/api/listings/route.ts b/app/api/listings/route.ts
index 9837ebe..0cd0699 100644
--- a/app/api/listings/route.ts
+++ b/app/api/listings/route.ts
@@ -138,6 +138,15 @@ export async function GET(req: Request) {
       );
     const translation = pickTranslation(listing.translations, locale);
     const fallback = listing.translations[0];
+    const validCalendarUrls = (listing.calendarUrls ?? []).filter((url) => {
+      if (!url) return false;
+      try {
+        const parsed = new URL(url);
+        return parsed.protocol === 'http:' || parsed.protocol === 'https:';
+      } catch {
+        return false;
+      }
+    });
     return {
       id: listing.id,
       title: translation?.title ?? fallback?.title ?? 'Listing',
@@ -173,7 +182,7 @@ export async function GET(req: Request) {
       priceWeekendEuros: listing.priceWeekendEuros,
       coverImage: resolveImageUrl(listing.images.find((img) => img.isCover) ?? listing.images[0] ?? { id: '', url: null, size: null }),
       isSample,
-      hasCalendar: Boolean(listing.calendarUrls?.length),
+      hasCalendar: Boolean(validCalendarUrls.length),
       availableForDates: availabilityFilterActive ? Boolean(availabilityMap.get(listing.id)) : undefined,
     };
   });
diff --git a/app/listings/[slug]/page.tsx b/app/listings/[slug]/page.tsx
index 6be4b2c..efff2a1 100644
--- a/app/listings/[slug]/page.tsx
+++ b/app/listings/[slug]/page.tsx
@@ -52,7 +52,15 @@ export default async function ListingPage({ params }: ListingPageProps) {
 
   const { listing, title, description, teaser, locale: translationLocale } = translation;
   const isSample = listing.isSample || listing.contactEmail === 'host@lomavuokraus.fi' || SAMPLE_LISTING_SLUGS.includes(params.slug);
-  const calendarUrls = listing.calendarUrls ?? [];
+  const calendarUrls = (listing.calendarUrls ?? []).filter((url) => {
+    if (!url) return false;
+    try {
+      const parsed = new URL(url);
+      return parsed.protocol === 'http:' || parsed.protocol === 'https:';
+    } catch {
+      return false;
+    }
+  });
   const hasCalendar = calendarUrls.length > 0;
   const availabilityFrom = new Date();
   availabilityFrom.setUTCHours(0, 0, 0, 0);
@@ -143,14 +151,27 @@ export default async function ListingPage({ params }: ListingPageProps) {
                 )}
               </div>
               <div className="panel" style={{ padding: 12 }}>
-                {hasCalendar ? (
-                  <AvailabilityCalendar blockedDates={blockedDates} months={1} disabled={!listing.calendarUrls?.length} />
-                ) : (
-                  <div style={{ display: 'grid', gap: 8 }}>
-                    <div style={{ fontWeight: 700 }}>{t('availabilityTitle')}</div>
-                    <p style={{ color: '#cbd5e1', margin: 0 }}>{t('availabilityMissing')}</p>
-                  </div>
-                )}
+                <div style={{ position: 'relative' }}>
+                  <AvailabilityCalendar blockedDates={blockedDates} months={1} disabled={!hasCalendar} />
+                  {!hasCalendar ? (
+                    <div
+                      style={{
+                        position: 'absolute',
+                        inset: 0,
+                        display: 'flex',
+                        alignItems: 'center',
+                        justifyContent: 'center',
+                        color: '#cbd5e1',
+                        fontWeight: 600,
+                        textAlign: 'center',
+                        background: 'linear-gradient(135deg, rgba(15,23,42,0.55), rgba(15,23,42,0.65))',
+                        borderRadius: 12,
+                      }}
+                    >
+                      {t('availabilityMissing')}
+                    </div>
+                  ) : null}
+                </div>
               </div>
             </div>
           )}