Files
latosa-escrima/frontend/components/photo-viewer.tsx
2025-03-10 16:25:12 +01:00

28 lines
650 B
TypeScript

"use client";
import {
Dialog,
DialogContent,
DialogTitle,
DialogTrigger,
} from "@/components/ui/dialog";
import Image, { ImageProps } from "next/image";
import React, { useState } from "react";
const PhotoViewer: React.FC<ImageProps> = ({ ...props }) => {
const [selected, setSelected] = useState(false);
return (
<Dialog open={selected} onOpenChange={setSelected}>
<DialogTitle>{props.alt}</DialogTitle>
<DialogTrigger asChild>
<Image onClick={() => setSelected(true)} {...props} />
</DialogTrigger>
<DialogContent>
<Image {...props} unoptimized />
</DialogContent>
</Dialog>
);
};
export default PhotoViewer;