From 0417af9e96c936c31ae7069107e658ac4a7dbf50 Mon Sep 17 00:00:00 2001 From: Jack Merrill Date: Wed, 1 Nov 2023 12:20:22 -0400 Subject: [PATCH] feat: add image optimization --- {public => src/assets}/img/DJI_0565.JPG | Bin {public => src/assets}/img/DJI_0605.JPG | Bin {public => src/assets}/img/IMG_0196.JPG | Bin {public => src/assets}/img/IMG_3942.JPG | Bin src/components/PictureShowcase.tsx | 21 +---------------- src/pages/index.astro | 29 ++++++++++++++++++++++-- 6 files changed, 28 insertions(+), 22 deletions(-) rename {public => src/assets}/img/DJI_0565.JPG (100%) rename {public => src/assets}/img/DJI_0605.JPG (100%) rename {public => src/assets}/img/IMG_0196.JPG (100%) rename {public => src/assets}/img/IMG_3942.JPG (100%) 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' - +