Add setNativeProps to Fabric

Summary:
changelog: Introduce setNativeProps to Fabric

Add support for `setNativeProps` in Fabric for backwards compatibility. It is still recommended to move away from `setNativeProps` because the API will not work with future features.

We can make step [Migrating off setNativeProps](https://reactnative.dev/docs/new-architecture-library-intro#migrating-off-setnativeprops) in migration guide optional.

Reviewed By: yungsters, mdvacca

Differential Revision: D41521523

fbshipit-source-id: 4d9bbd6304b8c5ee24a36b33039ed33ae1fc21f8

React/Fabric/Mounting/RCTMountingManager.h

@@ -10,6 +10,7 @@
 #import <React/RCTMountingManagerDelegate.h>
 #import <React/RCTPrimitives.h>
 #import <react/renderer/core/ComponentDescriptor.h>
+#import <react/renderer/core/RawProps.h>
 #import <react/renderer/core/ReactPrimitives.h>
 #import <react/renderer/mounting/MountingCoordinator.h>
 #import <react/renderer/mounting/ShadowView.h>
@@ -55,6 +56,13 @@ NS_ASSUME_NONNULL_BEGIN
  */
 - (void)dispatchCommand:(ReactTag)reactTag commandName:(NSString *)commandName args:(NSArray *)args;
 
+/**
+ * Set props on native view directly. It is a performance shortcut that skips render pipeline.
+ * This is a backport of setNativeProps from the old architecture and will be removed in the future.
+ * Can be called from any thread.
+ */
+- (void)setNativeProps_DEPRECATED:(ReactTag)reactTag withProps:(facebook::react::Props::Shared)props;
+
 /**
  * Dispatch an accessibility event to be performed on the main thread.
  * Can be called from any thread.

React/Fabric/Mounting/RCTMountingManager.mm

@@ -225,11 +225,24 @@ - (void)dispatchCommand:(ReactTag)reactTag commandName:(NSString *)commandName a
   }
 
   RCTExecuteOnMainQueue(^{
-    RCTAssertMainQueue();
     [self synchronouslyDispatchCommandOnUIThread:reactTag commandName:commandName args:args];
   });
 }
 
+- (void)setNativeProps_DEPRECATED:(ReactTag)reactTag withProps:(Props::Shared)props
+{
+  if (RCTIsMainQueue()) {
+    UIView<RCTComponentViewProtocol> *componentView = [_componentViewRegistry findComponentViewWithTag:reactTag];
+    Props::Shared oldProps = [componentView props];
+    [componentView updateProps:props oldProps:oldProps];
+    [componentView finalizeUpdates:RNComponentViewUpdateMaskProps];
+    return;
+  }
+  RCTExecuteOnMainQueue(^{
+    [self setNativeProps_DEPRECATED:reactTag withProps:std::move(props)];
+  });
+}
+
 - (void)sendAccessibilityEvent:(ReactTag)reactTag eventType:(NSString *)eventType
 {
   if (RCTIsMainQueue()) {
@@ -241,7 +254,6 @@ - (void)sendAccessibilityEvent:(ReactTag)reactTag eventType:(NSString *)eventTyp
   }
 
   RCTExecuteOnMainQueue(^{
-    RCTAssertMainQueue();
     [self synchronouslyDispatchAccessbilityEventOnUIThread:reactTag eventType:eventType];
   });
 }

React/Fabric/RCTScheduler.h

@@ -34,6 +34,9 @@ NS_ASSUME_NONNULL_BEGIN
                         commandName:(std::string const &)commandName
                                args:(folly::dynamic const &)args;
 
+- (void)setNativeProps_DEPRECATED:(facebook::react::ShadowView const &)shadowView
+                        withProps:(facebook::react::Props::Shared)props;
+
 - (void)schedulerDidSendAccessibilityEvent:(facebook::react::ShadowView const &)shadowView
                                  eventType:(std::string const &)eventType;
 

React/Fabric/RCTScheduler.mm

@@ -45,6 +45,12 @@ void schedulerDidDispatchCommand(
     [scheduler.delegate schedulerDidDispatchCommand:shadowView commandName:commandName args:args];
   }
 
+  void setNativeProps_DEPRECATED(const ShadowView &shadowView, Props::Shared props) override
+  {
+    RCTScheduler *scheduler = (__bridge RCTScheduler *)scheduler_;
+    [scheduler.delegate setNativeProps_DEPRECATED:shadowView withProps:std::move(props)];
+  }
+
   void schedulerDidSetIsJSResponder(ShadowView const &shadowView, bool isJSResponder, bool blockNativeResponder)
       override
   {

React/Fabric/RCTSurfacePresenter.mm

@@ -372,6 +372,12 @@ - (void)schedulerDidDispatchCommand:(ShadowView const &)shadowView
   [_mountingManager dispatchCommand:tag commandName:commandStr args:argsArray];
 }
 
+- (void)setNativeProps_DEPRECATED:(ShadowView const &)shadowView withProps:(Props::Shared)props
+{
+  ReactTag tag = shadowView.tag;
+  [self->_mountingManager setNativeProps_DEPRECATED:tag withProps:props];
+}
+
 - (void)schedulerDidSendAccessibilityEvent:(const facebook::react::ShadowView &)shadowView
                                  eventType:(const std::string &)eventType
 {

ReactAndroid/src/main/jni/react/fabric/Binding.cpp

@@ -549,6 +549,12 @@ void Binding::schedulerDidDispatchCommand(
   mountingManager->dispatchCommand(shadowView, commandName, args);
 }
 
+void Binding::setNativeProps_DEPRECATED(
+    const ShadowView &shadowView,
+    Props::Shared props) {
+  // TODO(T130729920): Add Android implementation for setNativeProps.
+}
+
 void Binding::schedulerDidSendAccessibilityEvent(
     const ShadowView &shadowView,
     std::string const &eventType) {

ReactAndroid/src/main/jni/react/fabric/Binding.h

@@ -107,6 +107,10 @@ class Binding : public jni::HybridClass<Binding>,
       std::string const &commandName,
       folly::dynamic const &args) override;
 
+  void setNativeProps_DEPRECATED(
+      const ShadowView &shadowView,
+      Props::Shared props) override;
+
   void schedulerDidSendAccessibilityEvent(
       const ShadowView &shadowView,
       std::string const &eventType) override;

ReactCommon/react/renderer/components/view/YogaLayoutableShadowNode.cpp

@@ -202,6 +202,7 @@ void YogaLayoutableShadowNode::adoptYogaChild(size_t index) {
     // react_native_assert(layoutableChildNode.yogaNode_.isDirty());
   } else {
     // The child is owned by some other node, we need to clone that.
+    // TODO: At this point, React has wrong reference to the node. (T138668036)
     auto clonedChildNode = childNode.clone({});
     auto &layoutableClonedChildNode =
         traitCast<YogaLayoutableShadowNode const &>(*clonedChildNode);

ReactCommon/react/renderer/core/DynamicPropsUtilities.cpp

@@ -8,6 +8,7 @@
 #include "DynamicPropsUtilities.h"
 
 namespace facebook::react {
+
 folly::dynamic mergeDynamicProps(
     folly::dynamic const &source,
     folly::dynamic const &patch) {
@@ -30,4 +31,8 @@ folly::dynamic mergeDynamicProps(
   return result;
 }
 
+RawProps mergeRawProps(folly::dynamic const &source, RawProps const &patch) {
+  return {mergeDynamicProps((folly::dynamic)source, (folly::dynamic)patch)};
+}
+
 } // namespace facebook::react

ReactCommon/react/renderer/core/DynamicPropsUtilities.h

@@ -8,13 +8,14 @@
 #pragma once
 
 #include <folly/dynamic.h>
+#include <react/renderer/core/RawProps.h>
 
-namespace facebook {
-namespace react {
+namespace facebook::react {
 
 folly::dynamic mergeDynamicProps(
     folly::dynamic const &source,
     folly::dynamic const &patch);
 
-} // namespace react
-} // namespace facebook
+RawProps mergeRawProps(folly::dynamic const &source, RawProps const &patch);
+
+} // namespace facebook::react

ReactCommon/react/renderer/core/ShadowNodeFamily.h

@@ -86,6 +86,13 @@ class ShadowNodeFamily final {
   void dispatchRawState(StateUpdate &&stateUpdate, EventPriority priority)
       const;
 
+  /*
+   * Holds currently applied native props. `nullptr` if setNativeProps API is
+   * not used. It is used to backport setNativeProps API from the old
+   * architecture and will be removed in the future.
+   */
+  mutable std::unique_ptr<folly::dynamic> nativeProps_DEPRECATED;
+
  private:
   friend ShadowNode;
   friend ShadowNodeFamilyFragment;

ReactCommon/react/renderer/scheduler/Scheduler.cpp

@@ -321,6 +321,17 @@ void Scheduler::uiManagerDidDispatchCommand(
   }
 }
 
+void Scheduler::setNativeProps_DEPRECATED(
+    const ShadowNode::Shared &shadowNode,
+    Props::Shared props) {
+  SystraceSection s("Scheduler::setNativeProps_DEPRECATED");
+
+  if (delegate_ != nullptr) {
+    auto shadowView = ShadowView(*shadowNode);
+    delegate_->setNativeProps_DEPRECATED(shadowView, std::move(props));
+  }
+}
+
 void Scheduler::uiManagerDidSendAccessibilityEvent(
     const ShadowNode::Shared &shadowNode,
     std::string const &eventType) {

ReactCommon/react/renderer/scheduler/Scheduler.h

@@ -94,6 +94,9 @@ class Scheduler final : public UIManagerDelegate {
       const ShadowNode::Shared &shadowNode,
       std::string const &commandName,
       folly::dynamic const &args) override;
+  void setNativeProps_DEPRECATED(
+      const ShadowNode::Shared &shadowNode,
+      Props::Shared props) override;
   void uiManagerDidSendAccessibilityEvent(
       const ShadowNode::Shared &shadowNode,
       std::string const &eventType) override;

ReactCommon/react/renderer/scheduler/SchedulerDelegate.h

@@ -13,8 +13,7 @@
 #include <react/renderer/mounting/MountingCoordinator.h>
 #include <react/renderer/mounting/ShadowView.h>
 
-namespace facebook {
-namespace react {
+namespace facebook::react {
 
 /*
  * Abstract class for Scheduler's delegate.
@@ -41,6 +40,10 @@ class SchedulerDelegate {
       std::string const &commandName,
       folly::dynamic const &args) = 0;
 
+  virtual void setNativeProps_DEPRECATED(
+      const ShadowView &shadowView,
+      Props::Shared props) = 0;
+
   virtual void schedulerDidSendAccessibilityEvent(
       const ShadowView &shadowView,
       std::string const &eventType) = 0;
@@ -56,5 +59,4 @@ class SchedulerDelegate {
   virtual ~SchedulerDelegate() noexcept = default;
 };
 
-} // namespace react
-} // namespace facebook
+} // namespace facebook::react

ReactCommon/react/renderer/uimanager/UIManager.cpp

@@ -8,6 +8,7 @@
 #include "UIManager.h"
 
 #include <react/debug/react_native_assert.h>
+#include <react/renderer/core/DynamicPropsUtilities.h>
 #include <react/renderer/core/PropsParserContext.h>
 #include <react/renderer/core/ShadowNodeFragment.h>
 #include <react/renderer/debug/SystraceSection.h>
@@ -109,14 +110,29 @@ ShadowNode::Shared UIManager::cloneNode(
       shadowNode.getFamily().getSurfaceId(), *contextContainer_.get()};
 
   auto &componentDescriptor = shadowNode.getComponentDescriptor();
+  auto &family = shadowNode.getFamily();
+  auto props = ShadowNodeFragment::propsPlaceholder();
+
+  if (rawProps != nullptr) {
+    if (family.nativeProps_DEPRECATED != nullptr) {
+      family.nativeProps_DEPRECATED =
+          std::make_unique<folly::dynamic>(mergeDynamicProps(
+              (folly::dynamic)*rawProps, *family.nativeProps_DEPRECATED));
+
+      props = componentDescriptor.cloneProps(
+          propsParserContext,
+          shadowNode.getProps(),
+          mergeRawProps(*family.nativeProps_DEPRECATED, *rawProps));
+    } else {
+      props = componentDescriptor.cloneProps(
+          propsParserContext, shadowNode.getProps(), *rawProps);
+    }
+  }
+
   auto clonedShadowNode = componentDescriptor.cloneShadowNode(
       shadowNode,
       {
-          /* .props = */
-          rawProps != nullptr
-              ? componentDescriptor.cloneProps(
-                    propsParserContext, shadowNode.getProps(), *rawProps)
-              : ShadowNodeFragment::propsPlaceholder(),
+          /* .props = */ props,
           /* .children = */ children,
       });
 
@@ -329,6 +345,34 @@ void UIManager::dispatchCommand(
   }
 }
 
+void UIManager::setNativeProps_DEPRECATED(
+    ShadowNode::Shared const &shadowNode,
+    RawProps const &rawProps) const {
+  if (delegate_ != nullptr) {
+    auto &family = shadowNode->getFamily();
+    if (family.nativeProps_DEPRECATED) {
+      family.nativeProps_DEPRECATED =
+          std::make_unique<folly::dynamic>(mergeDynamicProps(
+              *family.nativeProps_DEPRECATED, (folly::dynamic)rawProps));
+    } else {
+      family.nativeProps_DEPRECATED =
+          std::make_unique<folly::dynamic>((folly::dynamic)rawProps);
+    }
+
+    PropsParserContext propsParserContext{
+        family.getSurfaceId(), *contextContainer_.get()};
+    auto &componentDescriptor =
+        componentDescriptorRegistry_->at(shadowNode->getComponentHandle());
+
+    auto props = componentDescriptor.cloneProps(
+        propsParserContext,
+        getNewestCloneOfShadowNode(*shadowNode)->getProps(),
+        RawProps(*family.nativeProps_DEPRECATED));
+
+    delegate_->setNativeProps_DEPRECATED(shadowNode, std::move(props));
+  }
+}
+
 void UIManager::sendAccessibilityEvent(
     const ShadowNode::Shared &shadowNode,
     std::string const &eventType) {

ReactCommon/react/renderer/uimanager/UIManager.h

@@ -162,6 +162,10 @@ class UIManager final : public ShadowTreeDelegate {
       std::string const &commandName,
       folly::dynamic const &args) const;
 
+  void setNativeProps_DEPRECATED(
+      ShadowNode::Shared const &shadowNode,
+      RawProps const &rawProps) const;
+
   void sendAccessibilityEvent(
       const ShadowNode::Shared &shadowNode,
       std::string const &eventType);

ReactCommon/react/renderer/uimanager/UIManagerBinding.cpp

@@ -501,6 +501,24 @@ jsi::Value UIManagerBinding::get(
         });
   }
 
+  if (methodName == "setNativeProps") {
+    return jsi::Function::createFromHostFunction(
+        runtime,
+        name,
+        2,
+        [uiManager](
+            jsi::Runtime &runtime,
+            const jsi::Value &,
+            const jsi::Value *arguments,
+            size_t) -> jsi::Value {
+          uiManager->setNativeProps_DEPRECATED(
+              shadowNodeFromValue(runtime, arguments[0]),
+              RawProps(runtime, arguments[1]));
+
+          return jsi::Value::undefined();
+        });
+  }
+
   // Legacy API
   if (methodName == "measureLayout") {
     return jsi::Function::createFromHostFunction(

ReactCommon/react/renderer/uimanager/UIManagerDelegate.h

@@ -40,6 +40,15 @@ class UIManagerDelegate {
       std::string const &commandName,
       folly::dynamic const &args) = 0;
 
+  /*
+   * Called when UIManager wants directly manipulate view on the mounting layer.
+   * This is a backport of setNativeProps from the old architecture and will be
+   * removed in the future.
+   */
+  virtual void setNativeProps_DEPRECATED(
+      const ShadowNode::Shared &shadowNode,
+      Props::Shared props) = 0;
+
   /*
    * Called when UIManager wants to dispatch some accessibility event
    * to the mounting layer. eventType is platform-specific and not all