feat: mutate child nodes with native state

Author: okwasniewski

apps/example/src/Screens/Chat.tsx

@@ -30,12 +30,7 @@ export function Chat({
       style={styles.container}
     >
       <Button onPress={() => Alert.alert('Hey')} title="Press me" />
-      <ScrollView
-        contentInsetAdjustmentBehavior="automatic"
-        style={styles.inverted}
-        contentContainerStyle={styles.content}
-        {...rest}
-      >
+      <View style={styles.inverted} {...rest}>
         {MESSAGES.map((text, i) => {
           const odd = i % 2;
 
@@ -63,7 +58,7 @@ export function Chat({
             </View>
           );
         })}
-      </ScrollView>
+      </View>
       <TextInput
         style={[styles.input, { backgroundColor: 'white', color: 'black' }]}
         placeholderTextColor={'#B0B0B0'}

packages/react-native-bottom-tabs/common/cpp/react/renderer/components/RNCTabView/RNCTabViewComponentDescriptor.h

@@ -9,37 +9,18 @@ namespace facebook::react {
 
 class RNCTabViewComponentDescriptor final : public ConcreteComponentDescriptor<RNCTabViewShadowNode>
 {
-#ifdef ANDROID
 public:
   RNCTabViewComponentDescriptor(const ComponentDescriptorParameters &parameters)
-    : ConcreteComponentDescriptor(parameters), measurementsManager_(
-    std::make_shared<RNCTabViewMeasurementsManager>(contextContainer_)) {}
-
-  void adopt(ShadowNode &shadowNode) const override
-  {
+  : ConcreteComponentDescriptor(parameters) {}
+  
+  void adopt(ShadowNode &shadowNode) const override {
+    react_native_assert(dynamic_cast<RNCTabViewShadowNode *>(&shadowNode));
+    
+    const auto tabViewShadowNode = dynamic_cast<RNCTabViewShadowNode *>(&shadowNode);
+    tabViewShadowNode->updateStateIfNeeded();
     ConcreteComponentDescriptor::adopt(shadowNode);
-
-    auto &rncTabViewShadowNode =
-      static_cast<RNCTabViewShadowNode &>(shadowNode);
-
-    // `RNCTabViewShadowNode` uses `RNCTabViewMeasurementsManager` to
-    // provide measurements to Yoga.
-    rncTabViewShadowNode.setSliderMeasurementsManager(
-      measurementsManager_);
-
-    // All `RNCTabViewShadowNode`s must have leaf Yoga nodes with properly
-    // setup measure function.
-    rncTabViewShadowNode.enableMeasurement();
   }
 
-private:
-  const std::shared_ptr<RNCTabViewMeasurementsManager> measurementsManager_;
-#else
-public:
-  RNCTabViewComponentDescriptor(const ComponentDescriptorParameters &parameters)
-  : ConcreteComponentDescriptor(parameters) {}
-#endif
-
 };
 
 }

packages/react-native-bottom-tabs/common/cpp/react/renderer/components/RNCTabView/RNCTabViewMeasurementsManager.cpp

@@ -1,28 +1,20 @@
 #include "RNCTabViewShadowNode.h"
-#include "RNCTabViewMeasurementsManager.h"
 
 namespace facebook::react {
 
 extern const char RNCTabViewComponentName[] = "RNCTabView";
 
-#ifdef ANDROID
-void RNCTabViewShadowNode::setSliderMeasurementsManager(
-  const std::shared_ptr<RNCTabViewMeasurementsManager> &
-  measurementsManager)
-{
+void RNCTabViewShadowNode::updateStateIfNeeded() {
   ensureUnsealed();
-  measurementsManager_ = measurementsManager;
-}
-
-#pragma mark - LayoutableShadowNode
-
-Size RNCTabViewShadowNode::measureContent(
-  const LayoutContext & /*layoutContext*/,
-  const LayoutConstraints &layoutConstraints) const
-{
-  return measurementsManager_->measure(getSurfaceId(), layoutConstraints);
-}
-
-#endif
+  const auto &stateData = getStateData();
+  auto frameSize = stateData.frameSize;
+  
+  for (auto &child : getLayoutableChildNodes()) {
+    auto yogaChild = dynamic_cast<YogaLayoutableShadowNode*>(child);
+    if (!yogaChild->getSealed() && yogaChild->getLayoutMetrics().frame.size != frameSize) {
+      yogaChild->setSize(frameSize);
+    }
+  }
+};
 
 }

packages/react-native-bottom-tabs/common/cpp/react/renderer/components/RNCTabView/RNCTabViewMeasurementsManager.h

@@ -8,8 +8,6 @@
 #include <react/renderer/components/RNCTabView/EventEmitters.h>
 #include <react/renderer/components/view/ConcreteViewShadowNode.h>
 
-#include "RNCTabViewMeasurementsManager.h"
-
 namespace facebook::react {
 
 JSI_EXPORT extern const char RNCTabViewComponentName[];
@@ -26,23 +24,9 @@ RNCTabViewState>
 {
 public:
   using ConcreteViewShadowNode::ConcreteViewShadowNode;
-
-#ifdef ANDROID
-  void setSliderMeasurementsManager(
-    const std::shared_ptr<RNCTabViewMeasurementsManager> &measurementsManager);
-
-  #pragma mark - LayoutableShadowNode
-
-  Size measureContent(
-    const LayoutContext &layoutContext,
-    const LayoutConstraints &layoutConstraints) const override;
-
-private:
-  std::shared_ptr<RNCTabViewMeasurementsManager> measurementsManager_;
-#endif
-
+  
+  void updateStateIfNeeded();
 };
-
 }
 
 #endif

packages/react-native-bottom-tabs/common/cpp/react/renderer/components/RNCTabView/RNCTabViewShadowNode.cpp

@@ -1,7 +1,7 @@
 #ifdef __cplusplus
 
 #pragma once
-
+#include <react/renderer/graphics/Size.h>
 #ifdef ANDROID
 #include <folly/dynamic.h>
 #include <react/renderer/mapbuffer/MapBuffer.h>
@@ -14,20 +14,9 @@ class RNCTabViewState
 {
 public:
   RNCTabViewState() = default;
+  RNCTabViewState(Size frameSize): frameSize(frameSize) {};
 
-#ifdef ANDROID
-  RNCTabViewState(RNCTabViewState const &previousState, folly::dynamic data) {};
-  
-  folly::dynamic getDynamic() const
-  {
-    return {};
-  };
-  
-  MapBuffer getMapBuffer() const
-  {
-    return MapBufferBuilder::EMPTY();
-  };
-#endif
+  Size frameSize;
 };
 
 }

packages/react-native-bottom-tabs/common/cpp/react/renderer/components/RNCTabView/RNCTabViewShadowNode.h

@@ -38,6 +38,7 @@ @interface RCTTabViewComponentView () <RCTRNCTabViewViewProtocol, TabViewProvide
 @implementation RCTTabViewComponentView {
   TabViewProvider *_tabViewProvider;
   NSMutableArray<PlatformView *> *_reactSubviews;
+  RNCTabViewShadowNode::ConcreteState::Shared _state;
 }
 
 + (ComponentDescriptorProvider)componentDescriptorProvider
@@ -85,6 +86,10 @@ - (void)unmountChildComponentView:(PlatformView<RCTComponentViewProtocol> *)chil
   [childComponentView removeFromSuperview];
 }
 
+- (void)updateState:(const facebook::react::State::Shared &)state oldState:(const facebook::react::State::Shared &)oldState {
+  _state = std::static_pointer_cast<const RNCTabViewShadowNode::ConcreteState>(state);
+}
+
 - (void)updateProps:(Props::Shared const &)props oldProps:(Props::Shared const &)oldProps
 {
   const auto &oldViewProps = *std::static_pointer_cast<RNCTabViewProps const>(_props);
@@ -246,13 +251,7 @@ - (void)onTabBarMeasuredWithHeight:(NSInteger)height reactTag:(NSNumber *)reactT
 }
 
 - (void)onLayoutWithSize:(CGSize)size reactTag:(NSNumber *)reactTag {
-  auto eventEmitter = std::static_pointer_cast<const RNCTabViewEventEmitter>(_eventEmitter);
-  if (eventEmitter) {
-    eventEmitter->onNativeLayout(RNCTabViewEventEmitter::OnNativeLayout {
-      .height = size.height,
-      .width = size.width
-    });
-  }
+  _state->updateState(RNCTabViewState({size.width, size.height}));
 }
 
 @end