28 lines
650 B
TypeScript
28 lines
650 B
TypeScript
"use client";
|
|
|
|
import {
|
|
Dialog,
|
|
DialogContent,
|
|
DialogTitle,
|
|
DialogTrigger,
|
|
} from "@radix-ui/react-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;
|