import { StaticImageData } from "next/image";
import { ReactNode } from "react";

import biotamaCentral from "./assets/biotama1.png";
import biotamaLeft from "./assets/biotama2.png";
import biotamaRight from "./assets/biotama3.png";
import htpCentral from "./assets/htp3.png";
import htpLeft from "./assets/htp1.png";
import htpRight from "./assets/htp2.png";
import BiotamaText from "@/app/components/shrimp-projects/project-descriptions/biotama";
import HackThePlanetText from "@/app/components/shrimp-projects/project-descriptions/htp";

type ProjectImage = {
    src: StaticImageData;
    alt: string;
};

type ProjectImages = {
    left: ProjectImage;
    right: ProjectImage;
    central: ProjectImage;
};

type ProjectContent = {
    name: string;
    content: ReactNode;
    images: ProjectImages;
};

export type Project = {
    [key: string]: ProjectContent;
};

export const projects: Project = {
    biotama: {
        name: "BIOTAMA",
        content: <BiotamaText />,
        images: {
            left: {
                src: biotamaLeft,
                alt: "mother tree with a river and cliffs in the background",
            },
            right: {
                src: biotamaRight,
                alt: "inside of an old brick house looking out the door onto a path leading to a bridge",
            },
            central: {
                src: biotamaCentral,
                alt: "top down view of the mother tree and greenery",
            },
        },
    },
    htp: {
        name: "HACK THE PLANET",
        content: <HackThePlanetText />,
        images: {
            left: {
                src: htpLeft,
                alt: "visual puzzle with different colours",
            },
            right: {
                src: htpRight,
                alt: "the player character standing surrounded by various text characters",
            },
            central: {
                src: htpCentral,
                alt: "top down camera view of a black screen with hex codes randomly placed",
            },
        },
    },
};

//todo add new images for biotama
//todo use image components instead of properties