Only animate the like icon when from an actual toggle (#5096)

This commit is contained in:
Hailey 2024-09-03 10:55:53 -07:00 committed by GitHub
parent bd42f770b8
commit 0014d4363f
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
5 changed files with 20 additions and 9 deletions

View file

@ -106,8 +106,7 @@ let PostCtrls = ({
[t],
) as StyleProp<ViewStyle>
const likeValue = post.viewer?.like ? 1 : 0
const nextExpectedLikeValue = React.useRef(likeValue)
const [isToggleLikeIcon, setIsToggleLikeIcon] = React.useState(false)
const onPressToggleLike = React.useCallback(async () => {
if (isBlocked) {
@ -119,8 +118,8 @@ let PostCtrls = ({
}
try {
setIsToggleLikeIcon(true)
if (!post.viewer?.like) {
nextExpectedLikeValue.current = 1
playHaptic()
sendInteraction({
item: post.uri,
@ -130,7 +129,6 @@ let PostCtrls = ({
captureAction(ProgressGuideAction.Like)
await queueLike()
} else {
nextExpectedLikeValue.current = 0
await queueUnlike()
}
} catch (e: any) {
@ -317,11 +315,16 @@ let PostCtrls = ({
}
accessibilityHint=""
hitSlop={POST_CTRL_HITSLOP}>
<AnimatedLikeIcon isLiked={Boolean(post.viewer?.like)} big={big} />
<AnimatedLikeIcon
isLiked={Boolean(post.viewer?.like)}
big={big}
isToggle={isToggleLikeIcon}
/>
<CountWheel
likeCount={post.likeCount ?? 0}
big={big}
isLiked={Boolean(post.viewer?.like)}
isToggle={isToggleLikeIcon}
/>
</Pressable>
</View>