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",