From 394f6a834b3657b52d15cf9cbe0a7939d271da04 Mon Sep 17 00:00:00 2001
From: Mikkel Svartveit <mikkel.svartveit@gmail.com>
Date: Fri, 20 Oct 2023 18:08:25 -0700
Subject: [PATCH] Fix photos

---
 src/components/Photo.astro          | 25 -------------------------
 src/pages/photography/[photo].astro | 10 +++++++++-
 src/pages/photography/index.astro   | 10 ++++++++--
 3 files changed, 17 insertions(+), 28 deletions(-)
 delete mode 100644 src/components/Photo.astro

diff --git a/src/components/Photo.astro b/src/components/Photo.astro
deleted file mode 100644
index 8dfb6c5..0000000
--- a/src/components/Photo.astro
+++ /dev/null
@@ -1,25 +0,0 @@
----
-import { Image } from "astro:assets";
-
-interface Props {
-  photo: any;
-  width?: number;
-  height?: number;
-  class?: string;
-}
-
-const { photo, width, height, class: className } = Astro.props;
----
-
-<Image
-  src={photo}
-  alt=""
-  {width}
-  {height}
-  densities={[1, 2]}
-  quality="mid"
-  class={"object-contain rounded " + (className ?? "")}
-  decoding="sync"
-  loading="eager"
-  transition:name={photo.src}
-/>
diff --git a/src/pages/photography/[photo].astro b/src/pages/photography/[photo].astro
index 508a0e5..92dff61 100644
--- a/src/pages/photography/[photo].astro
+++ b/src/pages/photography/[photo].astro
@@ -1,5 +1,6 @@
 ---
 import type { GetStaticPaths } from "astro";
+import { Image } from "astro:assets";
 import { getFileNameFromPath } from "./index.astro";
 import RootLayout from "@layouts/RootLayout.astro";
 import Photo from "@components/Photo.astro";
@@ -27,6 +28,13 @@ const { photo } = Astro.props;
     history.back()
     "
   >
-    <Photo photo={photo.default} height={1000} class="w-auto h-full" />
+    <Image
+      src={photo.default}
+      alt=""
+      height={2000}
+      quality="high"
+      class="object-contain rounded w-auto h-full"
+      transition:name={photo.default.src}
+    />
   </div>
 </RootLayout>
diff --git a/src/pages/photography/index.astro b/src/pages/photography/index.astro
index 90dc7c8..6df0863 100644
--- a/src/pages/photography/index.astro
+++ b/src/pages/photography/index.astro
@@ -4,7 +4,6 @@ import ContainerLayout from "@layouts/ContainerLayout.astro";
 import BaseLayout from "@layouts/BaseLayout.astro";
 import TextContentLayout from "@layouts/TextContentLayout.astro";
 import { Image } from "astro:assets";
-import Photo from "@components/Photo.astro";
 
 const photos = await Astro.glob("../../assets/photos/*");
 
@@ -48,7 +47,14 @@ export const getFileNameFromPath = (path: string) => {
           class="flex w-full py-2 duration-100 hover:-translate-y-1 rounded-lg"
         >
           <div class="bg-gray-200 rounded">
-            <Photo photo={photo.default} width={400} />
+            <Image
+              src={photo.default}
+              alt=""
+              width={1000}
+              quality="mid"
+              class="object-contain rounded"
+              transition:name={photo.default.src}
+            />
           </div>
         </a>
       ))