From 9427eea29363ebe9ed180d384e0cdd1ebd97fe64 Mon Sep 17 00:00:00 2001
From: Nicolas Gallagher <nicolasgallagher@gmail.com>
Date: Mon, 5 Mar 2018 16:56:27 -0800
Subject: [PATCH] [add] VirtualizedList support

Make changes needed to run VirtualizedList using React Native for Web.

Close #659
---
 .../src/exports/VirtualizedList/index.js      |  4 +-
 .../src/vendor/Batchinator/index.js           |  3 +-
 .../src/vendor/ViewabilityHelper/index.js     |  2 +-
 .../src/vendor/VirtualizedList/index.js       | 66 +++++++++----------
 4 files changed, 37 insertions(+), 38 deletions(-)

diff --git a/packages/react-native-web/src/exports/VirtualizedList/index.js b/packages/react-native-web/src/exports/VirtualizedList/index.js
index 9cd4039d..bf9c27b1 100644
--- a/packages/react-native-web/src/exports/VirtualizedList/index.js
+++ b/packages/react-native-web/src/exports/VirtualizedList/index.js
@@ -1,2 +1,2 @@
-import UnimplementedView from '../../modules/UnimplementedView';
-export default UnimplementedView;
+import VirtualizedList from '../../vendor/VirtualizedList';
+export default VirtualizedList;
diff --git a/packages/react-native-web/src/vendor/Batchinator/index.js b/packages/react-native-web/src/vendor/Batchinator/index.js
index 6444b2a2..36fadd4f 100644
--- a/packages/react-native-web/src/vendor/Batchinator/index.js
+++ b/packages/react-native-web/src/vendor/Batchinator/index.js
@@ -7,9 +7,8 @@
  * @providesModule Batchinator
  * @flow
  */
-'use strict';
 
-const InteractionManager = require('InteractionManager');
+import InteractionManager from '../../exports/InteractionManager';
 
 /**
  * A simple class for batching up invocations of a low-pri callback. A timeout is set to run the
diff --git a/packages/react-native-web/src/vendor/ViewabilityHelper/index.js b/packages/react-native-web/src/vendor/ViewabilityHelper/index.js
index 281bc011..eaa959e3 100644
--- a/packages/react-native-web/src/vendor/ViewabilityHelper/index.js
+++ b/packages/react-native-web/src/vendor/ViewabilityHelper/index.js
@@ -5,7 +5,7 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @providesModule ViewabilityHelper
- * @flow
+ * @noflow
  * @format
  */
 'use strict';
diff --git a/packages/react-native-web/src/vendor/VirtualizedList/index.js b/packages/react-native-web/src/vendor/VirtualizedList/index.js
index 658b032c..4f8c4fea 100644
--- a/packages/react-native-web/src/vendor/VirtualizedList/index.js
+++ b/packages/react-native-web/src/vendor/VirtualizedList/index.js
@@ -5,39 +5,31 @@
  * LICENSE file in the root directory of this source tree.
  *
  * @providesModule VirtualizedList
- * @flow
+ * @noflow
  * @format
  */
-'use strict';
+import Batchinator from '../Batchinator';
+import FillRateHelper from '../FillRateHelper';
+import PropTypes from 'prop-types';
+import React from 'react';
+import RefreshControl from '../../exports/RefreshControl';
+import ScrollView from '../../exports/ScrollView';
+import StyleSheet, { type StyleObj } from '../../exports/StyleSheet';
+import UIManager from '../../exports/UIManager';
+import View from '../../exports/View';
+import ViewabilityHelper, {
+  type ViewabilityConfig,
+  type ViewToken,
+  type ViewabilityConfigCallbackPair
+} from '../ViewabilityHelper';
+import { computeWindowedRenderLimits } from '../VirtualizeUtils';
+import { findNodeHandle } from '../../exports/findNodeHandle';
+import infoLog from '../infoLog';
+import invariant from 'fbjs/lib/invariant';
+import warning from 'fbjs/lib/warning';
 
-const Batchinator = require('Batchinator');
-const FillRateHelper = require('FillRateHelper');
-const PropTypes = require('prop-types');
-const React = require('React');
-const ReactNative = require('ReactNative');
-const RefreshControl = require('RefreshControl');
-const ScrollView = require('ScrollView');
-const StyleSheet = require('StyleSheet');
-const UIManager = require('UIManager');
-const View = require('View');
-const ViewabilityHelper = require('ViewabilityHelper');
-
-const flattenStyle = require('flattenStyle');
-const infoLog = require('infoLog');
-const invariant = require('fbjs/lib/invariant');
-/* $FlowFixMe(>=0.54.0 site=react_native_oss) This comment suppresses an error
- * found when Flow v0.54 was deployed. To see the error delete this comment and
- * run Flow. */
-const warning = require('fbjs/lib/warning');
-
-const { computeWindowedRenderLimits } = require('VirtualizeUtils');
-
-import type { StyleObj } from 'StyleSheetTypes';
-import type {
-  ViewabilityConfig,
-  ViewToken,
-  ViewabilityConfigCallbackPair
-} from 'ViewabilityHelper';
+const flattenStyle = StyleSheet.flatten;
+const __DEV__ = process.env.NODE_ENV !== 'production';
 
 type Item = any;
 
@@ -388,7 +380,7 @@ class VirtualizedList extends React.PureComponent<Props, State> {
     if (this._scrollRef && this._scrollRef.getScrollableNode) {
       return this._scrollRef.getScrollableNode();
     } else {
-      return ReactNative.findNodeHandle(this._scrollRef);
+      return findNodeHandle(this._scrollRef);
     }
   }
 
@@ -608,6 +600,14 @@ class VirtualizedList extends React.PureComponent<Props, State> {
     };
   }
 
+  // Workaround for React 16.2 which does not support static getDerivedStateFromProps.
+  componentWillReceiveProps(nextProps: Props) {
+    const state = this.constructor.getDerivedStateFromProps(nextProps, this.state);
+    if (state !== null && state !== undefined) {
+      this.setState(() => state);
+    }
+  }
+
   _pushCells(
     cells: Array<Object>,
     stickyHeaderIndices: Array<number>,
@@ -980,8 +980,8 @@ class VirtualizedList extends React.PureComponent<Props, State> {
 
   _measureLayoutRelativeToContainingList(): void {
     UIManager.measureLayout(
-      ReactNative.findNodeHandle(this),
-      ReactNative.findNodeHandle(this.context.virtualizedList.getOutermostParentListRef()),
+      findNodeHandle(this),
+      findNodeHandle(this.context.virtualizedList.getOutermostParentListRef()),
       error => {
         console.warn(
           "VirtualizedList: Encountered an error while measuring a list's" +