29 lines
770 B
TypeScript
29 lines
770 B
TypeScript
import Image from "next/image";
|
|
import FilteredLightbox from "@/app/_components/lightbox";
|
|
import { api } from "@/trpc/server";
|
|
|
|
export default async function Photos(): Promise<React.JSX.Element> {
|
|
const { data: images } = await api.photos.list();
|
|
|
|
return (
|
|
<div className="mx-auto">
|
|
<FilteredLightbox imageData={images}>
|
|
{images.map((image) => (
|
|
<Image
|
|
key={image.src}
|
|
alt={image.src}
|
|
src={image.src}
|
|
className="h-60 w-80 object-contain"
|
|
sizes="100vw"
|
|
loading="lazy"
|
|
width={image.width}
|
|
height={image.height}
|
|
blurDataURL={image.blur}
|
|
placeholder="blur"
|
|
/>
|
|
))}
|
|
</FilteredLightbox>
|
|
</div>
|
|
);
|
|
}
|