From 1d74b38634a27bce65eb6ea11111dac6653bd905 Mon Sep 17 00:00:00 2001
From: Nishan <nishanbende@gmail.com>
Date: Thu, 5 Oct 2023 16:22:03 -0700
Subject: [PATCH] fix: view flips on RTL with new transform origin changes in
 Paper arch. (#39803)

Summary:
Fixes - https://github.com/facebook/react-native/pull/38626#issuecomment-1745528706. Explained the issue [here](https://github.com/facebook/react-native/pull/38626#issuecomment-1747212113).

## Changelog:

[IOS] [FIXED] - View flips horizontally in paper arch on RTL

Pull Request resolved: https://github.com/facebook/react-native/pull/39803

Test Plan: Run RNTester in Paper mode on iOS

Reviewed By: NickGerleman

Differential Revision: D49952227

Pulled By: lunaleaps

fbshipit-source-id: 7240552e499765859dceea0a0406561cc3a3148f
---
 .../react-native/React/Views/UIView+React.m   | 53 +++++++++++--------
 1 file changed, 30 insertions(+), 23 deletions(-)

diff --git a/packages/react-native/React/Views/UIView+React.m b/packages/react-native/React/Views/UIView+React.m
index 5268b638536b3b..2ee2c500ddb7bf 100644
--- a/packages/react-native/React/Views/UIView+React.m
+++ b/packages/react-native/React/Views/UIView+React.m
@@ -204,7 +204,10 @@ - (void)reactSetFrame:(CGRect)frame
   self.center = position;
   self.bounds = bounds;
 
-  updateTransform(self);
+  id transformOrigin = objc_getAssociatedObject(self, @selector(reactTransformOrigin));
+  if (transformOrigin) {
+    updateTransform(self);
+  }
 }
 
 #pragma mark - Transforms
@@ -242,31 +245,35 @@ - (void)setReactTransformOrigin:(RCTTransformOrigin)reactTransformOrigin
 
 static void updateTransform(UIView *view)
 {
-  CGSize size = view.bounds.size;
-  RCTTransformOrigin transformOrigin = view.reactTransformOrigin;
-
-  CGFloat anchorPointX = 0;
-  CGFloat anchorPointY = 0;
-  CGFloat anchorPointZ = 0;
-
-  if (transformOrigin.x.unit == YGUnitPoint) {
-    anchorPointX = transformOrigin.x.value - size.width * 0.5;
-  } else if (transformOrigin.x.unit == YGUnitPercent) {
-    anchorPointX = (transformOrigin.x.value * 0.01 - 0.5) * size.width;
-  }
+  CATransform3D transform;
+  id rawTansformOrigin = objc_getAssociatedObject(view, @selector(reactTransformOrigin));
+  if (rawTansformOrigin) {
+    CGSize size = view.bounds.size;
+    CGFloat anchorPointX = 0;
+    CGFloat anchorPointY = 0;
+    CGFloat anchorPointZ = 0;
+    RCTTransformOrigin transformOrigin;
+    [rawTansformOrigin getValue:&transformOrigin];
+    if (transformOrigin.x.unit == YGUnitPoint) {
+      anchorPointX = transformOrigin.x.value - size.width * 0.5;
+    } else if (transformOrigin.x.unit == YGUnitPercent) {
+      anchorPointX = (transformOrigin.x.value * 0.01 - 0.5) * size.width;
+    }
 
-  if (transformOrigin.y.unit == YGUnitPoint) {
-    anchorPointY = transformOrigin.y.value - size.height * 0.5;
-  } else if (transformOrigin.y.unit == YGUnitPercent) {
-    anchorPointY = (transformOrigin.y.value * 0.01 - 0.5) * size.height;
+    if (transformOrigin.y.unit == YGUnitPoint) {
+      anchorPointY = transformOrigin.y.value - size.height * 0.5;
+    } else if (transformOrigin.y.unit == YGUnitPercent) {
+      anchorPointY = (transformOrigin.y.value * 0.01 - 0.5) * size.height;
+    }
+    anchorPointZ = transformOrigin.z;
+    transform = CATransform3DConcat(
+        view.reactTransform, CATransform3DMakeTranslation(anchorPointX, anchorPointY, anchorPointZ));
+    transform =
+        CATransform3DConcat(CATransform3DMakeTranslation(-anchorPointX, -anchorPointY, -anchorPointZ), transform);
+  } else {
+    transform = view.reactTransform;
   }
 
-  anchorPointZ = transformOrigin.z;
-
-  CATransform3D transform = CATransform3DMakeTranslation(anchorPointX, anchorPointY, anchorPointZ);
-  transform = CATransform3DConcat(view.reactTransform, transform);
-  transform = CATransform3DTranslate(transform, -anchorPointX, -anchorPointY, -anchorPointZ);
-
   view.layer.transform = transform;
   // Enable edge antialiasing in rotation, skew, or perspective transforms
   view.layer.allowsEdgeAntialiasing = transform.m12 != 0.0f || transform.m21 != 0.0f || transform.m34 != 0.0f;