From 176006180959ab435096ff4bbe9ef06e76a5cc55 Mon Sep 17 00:00:00 2001
From: Daniel Szczepanik <tmlm18@gmail.com>
Date: Sat, 9 Apr 2022 16:38:24 +0200
Subject: [PATCH] fix: swap back to using one layer only for Android

---
 src/components/Surface.tsx | 31 +++++--------------------------
 1 file changed, 5 insertions(+), 26 deletions(-)

diff --git a/src/components/Surface.tsx b/src/components/Surface.tsx
index d6a259567b..798e8e8bd9 100644
--- a/src/components/Surface.tsx
+++ b/src/components/Surface.tsx
@@ -137,14 +137,9 @@ const Surface = ({
   const sharedStyle = [{ backgroundColor }, style];
 
   if (Platform.OS === 'android') {
-    const elevationLevels = [
-      [0, 1, 2, 3, 3, 3],
-      [0, 3, 4, 6, 8, 10],
-    ];
-
-    const getElevationAndroid = (layer: 0 | 1) => {
-      const elevationLevel = elevationLevels[layer];
+    const elevationLevel = [0, 3, 6, 9, 12, 15];
 
+    const getElevationAndroid = () => {
       if (isAnimatedValue(elevation)) {
         return elevation.interpolate({
           inputRange,
@@ -159,37 +154,21 @@ const Surface = ({
       style
     ) as ViewStyle;
 
-    const clearStyles = {
-      margin: 0,
-      padding: 0,
-      transform: undefined,
-    };
-
     const outerLayerStyles = { margin, padding, transform, borderRadius };
 
     return (
       <Animated.View
         style={[
           {
-            elevation: getElevationAndroid(0),
+            elevation: getElevationAndroid(),
             backgroundColor,
             transform,
           },
           outerLayerStyles,
+          sharedStyle,
         ]}
       >
-        <Animated.View
-          style={[
-            {
-              elevation: getElevationAndroid(1),
-              borderRadius,
-            },
-            sharedStyle,
-            clearStyles,
-          ]}
-        >
-          {children}
-        </Animated.View>
+        {children}
       </Animated.View>
     );
   }