From 1c168bd982190f9a8c460ac63f4547236bf424bc Mon Sep 17 00:00:00 2001
From: Arkadiusz Fal <arek@arekf.net>
Date: Wed, 19 Nov 2025 23:01:52 +0100
Subject: [PATCH] Fix thumbnail aspect ratio to prevent stretching and layout
 jumps

Fixed issues with thumbnails being stretched vertically and layout jumping during image loading:
- Simplified VideoCellThumbnail to always use 16:9 aspect ratio with .fill mode
- Added matching 16:9 aspect ratio to placeholder with .fill mode to prevent layout shifts
- Removed quality-based aspect ratio selection (4:3 vs 16:9) in favor of consistent 16:9
- Ensures thumbnails maintain proper proportions on both iOS and macOS

This provides consistent sizing across platforms and eliminates the jump when images finish loading.
---
 Shared/Videos/ThumbnailView.swift | 4 ++--
 Shared/Videos/VideoCell.swift     | 6 +-----
 2 files changed, 3 insertions(+), 7 deletions(-)

diff --git a/Shared/Videos/ThumbnailView.swift b/Shared/Videos/ThumbnailView.swift
index 540e0ae8..3432e068 100644
--- a/Shared/Videos/ThumbnailView.swift
+++ b/Shared/Videos/ThumbnailView.swift
@@ -44,13 +44,13 @@ struct ThumbnailView: View {
 
     var webImage: some View {
         WebImage(url: url)
+            .resizable()
             .onFailure { _ in
                 if let url {
                     thumbnails.insertUnloadable(url)
                 }
             }
             .placeholder { placeholder }
-            .resizable()
     }
 
     @ViewBuilder var asyncImageIfAvailable: some View {
@@ -78,6 +78,6 @@ struct ThumbnailView: View {
     var placeholder: some View {
         Rectangle()
             .fill(Color("PlaceholderColor"))
-            .aspectRatio(Constants.aspectRatio16x9, contentMode: .fit)
+            .aspectRatio(Constants.aspectRatio16x9, contentMode: .fill)
     }
 }
diff --git a/Shared/Videos/VideoCell.swift b/Shared/Videos/VideoCell.swift
index 016fcd7d..b0fdf0eb 100644
--- a/Shared/Videos/VideoCell.swift
+++ b/Shared/Videos/VideoCell.swift
@@ -429,7 +429,6 @@ struct VideoCell: View {
             }
             .lineLimit(1)
         }
-        .aspectRatio(Constants.aspectRatio16x9, contentMode: .fit)
     }
 
     private var thumbnailImage: some View {
@@ -478,10 +477,7 @@ struct VideoCellThumbnail: View {
         let (url, _) = thumbnails.best(video)
 
         ThumbnailView(url: url)
-            .scaledToFill()
-            .frame(maxWidth: .infinity)
-            .aspectRatio(Constants.aspectRatio16x9, contentMode: .fit)
-            .clipped()
+            .aspectRatio(Constants.aspectRatio16x9, contentMode: .fill)
     }
 }