From 9af3776ef24dc6d6f0f3610f50d01124df23e8ed Mon Sep 17 00:00:00 2001
From: Gabriel Donadel <donadeldev@gmail.com>
Date: Tue, 24 Oct 2023 14:12:34 -0300
Subject: [PATCH 1/3] fix createAnimatedStyle when providing undefined
 transform style

---
 .../react-native/Libraries/Animated/nodes/AnimatedStyle.js    | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/packages/react-native/Libraries/Animated/nodes/AnimatedStyle.js b/packages/react-native/Libraries/Animated/nodes/AnimatedStyle.js
index 8fdc6532aeb2e3..60527663e24cb3 100644
--- a/packages/react-native/Libraries/Animated/nodes/AnimatedStyle.js
+++ b/packages/react-native/Libraries/Animated/nodes/AnimatedStyle.js
@@ -30,6 +30,10 @@ function createAnimatedStyle(
   const animatedStyles: any = {};
   for (const key in style) {
     const value = style[key];
+    if (!value) {
+      continue;
+    }
+
     if (key === 'transform') {
       animatedStyles[key] =
         ReactNativeFeatureFlags.shouldUseAnimatedObjectForTransform()

From 580ff386ab41fd09bef389b6adfdb9ca77bc8318 Mon Sep 17 00:00:00 2001
From: Gabriel Donadel <donadeldev@gmail.com>
Date: Tue, 24 Oct 2023 14:25:58 -0300
Subject: [PATCH 2/3] Add transform undefined example to RNTester

---
 .../js/examples/Animated/TransformStylesExample.js         | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/packages/rn-tester/js/examples/Animated/TransformStylesExample.js b/packages/rn-tester/js/examples/Animated/TransformStylesExample.js
index 60a90bc107a55a..d9467354097d0e 100644
--- a/packages/rn-tester/js/examples/Animated/TransformStylesExample.js
+++ b/packages/rn-tester/js/examples/Animated/TransformStylesExample.js
@@ -123,6 +123,10 @@ function AnimatedTransformStyleExample(): React.Node {
           property => properties[property].selected,
         )}
       />
+      <View style={styles.section}>
+        <Text>{'Should not crash when transform style key is undefined'}</Text>
+        <Animated.View style={[styles.animatedView, {transform: undefined}]} />
+      </View>
     </View>
   );
 }
@@ -149,6 +153,9 @@ const styles = StyleSheet.create({
     marginBottom: 6,
     borderBottomWidth: 1,
   },
+  section: {
+    marginTop: 20,
+  },
 });
 
 export default ({

From 80b4ebf7aa292a1caf2025b006b56e006793614b Mon Sep 17 00:00:00 2001
From: Gabriel Donadel Dall'Agnol <donadeldev@gmail.com>
Date: Tue, 24 Oct 2023 22:23:10 +0200
Subject: [PATCH 3/3] Update
 packages/react-native/Libraries/Animated/nodes/AnimatedStyle.js

Co-authored-by: Pieter De Baets <pieter.debaets@gmail.com>
---
 .../react-native/Libraries/Animated/nodes/AnimatedStyle.js  | 6 +-----
 1 file changed, 1 insertion(+), 5 deletions(-)

diff --git a/packages/react-native/Libraries/Animated/nodes/AnimatedStyle.js b/packages/react-native/Libraries/Animated/nodes/AnimatedStyle.js
index 60527663e24cb3..8766d5e913b796 100644
--- a/packages/react-native/Libraries/Animated/nodes/AnimatedStyle.js
+++ b/packages/react-native/Libraries/Animated/nodes/AnimatedStyle.js
@@ -30,11 +30,7 @@ function createAnimatedStyle(
   const animatedStyles: any = {};
   for (const key in style) {
     const value = style[key];
-    if (!value) {
-      continue;
-    }
-
-    if (key === 'transform') {
+    if (value != null && key === 'transform') {
       animatedStyles[key] =
         ReactNativeFeatureFlags.shouldUseAnimatedObjectForTransform()
           ? new AnimatedObject(value)