Merge pull request #6303 from BlueWallet/walletexpo

FIX: Wallet export reminder was not visible on macOS

BlueComponents.js

@@ -18,6 +18,7 @@ import {
   View,
   I18nManager,
   ImageBackground,
+  findNodeHandle,
 } from 'react-native';
 import Clipboard from '@react-native-clipboard/clipboard';
 import NetworkTransactionFees, { NetworkTransactionFee, NetworkTransactionFeeType } from './models/networkTransactionFees';
@@ -26,6 +27,8 @@ import { BlueCurrentTheme, useTheme } from './components/themes';
 import PlusIcon from './components/icons/PlusIcon';
 import loc, { formatStringAddTwoWhiteSpaces } from './loc';
 import SafeArea from './components/SafeArea';
+import { isDesktop } from './blue_modules/environment';
+import ActionSheet from './screen/ActionSheet';
 
 const { height, width } = Dimensions.get('window');
 const aspectRatio = height / width;
@@ -193,16 +196,37 @@ export const BlueButtonLink = forwardRef((props, ref) => {
   );
 });
 
-export const BlueAlertWalletExportReminder = ({ onSuccess = () => {}, onFailure }) => {
-  Alert.alert(
-    loc.wallets.details_title,
-    loc.pleasebackup.ask,
-    [
-      { text: loc.pleasebackup.ask_yes, onPress: onSuccess, style: 'cancel' },
-      { text: loc.pleasebackup.ask_no, onPress: onFailure },
-    ],
-    { cancelable: false },
-  );
+export const BlueAlertWalletExportReminder = ({ onSuccess = () => {}, onFailure, anchor }) => {
+  if (isDesktop) {
+    ActionSheet.showActionSheetWithOptions(
+      {
+        title: loc.wallets.details_title, // Changed from loc.send.header to loc.wallets.details_title
+        message: loc.pleasebackup.ask,
+        options: [loc.pleasebackup.ask_yes, loc.pleasebackup.ask_no],
+        anchor: findNodeHandle(anchor), // Kept the same for context
+      },
+      buttonIndex => {
+        switch (buttonIndex) {
+          case 0:
+            onSuccess(); // Assuming the first button (yes) triggers onSuccess
+            break;
+          case 1:
+            onFailure(); // Assuming the second button (no) triggers onFailure
+            break;
+        }
+      },
+    );
+  } else {
+    Alert.alert(
+      loc.wallets.details_title,
+      loc.pleasebackup.ask,
+      [
+        { text: loc.pleasebackup.ask_yes, onPress: onSuccess, style: 'cancel' },
+        { text: loc.pleasebackup.ask_no, onPress: onFailure },
+      ],
+      { cancelable: false },
+    );
+  }
 };
 
 export const BluePrivateBalance = () => {

blue_modules/notifications.js

@@ -1,11 +1,13 @@
 import PushNotificationIOS from '@react-native-community/push-notification-ios';
-import { Alert, Platform } from 'react-native';
+import { Alert, Platform, findNodeHandle } from 'react-native';
 import Frisbee from 'frisbee';
 import { getApplicationName, getVersion, getSystemName, getSystemVersion, hasGmsSync, hasHmsSync } from 'react-native-device-info';
 import AsyncStorage from '@react-native-async-storage/async-storage';
 import loc from '../loc';
 import { requestNotifications } from 'react-native-permissions';
 import PushNotification from 'react-native-push-notification';
+import { isDesktop } from './environment';
+import ActionSheet from '../screen/ActionSheet';
 
 const constants = require('./constants');
 const PUSH_TOKEN = 'PUSH_TOKEN';
@@ -128,7 +130,7 @@ function Notifications(props) {
    *
    * @returns {Promise<boolean>} TRUE if permissions were obtained, FALSE otherwise
    */
-  Notifications.tryToObtainPermissions = async function () {
+  Notifications.tryToObtainPermissions = async function (anchor) {
     if (!Notifications.isNotificationsCapable) return false;
     if (await Notifications.getPushToken()) {
       // we already have a token, no sense asking again, just configure pushes to register callbacks and we are done
@@ -142,35 +144,63 @@ function Notifications(props) {
     }
 
     return new Promise(function (resolve) {
-      Alert.alert(
-        loc.settings.notifications,
-        loc.notifications.would_you_like_to_receive_notifications,
-        [
+      if (isDesktop) {
+        ActionSheet.showActionSheetWithOptions(
           {
-            text: loc.notifications.no_and_dont_ask,
-            onPress: () => {
-              AsyncStorage.setItem(NOTIFICATIONS_NO_AND_DONT_ASK_FLAG, '1');
-              resolve(false);
-            },
-            style: 'cancel',
+            title: loc.settings.notifications,
+            message: loc.notifications.would_you_like_to_receive_notifications,
+            options: [loc.notifications.no_and_dont_ask, loc.notifications.ask_me_later, loc._.ok],
+            cancelButtonIndex: 0, // Assuming 'no and don't ask' is treated as the cancel action
+            anchor: findNodeHandle(anchor.current), // Assuming you have a relevant anchor as before
           },
-          {
-            text: loc.notifications.ask_me_later,
-            onPress: () => {
-              resolve(false);
-            },
-            style: 'cancel',
+          buttonIndex => {
+            switch (buttonIndex) {
+              case 0:
+                AsyncStorage.setItem(NOTIFICATIONS_NO_AND_DONT_ASK_FLAG, '1');
+                resolve(false);
+                break;
+              case 1:
+                resolve(false);
+                break;
+              case 2:
+                (async () => {
+                  resolve(await configureNotifications());
+                })();
+                break;
+            }
           },
-          {
-            text: loc._.ok,
-            onPress: async () => {
-              resolve(await configureNotifications());
+        );
+      } else {
+        Alert.alert(
+          loc.settings.notifications,
+          loc.notifications.would_you_like_to_receive_notifications,
+          [
+            {
+              text: loc.notifications.no_and_dont_ask,
+              onPress: () => {
+                AsyncStorage.setItem(NOTIFICATIONS_NO_AND_DONT_ASK_FLAG, '1');
+                resolve(false);
+              },
+              style: 'cancel',
             },
-            style: 'default',
-          },
-        ],
-        { cancelable: false },
-      );
+            {
+              text: loc.notifications.ask_me_later,
+              onPress: () => {
+                resolve(false);
+              },
+              style: 'cancel',
+            },
+            {
+              text: loc._.ok,
+              onPress: async () => {
+                resolve(await configureNotifications());
+              },
+              style: 'default',
+            },
+          ],
+          { cancelable: false },
+        );
+      }
     });
   };
 

screen/receive/details.js

@@ -61,6 +61,7 @@ const ReceiveDetails = () => {
   const [initialUnconfirmed, setInitialUnconfirmed] = useState(0);
   const [displayBalance, setDisplayBalance] = useState('');
   const fetchAddressInterval = useRef();
+  const receiveAddressButton = useRef();
   const stylesHook = StyleSheet.create({
     modalContent: {
       backgroundColor: colors.modal,
@@ -270,7 +271,7 @@ const ReceiveDetails = () => {
           )}
 
           <QRCodeComponent value={bip21encoded} />
-          <BlueCopyTextToClipboard text={isCustom ? bip21encoded : address} />
+          <BlueCopyTextToClipboard text={isCustom ? bip21encoded : address} ref={receiveAddressButton} />
         </View>
         <View style={styles.share}>
           <BlueCard>
@@ -295,7 +296,7 @@ const ReceiveDetails = () => {
     let newAddress;
     if (address) {
       setAddressBIP21Encoded(address);
-      await Notifications.tryToObtainPermissions();
+      await Notifications.tryToObtainPermissions(receiveAddressButton.current);
       Notifications.majorTomToGroundControl([address], [], []);
     } else {
       if (wallet.chain === Chain.ONCHAIN) {
@@ -323,7 +324,7 @@ const ReceiveDetails = () => {
         }
       }
       setAddressBIP21Encoded(newAddress);
-      await Notifications.tryToObtainPermissions();
+      await Notifications.tryToObtainPermissions(receiveAddressButton.current);
       Notifications.majorTomToGroundControl([newAddress], [], []);
     }
     // eslint-disable-next-line react-hooks/exhaustive-deps
@@ -344,7 +345,6 @@ const ReceiveDetails = () => {
             BlueAlertWalletExportReminder({
               onSuccess: obtainWalletAddress,
               onFailure: () => {
-                goBack();
                 navigate('WalletExportRoot', {
                   screen: 'WalletExport',
                   params: {
@@ -352,6 +352,7 @@ const ReceiveDetails = () => {
                   },
                 });
               },
+              anchor: receiveAddressButton.current,
             });
           } else {
             obtainWalletAddress();