From 9f7dfcc35ff603de42cfa5e3fa63701916a86784 Mon Sep 17 00:00:00 2001
From: Eric Rozell <ericroz@meta.com>
Date: Fri, 11 Aug 2023 17:20:42 -0700
Subject: [PATCH] Temporary hotfix for broken view flattening on Android
 (#38968)

Summary:
Pull Request resolved: https://github.com/facebook/react-native/pull/38968

A previous change introduced a bug where elevation was no longer being parsed on Android, which caused views that were previously flattened to no longer get flattened. This is a hotfix that could be pushed to affected builds without native code changes, but will not restore the shadow UX.

## Changelog:
[General] [Internal] - Internal

Reviewed By: bvanderhoof

Differential Revision: D48271545

fbshipit-source-id: ebbecd8073a074525ff7b95a6298612d0bb304c6
---
 .../react-native/Libraries/Components/View/View.js    | 11 +++++++++++
 .../Libraries/ReactNative/ReactNativeFeatureFlags.js  |  5 +++++
 2 files changed, 16 insertions(+)

diff --git a/packages/react-native/Libraries/Components/View/View.js b/packages/react-native/Libraries/Components/View/View.js
index d9814254743..d54135af489 100644
--- a/packages/react-native/Libraries/Components/View/View.js
+++ b/packages/react-native/Libraries/Components/View/View.js
@@ -10,6 +10,7 @@
 
 import type {ViewProps} from './ViewPropTypes';
 
+import ReactNativeFeatureFlags from '../../ReactNative/ReactNativeFeatureFlags';
 import flattenStyle from '../../StyleSheet/flattenStyle';
 import TextAncestor from '../../Text/TextAncestor';
 import ViewNativeComponent from './ViewNativeComponent';
@@ -100,10 +101,20 @@ const View: React.AbstractComponent<
     let style = flattenStyle(otherProps.style);
 
     const newPointerEvents = style?.pointerEvents || pointerEvents;
+    const collapsableOverride =
+      ReactNativeFeatureFlags.shouldForceUnflattenForElevation()
+        ? {
+            collapsable:
+              style != null && style.elevation != null && style.elevation !== 0
+                ? false
+                : otherProps.collapsable,
+          }
+        : {};
 
     const actualView = (
       <ViewNativeComponent
         {...otherProps}
+        {...collapsableOverride}
         accessibilityLiveRegion={
           ariaLive === 'off' ? 'none' : ariaLive ?? accessibilityLiveRegion
         }
diff --git a/packages/react-native/Libraries/ReactNative/ReactNativeFeatureFlags.js b/packages/react-native/Libraries/ReactNative/ReactNativeFeatureFlags.js
index 5c24614e413..f8f7ccd56e1 100644
--- a/packages/react-native/Libraries/ReactNative/ReactNativeFeatureFlags.js
+++ b/packages/react-native/Libraries/ReactNative/ReactNativeFeatureFlags.js
@@ -57,6 +57,10 @@ export type FeatureFlags = {|
    * Enables native view configs in brdgeless mode.
    */
   enableNativeViewConfigsInBridgelessMode: () => boolean,
+  /**
+   * Enables a hotfix for forcing materialization of views with elevation set.
+   */
+  shouldForceUnflattenForElevation: () => boolean,
 |};
 
 const ReactNativeFeatureFlags: FeatureFlags = {
@@ -70,6 +74,7 @@ const ReactNativeFeatureFlags: FeatureFlags = {
   shouldUseAnimatedObjectForTransform: () => false,
   shouldUseSetNativePropsInFabric: () => false,
   enableNativeViewConfigsInBridgelessMode: () => false,
+  shouldForceUnflattenForElevation: () => false,
 };
 
 module.exports = ReactNativeFeatureFlags;