27 lines
886 B
TypeScript

import { ImageComponent } from "@components/image";
import { useSearchImageContext } from "@contexts/SearchImageContext";
import { useParams } from "@solidjs/router";
import { type Component } from "solid-js";
import SolidjsMarkdown from "solidjs-markdown";
export const ImagePage: Component = () => {
const { imageId } = useParams<{ imageId: string }>();
const { userImages } = useSearchImageContext();
const image = () => userImages().find((i) => i.ImageID === imageId);
return (
<main class="flex flex-col items-center gap-4">
<div class="w-full bg-white rounded-xl p-4">
<ImageComponent ID={imageId} />
</div>
<div>
<h2 class="font-bold text-xl">Description</h2>
<SolidjsMarkdown>{image()?.Image.Description}</SolidjsMarkdown>
</div>
<div class="w-full grid grid-cols-3 gap-2 grid-flow-row-dense p-4 bg-white rounded-xl"></div>
</main>
);
};