From 9be1b60ef1703214d4df24a665b0c93b0681c427 Mon Sep 17 00:00:00 2001
From: vsecoder <vsecoder@git.vsecoder.vodka>
Date: Sat, 18 Apr 2026 21:28:34 +0300
Subject: [PATCH] fix(feed): move card layout off Pressable style-fn so
 paddings stick
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Same Pressable-dynamic-style-function bug that bit the FAB: on some
RN versions the style function is re-evaluated mid-render in a way
that drops properties — here we lost paddingLeft:16 and sometimes
flexDirection:'row' on the outer PostCard Pressable, which is why
the avatar ended up flush against the left edge and the header/body
sometimes stacked into a column instead of row.

Fix: move layout to a plain <View> wrapper (static styles, can never
be dropped). Tap handling stays on two Pressables:
  - the avatar wrapper (opens author profile),
  - the content column (opens post detail + long-press for menu).

The card area visually covered by these two Pressables is ~100% —
tap anywhere on a post still navigates to detail, tap on the avatar
still goes to the author. No interaction regression.

Also paired opacity press-state on the content-column Pressable so
the feedback visual matches what the old bg-colour press gave.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
---
 client-app/components/feed/PostCard.tsx | 38 ++++++++++++++++++-------
 1 file changed, 27 insertions(+), 11 deletions(-)

diff --git a/client-app/components/feed/PostCard.tsx b/client-app/components/feed/PostCard.tsx
index 786860e..1778c21 100644
--- a/client-app/components/feed/PostCard.tsx
+++ b/client-app/components/feed/PostCard.tsx
@@ -183,16 +183,20 @@ function PostCardInner({ post, likedByMe, onStatsChanged, onDeleted, compact }:
 
   return (
     <>
-    <Pressable
-      onPress={onOpenDetail}
-      onLongPress={onLongPress}
-      style={({ pressed }) => ({
+    {/* Outer container is a plain View so layout styles (padding, row
+        direction) are static and always applied. Pressable's dynamic
+        style-function has been observed to drop properties between
+        renders on some RN versions — we hit that with the FAB, so
+        we're not relying on it here either. Tap handling lives on the
+        content-column Pressable (covers ~90% of the card area) plus a
+        separate Pressable around the avatar. */}
+    <View
+      style={{
         flexDirection: 'row',
         paddingLeft: 16,
         paddingRight: 16,
         paddingVertical: compact ? 10 : 12,
-        backgroundColor: pressed ? '#080808' : 'transparent',
-      })}
+      }}
     >
       {/* Avatar — own tap target (opens author profile). Explicit width
           on the wrapper (width:44) so the flex-row sibling below computes
@@ -201,9 +205,21 @@ function PostCardInner({ post, likedByMe, onStatsChanged, onDeleted, compact }:
         <Avatar name={displayName} address={post.author} size={44} />
       </Pressable>
 
-      {/* Content column. overflow:'hidden' prevents unbreakable tokens
-          from drawing past the right edge of the card. */}
-      <View style={{ flex: 1, marginLeft: 10, minWidth: 0, overflow: 'hidden' }}>
+      {/* Content column. Pressable so the card body is tappable →
+          detail; onLongPress routes to the context menu. overflow:
+          'hidden' prevents unbreakable tokens from drawing past the
+          right edge. */}
+      <Pressable
+        onPress={onOpenDetail}
+        onLongPress={onLongPress}
+        style={({ pressed }) => ({
+          flex: 1,
+          marginLeft: 10,
+          minWidth: 0,
+          overflow: 'hidden',
+          opacity: pressed ? 0.85 : 1,
+        })}
+      >
         {/* Header row — name + time on ONE line.
             Two siblings: the author-link Pressable (flex:1, row, so it
             expands; name inside gets numberOfLines:1 + flexShrink:1 so
@@ -361,8 +377,8 @@ function PostCardInner({ post, likedByMe, onStatsChanged, onDeleted, compact }:
             />
           </View>
         </View>
-      </View>
-    </Pressable>
+      </Pressable>
+    </View>
     <ShareSheet
       visible={shareOpen}
       post={post}