Use Newsletter data from API

This commit is contained in:
2021-10-15 22:34:36 +02:00
parent 99cc1bc661
commit 7384088388

View File

@@ -1,11 +1,11 @@
<script lang="ts"> <script lang="ts">
import dayjs from 'dayjs'
// Components // Components
import Metas from '$components/Metas.svelte' import Metas from '$components/Metas.svelte'
import Image from '$components/atoms/Image.svelte'
import Heading from '$components/molecules/Heading.svelte' import Heading from '$components/molecules/Heading.svelte'
import Shop from '$components/organisms/Shop.svelte'
import Newsletter from '$components/organisms/Newsletter.svelte'
export let photos: any export let issues: any
</script> </script>
<Metas <Metas
@@ -22,51 +22,22 @@
<section class="subscribe__issues"> <section class="subscribe__issues">
<h2 class="title-small">Past Issues</h2> <h2 class="title-small">Past Issues</h2>
<ul> <ul>
{#each issues as { issue, title, date_sent, link, thumbnail: { id } }}
<li class="issue"> <li class="issue">
<a href="#"> <a href={link} rel="external noreferrer noopener">
<img src="/images/issue-1.jpg" alt=""> <Image id={id} width={80} height={56} alt="Issue {issue} thumbnail" />
<dl> <dl>
<dt>Issue #3</dt> <dt>Issue #{issue}</dt>
<dd> <dd>
<p>Adding Occitanie region to the mix!</p> <p>{title}</p>
<time>24/08/2020</time> <time>{dayjs(date_sent).format('DD/MM/YYYY')}</time>
</dd>
</dl>
</a>
</li>
<li class="issue">
<a href="#">
<img src="/images/issue-1.jpg" alt="">
<dl>
<dt>Issue #3</dt>
<dd>
<p>Adding Occitanie region to the mix!</p>
<time>24/08/2020</time>
</dd>
</dl>
</a>
</li>
<li class="issue">
<a href="#">
<img src="/images/issue-1.jpg" alt="">
<dl>
<dt>Issue #3</dt>
<dd>
<p>Adding Occitanie region to the mix!</p>
<time>24/08/2020</time>
</dd> </dd>
</dl> </dl>
</a> </a>
</li> </li>
{/each}
</ul> </ul>
</section> </section>
<section class="grid-modules grid">
<div class="wrap">
<Shop />
<Newsletter />
</div>
</section>
</main> </main>
@@ -76,11 +47,12 @@
export async function load ({ page, fetch, session, stuff }) { export async function load ({ page, fetch, session, stuff }) {
const res = await fetchAPI(` const res = await fetchAPI(`
query { query {
photo (limit: 11, sort: ["-date_created"]) { newsletter (limit: -1, sort: "-issue") {
image { issue
id
title title
} date_sent
link
thumbnail { id }
} }
} }
`) `)
@@ -89,7 +61,7 @@
return { return {
props: { props: {
photos: data.photo, issues: data.newsletter,
} }
} }
} }