2023-02-14 16:10:03 +00:00
|
|
|
import useImgProxy from "Hooks/useImgProxy";
|
2023-01-31 14:41:21 +00:00
|
|
|
import { useEffect, useState } from "react";
|
|
|
|
|
2023-02-09 12:26:54 +00:00
|
|
|
interface ProxyImgProps extends React.DetailedHTMLProps<React.ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement> {
|
2023-02-07 19:47:57 +00:00
|
|
|
size?: number;
|
|
|
|
}
|
|
|
|
|
|
|
|
export const ProxyImg = (props: ProxyImgProps) => {
|
2023-02-07 20:04:50 +00:00
|
|
|
const { src, size, ...rest } = props;
|
|
|
|
const [url, setUrl] = useState<string>();
|
|
|
|
const { proxy } = useImgProxy();
|
2023-01-31 14:41:21 +00:00
|
|
|
|
2023-02-07 20:04:50 +00:00
|
|
|
useEffect(() => {
|
|
|
|
if (src) {
|
2023-04-18 11:47:01 +00:00
|
|
|
const url = proxy(src, size);
|
|
|
|
setUrl(url);
|
2023-02-07 20:04:50 +00:00
|
|
|
}
|
|
|
|
}, [src]);
|
2023-01-31 14:41:21 +00:00
|
|
|
|
2023-02-07 20:04:50 +00:00
|
|
|
return <img src={url} {...rest} />;
|
|
|
|
};
|