diff --git a/src/components/PhotoFrame.tsx b/src/components/PhotoFrame.tsx
index 1daae5b1a..3639adc4b 100644
--- a/src/components/PhotoFrame.tsx
+++ b/src/components/PhotoFrame.tsx
@@ -244,18 +244,15 @@ const PhotoFrame = ({
}, [open]);
const updateURL = (index: number) => (url: string) => {
- setFiles((files) => {
- files[index] = {
- ...files[index],
+ const updateFile = (file: EnteFile) => {
+ file = {
+ ...file,
msrc: url,
w: window.innerWidth,
h: window.innerHeight,
};
- if (
- files[index].metadata.fileType === FILE_TYPE.VIDEO &&
- !files[index].html
- ) {
- files[index].html = `
+ if (file.metadata.fileType === FILE_TYPE.VIDEO && !file.html) {
+ file.html = `
@@ -264,48 +261,55 @@ const PhotoFrame = ({
`;
}
- if (
- files[index].metadata.fileType === FILE_TYPE.IMAGE &&
- !files[index].src
- ) {
- files[index].src = url;
+ if (file.metadata.fileType === FILE_TYPE.IMAGE && !file.src) {
+ file.src = url;
}
+ return file;
+ };
+ setFiles((files) => {
+ files[index] = updateFile(files[index]);
return [...files];
});
+ return updateFile(files[index]);
};
const updateSrcURL = async (index: number, url: string) => {
const isPlayable = await isPlaybackPossible(url);
- setFiles((files) => {
- files[index] = {
- ...files[index],
+ const updateFile = (file: EnteFile) => {
+ file = {
+ ...file,
w: window.innerWidth,
h: window.innerHeight,
};
- if (files[index].metadata.fileType === FILE_TYPE.VIDEO) {
+ if (file.metadata.fileType === FILE_TYPE.VIDEO) {
if (isPlayable) {
- files[index].html = `
-
- `;
+ file.html = `
+
+ `;
} else {
- files[index].html = `
-
-
-
- ${constants.VIDEO_PLAYBACK_FAILED_DOWNLOAD_INSTEAD}
-
Download
-
+ file.html = `
+
+
+
+ ${constants.VIDEO_PLAYBACK_FAILED_DOWNLOAD_INSTEAD}
+
Download
- `;
+
+ `;
}
} else {
- files[index].src = url;
+ file.src = url;
}
+ return file;
+ };
+ setFiles((files) => {
+ files[index] = updateFile(files[index]);
return [...files];
});
+ return updateFile(files[index]);
};
const handleClose = (needUpdate) => {
@@ -421,9 +425,13 @@ const PhotoFrame = ({
}
galleryContext.thumbs.set(item.id, url);
}
- updateURL(item.dataIndex)(url);
- item.msrc = url;
- item.html;
+ const newFile = updateURL(item.dataIndex)(url);
+ item.msrc = newFile.msrc;
+ item.html = newFile.html;
+ item.src = newFile.src;
+ item.w = newFile.w;
+ item.h = newFile.h;
+
try {
instance.invalidateCurrItems();
instance.updateSize(true);
@@ -455,7 +463,12 @@ const PhotoFrame = ({
}
galleryContext.files.set(item.id, url);
}
- await updateSrcURL(item.dataIndex, url);
+ const newFile = await updateSrcURL(item.dataIndex, url);
+ item.msrc = newFile.msrc;
+ item.html = newFile.html;
+ item.src = newFile.src;
+ item.w = newFile.w;
+ item.h = newFile.h;
try {
instance.invalidateCurrItems();
instance.updateSize(true);