pages that creates all the albums
This commit is contained in:
37
src/pages/pictures/[id].astro
Normal file
37
src/pages/pictures/[id].astro
Normal file
@@ -0,0 +1,37 @@
|
|||||||
|
---
|
||||||
|
// useful https://jankraus.net/2024/04/05/how-to-build-a-simple-photo-gallery-with-astro/
|
||||||
|
import { type CollectionEntry, getCollection, } from 'astro:content';
|
||||||
|
import Album from '../../layouts/Album.astro';
|
||||||
|
import { Image } from 'astro:assets';
|
||||||
|
export const prerender = true;
|
||||||
|
|
||||||
|
|
||||||
|
async function getAlbumImages(id : any) {
|
||||||
|
let images = import.meta.glob<{default : ImageMetadata}>("/src/assets/pictures/**/*.png")
|
||||||
|
images = Object.fromEntries(Object.entries(images).filter(([key]) => key.includes(id)));
|
||||||
|
const resolvedImages = await Promise.all(Object.values(images).map((image) => image().then((mod) => mod.default)));
|
||||||
|
return resolvedImages;
|
||||||
|
}
|
||||||
|
|
||||||
|
export async function getStaticPaths() {
|
||||||
|
const albums = await getCollection('album');
|
||||||
|
|
||||||
|
return albums.map((album) => {
|
||||||
|
return {
|
||||||
|
params: {id: album.id,},
|
||||||
|
props: album ,
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
type Props = CollectionEntry<'album'>;
|
||||||
|
|
||||||
|
const album = Astro.props;
|
||||||
|
|
||||||
|
const images = await getAlbumImages(album.id);
|
||||||
|
// console.log(images)
|
||||||
|
---
|
||||||
|
|
||||||
|
<Album {...album.data}>
|
||||||
|
{images.map((image) => <Image src={image} alt=""></Image>)}
|
||||||
|
</Album>
|
||||||
Reference in New Issue
Block a user