fix: eslint errors

apps/website/src/components/SplitText.svelte

@@ -17,7 +17,6 @@
                 <span class="text-split__line" aria-hidden={index === 1}>
                     {#each split as word, i}
                         <span class="word" style:--i-w={i}>{word}</span>{#if word.includes('\n')}<br>{/if}
-                        <!-- svelte-ignore empty-block -->
                         {#if i < split.length - 1}{/if}
                     {/each}
                 </span>

apps/website/src/components/atoms/Button.svelte

@@ -45,7 +45,6 @@
         href={url} class={classes}
         {target} {rel}
         data-sveltekit-noscroll={isExternal || isProtocol ? 'off' : ''}
-        {disabled}
         tabindex="0"
         on:click
     >

apps/website/src/components/atoms/Image.svelte

@@ -10,7 +10,7 @@
     export let ratio: number = undefined
     export let alt: string
     export let lazy = true
-    export let decoding: "auto" | "sync" | "async" = "auto"
+    export let decoding: 'auto' | 'sync' | 'async' = 'auto'
 
     interface Sizes {
         small?: { width?: number, height?: number }
@@ -50,16 +50,16 @@
     $: imgSrc = id ? getAssetUrlKey(id, `${sizeKey}-small-jpg`) : src ? src : undefined
     $: srcSet = {
         // WebP
-        webp:
+        webp: sizes
-            sizes ? [
+            ? [
                 `${getAssetUrlKey(id, `${sizeKey}-small-webp`)} 345w`,
                 sizes.medium ? `${getAssetUrlKey(id, `${sizeKey}-medium-webp`)} 768w` : null,
                 sizes.large ? `${getAssetUrlKey(id, `${sizeKey}-large-webp`)} 1280w` : null,
             ]
             : [getAssetUrlKey(id, `${sizeKey}-webp`)],
         // JPG
-        jpg:
+        jpg: sizes
-            sizes ? [
+            ? [
                 `${getAssetUrlKey(id, `${sizeKey}-small-jpg`)} 345w`,
                 sizes.medium ? `${getAssetUrlKey(id, `${sizeKey}-medium-jpg`)} 768w` : null,
                 sizes.large ? `${getAssetUrlKey(id, `${sizeKey}-large-jpg`)} 1280w` : null,

apps/website/src/components/molecules/Location.svelte

@@ -31,7 +31,7 @@
 
         // Detect if location has new content
         const seenLocationDate = dayjs(parsedSeenLocations[location.id])
-        const isLocationSeen = parsedSeenLocations?.hasOwnProperty(location.id)
+        const isLocationSeen = location.id in parsedSeenLocations
 
         // Define if location is has new photos
         if (seenLocationDate && isLocationSeen) {

apps/website/src/components/molecules/NotificationCart.svelte

@@ -19,8 +19,9 @@
 </script>
 
 <div class="notification-cart shadow-small"
-    on:click={closeNotification}
     transition:fly={{ y: 20, duration: 700, easing: quartOut }}
+    on:click={closeNotification}
+    on:keydown
 >
     <div class="notification-cart__left">
         <img src={image} width={58} height={88} alt={title}>

apps/website/src/components/molecules/ProcessStep.svelte

@@ -36,7 +36,7 @@
                 alt={image.title}
             />
         {:else if video && video.mp4 && video.webm}
-            <video muted loop playsinline autoplay allow="autoplay">
+            <video muted loop playsinline autoplay>
                 <source type="video/mp4" src={getAssetUrlKey(video.mp4, 'step')} />
                 <source type="video/webm" src={getAssetUrlKey(video.webm, 'step')} />
                 <track kind="captions" />

apps/website/src/components/molecules/Select.svelte

@@ -1,5 +1,5 @@
 <script lang="ts">
-    import { createEventDispatcher } from 'svelte';
+    import { createEventDispatcher } from 'svelte'
 
     interface Option {
         value: string

apps/website/src/components/organisms/Cart.svelte

@@ -10,12 +10,12 @@
     import { smoothScroll } from '$utils/stores'
     import { cartOpen, cartData, cartAmount, cartIsUpdating } from '$utils/stores/shop'
     import { initSwell, getCart, updateCartItem, removeCartItem } from '$utils/functions/shop'
+    import { sendEvent } from '$utils/analytics'
     // Components
     import Button from '$components/atoms/Button.svelte'
     import Icon from '$components/atoms/Icon.svelte'
     import CartItem from '$components/molecules/CartItem.svelte'
     import ShopLocationSwitcher from '$components/molecules/ShopLocationSwitcher.svelte'
-    import { sendEvent } from '$utils/analytics';
 
 
     // Block scroll if cart is open
@@ -151,5 +151,6 @@
     <div class="cart-overlay"
         transition:fade={{ duration: 600, easing: quartOut }}
         on:click={handleCloseCart}
+        on:keydown
     />
 {/if}

apps/website/src/routes/(shop)/shop/+error.svelte

@@ -15,7 +15,7 @@
         },
         500: {
             title: 'Server error',
-            message: "That is embarassing, the problem is on our side.",
+            message: 'That is embarassing, the problem is on our side.',
         },
     }
 </script>

apps/website/src/routes/(site)/[country]/[location]/+page.server.ts

@@ -73,7 +73,7 @@ export const load = (async ({ params, setHeaders }) => {
         const { data: { location: location, photos, total_published, product } } = res
 
         if (!location.length || location.length && params.country !== location[0].country.slug) {
-            throw error(404, "This location is not available… yet!")
+            throw error(404, 'This location is not available… yet!')
         }
 
         setHeaders({ 'Cache-Control': 'public, max-age=1, stale-while-revalidate=604799' })

apps/website/src/routes/(site)/[country]/[location]/+page.svelte

@@ -219,7 +219,6 @@
 />
 
 
-
 <PageTransition>
     <main class="location-page">
         <section class="location-page__intro grid" bind:this={introEl}>
@@ -302,7 +301,7 @@
                         location={location.name}
                         ratio={width / height}
                         date={date_taken}
-                        index={(totalPhotos - index < 10) ? '0' : ''}{totalPhotos - index}
+                        index="{(totalPhotos - index < 10) ? '0' : ''}{totalPhotos - index}"
                     />
                 {/each}
             </section>
@@ -312,7 +311,7 @@
                     ended={ended}
                     current={currentPhotosAmount}
                     total={totalPhotos}
-                    on:click={!ended && loadMorePhotos}
+                    on:click={() => !ended && loadMorePhotos()}
                 >
                     {#if !ended}
                         <p class="more">See more photos</p>

apps/website/src/routes/(site)/[country]/[location]/[photo]/+page.svelte

@@ -93,10 +93,10 @@
     const handleKeydown = ({ key, defaultPrevented }: KeyboardEvent) => {
         if (defaultPrevented) return
         switch (key) {
-            case 'ArrowLeft': goToPrevious(); break;
+            case 'ArrowLeft': goToPrevious(); break
-            case 'ArrowRight': goToNext(); break;
+            case 'ArrowRight': goToNext(); break
-            case 'Escape': closeViewer(); break;
+            case 'Escape': closeViewer(); break
-            default: return;
+            default: return
         }
     }
 
@@ -105,15 +105,15 @@
         // Swipe up and down on mobile/small screens
         if (innerWidth < 992) {
             switch (detail) {
-                case '-y': goToNext(); break;
+                case '-y': goToNext(); break
-                case 'y': goToPrevious(); break;
+                case 'y': goToPrevious(); break
             }
         }
         // Swipe left and right on larger screens
         else {
             switch (detail) {
-                case '-x': goToNext(); break;
+                case '-x': goToNext(); break
-                case 'x': goToPrevious(); break;
+                case 'x': goToPrevious(); break
             }
         }
     }
@@ -320,7 +320,11 @@
             </ButtonCircle>
 
             <div class="photo-page__carousel">
-                <div class="photo-page__images" use:swipe on:swipe={handleSwipe} on:tap={toggleFullscreen}>
+                <div class="photo-page__images"
+                    use:swipe
+                    on:swipe={handleSwipe}
+                    on:tap={toggleFullscreen}
+                >
                     {#each visiblePhotos as { id, image, title }, index (id)}
                         <div class="photo-page__picture is-{currentIndex === 0 ? index + 1 : index}">
                             <Image
@@ -377,7 +381,8 @@
         </div>
 
         {#if isFullscreen}
-            <div class="photo-page__fullscreen" bind:this={fullscreenEl} on:click={toggleFullscreen}
+            <div class="photo-page__fullscreen" bind:this={fullscreenEl}
+                on:click={toggleFullscreen} on:keydown
                 in:fade={{ easing: quartOut, duration: 1000 }}
                 out:fade={{ easing: quartOut, duration: 1000, delay: 300 }}
             >

apps/website/src/routes/(site)/about/+page.svelte

@@ -3,7 +3,7 @@
 </style>
 
 <script lang="ts">
-    import { navigating, page } from '$app/stores'
+    import { navigating } from '$app/stores'
     import { onMount, afterUpdate } from 'svelte'
     import { quartOut as quartOutSvelte } from 'svelte/easing'
     import { fade, fly } from 'svelte/transition'
@@ -12,6 +12,7 @@
     import { mailtoClipboard, map } from '$utils/functions'
     import { getAssetUrlKey } from '$utils/api'
     import { DELAY } from '$utils/constants'
+    import { sendEvent } from '$utils/analytics'
     import { quartOut } from '$animations/easings'
     // Components
     import Metas from '$components/Metas.svelte'
@@ -21,7 +22,6 @@
     import AboutGridPhoto from '$components/atoms/AboutGridPhoto.svelte'
     import ProcessStep from '$components/molecules/ProcessStep.svelte'
     import Banner from '$components/organisms/Banner.svelte'
-    import { sendEvent } from '$utils/analytics';
 
     export let data: PageData
     const { about, photos } = data
@@ -223,7 +223,7 @@
                         {about.intro_firstphoto_caption}<br>
                         in
                         <a href="/{about.intro_firstlocation.country.slug}/{about.intro_firstlocation.slug}" data-sveltekit-noscroll>
-                            <img src="{getAssetUrlKey(about.intro_firstlocation.country.flag.id, 'square-small-jpg')}" width="32" height="32" alt="{about.intro_firstlocation.country.flag.title}">
+                            <img src={getAssetUrlKey(about.intro_firstlocation.country.flag.id, 'square-small-jpg')} width="32" height="32" alt={about.intro_firstlocation.country.flag.title}>
                             <span>Naarm Australia (Melbourne)</span>
                         </a>
                     </figcaption>

apps/website/src/routes/(site)/locations/+page.svelte

@@ -14,7 +14,7 @@
     import Heading from '$components/molecules/Heading.svelte'
 
     const { locations }: any = getContext('global')
-    const text = "Explore the globe to discover unique locations across the world"
+    const text = 'Explore the globe to discover unique locations across the world'
 </script>
 
 <Metas

apps/website/src/service-workers.ts

@@ -15,12 +15,11 @@ const cached = build.concat(files);
             .then(cache => cache.addAll(cached))
             .then(() => {
                 // if you use typescript:
-                (self as unknown as ServiceWorkerGlobalScope).skipWaiting();
+                (self as unknown as ServiceWorkerGlobalScope).skipWaiting()
                 // self.skipWaiting();
             })
-        );
+    )
-    }
+});
-);
 
 // self.addEventListener(
 // if you use typescript:
@@ -38,7 +37,7 @@ const cached = build.concat(files);
             (self as unknown as ServiceWorkerGlobalScope).clients.claim()
             // self.clients.claim()
         })
-    );
+    )
 })
 
 
@@ -110,5 +109,4 @@ async function fetchAndCache(request: Request) {
             return cachedAsset || fetchAndCache(event.request)
         })()
     )
-    }
+})
-)

packages/config/eslintrc.config.cjs

@@ -39,7 +39,7 @@ module.exports = {
         ========================================= */
         // Use spaces over tabs
         'no-tabs': 'error',
-        indent: ['error', 4],
+        indent: ['error', 4, { SwitchCase: 1 }],
         // Use single quote in javascript
         quotes: ['error', 'single', {
             avoidEscape: true,