From 83697ce3fe561e73a2e6e46a9b1caf9199d7a9bb Mon Sep 17 00:00:00 2001
From: Innei <tukon479@gmail.com>
Date: Sat, 7 Jun 2025 00:36:14 +0800
Subject: [PATCH] fix(entry-list): ThumbnailImage border radius

- Added conditional class handling for ThumbnailImage to manage height based on thumbnail ratio.
- Simplified AspectRatioImage structure by removing unnecessary nested View and consolidating Image properties.
- Enhanced readability and maintainability of the code.

Signed-off-by: Innei <tukon479@gmail.com>
---
 .../entry-list/templates/EntryNormalItem.tsx  | 44 +++++++++----------
 1 file changed, 21 insertions(+), 23 deletions(-)

diff --git a/apps/mobile/src/modules/entry-list/templates/EntryNormalItem.tsx b/apps/mobile/src/modules/entry-list/templates/EntryNormalItem.tsx
index 19fc191dc..eef2efe2c 100644
--- a/apps/mobile/src/modules/entry-list/templates/EntryNormalItem.tsx
+++ b/apps/mobile/src/modules/entry-list/templates/EntryNormalItem.tsx
@@ -224,8 +224,9 @@ const ThumbnailImage = ({
   }, [audio, entry?.title, feed?.title, image, isLoading, isPlaying, video, videoPlayer])
 
   if (!image && !audio && !video) return null
+  const isSquare = thumbnailRatio === "square"
   return (
-    <View className="relative ml-4 min-h-24 min-w-24 overflow-hidden rounded-lg">
+    <View className={cn("relative ml-4 h-24 overflow-hidden rounded-lg", isSquare ? "h-24" : "")}>
       {image &&
         (thumbnailRatio === "square" ? (
           <SquareImage image={image} blurhash={blurhash} />
@@ -317,32 +318,29 @@ const AspectRatioImage = ({
   }
 
   return (
-    <View className="size-24 items-center justify-center">
-      <View
+    <View
+      style={{
+        width: scaledWidth,
+        height: scaledHeight,
+      }}
+      className="ml-auto overflow-hidden rounded-lg"
+    >
+      <Image
+        proxy={{
+          width: 96,
+        }}
+        source={{
+          uri: image,
+        }}
         style={{
           width: scaledWidth,
           height: scaledHeight,
         }}
-        className="overflow-hidden rounded-md"
-      >
-        <Image
-          proxy={{
-            width: 96,
-          }}
-          source={{
-            uri: image,
-          }}
-          style={{
-            width: scaledWidth,
-            height: scaledHeight,
-          }}
-          transition={100}
-          blurhash={blurhash}
-          className="rounded-md"
-          contentFit="cover"
-          hideOnError
-        />
-      </View>
+        transition={100}
+        blurhash={blurhash}
+        contentFit="cover"
+        hideOnError
+      />
     </View>
   )
 }