---
import type { GetStaticPaths } from "astro";
import { getFileNameFromPath } from "./index.astro";
import RootLayout from "@layouts/RootLayout.astro";
import Photo from "@components/Photo.astro";

export const getStaticPaths = (async () => {
  const photos = await Astro.glob("../../assets/photos/*");

  return photos.map((photo: any) => ({
    params: {
      photo: getFileNameFromPath(photo.default.src),
    },
    props: {
      photo,
    },
  }));
}) satisfies GetStaticPaths;

const { photo } = Astro.props;
---

<RootLayout title="Photo" hideScrollbar>
  <div
    class="cursor-pointer bg-gray-900 w-full h-screen flex justify-center"
    onclick="
    history.back()
    "
  >
    <Photo photo={photo.default} height={1000} class="w-auto h-full" />
  </div>
</RootLayout>
