This commit is contained in:
parent
eb9cf7f361
commit
ee01623bf1
@ -1,6 +1,7 @@
|
|||||||
import { forwardRef, HTMLProps, ReactNode, useEffect, useState } from "react";
|
import { forwardRef, HTMLProps, memo, ReactNode, useEffect, useState } from "react";
|
||||||
import { FormattedMessage } from "react-intl";
|
import { FormattedMessage } from "react-intl";
|
||||||
|
|
||||||
|
import Icon from "@/Components/Icons/Icon";
|
||||||
import useImgProxy from "@/Hooks/useImgProxy";
|
import useImgProxy from "@/Hooks/useImgProxy";
|
||||||
import { getUrlHostname } from "@/Utils";
|
import { getUrlHostname } from "@/Utils";
|
||||||
|
|
||||||
@ -12,7 +13,9 @@ type ProxyImgProps = HTMLProps<HTMLImageElement> & {
|
|||||||
missingImageElement?: ReactNode;
|
missingImageElement?: ReactNode;
|
||||||
};
|
};
|
||||||
|
|
||||||
export const ProxyImg = forwardRef<HTMLImageElement, ProxyImgProps>(function ProxyImg(
|
const defaultMissingImageElement = <Icon name="x" className="warning" />;
|
||||||
|
|
||||||
|
const ProxyImgComponent = forwardRef<HTMLImageElement, ProxyImgProps>(function ProxyImg(
|
||||||
{ src, size, className, promptToLoadDirectly, missingImageElement, sha256, ...props }: ProxyImgProps,
|
{ src, size, className, promptToLoadDirectly, missingImageElement, sha256, ...props }: ProxyImgProps,
|
||||||
ref,
|
ref,
|
||||||
) {
|
) {
|
||||||
@ -60,14 +63,9 @@ export const ProxyImg = forwardRef<HTMLImageElement, ProxyImgProps>(function Pro
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
if (!imgSrc || loadFailed)
|
if (!imgSrc || loadFailed) {
|
||||||
return (
|
return missingImageElement ?? defaultMissingImageElement;
|
||||||
missingImageElement ?? (
|
}
|
||||||
<div>
|
|
||||||
<FormattedMessage defaultMessage="Image not available" id="Y7FG5M" />
|
|
||||||
</div>
|
|
||||||
)
|
|
||||||
);
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<img
|
<img
|
||||||
@ -81,3 +79,8 @@ export const ProxyImg = forwardRef<HTMLImageElement, ProxyImgProps>(function Pro
|
|||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
});
|
});
|
||||||
|
|
||||||
|
const ProxyImg = memo(ProxyImgComponent);
|
||||||
|
ProxyImg.displayName = "ProxyImg";
|
||||||
|
|
||||||
|
export { ProxyImg };
|
||||||
|
@ -4,7 +4,6 @@ import type { UserMetadata } from "@snort/system";
|
|||||||
import classNames from "classnames";
|
import classNames from "classnames";
|
||||||
import { ReactNode, useMemo } from "react";
|
import { ReactNode, useMemo } from "react";
|
||||||
|
|
||||||
import Icon from "@/Components/Icons/Icon";
|
|
||||||
import { ProxyImg } from "@/Components/ProxyImg";
|
import { ProxyImg } from "@/Components/ProxyImg";
|
||||||
import { defaultAvatar, getDisplayName } from "@/Utils";
|
import { defaultAvatar, getDisplayName } from "@/Utils";
|
||||||
|
|
||||||
@ -60,7 +59,6 @@ const Avatar = ({
|
|||||||
size={s}
|
size={s}
|
||||||
alt={getDisplayName(user, "")}
|
alt={getDisplayName(user, "")}
|
||||||
promptToLoadDirectly={false}
|
promptToLoadDirectly={false}
|
||||||
missingImageElement={<Icon name="x" className="warning" />}
|
|
||||||
/>
|
/>
|
||||||
{icons && <div className="icons">{icons}</div>}
|
{icons && <div className="icons">{icons}</div>}
|
||||||
{imageOverlay && <div className="overlay">{imageOverlay}</div>}
|
{imageOverlay && <div className="overlay">{imageOverlay}</div>}
|
||||||
|
@ -1033,9 +1033,6 @@
|
|||||||
"defaultMessage": "Redeem",
|
"defaultMessage": "Redeem",
|
||||||
"description": "Button: Redeem Cashu token"
|
"description": "Button: Redeem Cashu token"
|
||||||
},
|
},
|
||||||
"Y7FG5M": {
|
|
||||||
"defaultMessage": "Image not available"
|
|
||||||
},
|
|
||||||
"YDURw6": {
|
"YDURw6": {
|
||||||
"defaultMessage": "Service URL"
|
"defaultMessage": "Service URL"
|
||||||
},
|
},
|
||||||
|
@ -340,7 +340,6 @@
|
|||||||
"Xnimz0": "Sending from <b>{wallet}</b>",
|
"Xnimz0": "Sending from <b>{wallet}</b>",
|
||||||
"Xopqkl": "Your default zap amount is {number} sats, example values are calculated from this.",
|
"Xopqkl": "Your default zap amount is {number} sats, example values are calculated from this.",
|
||||||
"XrSk2j": "Redeem",
|
"XrSk2j": "Redeem",
|
||||||
"Y7FG5M": "Image not available",
|
|
||||||
"YDURw6": "Service URL",
|
"YDURw6": "Service URL",
|
||||||
"YR2I9M": "No keys, no {app}, There is no way to reset it if you don't back up. It only takes a minute.",
|
"YR2I9M": "No keys, no {app}, There is no way to reset it if you don't back up. It only takes a minute.",
|
||||||
"YXA3AH": "Enable reactions",
|
"YXA3AH": "Enable reactions",
|
||||||
|
Loading…
Reference in New Issue
Block a user