fix(native/community): sync realtime-patched likes_count back into PostCard

`useCommunityRealtime` was already patching the React-Query cache
on community_posts UPDATE events — likesCount, dislikesCount, userLike
all reached the component as props on re-render. But PostCard was
seeding `localLike` / `localCount` once via useState initial values
and never re-reading the props after mount, so a like from another
account showed up as a notification but the heart counter stayed
stale until pull-to-refresh.

Added a useEffect that mirrors `post.likesCount` / `post.userLike`
back into local state, guarded by `isLiking` so an in-flight
optimistic update isn't clobbered by a concurrent realtime patch
of the same row.

Handles unlike (decrement) on the same path, plus off-screen posts
which get the patched cache value on remount and feed-list cards
that refresh in place without scroll.
This commit is contained in:
chahinebrini 2026-05-16 00:25:38 +02:00
parent a57a873215
commit 4c4792c153

View File

@ -30,6 +30,14 @@ function PostCardImpl({ post, onCommentPress }: Props) {
const [localCount, setLocalCount] = useState(post.likesCount);
const [isLiking, setIsLiking] = useState(false);
// Sync realtime-patched prop values into local state. Guarded by isLiking so
// an in-flight optimistic update is never clobbered by a concurrent patch.
useEffect(() => {
if (isLiking) return;
setLocalCount(post.likesCount);
setLocalLike(post.userLike === 'like' ? 'like' : null);
}, [post.likesCount, post.userLike, isLiking]);
// Heart-Pop Animation — Insta-Style: quick scale-up + spring-bounce back
const heartScale = useRef(new Animated.Value(1)).current;
const triggerHeartPop = useCallback(() => {