flayks/housesof
2
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Make GraphQL queries more compact

Browse Source
This commit is contained in:
Félix Péault
2022-08-16 21:17:14 +02:00
parent 52e0407700
commit 0e6aaaa4e2
14 changed files with 435 additions and 471 deletions
Download Patch File Download Diff File Expand all files Collapse all files

138
src/routes/+layout.server.ts
View File

@@ -6,86 +6,84 @@ import { PUBLIC_PREVIEW_COUNT } from '$env/static/public'
export const load: PageServerLoad = async () => {
try {
const res = await fetchAPI(`
query {
locations: location (filter: { status: { _eq: "published" }}) {
id
name
slug
coordinates
country {
name
slug
flag { id }
continent { slug }
}
date_updated
photos (
sort: "-date_created",
limit: ${PUBLIC_PREVIEW_COUNT}
) {
image {
id
title
}
date_created
}
has_poster
globe_close
}
countries: country (filter: { status: { _eq: "published" }}) {
id
const res = await fetchAPI(`query {
locations: location (filter: { status: { _eq: "published" }}) {
id
name
slug
coordinates
country {
name
slug
flag { id }
locations { id slug }
continent { slug }
}
continents: continent (filter: { countries: { slug: { _neq: "_empty" }}}) {
name
slug
rotation
date_updated
photos (
sort: "-date_created",
limit: ${PUBLIC_PREVIEW_COUNT}
) {
image {
id
title
}
date_created
}
has_poster
globe_close
}
settings {
seo_name
seo_title
seo_description
description
explore_list
limit_new
instagram
footer_links
switcher_links
newsletter_subtitle
newsletter_text
}
countries: country (filter: { status: { _eq: "published" }}) {
id
name
slug
flag { id }
locations { id slug }
}
shop {
enabled
module_title
module_text
module_images {
directus_files_id {
id
title
}
continents: continent (filter: { countries: { slug: { _neq: "_empty" }}}) {
name
slug
rotation
}
settings {
seo_name
seo_title
seo_description
description
explore_list
limit_new
instagram
footer_links
switcher_links
newsletter_subtitle
newsletter_text
}
shop {
enabled
module_title
module_text
module_images {
directus_files_id {
id
title
}
}
# Count
countPhotos: photo_aggregated (filter: { status: { _eq: "published" }}) {
count { id }
}
countLocations: location_aggregated (filter: { status: { _eq: "published" }}) {
count { id }
}
countCountries: country_aggregated (filter: { status: { _eq: "published" }}) {
count { id }
}
}
`)
# Count
countPhotos: photo_aggregated (filter: { status: { _eq: "published" }}) {
count { id }
}
countLocations: location_aggregated (filter: { status: { _eq: "published" }}) {
count { id }
}
countCountries: country_aggregated (filter: { status: { _eq: "published" }}) {
count { id }
}
}`)
if (res) {
const { data: { countPhotos, countLocations, countCountries, ...rest }} = res

48
src/routes/+page.server.ts
View File

@@ -6,44 +6,40 @@ import { getRandomItems } from '$utils/functions'
export const load: PageServerLoad = async () => {
try {
// Get total of published photos
const totalRes = await fetchAPI(`
query {
photo (
filter: {
favorite: { _eq: true },
status: { _eq: "published" },
},
limit: -1,
) {
id
}
const totalRes = await fetchAPI(`query {
photo (
filter: {
favorite: { _eq: true },
status: { _eq: "published" },
},
limit: -1,
) {
id
}
`)
}`)
const { data: { photo: photosIds }} = totalRes
// Get random photos
const randomPhotosIds = [...getRandomItems(photosIds, 11)].map(({ id }) => id)
// Query these random photos from IDs
const photosRes = await fetchAPI(`
query {
photo (filter: { id: { _in: [${randomPhotosIds}] }}) {
const photosRes = await fetchAPI(`query {
photo (filter: { id: { _in: [${randomPhotosIds}] }}) {
slug
title
city
location {
name
slug
title
city
location {
name
country {
slug
country {
slug
name
flag { id }
}
name
flag { id }
}
image { id }
}
image { id }
}
`)
}`)
const { data: { photo: photos }} = photosRes
if (photos) {

102
src/routes/[country]/[location]/+page.server.ts
View File

@@ -21,63 +21,61 @@ export const load: PageServerLoad = async ({ params }) => {
const { location: slug } = params
// Query
const res = await fetchAPI(`
query {
location (
filter: {
slug: { _eq: "${slug}" },
status: { _eq: "published" },
},
) {
id
const res = await fetchAPI(`query {
location (
filter: {
slug: { _eq: "${slug}" },
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
slug
description
date_updated
illustration_desktop { id }
illustration_desktop_2x { id }
illustration_mobile { id }
credits {
credit_id {
name
website
}
flag { id }
}
has_poster
acknowledgement
}
photos: photo (
filter: {
location: { slug: { _eq: "${slug}" }}
},
sort: "-date_created",
limit: ${PUBLIC_LIST_AMOUNT},
page: 1,
) {
${photoFields}
}
# Total
total_published: photo_aggregated (filter: { location: { slug: { _eq: "${slug}" }}}) {
count { location }
}
# Shop product
product (filter: { location: { slug: { _eq: "${slug}" }}}) {
photos_product {
directus_files_id {
id
}
country {
name
slug
flag { id }
}
has_poster
acknowledgement
}
photos: photo (
filter: {
location: { slug: { _eq: "${slug}" }}
},
sort: "-date_created",
limit: ${PUBLIC_LIST_AMOUNT},
page: 1,
) {
${photoFields}
}
# Total
total_published: photo_aggregated (filter: { location: { slug: { _eq: "${slug}" }}}) {
count { location }
}
# Shop product
product (filter: { location: { slug: { _eq: "${slug}" }}}) {
photos_product {
directus_files_id {
id
}
}
}
}
`)
}`)
const { data: { location: location, photos, total_published, product }} = res

26
src/routes/[country]/[location]/+page.svelte
View File

@@ -75,21 +75,19 @@
const loadPhotos = async (page?: number) => {
const res = await fetch('/api/data', {
method: 'POST',
body: `
query {
photos: photo (
filter: {
location: { slug: { _eq: "${params.location}" }},
status: { _eq: "published" },
},
sort: "-date_created",
limit: ${PUBLIC_LIST_INCREMENT},
page: ${page},
) {
${photoFields}
}
body: `query {
photos: photo (
filter: {
location: { slug: { _eq: "${params.location}" }},
status: { _eq: "published" },
},
sort: "-date_created",
limit: ${PUBLIC_LIST_INCREMENT},
page: ${page},
) {
${photoFields}
}
`,
}`,
})
const { data: { photos }} = await res.json()

94
src/routes/[country]/[location]/[photo]/+page.server.ts
View File

@@ -5,75 +5,69 @@ import { fetchAPI } from '$utils/api'
export const load: PageServerLoad = async ({ params }) => {
try {
// Get the first photo ID
const firstPhoto = await fetchAPI(`
query {
photo (search: "${params.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
}
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},
) {
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
slug
date_taken
image {
id
title
width, height
}
city
width, height
}
city
}
location (filter: { slug: { _eq: "${params.location}" }}) {
id
location (filter: { slug: { _eq: "${params.location}" }}) {
id
name
slug
country {
name
slug
country {
name
slug
}
}
total_published: photo_aggregated (filter: { location: { slug: { _eq: "${params.location}" }}}) {
count { location }
}
}
`)
total_published: photo_aggregated (filter: { location: { slug: { _eq: "${params.location}" }}}) {
count { location }
}
}`)
const { data } = res

36
src/routes/[country]/[location]/[photo]/+page.svelte
View File

@@ -152,29 +152,27 @@
const isPrev = direction === directions.PREV
const res = await fetch('/api/data', {
method: 'POST',
body: `
query {
photos: photo (
filter: {
location: { slug: { _eq: "${location.slug}" }},
id: { _${isPrev ? 'gt' : 'lt'}: ${id} },
status: { _eq: "published" },
},
sort: "${isPrev ? '' : '-'}id",
limit: ${limit},
) {
body: `query {
photos: photo (
filter: {
location: { slug: { _eq: "${location.slug}" }},
id: { _${isPrev ? 'gt' : 'lt'}: ${id} },
status: { _eq: "published" },
},
sort: "${isPrev ? '' : '-'}id",
limit: ${limit},
) {
id
title
slug
date_taken
image {
id
title
slug
date_taken
image {
id
title
}
city
}
city
}
`,
}`,
})
const { data: { photos: newPhotos }} = await res.json()

114
src/routes/about/+page.server.ts
View File

@@ -6,76 +6,72 @@ import { getRandomItems } from '$utils/functions'
export const load: PageServerLoad = async () => {
try {
// Get data and total of published photos
const res = await fetchAPI(`
query {
photos: photo (
filter: {
favorite: { _eq: true },
status: { _eq: "published" },
},
limit: -1,
) {
id
}
about {
description
intro_firstphoto {
id
title
}
intro_portraits {
id
title
}
intro_text
intro_firstlocation {
slug
country {
flag { id }
slug
}
}
purpose_text
process_title
process_subtitle
process_steps {
title
text
image {
id
title
width, height
}
}
process_intention
contact_title
contact_blocks
}
const res = await fetchAPI(`query {
photos: photo (
filter: {
favorite: { _eq: true },
status: { _eq: "published" },
},
limit: -1,
) {
id
}
`)
about {
description
intro_firstphoto {
id
title
}
intro_portraits {
id
title
}
intro_text
intro_firstlocation {
slug
country {
flag { id }
slug
}
}
purpose_text
process_title
process_subtitle
process_steps {
title
text
image {
id
title
width, height
}
}
process_intention
contact_title
contact_blocks
}
}`)
const { data: { about, photos: photosIds }} = res
// Get random photos
const randomPhotosIds = [...getRandomItems(photosIds, 42)].map(({ id }) => id)
// Query these random photos from IDs
const photosRes = await fetchAPI(`
query {
photo (filter: { id: { _in: [${randomPhotosIds}] }}) {
const photosRes = await fetchAPI(`query {
photo (filter: { id: { _in: [${randomPhotosIds}] }}) {
id
title
slug
image {
id
title
slug
image {
id
title
}
}
}
`)
}`)
if (photosRes) {
const { data: { photo: photos }} = photosRes

34
src/routes/credits/+page.server.ts
View File

@@ -4,31 +4,29 @@ import { fetchAPI } from '$utils/api'
export const load: PageServerLoad = async () => {
try {
const res = await fetchAPI(`
query {
credits {
text
list
}
const res = await fetchAPI(`query {
credits {
text
list
}
credit (filter: { status: { _eq: "published" }}) {
name
website
location {
location_id (filter: { status: { _eq: "published" }}) {
name
credit (filter: { status: { _eq: "published" }}) {
name
website
location {
location_id (filter: { status: { _eq: "published" }}) {
name
slug
country {
slug
country {
slug
flag {
id
}
flag {
id
}
}
}
}
}
`)
}`)
const { data } = res

76
src/routes/photos/+page.server.ts
View File

@@ -11,53 +11,51 @@ export const load: PageServerLoad = async ({ url }) => {
const querySort = url.searchParams.get('sort') || PUBLIC_FILTERS_DEFAULT_SORT
// Query
const res = await fetchAPI(`
query {
photos: photo (
filter: {
${queryCountry !== 'all' ? `location: { country: { slug: { _eq: "${queryCountry}" }}},` : ''}
status: { _eq: "published" },
},
sort: "${querySort === 'latest' ? '-' : ''}date_created",
limit: ${PUBLIC_GRID_AMOUNT},
page: 1,
) {
const res = await fetchAPI(`query {
photos: photo (
filter: {
${queryCountry !== 'all' ? `location: { country: { slug: { _eq: "${queryCountry}" }}},` : ''}
status: { _eq: "published" },
},
sort: "${querySort === 'latest' ? '-' : ''}date_created",
limit: ${PUBLIC_GRID_AMOUNT},
page: 1,
) {
id
title
slug
image {
id
title
}
location {
slug
image {
id
title
}
location {
name
region
country {
slug
name
region
country {
slug
name
flag { id }
}
flag { id }
}
city
date_created
}
country: country (
filter: {
slug: { _eq: "${queryCountry}" },
status: { _eq: "published" },
},
) {
slug
}
# Total
total_published: photo_aggregated ${queryCountry !== 'all' ? `(filter: { location: { country: { slug: { _eq: "${queryCountry}" }}}})` : ''} {
count { id }
}
city
date_created
}
`)
country: country (
filter: {
slug: { _eq: "${queryCountry}" },
status: { _eq: "published" },
},
) {
slug
}
# Total
total_published: photo_aggregated ${queryCountry !== 'all' ? `(filter: { location: { country: { slug: { _eq: "${queryCountry}" }}}})` : ''} {
count { id }
}
}`)
const { data } = res

46
src/routes/photos/+page.svelte
View File

@@ -159,38 +159,36 @@
const loadPhotos = async (page: number) => {
const res = await fetch('/api/data', {
method: 'POST',
body: `
query {
photos: photo (
filter: {
${filterCountry !== 'all' ? `location: { country: { slug: { _eq: "${filterCountry}" }} },` : ''}
status: { _eq: "published" },
},
sort: "${filterSort === 'latest' ? '-' : ''}date_created",
limit: ${PUBLIC_GRID_INCREMENT},
page: ${page},
) {
body: `query {
photos: photo (
filter: {
${filterCountry !== 'all' ? `location: { country: { slug: { _eq: "${filterCountry}" }} },` : ''}
status: { _eq: "published" },
},
sort: "${filterSort === 'latest' ? '-' : ''}date_created",
limit: ${PUBLIC_GRID_INCREMENT},
page: ${page},
) {
id
title
slug
image {
id
title
}
location {
slug
image {
id
title
}
location {
name
region
country {
slug
name
region
country {
slug
name
flag { id }
}
flag { id }
}
city
}
city
}
`,
}`,
})
const { data: { photos }} = await res.json()

70
src/routes/shop/+layout.server.ts
View File

@@ -6,50 +6,48 @@ import { getProducts } from '$utils/functions/swell'
export const load: PageServerLoad = async () => {
try {
// Get content from API
const res = await fetchAPI(`
query {
shop {
page_heroimage { id }
}
const res = await fetchAPI(`query {
shop {
page_heroimage { id }
}
location (
filter: {
has_poster: { _eq: true },
status: { _eq: "published" },
},
sort: "name"
) {
location (
filter: {
has_poster: { _eq: true },
status: { _eq: "published" },
},
sort: "name"
) {
name
slug
}
posters: product (
filter: { status: { _eq: "published" }}
) {
name
type
description
details
location {
name
slug
}
posters: product (
filter: { status: { _eq: "published" }}
) {
name
type
description
details
location {
name
slug
product_id
photos_product {
directus_files_id {
id
title
}
product_id
photos_product {
directus_files_id {
id
title
}
}
photos_preview {
directus_files_id {
id
title
}
}
photos_preview {
directus_files_id {
id
title
}
}
}
`)
}`)
const { data: { shop, location, posters }} = res

46
src/routes/shop/+page.server.ts
View File

@@ -7,35 +7,33 @@ import { getRandomItem } from '$utils/functions'
export const load: PageServerLoad = async ({}) => {
try {
// Get content from API
const data = await fetchAPI(`
query {
posters: product (
filter: { status: { _eq: "published" }}
) {
const data = await fetchAPI(`query {
posters: product (
filter: { status: { _eq: "published" }}
) {
name
type
description
details
location {
name
type
description
details
location {
name
slug
slug
}
product_id
photos_product {
directus_files_id {
id
title
}
product_id
photos_product {
directus_files_id {
id
title
}
}
photos_preview {
directus_files_id {
id
title
}
}
photos_preview {
directus_files_id {
id
title
}
}
}
`)
}`)
if (data) {
const randomPoster = getRandomItem(data.data.posters)

42
src/routes/shop/[type]-[name]/+page.server.ts
View File

@@ -6,33 +6,31 @@ import { getProduct } from '$utils/functions/swell'
export const load: PageServerLoad = async ({ params }) => {
try {
// Get content from API
const data = await fetchAPI(`
query {
poster: product (search: "${params.name}") {
const data = await fetchAPI(`query {
poster: product (search: "${params.name}") {
name
type
description
details
location {
name
type
description
details
location {
name
slug
slug
}
product_id
photos_product {
directus_files_id {
id
title
}
product_id
photos_product {
directus_files_id {
id
title
}
}
photos_preview {
directus_files_id {
id
title
}
}
photos_preview {
directus_files_id {
id
title
}
}
}
`)
}`)
if (data) {
const poster = data.data.poster[0]

34
src/routes/subscribe/+page.server.ts
View File

@@ -4,25 +4,23 @@ import { fetchAPI } from '$utils/api'
export const load: PageServerLoad = async () => {
try {
const res = await fetchAPI(`
query {
settings {
newsletter_page_text
}
newsletter (
limit: -1,
sort: "-issue",
filter: { status: { _eq: "published" }},
) {
issue
title
date_sent
link
thumbnail { id }
}
const res = await fetchAPI(`query {
settings {
newsletter_page_text
}
`)
newsletter (
limit: -1,
sort: "-issue",
filter: { status: { _eq: "published" }},
) {
issue
title
date_sent
link
thumbnail { id }
}
}`)
const { data } = res