From 40e2dbaecffc43df41b7951f152bbcb4b7104bb1 Mon Sep 17 00:00:00 2001
From: Satyajit Sahoo <satyajit.happy@gmail.com>
Date: Wed, 29 Jul 2020 00:33:40 +0200
Subject: [PATCH] fix: fix TouchableItem opacity on press on iOS

---
 .../drawer/src/views/TouchableItem.ios.tsx    | 30 ++++++++-----------
 .../stack/src/views/TouchableItem.ios.tsx     | 30 ++++++++-----------
 2 files changed, 26 insertions(+), 34 deletions(-)

diff --git a/packages/drawer/src/views/TouchableItem.ios.tsx b/packages/drawer/src/views/TouchableItem.ios.tsx
index dfa0f029..22b3d9f6 100644
--- a/packages/drawer/src/views/TouchableItem.ios.tsx
+++ b/packages/drawer/src/views/TouchableItem.ios.tsx
@@ -10,27 +10,26 @@ type Props = React.ComponentProps<typeof BaseButton> & {
 
 const useNativeDriver = Platform.OS !== 'web';
 
-export default class BorderlessButton extends React.Component<Props> {
+export default class TouchableItem extends React.Component<Props> {
   static defaultProps = {
     activeOpacity: 0.3,
     borderless: true,
+    enabled: true,
   };
 
   private opacity = new Animated.Value(1);
 
   private handleActiveStateChange = (active: boolean) => {
-    if (Platform.OS !== 'android') {
-      Animated.spring(this.opacity, {
-        stiffness: 1000,
-        damping: 500,
-        mass: 3,
-        overshootClamping: true,
-        restDisplacementThreshold: 0.01,
-        restSpeedThreshold: 0.01,
-        toValue: active ? this.props.activeOpacity : 1,
-        useNativeDriver,
-      }).start();
-    }
+    Animated.spring(this.opacity, {
+      stiffness: 1000,
+      damping: 500,
+      mass: 3,
+      overshootClamping: true,
+      restDisplacementThreshold: 0.01,
+      restSpeedThreshold: 0.01,
+      toValue: active ? this.props.activeOpacity : 1,
+      useNativeDriver,
+    }).start();
 
     this.props.onActiveStateChange?.(active);
   };
@@ -43,10 +42,7 @@ export default class BorderlessButton extends React.Component<Props> {
       <AnimatedBaseButton
         {...rest}
         onActiveStateChange={this.handleActiveStateChange}
-        style={[
-          style,
-          Platform.OS === 'ios' && enabled && { opacity: this.opacity },
-        ]}
+        style={[style, enabled && { opacity: this.opacity }]}
       >
         {children}
       </AnimatedBaseButton>
diff --git a/packages/stack/src/views/TouchableItem.ios.tsx b/packages/stack/src/views/TouchableItem.ios.tsx
index dfa0f029..22b3d9f6 100644
--- a/packages/stack/src/views/TouchableItem.ios.tsx
+++ b/packages/stack/src/views/TouchableItem.ios.tsx
@@ -10,27 +10,26 @@ type Props = React.ComponentProps<typeof BaseButton> & {
 
 const useNativeDriver = Platform.OS !== 'web';
 
-export default class BorderlessButton extends React.Component<Props> {
+export default class TouchableItem extends React.Component<Props> {
   static defaultProps = {
     activeOpacity: 0.3,
     borderless: true,
+    enabled: true,
   };
 
   private opacity = new Animated.Value(1);
 
   private handleActiveStateChange = (active: boolean) => {
-    if (Platform.OS !== 'android') {
-      Animated.spring(this.opacity, {
-        stiffness: 1000,
-        damping: 500,
-        mass: 3,
-        overshootClamping: true,
-        restDisplacementThreshold: 0.01,
-        restSpeedThreshold: 0.01,
-        toValue: active ? this.props.activeOpacity : 1,
-        useNativeDriver,
-      }).start();
-    }
+    Animated.spring(this.opacity, {
+      stiffness: 1000,
+      damping: 500,
+      mass: 3,
+      overshootClamping: true,
+      restDisplacementThreshold: 0.01,
+      restSpeedThreshold: 0.01,
+      toValue: active ? this.props.activeOpacity : 1,
+      useNativeDriver,
+    }).start();
 
     this.props.onActiveStateChange?.(active);
   };
@@ -43,10 +42,7 @@ export default class BorderlessButton extends React.Component<Props> {
       <AnimatedBaseButton
         {...rest}
         onActiveStateChange={this.handleActiveStateChange}
-        style={[
-          style,
-          Platform.OS === 'ios' && enabled && { opacity: this.opacity },
-        ]}
+        style={[style, enabled && { opacity: this.opacity }]}
       >
         {children}
       </AnimatedBaseButton>