fix: link github to homepage and fix searched project not clickable

This commit is contained in:
Naytitorn Chaovirachot 2024-11-06 15:26:57 +07:00
commit b3fd664cb4
2 changed files with 15 additions and 8 deletions

View File

@ -11,25 +11,31 @@ import {
import Image from "next/image";
import { StaticImport } from "next/dist/shared/lib/get-img-props";
interface ItemProps {
src: string | StaticImport;
alt: string;
width: number;
height: number;
}
const ImageModal = ({ item, width }: { item: { src: string | StaticImport; alt: string;} }, number ) => {
const ImageModal = ({ src, alt, width, height }: ItemProps) => {
return (
<Dialog>
<DialogTrigger asChild>
<Image src={item.src} alt={item.alt} width={item.width} height={item.height} className="rounded-lg basis-0" />
<Image src={src} alt={alt} width={width} height={height} className="rounded-lg basis-0" />
</DialogTrigger>
<DialogContent className="">
<DialogContent>
<DialogHeader>
<DialogTitle>Image Preview</DialogTitle>
<DialogDescription>Click outside to close the image preview.</DialogDescription>
</DialogHeader>
<Image src={item.src} alt={item.alt} width={700} height={400} />
<Image src={src} alt={alt} width={700} height={400} />
<DialogFooter />
</DialogContent>
</Dialog>
);
};
export function DisplayFullImage({ item }: { item: { src: string | StaticImport; alt: string; width: number; height: number } }) {
return <ImageModal item={item} />;
export function DisplayFullImage({ src, alt, width, height }: ItemProps) {
return <ImageModal src={src} alt={alt} width={width} height={height} />;
}

View File

@ -49,7 +49,6 @@ export default async function ProjectDealPage({ params }: { params: { id: number
alt: `${projectData.project_name} Image`,
});
return (
<div className="container max-w-screen-xl my-5">
<div className="flex flex-col gap-y-10">
@ -92,7 +91,9 @@ export default async function ProjectDealPage({ params }: { params: { id: number
<CarouselContent className="flex space-x-1">
{carouselData.map((item, index) => (
<CarouselItem key={index} className="flex">
<DisplayFullImage item={item} width={200} height={100}/>
<CarouselItem key={index} className="flex">
<DisplayFullImage src="/path/to/image.jpg" alt="Image description" width={300} height={200} />
</CarouselItem>
</CarouselItem>
))}
</CarouselContent>