ddix-solid/src/routes/news/[slug].tsx
2024-05-22 09:35:11 +02:00

49 lines
1.2 KiB
TypeScript

import { createSignal, For, Show } from "solid-js";
import {
cache,
createAsync,
A,
type RouteDefinition,
useParams,
} from "@solidjs/router";
const getPost = cache(async (slug) => {
"use server";
return await fetch(`https://content.dd-ix.net/news/en/${slug}`).then((data) =>
data.json()
);
}, "news-post");
export const route = {
load: ({ params }) => {
getPost(params.slug);
},
} satisfies RouteDefinition;
export default () => {
const params = useParams();
const post = createAsync(() => getPost(params.slug));
return (
<main>
<div class="relative">
<img
src={`https://content.dd-ix.net/news/assets/${post()?.image}`}
alt={post()?.title}
class="min-h-[30vh] max-h-[70vh] w-full object-cover"
/>
{/* <h1 class="absolute bottom-0 left-0 p-4 backdrop-blur text-white drop-shadow-md bg-gray-800/40">{post()?.title}</h1> */}
</div>
<div class="container mx-auto p-4">
<article>
<h1>{post()?.title}</h1>
<p>
{post()?.published} by {post()?.authors.join(", ")}
</p>
<div innerHTML={post()?.body} />
</article>
</div>
</main>
);
};