[chore] Switch rest of page endpoints
This commit is contained in:
@@ -6,6 +6,7 @@
|
||||
import { scale } from 'svelte/transition'
|
||||
import { quartOut } from 'svelte/easing'
|
||||
import { getAssetUrlKey } from '$utils/helpers'
|
||||
import { fetchAPI } from '$utils/api'
|
||||
import { previousPage } from '$utils/stores'
|
||||
import { throttle } from '$utils/functions'
|
||||
import { swipe } from '$utils/interactions/swipe'
|
||||
@@ -398,92 +399,4 @@
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
</PageTransition>
|
||||
|
||||
|
||||
<script context="module" lang="ts">
|
||||
import { fetchAPI } from '$utils/api'
|
||||
|
||||
/** @type {import('@sveltejs/kit').Load} */
|
||||
export async function load ({ url, params, fetch, session, stuff }) {
|
||||
// Get the first photo ID
|
||||
const firstPhoto = await fetchAPI(`
|
||||
query {
|
||||
photo: photo (search: "${params.photo}") {
|
||||
id
|
||||
}
|
||||
}
|
||||
`)
|
||||
const firstPhotoId = firstPhoto?.data?.photo[0]?.id
|
||||
// TODO: use same request for both queries (photo.id)
|
||||
const photosBeforeFirst = await fetchAPI(`
|
||||
query {
|
||||
count: photo_aggregated (
|
||||
filter: {
|
||||
id: { _gt: ${firstPhotoId} },
|
||||
location: { slug: { _eq: "${params.location}" }},
|
||||
status: { _eq: "published" },
|
||||
},
|
||||
sort: "-id",
|
||||
) {
|
||||
count {
|
||||
id
|
||||
}
|
||||
}
|
||||
}
|
||||
`)
|
||||
// Define offset from the current count
|
||||
const offset = Math.max(photosBeforeFirst?.data?.count[0]?.count.id - 5, 0)
|
||||
const limit = 10
|
||||
const res = await fetchAPI(`
|
||||
query {
|
||||
photos: photo (
|
||||
filter: {
|
||||
location: { slug: { _eq: "${params.location}" }}
|
||||
status: { _eq: "published" },
|
||||
},
|
||||
sort: "-date_created",
|
||||
limit: ${limit},
|
||||
offset: ${offset},
|
||||
) {
|
||||
id
|
||||
title
|
||||
slug
|
||||
date_taken
|
||||
image {
|
||||
id
|
||||
title
|
||||
}
|
||||
city
|
||||
}
|
||||
|
||||
location (filter: { slug: { _eq: "${params.location}" }}) {
|
||||
name
|
||||
slug
|
||||
country {
|
||||
name
|
||||
slug
|
||||
}
|
||||
}
|
||||
}
|
||||
`)
|
||||
|
||||
const { data } = res
|
||||
const location = stuff.locations.find((location: any) => location.slug === params.location)
|
||||
const totalPhotos = stuff.countTotalPhotosByLocation.find((total: any) => total.group.location === Number(location.id)).count.id
|
||||
|
||||
// Find photo's index
|
||||
const currentIndex = data.photos.findIndex((photo: any) => photo.slug === params.photo)
|
||||
|
||||
return {
|
||||
props: {
|
||||
photos: data.photos,
|
||||
location: data.location[0],
|
||||
currentIndex,
|
||||
countPhotos: totalPhotos,
|
||||
limit,
|
||||
offset,
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</PageTransition>
|
||||
95
src/routes/[country]/[location]/[photo].ts
Normal file
95
src/routes/[country]/[location]/[photo].ts
Normal file
@@ -0,0 +1,95 @@
|
||||
import type { RequestEvent, RequestHandlerOutput } from '@sveltejs/kit'
|
||||
import { fetchAPI } from '$utils/api'
|
||||
|
||||
export async function get({ params }: RequestEvent): Promise<RequestHandlerOutput> {
|
||||
try {
|
||||
// Get the first photo ID
|
||||
const firstPhoto = await fetchAPI(`
|
||||
query {
|
||||
photo (search: "${params.photo}") {
|
||||
id
|
||||
}
|
||||
}
|
||||
`)
|
||||
const firstPhotoId = firstPhoto?.data?.photo[0]?.id
|
||||
|
||||
// TODO: use same request for both queries (photo.id)
|
||||
const photosBeforeFirst = await fetchAPI(`
|
||||
query {
|
||||
count: photo_aggregated (
|
||||
filter: {
|
||||
id: { _gt: ${firstPhotoId} },
|
||||
location: { slug: { _eq: "${params.location}" }},
|
||||
status: { _eq: "published" },
|
||||
},
|
||||
sort: "-id",
|
||||
) {
|
||||
count {
|
||||
id
|
||||
}
|
||||
}
|
||||
}
|
||||
`)
|
||||
|
||||
// Define offset from the current count
|
||||
const offset = Math.max(photosBeforeFirst?.data?.count[0]?.count.id - 5, 0)
|
||||
const limit = 10
|
||||
|
||||
const res = await fetchAPI(`
|
||||
query {
|
||||
photos: photo (
|
||||
filter: {
|
||||
location: { slug: { _eq: "${params.location}" }}
|
||||
status: { _eq: "published" },
|
||||
},
|
||||
sort: "-date_created",
|
||||
limit: ${limit},
|
||||
offset: ${offset},
|
||||
) {
|
||||
id
|
||||
title
|
||||
slug
|
||||
date_taken
|
||||
image {
|
||||
id
|
||||
title
|
||||
}
|
||||
city
|
||||
}
|
||||
|
||||
location (filter: { slug: { _eq: "${params.location}" }}) {
|
||||
id
|
||||
name
|
||||
slug
|
||||
country {
|
||||
name
|
||||
slug
|
||||
}
|
||||
}
|
||||
|
||||
total_published: photo_aggregated (filter: { location: { slug: { _eq: "${params.location}" }}}) {
|
||||
count { location }
|
||||
}
|
||||
}
|
||||
`)
|
||||
|
||||
const { data } = res
|
||||
const currentIndex = data.photos.findIndex((photo: any) => photo.slug === params.photo)
|
||||
|
||||
return {
|
||||
body: {
|
||||
photos: data.photos,
|
||||
location: data.location[0],
|
||||
currentIndex,
|
||||
countPhotos: data.total_published[0].count.location,
|
||||
limit,
|
||||
offset,
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
return {
|
||||
status: 404,
|
||||
body: error,
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -7,6 +7,7 @@
|
||||
import dayjs from 'dayjs'
|
||||
import relativeTime from 'dayjs/plugin/relativeTime.js'
|
||||
import { getAssetUrlKey } from '$utils/helpers'
|
||||
import { fetchAPI } from '$utils/api'
|
||||
import { DURATION } from '$utils/contants'
|
||||
// Components
|
||||
import Metas from '$components/Metas.svelte'
|
||||
@@ -348,75 +349,4 @@
|
||||
</p>
|
||||
</div>
|
||||
{/if}
|
||||
</PageTransition>
|
||||
|
||||
|
||||
<script context="module" lang="ts">
|
||||
import { fetchAPI } from '$utils/api'
|
||||
|
||||
/** @type {import('@sveltejs/kit').Load} */
|
||||
export async function load ({ url, params, fetch, session, stuff }) {
|
||||
const { location } = params
|
||||
|
||||
const res = await fetchAPI(`
|
||||
query {
|
||||
location (
|
||||
filter: {
|
||||
slug: { _eq: "${location}" },
|
||||
status: { _eq: "published" },
|
||||
}
|
||||
) {
|
||||
id
|
||||
name
|
||||
slug
|
||||
description
|
||||
date_updated
|
||||
illustration_desktop { id }
|
||||
illustration_desktop_2x { id }
|
||||
illustration_mobile { id }
|
||||
credits {
|
||||
credit_id {
|
||||
name
|
||||
website
|
||||
}
|
||||
}
|
||||
country { name }
|
||||
has_poster
|
||||
}
|
||||
|
||||
photos: photo (
|
||||
filter: {
|
||||
location: { slug: { _eq: "${location}" }}
|
||||
},
|
||||
sort: "-date_created",
|
||||
limit: ${import.meta.env.VITE_LIST_AMOUNT},
|
||||
page: 1,
|
||||
) {
|
||||
title
|
||||
slug
|
||||
city
|
||||
image {
|
||||
id
|
||||
title
|
||||
}
|
||||
date_taken
|
||||
date_created
|
||||
}
|
||||
|
||||
total_published: photo_aggregated (filter: { location: { slug: { _eq: "${location}" }}}) {
|
||||
count { location }
|
||||
}
|
||||
}
|
||||
`)
|
||||
|
||||
const { data } = res
|
||||
|
||||
return {
|
||||
props: {
|
||||
location: data.location[0],
|
||||
photos: data.photos,
|
||||
totalPhotos: data.photos.length ? data.total_published[0].count.location : 0,
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</PageTransition>
|
||||
76
src/routes/[country]/[location]/index.ts
Normal file
76
src/routes/[country]/[location]/index.ts
Normal file
@@ -0,0 +1,76 @@
|
||||
import type { RequestEvent, RequestHandlerOutput } from '@sveltejs/kit'
|
||||
import { fetchAPI } from '$utils/api'
|
||||
|
||||
export async function get({ params }: RequestEvent): Promise<RequestHandlerOutput> {
|
||||
try {
|
||||
const { location } = params
|
||||
|
||||
// Query
|
||||
const res = await fetchAPI(`
|
||||
query {
|
||||
location (
|
||||
filter: {
|
||||
slug: { _eq: "${location}" },
|
||||
status: { _eq: "published" },
|
||||
}
|
||||
) {
|
||||
id
|
||||
name
|
||||
slug
|
||||
description
|
||||
date_updated
|
||||
illustration_desktop { id }
|
||||
illustration_desktop_2x { id }
|
||||
illustration_mobile { id }
|
||||
credits {
|
||||
credit_id {
|
||||
name
|
||||
website
|
||||
}
|
||||
}
|
||||
country { name }
|
||||
has_poster
|
||||
}
|
||||
|
||||
photos: photo (
|
||||
filter: {
|
||||
location: { slug: { _eq: "${location}" }}
|
||||
},
|
||||
sort: "-date_created",
|
||||
limit: ${import.meta.env.VITE_LIST_AMOUNT},
|
||||
page: 1,
|
||||
) {
|
||||
title
|
||||
slug
|
||||
city
|
||||
image {
|
||||
id
|
||||
title
|
||||
}
|
||||
date_taken
|
||||
date_created
|
||||
}
|
||||
|
||||
# Total
|
||||
total_published: photo_aggregated (filter: { location: { slug: { _eq: "${location}" }}}) {
|
||||
count { location }
|
||||
}
|
||||
}
|
||||
`)
|
||||
|
||||
const { data } = res
|
||||
|
||||
return {
|
||||
body: {
|
||||
location: data.location[0],
|
||||
photos: data.photos,
|
||||
totalPhotos: data.photos.length ? data.total_published[0].count.location : 0,
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
return {
|
||||
status: 404,
|
||||
body: error,
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -148,45 +148,4 @@
|
||||
</section>
|
||||
|
||||
<InteractiveGlobe type="cropped" />
|
||||
</PageTransition>
|
||||
|
||||
|
||||
<script context="module" lang="ts">
|
||||
import { fetchAPI } from '$utils/api'
|
||||
|
||||
/** @type {import('@sveltejs/kit').Load} */
|
||||
export async function load ({ url, params, fetch, session, stuff }) {
|
||||
const res = await fetchAPI(`
|
||||
query {
|
||||
credits {
|
||||
text
|
||||
list
|
||||
}
|
||||
|
||||
credit (filter: { status: { _eq: "published" }}) {
|
||||
name
|
||||
website
|
||||
location {
|
||||
location_id (filter: { status: { _eq: "published" }}) {
|
||||
name
|
||||
slug
|
||||
country {
|
||||
slug
|
||||
flag {
|
||||
id
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`)
|
||||
const { data } = res
|
||||
|
||||
return {
|
||||
props: {
|
||||
data,
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
</PageTransition>
|
||||
45
src/routes/credits.ts
Normal file
45
src/routes/credits.ts
Normal file
@@ -0,0 +1,45 @@
|
||||
import type { RequestEvent, RequestHandlerOutput } from '@sveltejs/kit'
|
||||
import { fetchAPI } from '$utils/api'
|
||||
|
||||
export async function get({}: RequestEvent): Promise<RequestHandlerOutput> {
|
||||
try {
|
||||
const res = await fetchAPI(`
|
||||
query {
|
||||
credits {
|
||||
text
|
||||
list
|
||||
}
|
||||
|
||||
credit (filter: { status: { _eq: "published" }}) {
|
||||
name
|
||||
website
|
||||
location {
|
||||
location_id (filter: { status: { _eq: "published" }}) {
|
||||
name
|
||||
slug
|
||||
country {
|
||||
slug
|
||||
flag {
|
||||
id
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
`)
|
||||
|
||||
const { data } = res
|
||||
|
||||
return {
|
||||
body: {
|
||||
data
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
return {
|
||||
status: 404,
|
||||
body: error,
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -30,10 +30,10 @@ export async function get({}: RequestEvent): Promise<RequestHandlerOutput> {
|
||||
photos: data.photo
|
||||
}
|
||||
}
|
||||
|
||||
} catch (error) {
|
||||
return {
|
||||
status: 404,
|
||||
body: error,
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -72,6 +72,7 @@ export async function get({ url }: RequestEvent): Promise<RequestHandlerOutput>
|
||||
} catch (error) {
|
||||
return {
|
||||
status: 404,
|
||||
body: error,
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user