use strapi client, use locals for strapi url
This commit is contained in:
parent
817c3a78ac
commit
0e94cb95ca
11 changed files with 144 additions and 110 deletions
|
|
@ -1,24 +1,37 @@
|
|||
import { env } from '$env/dynamic/private';
|
||||
import { strapi } from '@strapi/client';
|
||||
import type { PageServerLoad } from './$types';
|
||||
|
||||
export const load: PageServerLoad = async ({ params }) => {
|
||||
export const load: PageServerLoad = async ({ locals, params }) => {
|
||||
const { slug } = params;
|
||||
const response = await fetch(
|
||||
`http://${env.STRAPI_HOST}:${env.STRAPI_PORT}/api/blogs/${slug}?populate=Header&populate=Topics`,
|
||||
{
|
||||
method: 'GET',
|
||||
headers: {
|
||||
Authorization: `bearer ${env.STRAPI_TOKEN}`
|
||||
}
|
||||
}
|
||||
);
|
||||
const { Strapi } = locals;
|
||||
|
||||
const { data, meta } = await response.json();
|
||||
const client = strapi({
|
||||
baseURL: Strapi.url,
|
||||
auth: env.STRAPI_TOKEN
|
||||
});
|
||||
|
||||
console.log(JSON.stringify(data, null, 2));
|
||||
const blogs = client.collection('blogs');
|
||||
|
||||
const { data: post, meta } = await blogs.findOne(slug, {
|
||||
populate: ['Header', 'Topics']
|
||||
});
|
||||
|
||||
return {
|
||||
post: data,
|
||||
post: {
|
||||
id: post.documentId,
|
||||
image: {
|
||||
url: `${Strapi.url}${post.Header.url}`,
|
||||
alt: post.Header.alternativeText
|
||||
},
|
||||
title: post.Title,
|
||||
body: post.Body,
|
||||
topics: post.Topics.map((topic: { id: string; Topic: string }) => ({
|
||||
id: topic.id,
|
||||
name: topic.Topic
|
||||
})),
|
||||
published: post.publishedAt
|
||||
},
|
||||
meta
|
||||
};
|
||||
};
|
||||
|
|
|
|||
|
|
@ -11,16 +11,16 @@
|
|||
|
||||
<div class="flex flex-col items-center gap-4">
|
||||
<div class="w-full max-w-5xl px-4">
|
||||
<p class="text-gray-500">{dayjs(post.createdAt).format('DD MMMM YYYY')}</p>
|
||||
<h1 class="text-4xl font-light">{post.Title}</h1>
|
||||
<p class="text-gray-500">{dayjs(post.published).format('DD MMMM YYYY')}</p>
|
||||
<h1 class="text-4xl font-light">{post.title}</h1>
|
||||
</div>
|
||||
<img
|
||||
class="aspect-4/2 w-full object-cover"
|
||||
src={`${env.PUBLIC_STRAPI_HOST}${post.Header.formats.medium.url}`}
|
||||
alt={post.Header.alternativeText}
|
||||
src={`${env.PUBLIC_STRAPI_HOST}${post.image.url}`}
|
||||
alt={post.image.alt}
|
||||
/>
|
||||
<div class="w-full max-w-5xl px-4">
|
||||
{#await compile(post.Body)}
|
||||
{#await compile(post.body)}
|
||||
<div class="skeleton h-48 w-full"></div>
|
||||
{:then content}
|
||||
<!-- eslint-disable-next-line svelte/no-at-html-tags -->
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue