From 54af5b151efbfb82127374b6653b89fcc6eaa61b Mon Sep 17 00:00:00 2001
From: AntoineDoubovetzky <antoined@bam.tech>
Date: Mon, 8 Apr 2019 12:41:57 -0700
Subject: [PATCH] Remove wrapper around ListEmptyComponent (#24339)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Summary:
This pull request fixes #24257.

The wrapper around ListEmptyComponent doesn't allow to use flex on the ListEmptyComponent.
The wrapper was removed in this [commit](https://github.com/facebook/react-native/commit/db061ea8c7b78d7e9df4a450c9e7a24d9b2382b4), and then put back in this [commit](https://github.com/facebook/react-native/commit/e94d3444dcface90bd20234d13143462690ff23c) but I think the relevant part was removing the condition on `itemCount !== 0` to apply the inversionStyle on the ScrollView and everything is still working without the wrapper.

[GENERAL] [FIXED] - Remove wrapper around ListEmptyComponent
Pull Request resolved: https://github.com/facebook/react-native/pull/24339

Differential Revision: D14822221

Pulled By: cpojer

fbshipit-source-id: 623e1ab3f228e9b75b92cdcd568683232a403c1a
---
 Libraries/Lists/VirtualizedList.js            | 24 ++++++++++---------
 .../VirtualizedList-test.js.snap              |  6 +----
 2 files changed, 14 insertions(+), 16 deletions(-)

diff --git a/Libraries/Lists/VirtualizedList.js b/Libraries/Lists/VirtualizedList.js
index 5bfe5427297485..72686db4e322c1 100644
--- a/Libraries/Lists/VirtualizedList.js
+++ b/Libraries/Lists/VirtualizedList.js
@@ -885,17 +885,19 @@ class VirtualizedList extends React.PureComponent<Props, State> {
         <ListEmptyComponent />
       )): any);
       cells.push(
-        <View key="$empty" style={inversionStyle}>
-          {React.cloneElement(element, {
-            onLayout: event => {
-              this._onLayoutEmpty(event);
-              if (element.props.onLayout) {
-                element.props.onLayout(event);
-              }
-            },
-            style: element.props.style,
-          })}
-        </View>,
+        React.cloneElement(element, {
+          key: '$empty',
+          onLayout: event => {
+            this._onLayoutEmpty(event);
+            if (element.props.onLayout) {
+              element.props.onLayout(event);
+            }
+          },
+          style: StyleSheet.compose(
+            inversionStyle,
+            element.props.style,
+          ),
+        }),
       );
     }
     if (ListFooterComponent) {
diff --git a/Libraries/Lists/__tests__/__snapshots__/VirtualizedList-test.js.snap b/Libraries/Lists/__tests__/__snapshots__/VirtualizedList-test.js.snap
index 32ec715a10ba71..2ae233201f72ba 100644
--- a/Libraries/Lists/__tests__/__snapshots__/VirtualizedList-test.js.snap
+++ b/Libraries/Lists/__tests__/__snapshots__/VirtualizedList-test.js.snap
@@ -668,11 +668,7 @@ exports[`VirtualizedList renders empty list with empty component 1`] = `
     >
       <header />
     </View>
-    <View
-      style={null}
-    >
-      <empty />
-    </View>
+    <empty />
     <View
       onLayout={[Function]}
     >