about summary refs log tree commit diff
path: root/src/lib/custom-animations
diff options
context:
space:
mode:
Diffstat (limited to 'src/lib/custom-animations')
-rw-r--r--src/lib/custom-animations/CountWheel.tsx4
-rw-r--r--src/lib/custom-animations/CountWheel.web.tsx4
-rw-r--r--src/lib/custom-animations/LikeIcon.tsx4
-rw-r--r--src/lib/custom-animations/LikeIcon.web.tsx4
4 files changed, 12 insertions, 4 deletions
diff --git a/src/lib/custom-animations/CountWheel.tsx b/src/lib/custom-animations/CountWheel.tsx
index 1a8676712..2e435f7d3 100644
--- a/src/lib/custom-animations/CountWheel.tsx
+++ b/src/lib/custom-animations/CountWheel.tsx
@@ -91,13 +91,15 @@ export function CountWheel({
   likeCount,
   big,
   isLiked,
+  isToggle,
 }: {
   likeCount: number
   big?: boolean
   isLiked: boolean
+  isToggle: boolean
 }) {
   const t = useTheme()
-  const shouldAnimate = !useReducedMotion()
+  const shouldAnimate = !useReducedMotion() && isToggle
   const shouldRoll = decideShouldRoll(isLiked, likeCount)
 
   // Incrementing the key will cause the `Animated.View` to re-render, with the newly selected entering/exiting
diff --git a/src/lib/custom-animations/CountWheel.web.tsx b/src/lib/custom-animations/CountWheel.web.tsx
index 594117bfe..78120b707 100644
--- a/src/lib/custom-animations/CountWheel.web.tsx
+++ b/src/lib/custom-animations/CountWheel.web.tsx
@@ -39,13 +39,15 @@ export function CountWheel({
   likeCount,
   big,
   isLiked,
+  isToggle,
 }: {
   likeCount: number
   big?: boolean
   isLiked: boolean
+  isToggle: boolean
 }) {
   const t = useTheme()
-  const shouldAnimate = !useReducedMotion()
+  const shouldAnimate = !useReducedMotion() && isToggle
   const shouldRoll = decideShouldRoll(isLiked, likeCount)
 
   const countView = React.useRef<HTMLDivElement>(null)
diff --git a/src/lib/custom-animations/LikeIcon.tsx b/src/lib/custom-animations/LikeIcon.tsx
index f5802eccb..ee3d413e5 100644
--- a/src/lib/custom-animations/LikeIcon.tsx
+++ b/src/lib/custom-animations/LikeIcon.tsx
@@ -71,13 +71,15 @@ const circle2Keyframe = new Keyframe({
 export function AnimatedLikeIcon({
   isLiked,
   big,
+  isToggle,
 }: {
   isLiked: boolean
   big?: boolean
+  isToggle: boolean
 }) {
   const t = useTheme()
   const size = big ? 22 : 18
-  const shouldAnimate = !useReducedMotion()
+  const shouldAnimate = !useReducedMotion() && isToggle
 
   return (
     <View>
diff --git a/src/lib/custom-animations/LikeIcon.web.tsx b/src/lib/custom-animations/LikeIcon.web.tsx
index 6dc94c291..ef330bc62 100644
--- a/src/lib/custom-animations/LikeIcon.web.tsx
+++ b/src/lib/custom-animations/LikeIcon.web.tsx
@@ -41,13 +41,15 @@ const circle2Keyframe = [
 export function AnimatedLikeIcon({
   isLiked,
   big,
+  isToggle,
 }: {
   isLiked: boolean
   big?: boolean
+  isToggle: boolean
 }) {
   const t = useTheme()
   const size = big ? 22 : 18
-  const shouldAnimate = !useReducedMotion()
+  const shouldAnimate = !useReducedMotion() && isToggle
   const prevIsLiked = React.useRef(isLiked)
 
   const likeIconRef = React.useRef<HTMLDivElement>(null)