Update lightbox with images generated while it is open

This removes the need to close and re-open the lightbox to view images
that were completed while it was open.

web/js/common/lightbox.js

@@ -107,6 +107,16 @@ export class Lightbox {
 		this.img.src = img;
 		this.img.style.opacity = 1;
 	}
+
+	async updateWithNewImage(img, feedDirection) {
+		// No-op if lightbox is not open
+		if (this.el.style.display === "none" || this.el.style.opacity === "0") return;
+
+		// Ensure currently shown image does not change
+		const [method, shift] = feedDirection === "newest first" ? ["unshift", 1] : ["push", 0];
+		this.images[method](img);
+		await this.update(shift);
+	}
 }
 
 export const lightbox = new Lightbox();

web/js/imageFeed.js

@@ -438,6 +438,8 @@ app.registerExtension({
 							),
 						])
 					);
+					// If lightbox is open, update it with new image
+					lightbox.updateWithNewImage(href, feedDirection.value);
 				}
 			}
 		});