From 6ef8e41c80c616910eada05b5aa5cdea2ed2c226 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Fe=CC=81lix=20Pe=CC=81ault?= <hello@flayks.com>
Date: Sat, 9 Oct 2021 19:20:41 +0200
Subject: [PATCH] =?UTF-8?q?=F0=9F=94=A5=20Update=20Photos=20content=20when?=
 =?UTF-8?q?=20changing=20filters?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/routes/photos.svelte | 20 ++++++++------------
 1 file changed, 8 insertions(+), 12 deletions(-)

diff --git a/src/routes/photos.svelte b/src/routes/photos.svelte
index c4a948b..9557cee 100644
--- a/src/routes/photos.svelte
+++ b/src/routes/photos.svelte
@@ -32,6 +32,7 @@
     // Filters
     const defaultCountry = 'all'
     const defaultSort = 'latest'
+    const urlFiltersParams = new URLSearchParams()
     let filtered: boolean = false
     let filterCountry: any = $page.query.get('country') || defaultCountry
     let filterSort: string = $page.query.get('sort') || defaultSort
@@ -39,8 +40,9 @@
 
     // Pages related informations
     let currentPage: number = 1
-    let currentPhotosAmount: number = photos.length
     let ended: boolean
+    let currentPhotosAmount: number
+    $: currentPhotosAmount = photos.length
     $: ended = currentPhotosAmount === totalPhotos
 
 
@@ -57,16 +59,10 @@
 
         // Update URL filtering params from filter values
         if (filtered && filterCountry && filterSort) {
-            // urlFiltersParams.set('country', filterCountry)
-            // urlFiltersParams.set('sort', filterSort)
-            // goto(`${$page.path}?${urlFiltersParams.toString()}`, { keepfocus:true, replaceState:true, noscroll:true })
-
-            // TODO: Request photos from the country of choice
-            // loadPhotos()
-            console.log('load photos')
+            urlFiltersParams.set('country', filterCountry)
+            urlFiltersParams.set('sort', filterSort)
+            goto(`${$page.path}?${urlFiltersParams.toString()}`, { keepfocus:true, replaceState:true, noscroll:true })
         }
-
-        // console.log({ filtered, filterCountry, filterSort })
     }
 
 
@@ -123,7 +119,7 @@
     }
 
     // [function] Load photos helper
-    const loadPhotos = async (page?: number, params?: string) => {
+    const loadPhotos = async (page?: number) => {
         const res = fetchAPI(`
             query {
                 photos: photo (
@@ -300,7 +296,7 @@
             query {
                 photos: photo (
                     filter: {
-                        ${queryCountry ? `location: { country: { slug: { _eq: "${queryCountry}" }} },` : ''}
+                        ${queryCountry !== 'all' ? `location: { country: { slug: { _eq: "${queryCountry}" }} },` : ''}
                         status: { _eq: "published" },
                     },
                     sort: "${querySort === 'latest' ? '-' : ''}date_created",