immich icon indicating copy to clipboard operation
immich copied to clipboard

fix(web): more refactoring and tweaking of the memory viewer.

Open dagstuan opened this issue 5 months ago • 1 comments

Description

Refactor asset viewing in memory page.

Split photo and video viewing into separate components to ensure they work similarly to the assets viewer. The previous implementation faded out the assets, while the assets-viewer only fades assets in. For images, add a spinner while waiting for the image to load, before adding the image to the DOM. For videos, add the video to the DOM after mounting the component. In both cases, the assets fade in smoothly, like the regular assets viewer.

Fix video fade-in for video-native-viewer

The previous implementation never actually faded in the video element. Fix this by ensuring the video element is only added to the DOM after mounting, so Svelte can handle the fade-in transition correctly.

These changes should hopefully fix the comment by @alextran1502 in #19184

How Has This Been Tested?

Tested locally in chrome with and without cache enabled. Also tested by throttling my network to see how it behaves for slow clients.

Checklist:

  • [X] I have performed a self-review of my own code
  • [X] I have made corresponding changes to the documentation if applicable
  • [X] I have no unrelated changes in the PR.
  • [X] I have confirmed that any new dependencies are strictly necessary.
  • [X] I have written tests for new code (if applicable)
  • [X] I have followed naming conventions/patterns in the surrounding code
  • [X] All code in src/services/ uses repositories implementations for database calls, filesystem operations, etc.
  • [X] All code in src/repositories/ is pretty basic/simple and does not have any immich specific logic (that belongs in src/services/)

dagstuan avatar Jun 16 '25 18:06 dagstuan