From 92540a618d336c747c0ebdfffdd1a2a0a82e636d Mon Sep 17 00:00:00 2001
From: Samuel Susla <samuelsusla@meta.com>
Date: Tue, 12 Mar 2024 10:19:56 -0700
Subject: [PATCH] do not synchronise native animated in paper

Summary:
## Changelog:
[General][Fixed] - Fix broken native animation in Paper

In Native Animated Paper, `scheduleUpdate` must not be called. In Fabric, the synchronisation between Fiber and Shadow trees is a must but in Paper it sets undesired state.

Reviewed By: javache

Differential Revision: D54799237

fbshipit-source-id: f6b07dc377111ed2f8253ea0c7c7e312168166e8
---
 .../Libraries/Animated/useAnimatedProps.js    | 29 +++++++++++++------
 1 file changed, 20 insertions(+), 9 deletions(-)

diff --git a/packages/react-native/Libraries/Animated/useAnimatedProps.js b/packages/react-native/Libraries/Animated/useAnimatedProps.js
index 51196426ec2..7350b0951e7 100644
--- a/packages/react-native/Libraries/Animated/useAnimatedProps.js
+++ b/packages/react-native/Libraries/Animated/useAnimatedProps.js
@@ -74,34 +74,45 @@ export default function useAnimatedProps<TProps: {...}, TInstance>(
       // every animation frame. When using the native driver, this callback is
       // called when the animation completes.
       onUpdateRef.current = () => {
-        if (node.__isNative || process.env.NODE_ENV === 'test') {
-          // Check 1: either tests are running or this is a native driven animation.
-          // In native driven animations, this callback is only called once the animation completes.
-          // Call `scheduleUpdate` to synchronise Fiber and Shadow tree.
+        if (process.env.NODE_ENV === 'test') {
+          // Check 1: this is a test.
+          // call `scheduleUpdate` to bypass use of setNativeProps.
           return scheduleUpdate();
         }
 
+        const isFabricNode = isFabricInstance(instance);
+        if (node.__isNative) {
+          // Check 2: this is an animation driven by native.
+          // In native driven animations, this callback is only called once the animation completes.
+          if (isFabricNode) {
+            // Call `scheduleUpdate` to synchronise Fiber and Shadow tree.
+            // Must not be called in Paper.
+            scheduleUpdate();
+          }
+          return;
+        }
+
         if (
           typeof instance !== 'object' ||
           typeof instance?.setNativeProps !== 'function'
         ) {
-          // Check 2: the instance does not support setNativeProps. Call `scheduleUpdate`.
+          // Check 3: the instance does not support setNativeProps. Call `scheduleUpdate`.
           return scheduleUpdate();
         }
 
-        if (!isFabricInstance(instance)) {
-          // Check 3: this is a paper instance, call setNativeProps.
+        if (!isFabricNode) {
+          // Check 4: this is a paper instance, call setNativeProps.
           // $FlowIgnore[not-a-function] - Assume it's still a function.
           // $FlowFixMe[incompatible-use]
           return instance.setNativeProps(node.__getAnimatedValue());
         }
 
         if (!useNativePropsInFabric) {
-          // Check 4: setNativeProps are disabled.
+          // Check 5: setNativeProps are disabled.
           return scheduleUpdate();
         }
 
-        // This is a Fabric instance and setNativeProps are supported.
+        // This is a Fabric instance and setNativeProps is supported.
 
         // $FlowIgnore[not-a-function] - Assume it's still a function.
         // $FlowFixMe[incompatible-use]