parra/ntfy
parra/ntfy
1
0
Fork 0
mirror of https://github.com/binwiederhier/ntfy.git synced 2024-11-23 11:49:19 +01:00
Code Releases Activity

PoC: Load external images

Browse source
This commit is contained in:
binwiederhier 2023-06-01 22:13:31 -04:00
parent f58c1e4c84
commit f3c955b0f8
2 changed files with 11 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
web/public/config.js
View file

@ -7,7 +7,7 @@
var config = {
base_url: window.location.origin, // Change to test against a different server
app_root: "/app",
app_root: "/",
enable_login: true,
enable_signup: true,
enable_payments: false,

14
web/src/components/Notifications.jsx
View file

@ -287,14 +287,15 @@ const NotificationItem = (props) => {
const Attachment = (props) => {
const { t } = useTranslation();
const [ imageError, setImageError ] = useState(false);
const { attachment } = props;
const expired = attachment.expires && attachment.expires < Date.now() / 1000;
const expires = attachment.expires && attachment.expires > Date.now() / 1000;
const displayableImage = !expired && attachment.type && attachment.type.startsWith("image/");
// Unexpired image
if (displayableImage) {
return <Image attachment={attachment} />;
if (!imageError) {
return <Image attachment={attachment} onError={() => setImageError(true)} />;
}
// Anything else: Show box
@ -376,14 +377,19 @@ const Attachment = (props) => {
const Image = (props) => {
const { t } = useTranslation();
const [open, setOpen] = useState(false);
const [loaded, setLoaded] = useState(false);
return (
<>
<div style={{
display: loaded ? "block" : "none",
}}>
<Box
component="img"
src={props.attachment.url}
loading="lazy"
alt={t("notifications_attachment_image")}
onClick={() => setOpen(true)}
onLoad={() => setLoaded(true)}
onError={props.onError}
sx={{
marginTop: 2,
borderRadius: "4px",
@ -413,7 +419,7 @@ const Image = (props) => {
/>
</Fade>
</Modal>
</>
</div>
);
};