From 817f6decd6ef54c2563ac876c6e837eb66eb937c Mon Sep 17 00:00:00 2001
From: ryanh2o3 <105818979+ryanh2o3@users.noreply.github.com>
Date: Tue, 23 Apr 2024 15:09:30 -0400
Subject: [PATCH] remove transition from image view (#1044)

---
 Shared/Components/ImageView.swift                           | 6 ++++++
 .../ItemView/iOS/ScrollViews/CinematicScrollView.swift      | 2 +-
 .../ItemView/iOS/ScrollViews/CompactLogoScrollView.swift    | 2 +-
 .../iOS/ScrollViews/CompactPortraitScrollView.swift         | 2 +-
 4 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/Shared/Components/ImageView.swift b/Shared/Components/ImageView.swift
index 062a7d56..67d9c600 100644
--- a/Shared/Components/ImageView.swift
+++ b/Shared/Components/ImageView.swift
@@ -25,6 +25,12 @@ private let imagePipeline = {
 //       - instead of removing first source on failure, just safe index into sources
 // TODO: currently SVGs are only supported for logos, which are only used in a few places.
 //       make it so when displaying an SVG there is a unified `image` caller modifier
+// TODO: `LazyImage` uses a transaction for view swapping, which will fade out old views
+//       and fade in new views, causing a black "flash" between the placeholder and final image.
+//       Since we use blur hashes, we actually just want the final image to fade in on top while
+//       the blur hash view is at full opacity.
+//       - refactor for option
+//       - take a look at `RotateContentView`
 struct ImageView: View {
 
     @State
diff --git a/Swiftfin/Views/ItemView/iOS/ScrollViews/CinematicScrollView.swift b/Swiftfin/Views/ItemView/iOS/ScrollViews/CinematicScrollView.swift
index c2958ef7..95306aea 100644
--- a/Swiftfin/Views/ItemView/iOS/ScrollViews/CinematicScrollView.swift
+++ b/Swiftfin/Views/ItemView/iOS/ScrollViews/CinematicScrollView.swift
@@ -44,7 +44,7 @@ extension ItemView {
                 usePrimaryImage ? .primary : .backdrop,
                 maxWidth: UIScreen.main.bounds.width
             ))
-            .aspectRatio(contentMode: .fill)
+            .aspectRatio(usePrimaryImage ? (2 / 3) : 1.77, contentMode: .fill)
             .frame(height: UIScreen.main.bounds.height * 0.6)
             .bottomEdgeGradient(bottomColor: blurHashBottomEdgeColor)
             .onAppear {
diff --git a/Swiftfin/Views/ItemView/iOS/ScrollViews/CompactLogoScrollView.swift b/Swiftfin/Views/ItemView/iOS/ScrollViews/CompactLogoScrollView.swift
index b7c03afa..a7da5a00 100644
--- a/Swiftfin/Views/ItemView/iOS/ScrollViews/CompactLogoScrollView.swift
+++ b/Swiftfin/Views/ItemView/iOS/ScrollViews/CompactLogoScrollView.swift
@@ -29,7 +29,7 @@ extension ItemView {
         @ViewBuilder
         private var headerView: some View {
             ImageView(viewModel.item.imageSource(.backdrop, maxHeight: UIScreen.main.bounds.height * 0.35))
-                .aspectRatio(contentMode: .fill)
+                .aspectRatio(1.77, contentMode: .fill)
                 .frame(height: UIScreen.main.bounds.height * 0.35)
                 .bottomEdgeGradient(bottomColor: blurHashBottomEdgeColor)
                 .onAppear {
diff --git a/Swiftfin/Views/ItemView/iOS/ScrollViews/CompactPortraitScrollView.swift b/Swiftfin/Views/ItemView/iOS/ScrollViews/CompactPortraitScrollView.swift
index aa64c8a8..436d2c11 100644
--- a/Swiftfin/Views/ItemView/iOS/ScrollViews/CompactPortraitScrollView.swift
+++ b/Swiftfin/Views/ItemView/iOS/ScrollViews/CompactPortraitScrollView.swift
@@ -37,7 +37,7 @@ extension ItemView {
         @ViewBuilder
         private var headerView: some View {
             ImageView(viewModel.item.imageSource(.backdrop, maxWidth: UIScreen.main.bounds.width))
-                .aspectRatio(contentMode: .fill)
+                .aspectRatio(1.77, contentMode: .fill)
                 .frame(height: UIScreen.main.bounds.height * 0.35)
                 .bottomEdgeGradient(bottomColor: blurHashBottomEdgeColor)
                 .onAppear {