diff --git a/public/img/DJI_0565.JPG b/src/assets/img/DJI_0565.JPG similarity index 100% rename from public/img/DJI_0565.JPG rename to src/assets/img/DJI_0565.JPG diff --git a/public/img/DJI_0605.JPG b/src/assets/img/DJI_0605.JPG similarity index 100% rename from public/img/DJI_0605.JPG rename to src/assets/img/DJI_0605.JPG diff --git a/public/img/IMG_0196.JPG b/src/assets/img/IMG_0196.JPG similarity index 100% rename from public/img/IMG_0196.JPG rename to src/assets/img/IMG_0196.JPG diff --git a/public/img/IMG_3942.JPG b/src/assets/img/IMG_3942.JPG similarity index 100% rename from public/img/IMG_3942.JPG rename to src/assets/img/IMG_3942.JPG diff --git a/src/components/PictureShowcase.tsx b/src/components/PictureShowcase.tsx index 5543927..4412b72 100644 --- a/src/components/PictureShowcase.tsx +++ b/src/components/PictureShowcase.tsx @@ -1,26 +1,7 @@ import { useState } from "react"; import Carousel, { type Picture } from "./Carousel"; -const pictures: Picture[] = [ - { - title: "Drone Picture of Hampshire College", - image: "/img/DJI_0565.JPG", - }, - { - title: "Drone Picture of Hampshire College (winter)", - image: "/img/DJI_0605.JPG", - }, - { - title: "Bean!!", - image: "/img/IMG_0196.JPG", - }, - { - title: "Ricky!!", - image: "/img/IMG_3942.JPG", - }, -]; - -export default function PictureShowcase() { +export default function PictureShowcase({ pictures }: { pictures: Picture[] }) { return (
diff --git a/src/pages/index.astro b/src/pages/index.astro index 623e675..8baffe3 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -1,5 +1,5 @@ --- -import { Image } from "astro:assets" +import { Image, getImage } from "astro:assets" import memoji from '../assets/memoji.png' import SpotifyNowPlaying from '../components/SpotifyNowPlaying' import SocialNetworks from '../components/SocialNetworks' @@ -7,6 +7,31 @@ import TechStack from '../components/TechStack' import WAIWO from '../components/WAIWO' import PictureShowcase from '../components/PictureShowcase' import { SEO } from 'astro-seo' + +const pictures = [ + { + title: "Drone Picture of Hampshire College", + image: "/img/DJI_0565.JPG", + }, + { + title: "Drone Picture of Hampshire College (winter)", + image: "/img/DJI_0605.JPG", + }, + { + title: "Bean!!", + image: "/img/IMG_0196.JPG", + }, + { + title: "Ricky!!", + image: "/img/IMG_3942.JPG", + }, +]; + +for (const picture of pictures) { + const imported = await import(`../assets${picture.image}`); + const image = await getImage(imported.default); + picture.image = image.src; +} --- @@ -108,7 +133,7 @@ import { SEO } from 'astro-seo' - +