From 1e6e37a3a8c8a00661b3fbe7a8ee289da3bf01b7 Mon Sep 17 00:00:00 2001
From: Oleksandr Melnykov <omelnykov@fb.com>
Date: Tue, 14 Jan 2020 03:51:29 -0800
Subject: [PATCH] Use commands instead of setNativeProps for
 AndroidSwipeRefreshLayout

Summary:
As a part of the migration from setNativeProps in Fabric and Paper, we are replacing it by view commands in the RefreshControl component on Android.

Changelog: [Internal]

Reviewed By: mdvacca

Differential Revision: D18475450

fbshipit-source-id: ad89547fada3444f725fd9b00e8482cfc8f4d7fc
---
 .../RefreshControl/RefreshControl.js          | 41 +++++++++++--------
 .../RefreshControl/RefreshControlExample.js   |  1 +
 2 files changed, 25 insertions(+), 17 deletions(-)

diff --git a/Libraries/Components/RefreshControl/RefreshControl.js b/Libraries/Components/RefreshControl/RefreshControl.js
index c0d600c0e87..3e98f4adf24 100644
--- a/Libraries/Components/RefreshControl/RefreshControl.js
+++ b/Libraries/Components/RefreshControl/RefreshControl.js
@@ -15,8 +15,9 @@ const React = require('react');
 
 import type {ColorValue} from '../../StyleSheet/StyleSheetTypes';
 import type {ViewProps} from '../View/ViewPropTypes';
-import AndroidSwipeRefreshLayoutNativeComponent from './AndroidSwipeRefreshLayoutNativeComponent';
-
+import AndroidSwipeRefreshLayoutNativeComponent, {
+  Commands as AndroidSwipeRefreshLayoutCommands,
+} from './AndroidSwipeRefreshLayoutNativeComponent';
 import PullToRefreshViewNativeComponent, {
   Commands as PullToRefreshCommands,
 } from './PullToRefreshViewNativeComponent';
@@ -138,11 +139,12 @@ export type RefreshControlProps = $ReadOnly<{|
 class RefreshControl extends React.Component<RefreshControlProps> {
   static SIZE: any = RefreshLayoutConsts.SIZE;
 
-  _setNativePropsOnRef: ?({refreshing: boolean, ...}) => void;
+  _nativeRef: ?React.ElementRef<
+    | typeof PullToRefreshViewNativeComponent
+    | typeof AndroidSwipeRefreshLayoutNativeComponent,
+  >;
   _lastNativeRefreshing = false;
 
-  _nativeRef: ?React.ElementRef<typeof PullToRefreshViewNativeComponent>;
-
   componentDidMount() {
     this._lastNativeRefreshing = this.props.refreshing;
   }
@@ -155,13 +157,14 @@ class RefreshControl extends React.Component<RefreshControlProps> {
       this._lastNativeRefreshing = this.props.refreshing;
     } else if (
       this.props.refreshing !== this._lastNativeRefreshing &&
-      this._setNativePropsOnRef
+      this._nativeRef
     ) {
       if (Platform.OS === 'android') {
-        this._setNativePropsOnRef({
-          refreshing: this.props.refreshing,
-        });
-      } else if (this._nativeRef) {
+        AndroidSwipeRefreshLayoutCommands.setNativeRefreshing(
+          this._nativeRef,
+          this.props.refreshing,
+        );
+      } else {
         PullToRefreshCommands.setNativeRefreshing(
           this._nativeRef,
           this.props.refreshing,
@@ -172,11 +175,6 @@ class RefreshControl extends React.Component<RefreshControlProps> {
   }
 
   render(): React.Node {
-    const setRef = ref => {
-      this._setNativePropsOnRef = ref ? ref.setNativeProps.bind(ref) : null;
-      this._nativeRef = ref;
-    };
-
     if (Platform.OS === 'ios') {
       const {
         enabled,
@@ -189,7 +187,7 @@ class RefreshControl extends React.Component<RefreshControlProps> {
       return (
         <PullToRefreshViewNativeComponent
           {...props}
-          ref={setRef}
+          ref={this._setNativeRef}
           onRefresh={this._onRefresh}
         />
       );
@@ -198,7 +196,7 @@ class RefreshControl extends React.Component<RefreshControlProps> {
       return (
         <AndroidSwipeRefreshLayoutNativeComponent
           {...props}
-          ref={setRef}
+          ref={this._setNativeRef}
           onRefresh={this._onRefresh}
         />
       );
@@ -214,6 +212,15 @@ class RefreshControl extends React.Component<RefreshControlProps> {
     // make sure it stays in sync with the js component.
     this.forceUpdate();
   };
+
+  _setNativeRef = (
+    ref: ?React.ElementRef<
+      | typeof PullToRefreshViewNativeComponent
+      | typeof AndroidSwipeRefreshLayoutNativeComponent,
+    >,
+  ) => {
+    this._nativeRef = ref;
+  };
 }
 
 module.exports = RefreshControl;
diff --git a/RNTester/js/examples/RefreshControl/RefreshControlExample.js b/RNTester/js/examples/RefreshControl/RefreshControlExample.js
index bff7198e5ab..06493b0971b 100644
--- a/RNTester/js/examples/RefreshControl/RefreshControlExample.js
+++ b/RNTester/js/examples/RefreshControl/RefreshControlExample.js
@@ -116,6 +116,7 @@ class RefreshControlExample extends React.Component {
 
 exports.title = '<RefreshControl>';
 exports.description = 'Adds pull-to-refresh support to a scrollview.';
+exports.simpleExampleContainer = true;
 exports.examples = [
   {
     title: 'Simple refresh',