TST: force mock

Navigation.tsx

@@ -107,7 +107,15 @@ const WalletsRoot = () => {
       <WalletsStack.Screen name="CPFP" component={CPFP} options={CPFP.navigationOptions(theme)} />
       <WalletsStack.Screen name="RBFBumpFee" component={RBFBumpFee} options={RBFBumpFee.navigationOptions(theme)} />
       <WalletsStack.Screen name="RBFCancel" component={RBFCancel} options={RBFCancel.navigationOptions(theme)} />
-      <WalletsStack.Screen name="Settings" component={Settings} options={Settings.navigationOptions(theme)} />
+      <WalletsStack.Screen
+        name="Settings"
+        component={Settings}
+        options={navigationStyle({
+          headerTransparent: true,
+          title: Platform.select({ ios: loc.settings.header, default: '' }),
+          headerLargeTitle: true,
+        })(theme)}
+      />
       <WalletsStack.Screen name="SelectWallet" component={SelectWallet} options={SelectWallet.navigationOptions(theme)} />
       <WalletsStack.Screen name="Currency" component={Currency} options={navigationStyle({ title: loc.settings.currency })(theme)} />
       <WalletsStack.Screen name="About" component={About} options={About.navigationOptions(theme)} />

components/Button.tsx

@@ -56,10 +56,7 @@ export const Button = forwardRef<TouchableOpacity, ButtonProps>((props, ref) =>
       onPress={props.onPress}
       disabled={props.disabled}
     >
-      <View style={styles.content}>
-        {props.icon && <Icon name={props.icon.name} type={props.icon.type} color={props.icon.color} />}
-        {props.title && <Text style={textStyle}>{props.title}</Text>}
-      </View>
+      {buttonView}
     </TouchableOpacity>
   ) : (
     buttonView

components/SaveFileButton.tsx

@@ -8,7 +8,7 @@ const fs = require('../blue_modules/fs');
 interface SaveFileButtonProps {
   fileName: string;
   fileContent: string;
-  children: ReactNode;
+  children?: ReactNode;
   style?: StyleProp<ViewStyle>;
   afterOnPress?: () => void;
   beforeOnPress?: () => Promise<void>; // Changed this line
@@ -38,9 +38,8 @@ const SaveFileButton: React.FC<SaveFileButtonProps> = ({ fileName, fileContent,
   };
 
   return (
-    <ToolTipMenu isButton isMenuPrimaryAction actions={actions} onPressMenuItem={handlePressMenuItem} buttonStyle={style}>
-      {children}
-    </ToolTipMenu>
+    // @ts-ignore: Tooltip must be refactored to use TSX}
+    <ToolTipMenu isButton isMenuPrimaryAction actions={actions} onPressMenuItem={handlePressMenuItem} buttonStyle={style} />
   );
 };
 

components/TooltipMenu.android.js

@@ -1,4 +1,4 @@
-import React, { useRef, useEffect, forwardRef } from 'react';
+import React, { useRef, useEffect } from 'react';
 import PropTypes from 'prop-types';
 import { Pressable } from 'react-native';
 import showPopupMenu from '../blue_modules/showPopupMenu';
@@ -51,13 +51,16 @@ const ToolTipMenu = (props, ref) => {
   );
 };
 
-export default forwardRef(ToolTipMenu);
+export default ToolTipMenu;
 ToolTipMenu.propTypes = {
-  enableAndroidRipple: PropTypes.bool,
   actions: PropTypes.object.isRequired,
-  children: PropTypes.node.isRequired,
+  title: PropTypes.string,
+  children: PropTypes.node,
   onPressMenuItem: PropTypes.func.isRequired,
   isMenuPrimaryAction: PropTypes.bool,
+  isButton: PropTypes.bool,
+  renderPreview: PropTypes.element,
   onPress: PropTypes.func,
+  previewValue: PropTypes.string,
   disabled: PropTypes.bool,
 };

components/TooltipMenu.ios.js

@@ -1,4 +1,4 @@
-import React, { forwardRef } from 'react';
+import React from 'react';
 import { ContextMenuView, ContextMenuButton } from 'react-native-ios-context-menu';
 import PropTypes from 'prop-types';
 import { TouchableOpacity } from 'react-native';
@@ -117,11 +117,11 @@ const ToolTipMenu = (props, ref) => {
   );
 };
 
-export default forwardRef(ToolTipMenu);
+export default ToolTipMenu;
 ToolTipMenu.propTypes = {
   actions: PropTypes.object.isRequired,
   title: PropTypes.string,
-  children: PropTypes.node.isRequired,
+  children: PropTypes.node,
   onPressMenuItem: PropTypes.func.isRequired,
   isMenuPrimaryAction: PropTypes.bool,
   isButton: PropTypes.bool,

screen/settings/Settings.js

@@ -1,27 +1,36 @@
 import React, { useContext } from 'react';
 import { ScrollView, StyleSheet, Platform } from 'react-native';
-import { useNavigation } from '@react-navigation/native';
-
-import navigationStyle from '../../components/navigationStyle';
 import { BlueHeaderDefaultSub } from '../../BlueComponents';
 import loc from '../../loc';
 import { BlueStorageContext } from '../../blue_modules/storage-context';
 import ListItem from '../../components/ListItem';
+import { useExtendedNavigation } from '../../hooks/useExtendedNavigation';
 
 const styles = StyleSheet.create({
   root: {
     flex: 1,
   },
+  container: Platform.select({
+    android: {
+      paddingTop: 50,
+    },
+    default: undefined,
+  }),
 });
 
 const Settings = () => {
-  const { navigate } = useNavigation();
+  const { navigate } = useExtendedNavigation();
   // By simply having it here, it'll re-render the UI if language is changed
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   const { language } = useContext(BlueStorageContext);
 
   return (
-    <ScrollView style={styles.root} contentInsetAdjustmentBehavior="automatic" automaticallyAdjustContentInsets>
+    <ScrollView
+      style={styles.root}
+      contentContainerStyle={styles.container}
+      contentInsetAdjustmentBehavior="automatic"
+      automaticallyAdjustContentInsets
+    >
       {Platform.OS === 'android' ? <BlueHeaderDefaultSub leftText={loc.settings.header} /> : <></>}
       <ListItem title={loc.settings.general} onPress={() => navigate('GeneralSettings')} testID="GeneralSettings" chevron />
       <ListItem title={loc.settings.currency} onPress={() => navigate('Currency')} testID="Currency" chevron />
@@ -35,8 +44,3 @@ const Settings = () => {
 };
 
 export default Settings;
-Settings.navigationOptions = navigationStyle({
-  headerTransparent: true,
-  headerTitle: Platform.select({ ios: loc.settings.header, default: '' }),
-  headerLargeTitle: true,
-});

tests/setup.js

@@ -205,4 +205,6 @@ jest.mock('react-native-keychain', () => mockKeychain);
 
 jest.mock('react-native-tcp-socket', () => mockKeychain);
 
+jest.mock('../components/TooltipMenu.ios.js', () => require('../components/TooltipMenu.js'));
+
 global.alert = () => {};