🔥 Filter locations from clicked continent on Locations

src/components/molecules/Location.svelte

@@ -10,11 +10,10 @@
     export let location: any
 
     const { settings: { limit_new }}: any = getContext('global')
-    const { name, slug, country, date_updated } = location
 
     // Location date limit
     const dateNowOffset = dayjs().subtract(limit_new, 'day')
-    const dateLocationUpdated = dayjs(date_updated)
+    const dateLocationUpdated = dayjs(location.date_updated)
     const isNew = dateLocationUpdated.isAfter(dateNowOffset)
 
     let locationEl: HTMLElement
@@ -51,19 +50,19 @@
 <div class="location" role="listitem" bind:this={locationEl}
     style="--offset-x: {$offset.x}px; --offset-y: {$offset.y}px; --rotate: {$offset.x * 0.125}deg"
 >
-    <a href="/{country.slug}/{slug}"
+    <a href="/{location.country.slug}/{location.slug}"
         on:mousemove={handleMouseMove}
         on:mouseleave={handleMouseLeave}
         sveltekit-noscroll
     >
-        <Image class="location__flag" id={country.flag.id} alt="Flag of {country.name}" width={32} height={32} />
+        <Image class="location__flag" id={location.country.flag.id} alt="Flag of {location.country.name}" width={32} height={32} />
         <div class="text">
             <dl>
                 <dt class="location__name">
-                    {name}
+                    {location.name}
                 </dt>
                 <dd class="location__country text-label">
-                    {country.name}
+                    {location.country.name}
                 </dd>
             </dl>
             {#if isNew}
@@ -73,10 +72,10 @@
     </a>
     {#if location.photos.length}
         <div class="location__photos">
-            {#each location.photos as photo, index}
+            {#each location.photos as { image }, index}
                 <Image
                     class={index === photoIndex ? 'is-visible' : null}
-                    id={photo.image.id} alt={photo.image.title}
+                    id={image.id} alt={image.title}
                     width={340} height={226} quality={70}
                 />
             {/each}