TerribleDev/ente
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Let PhotoSwipe show the error

Browse Source
This commit is contained in:
Manav Rathi
2025-03-10 20:29:10 +05:30
parent ad0169b7e5
commit 76d8038899
1 changed files with 18 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
web/packages/gallery/components/viewer/data-source.ts
View File

@@ -359,7 +359,9 @@ const enqueueUpdates = async (file: EnteFile) => {
// While the types don't reflect it, it is safe to use the ! (null
// assertion) here since renderableThumbnailURL can throw but will not
// return undefined by default.
const thumbnailData = await withDimensions(ensureString(thumbnailURL));
const thumbnailData = await withDimensionsIfPossible(
ensureString(thumbnailURL),
);
update({
...thumbnailData,
isContentLoading: true,
@@ -386,7 +388,7 @@ const enqueueUpdates = async (file: EnteFile) => {
await downloadManager.renderableSourceURLs(file);
const imageURL = ensureString(sourceURLs.url);
const originalImageBlob = sourceURLs.originalImageBlob!;
const itemData = await withDimensions(imageURL);
const itemData = await withDimensionsIfPossible(imageURL);
update({ ...itemData, imageURL, originalImageBlob });
break;
}
@@ -424,7 +426,7 @@ const enqueueUpdates = async (file: EnteFile) => {
const originalImageBlob =
livePhotoSourceURLs.originalImageBlob()!;
update({
...(await withDimensions(imageURL)),
...(await withDimensionsIfPossible(imageURL)),
imageURL,
originalImageBlob,
videoURL,
@@ -457,12 +459,19 @@ const enqueueUpdates = async (file: EnteFile) => {
};
/**
* Take a image URL, determine its dimensions using browser APIs, and return the URL
* and its dimensions in a form that can directly be passed to PhotoSwipe as
* {@link ItemData}.
* Take a image URL, determine its dimensions using browser APIs if possible,
* and return the URL and its dimensions in a form that can directly be passed
* to PhotoSwipe as {@link ItemData}.
*
* If the dimensions cannot be extracted (i.e., the browser was not able to load
* the image), then PhotoSwipe itself will also not likely be able to render it,
* but we still return the {@link imageURL} back so that PhotoSwipe can show the
* appropriate error when trying to render it.
*/
const withDimensions = (imageURL: string): Promise<Partial<ItemData>> =>
new Promise((resolve, reject) => {
const withDimensionsIfPossible = (
imageURL: string,
): Promise<Partial<ItemData>> =>
new Promise((resolve) => {
const image = new Image();
image.onload = () =>
resolve({
@@ -470,7 +479,7 @@ const withDimensions = (imageURL: string): Promise<Partial<ItemData>> =>
width: image.naturalWidth,
height: image.naturalHeight,
});
image.onerror = reject;
image.onerror = () => resolve({ src: imageURL });
image.src = imageURL;
});