132 lines
3.3 KiB
Svelte
132 lines
3.3 KiB
Svelte
<style lang="scss">
|
|
@import "../../style/pages/shop";
|
|
</style>
|
|
|
|
<script lang="ts">
|
|
import { setContext } from 'svelte'
|
|
import { cartNotifications } from '$utils/stores/shop'
|
|
// Components
|
|
import Cart from '$components/organisms/Cart.svelte'
|
|
import NotificationCart from '$components/molecules/NotificationCart.svelte'
|
|
|
|
export let shop: any
|
|
export let locations: any
|
|
export let posters: any
|
|
export let shopProducts: any
|
|
|
|
// Locations with an existing poster product
|
|
const shopLocations = locations.filter(({ slug }: any) => {
|
|
if (posters.find((poster: any) => poster.location.slug === slug)) {
|
|
return true
|
|
}
|
|
})
|
|
|
|
setContext('shop', {
|
|
shop,
|
|
posters,
|
|
shopLocations,
|
|
shopProducts,
|
|
})
|
|
</script>
|
|
|
|
|
|
<Cart />
|
|
|
|
<div class="notifications">
|
|
{#each $cartNotifications as { id, title, name, image } (id)}
|
|
<NotificationCart
|
|
title={title}
|
|
name={name}
|
|
image={image}
|
|
/>
|
|
{/each}
|
|
</div>
|
|
|
|
<slot />
|
|
|
|
|
|
<script context="module" lang="ts">
|
|
import type { LoadEvent, LoadOutput } from '@sveltejs/kit'
|
|
import { fetchAPI } from '$utils/api'
|
|
|
|
export async function load ({ fetch }: LoadEvent): Promise<LoadOutput> {
|
|
// Get content from API
|
|
const res = await fetchAPI(`
|
|
query {
|
|
shop {
|
|
page_heroimage { id }
|
|
}
|
|
|
|
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
|
|
}
|
|
product_id
|
|
photos_product {
|
|
directus_files_id {
|
|
id
|
|
title
|
|
}
|
|
}
|
|
photos_preview {
|
|
directus_files_id {
|
|
id
|
|
title
|
|
}
|
|
}
|
|
}
|
|
}
|
|
`)
|
|
|
|
const { data: { shop, location, posters }} = res
|
|
|
|
|
|
/**
|
|
* Get products data from Swell
|
|
*/
|
|
let shopProducts: any
|
|
|
|
const shopProductRes = await fetch('/api/swell', {
|
|
method: 'POST',
|
|
body: JSON.stringify({
|
|
action: 'getProducts',
|
|
category: 'posters',
|
|
})
|
|
})
|
|
if (shopProductRes.ok) {
|
|
// Set all products
|
|
const { results } = await shopProductRes.json()
|
|
if (results) {
|
|
shopProducts = results
|
|
}
|
|
}
|
|
|
|
|
|
return {
|
|
props: {
|
|
shop,
|
|
locations: location,
|
|
posters,
|
|
shopProducts,
|
|
},
|
|
}
|
|
}
|
|
</script> |