fix: android header pressability

bitpay · Jan 14, 2025 · 8bb0d1d · 8bb0d1d
1 parent eff68f7
commit 8bb0d1d
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 5 deletions.
diff --git a/patches/@react-navigation+elements+1.3.21.patch b/patches/@react-navigation+elements+1.3.21.patch
@@ -0,0 +1,20 @@
+diff --git a/node_modules/@react-navigation/elements/src/Header/HeaderBackButton.tsx b/node_modules/@react-navigation/elements/src/Header/HeaderBackButton.tsx
+index 7c2a541..9f7478b 100644
+--- a/node_modules/@react-navigation/elements/src/Header/HeaderBackButton.tsx
++++ b/node_modules/@react-navigation/elements/src/Header/HeaderBackButton.tsx
+@@ -150,7 +150,14 @@ export default function HeaderBackButton({
+       accessibilityRole="button"
+       accessibilityLabel={accessibilityLabel}
+       testID={testID}
+-      onPress={disabled ? undefined : handlePress}
++      onPress={Platform.select({
++        android: undefined,
++        default: disabled ? undefined : handlePress,
++      })}
++      onPressOut={Platform.select({
++        android: disabled ? undefined : handlePress,
++        default: undefined,
++      })}
+       pressColor={pressColor}
+       pressOpacity={pressOpacity}
+       android_ripple={androidRipple}
diff --git a/src/components/settings/Settings.tsx b/src/components/settings/Settings.tsx
@@ -28,7 +28,7 @@ const Settings = ({onPress}: {onPress: () => void}) => {
 
   return (
     <HeaderRightContainer>
-      <SettingsSvgContainer activeOpacity={ActiveOpacity} onPress={onPress}>
+      <SettingsSvgContainer activeOpacity={ActiveOpacity} onPressOut={onPress}>
         <SettingsSvg color={color} background={background} />
       </SettingsSvgContainer>
     </HeaderRightContainer>

diff --git a/src/navigation/tabs/settings/components/General.tsx b/src/navigation/tabs/settings/components/General.tsx
@@ -71,8 +71,7 @@ const General = () => {
       headerLeft: () => (
         <HeaderRightContainer>
           <CloseModalButtonContainer>
-            <CloseModalButton
-             onPress={() => navigation.goBack()}>
+            <CloseModalButton onPressOut={() => navigation.goBack()}>
               <CloseIcon />
             </CloseModalButton>
           </CloseModalButtonContainer>

diff --git a/src/navigation/wallet/screens/KeyOverview.tsx b/src/navigation/wallet/screens/KeyOverview.tsx
@@ -13,7 +13,7 @@ import {
   useTheme,
 } from '@react-navigation/native';
 import {FlashList} from '@shopify/flash-list';
-import {LogBox, RefreshControl, TouchableOpacity} from 'react-native';
+import {LogBox, Platform, RefreshControl, TouchableOpacity} from 'react-native';
 import styled from 'styled-components/native';
 import haptic from '../../../components/haptic-feedback/haptic';
 import {
@@ -215,7 +215,7 @@ const KeyOverview = () => {
           <KeyToggle
             activeOpacity={ActiveOpacity}
             disabled={!hasMultipleKeys && !linkedCoinbase}
-            onPress={() => setShowKeyDropdown(true)}>
+            onPressOut={() => setShowKeyDropdown(true)}>
             {key.methods?.isPrivKeyEncrypted() ? (
               theme.dark ? (
                 <EncryptPasswordDarkModeImg />