17 lines
435 B
TypeScript
17 lines
435 B
TypeScript
"use client";
|
|
|
|
import Image, { type ImageProps } from "next/image";
|
|
import { useState } from "react";
|
|
|
|
export function FadeImage(props: ImageProps) {
|
|
const [loaded, setLoaded] = useState(false);
|
|
|
|
return (
|
|
<Image
|
|
{...props}
|
|
placeholder={undefined}
|
|
className={`${props.className ?? ""} transition-opacity duration-700 ${loaded ? "opacity-100" : "opacity-0"}`}
|
|
onLoad={() => setLoaded(true)}
|
|
/>
|
|
);
|
|
}
|