REF: WidgetCommunication to TSX (#6379)

* REF: WidgetCommunication to TSX

* Update WidgetCommunication.ios.tsx

* Update WidgetCommunication.ios.tsx

* Update WalletInformationWidget.swift

App.js

@@ -27,7 +27,7 @@ import WatchConnectivity from './WatchConnectivity';
 import DeviceQuickActions from './class/quick-actions';
 import Notifications from './blue_modules/notifications';
 import Biometric from './class/biometrics';
-import WidgetCommunication from './blue_modules/WidgetCommunication';
+import WidgetCommunication from './components/WidgetCommunication';
 import ActionSheet from './screen/ActionSheet';
 import triggerHapticFeedback, { HapticFeedbackTypes } from './blue_modules/hapticFeedback';
 import MenuElements from './components/MenuElements';

blue_modules/BlueElectrum.ts

@@ -4,11 +4,10 @@ import * as bitcoin from 'bitcoinjs-lib';
 import { Alert } from 'react-native';
 import DefaultPreference from 'react-native-default-preference';
 import Realm from 'realm';
-
 import { LegacyWallet, SegwitBech32Wallet, SegwitP2SHWallet, TaprootWallet } from '../class';
 import presentAlert from '../components/Alert';
 import loc from '../loc';
-import WidgetCommunication from './WidgetCommunication';
+import { reloadAllTimelines } from '../components/WidgetCommunication';
 
 const ElectrumClient = require('electrum-client');
 const net = require('net');
@@ -211,7 +210,7 @@ export async function connectMain(): Promise<void> {
       await DefaultPreference.set(ELECTRUM_SSL_PORT, usingPeer.ssl ?? '');
     }
 
-    WidgetCommunication.reloadAllTimelines();
+    reloadAllTimelines();
   } catch (e) {
     // Must be running on Android
     console.log(e);
@@ -338,7 +337,7 @@ const presentNetworkErrorAlert = async (usingPeer?: Peer) => {
                     await DefaultPreference.clear(ELECTRUM_HOST);
                     await DefaultPreference.clear(ELECTRUM_SSL_PORT);
                     await DefaultPreference.clear(ELECTRUM_TCP_PORT);
-                    WidgetCommunication.reloadAllTimelines();
+                    reloadAllTimelines();
                   } catch (e) {
                     // Must be running on Android
                     console.log(e);

blue_modules/WidgetCommunication.ios.js

@@ -1,79 +0,0 @@
-import { useContext, useEffect } from 'react';
-import { BlueStorageContext } from './storage-context';
-import DefaultPreference from 'react-native-default-preference';
-import RNWidgetCenter from 'react-native-widget-center';
-import AsyncStorage from '@react-native-async-storage/async-storage';
-
-function WidgetCommunication() {
-  WidgetCommunication.WidgetCommunicationAllWalletsSatoshiBalance = 'WidgetCommunicationAllWalletsSatoshiBalance';
-  WidgetCommunication.WidgetCommunicationAllWalletsLatestTransactionTime = 'WidgetCommunicationAllWalletsLatestTransactionTime';
-  WidgetCommunication.WidgetCommunicationDisplayBalanceAllowed = 'WidgetCommunicationDisplayBalanceAllowed';
-  WidgetCommunication.LatestTransactionIsUnconfirmed = 'WidgetCommunicationLatestTransactionIsUnconfirmed';
-  const { wallets, walletsInitialized, isStorageEncrypted } = useContext(BlueStorageContext);
-
-  WidgetCommunication.isBalanceDisplayAllowed = async () => {
-    try {
-      const displayBalance = JSON.parse(await AsyncStorage.getItem(WidgetCommunication.WidgetCommunicationDisplayBalanceAllowed));
-      if (displayBalance !== null) {
-        return displayBalance;
-      } else {
-        return true;
-      }
-    } catch (e) {
-      return true;
-    }
-  };
-
-  WidgetCommunication.setBalanceDisplayAllowed = async value => {
-    await AsyncStorage.setItem(WidgetCommunication.WidgetCommunicationDisplayBalanceAllowed, JSON.stringify(value));
-    setValues();
-  };
-
-  WidgetCommunication.reloadAllTimelines = () => {
-    RNWidgetCenter.reloadAllTimelines();
-  };
-
-  const allWalletsBalanceAndTransactionTime = async () => {
-    if ((await isStorageEncrypted()) || !(await WidgetCommunication.isBalanceDisplayAllowed())) {
-      return { allWalletsBalance: 0, latestTransactionTime: 0 };
-    } else {
-      let balance = 0;
-      let latestTransactionTime = 0;
-      for (const wallet of wallets) {
-        if (wallet.hideBalance) {
-          continue;
-        }
-        balance += wallet.getBalance();
-        if (wallet.getLatestTransactionTimeEpoch() > latestTransactionTime) {
-          if (wallet.getTransactions()[0].confirmations === 0) {
-            latestTransactionTime = WidgetCommunication.LatestTransactionIsUnconfirmed;
-          } else {
-            latestTransactionTime = wallet.getLatestTransactionTimeEpoch();
-          }
-        }
-      }
-      return { allWalletsBalance: balance, latestTransactionTime };
-    }
-  };
-  const setValues = async () => {
-    await DefaultPreference.setName('group.io.bluewallet.bluewallet');
-    const { allWalletsBalance, latestTransactionTime } = await allWalletsBalanceAndTransactionTime();
-    await DefaultPreference.set(WidgetCommunication.WidgetCommunicationAllWalletsSatoshiBalance, JSON.stringify(allWalletsBalance));
-    await DefaultPreference.set(
-      WidgetCommunication.WidgetCommunicationAllWalletsLatestTransactionTime,
-      JSON.stringify(latestTransactionTime),
-    );
-    RNWidgetCenter.reloadAllTimelines();
-  };
-
-  useEffect(() => {
-    if (walletsInitialized) {
-      setValues();
-    }
-
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [wallets, walletsInitialized]);
-  return null;
-}
-
-export default WidgetCommunication;

blue_modules/currency.ts

@@ -3,7 +3,7 @@ import DefaultPreference from 'react-native-default-preference';
 import * as RNLocalize from 'react-native-localize';
 import BigNumber from 'bignumber.js';
 import { FiatUnit, FiatUnitType, getFiatRate } from '../models/fiatUnit';
-import WidgetCommunication from './WidgetCommunication';
+import { reloadAllTimelines } from '../components/WidgetCommunication';
 
 const PREFERRED_CURRENCY_STORAGE_KEY = 'preferredCurrency';
 const PREFERRED_CURRENCY_LOCALE_STORAGE_KEY = 'preferredCurrencyLocale';
@@ -33,7 +33,7 @@ async function setPreferredCurrency(item: FiatUnitType): Promise<void> {
   await DefaultPreference.set(PREFERRED_CURRENCY_STORAGE_KEY, item.endPointKey);
   await DefaultPreference.set(PREFERRED_CURRENCY_LOCALE_STORAGE_KEY, item.locale.replace('-', '_'));
   // @ts-ignore: Convert to TSX later
-  WidgetCommunication.reloadAllTimelines();
+  reloadAllTimelines();
 }
 
 async function getPreferredCurrency(): Promise<FiatUnitType> {

components/WidgetCommunication.ios.tsx

@@ -0,0 +1,80 @@
+import React, { useContext, useEffect } from 'react';
+import DefaultPreference from 'react-native-default-preference';
+// @ts-ignore: fix later
+import RNWidgetCenter from 'react-native-widget-center';
+import { BlueStorageContext } from '../blue_modules/storage-context';
+import { TWallet } from '../class/wallets/types';
+
+enum WidgetCommunicationKeys {
+  AllWalletsSatoshiBalance = 'WidgetCommunicationAllWalletsSatoshiBalance',
+  AllWalletsLatestTransactionTime = 'WidgetCommunicationAllWalletsLatestTransactionTime',
+  DisplayBalanceAllowed = 'WidgetCommunicationDisplayBalanceAllowed',
+  LatestTransactionIsUnconfirmed = 'WidgetCommunicationLatestTransactionIsUnconfirmed',
+}
+
+export const reloadAllTimelines = (): void => {
+  RNWidgetCenter.reloadAllTimelines();
+};
+
+export const isBalanceDisplayAllowed = async (): Promise<boolean> => {
+  try {
+    const displayBalance = await DefaultPreference.get(WidgetCommunicationKeys.DisplayBalanceAllowed);
+    return displayBalance === '1';
+  } catch {
+    return false;
+  }
+};
+
+export const setBalanceDisplayAllowed = async (value: boolean): Promise<void> => {
+  if (value) {
+    await DefaultPreference.set(WidgetCommunicationKeys.DisplayBalanceAllowed, '1');
+  } else {
+    await DefaultPreference.clear(WidgetCommunicationKeys.DisplayBalanceAllowed);
+  }
+  reloadAllTimelines();
+};
+
+const WidgetCommunication: React.FC = () => {
+  const { wallets, walletsInitialized } = useContext(BlueStorageContext);
+
+  useEffect(() => {
+    const allWalletsBalanceAndTransactionTime = async (): Promise<{
+      allWalletsBalance: number;
+      latestTransactionTime: number | string;
+    }> => {
+      if (!walletsInitialized || !(await isBalanceDisplayAllowed())) {
+        return { allWalletsBalance: 0, latestTransactionTime: 0 };
+      } else {
+        let balance = 0;
+        let latestTransactionTime: number | string = 0;
+        wallets.forEach((wallet: TWallet) => {
+          if (wallet.hideBalance) return;
+          balance += wallet.getBalance();
+          const walletLatestTime = wallet.getLatestTransactionTimeEpoch();
+
+          if (typeof latestTransactionTime === 'number' && walletLatestTime > latestTransactionTime) {
+            latestTransactionTime =
+              wallet.getTransactions()[0]?.confirmations === 0 ? WidgetCommunicationKeys.LatestTransactionIsUnconfirmed : walletLatestTime;
+          }
+        });
+        return { allWalletsBalance: balance, latestTransactionTime };
+      }
+    };
+
+    const setValues = async (): Promise<void> => {
+      await DefaultPreference.setName('group.io.bluewallet.bluewallet');
+      const { allWalletsBalance, latestTransactionTime } = await allWalletsBalanceAndTransactionTime();
+      await DefaultPreference.set(WidgetCommunicationKeys.AllWalletsSatoshiBalance, String(allWalletsBalance));
+      await DefaultPreference.set(WidgetCommunicationKeys.AllWalletsLatestTransactionTime, String(latestTransactionTime));
+      reloadAllTimelines();
+    };
+
+    if (walletsInitialized) {
+      setValues();
+    }
+  }, [wallets, walletsInitialized]);
+
+  return null;
+};
+
+export default WidgetCommunication;

components/WidgetCommunication.tsx

@@ -0,0 +1,15 @@
+import React from 'react';
+
+export const isBalanceDisplayAllowed = async (): Promise<boolean> => {
+  return true;
+};
+
+export const setBalanceDisplayAllowed = async (value: boolean): Promise<void> => {};
+
+export const reloadAllTimelines = (): void => {};
+
+const WidgetCommunication: React.FC = () => {
+  return null; // This component does not render anything.
+};
+
+export default WidgetCommunication;

ios/WalletInformationWidget/WalletInformationWidget.swift

@@ -104,7 +104,7 @@ struct WalletInformationWidget: Widget {
 
 struct WalletInformationWidget_Previews: PreviewProvider {
   static var previews: some View {
-    WalletInformationWidgetEntryView(entry: WalletInformationWidgetEntry(date: Date(), marketData: MarketData(nextBlock: "26", sats: "9 134", price: "$10,000", rate: Double(0)), allWalletsBalance: WalletData(balance: 10000, latestTransactionTime: LatestTransaction(isUnconfirmed: false, epochValue: 1568804029000))))
+    WalletInformationWidgetEntryView(entry: WalletInformationWidgetEntry(date: Date(), marketData: MarketData(nextBlock: "26", sats: "9 134", price: "$10,000", rate: Double(0)), allWalletsBalance: WalletData(balance: 0, latestTransactionTime: LatestTransaction(isUnconfirmed: nil, epochValue: nil))))
       .previewContext(WidgetPreviewContext(family: .systemSmall))
   }
 }

screen/settings/SettingsPrivacy.js

@@ -8,7 +8,7 @@ import loc from '../../loc';
 import DeviceQuickActions from '../../class/quick-actions';
 import BlueClipboard from '../../blue_modules/clipboard';
 import { BlueStorageContext } from '../../blue_modules/storage-context';
-import WidgetCommunication from '../../blue_modules/WidgetCommunication';
+import { isBalanceDisplayAllowed, setBalanceDisplayAllowed } from '../../components/WidgetCommunication';
 import { useTheme } from '../../components/themes';
 import ListItem from '../../components/ListItem';
 import A from '../../blue_modules/analytics';
@@ -38,7 +38,7 @@ const SettingsPrivacy = () => {
         setIsReadClipboardAllowed(await BlueClipboard().isReadClipboardAllowed());
         setStorageIsEncrypted(await isStorageEncrypted());
         setIsQuickActionsEnabled(await DeviceQuickActions.getEnabled());
-        setIsDisplayWidgetBalanceAllowed(await WidgetCommunication.isBalanceDisplayAllowed());
+        setIsDisplayWidgetBalanceAllowed(await isBalanceDisplayAllowed());
       } catch (e) {
         console.log(e);
       }
@@ -84,7 +84,7 @@ const SettingsPrivacy = () => {
   const onWidgetsTotalBalanceValueChange = async value => {
     setIsLoading(sections.WIDGETS);
     try {
-      await WidgetCommunication.setBalanceDisplayAllowed(value);
+      await setBalanceDisplayAllowed(value);
       setIsDisplayWidgetBalanceAllowed(value);
     } catch (e) {
       console.log(e);

screen/settings/electrumSettings.js

@@ -29,7 +29,7 @@ import {
   BlueDismissKeyboardInputAccessory,
 } from '../../BlueComponents';
 import { BlueCurrentTheme } from '../../components/themes';
-import WidgetCommunication from '../../blue_modules/WidgetCommunication';
+import { reloadAllTimelines } from '../../components/WidgetCommunication';
 import { BlueStorageContext } from '../../blue_modules/storage-context';
 import presentAlert from '../../components/Alert';
 import { requestCameraAuthorization } from '../../helpers/scan-qr';
@@ -170,7 +170,7 @@ export default class ElectrumSettings extends Component {
             await DefaultPreference.clear(BlueElectrum.ELECTRUM_HOST);
             await DefaultPreference.clear(BlueElectrum.ELECTRUM_SSL_PORT);
             await DefaultPreference.clear(BlueElectrum.ELECTRUM_TCP_PORT);
-            WidgetCommunication.reloadAllTimelines();
+            reloadAllTimelines();
           } catch (e) {
             // Must be running on Android
             console.log(e);
@@ -199,7 +199,7 @@ export default class ElectrumSettings extends Component {
             await DefaultPreference.set(BlueElectrum.ELECTRUM_HOST, host);
             await DefaultPreference.set(BlueElectrum.ELECTRUM_TCP_PORT, port);
             await DefaultPreference.set(BlueElectrum.ELECTRUM_SSL_PORT, sslPort);
-            WidgetCommunication.reloadAllTimelines();
+            reloadAllTimelines();
           } catch (e) {
             // Must be running on Android
             console.log(e);

tests/setup.js

@@ -187,7 +187,7 @@ jest.mock('react-native-share', () => {
   };
 });
 
-jest.mock('../blue_modules/WidgetCommunication', () => {
+jest.mock('../components/WidgetCommunication', () => {
   return {
     reloadAllTimelines: jest.fn(),
   };