fix: async beignet wallet

Author: limpbrains

package.json

@@ -63,7 +63,7 @@
     "@synonymdev/slashtags-widget-price-feed": "1.1.0",
     "@synonymdev/web-relay": "1.0.7",
     "bech32": "2.0.0",
-    "beignet": "0.0.46",
+    "beignet": "0.0.47",
     "bip21": "2.0.3",
     "bip32": "4.0.0",
     "bip39": "3.1.0",

src/AppOnboarded.tsx

@@ -7,7 +7,7 @@ import RootNavigator from './navigation/root/RootNavigator';
 import InactivityTracker from './components/InactivityTracker';
 import { showToast } from './utils/notifications';
 import { startWalletServices } from './utils/startup';
-import { getOnChainWalletElectrum } from './utils/wallet';
+import { getOnChainWalletElectrumAsync } from './utils/wallet';
 import { unsubscribeFromLightningSubscriptions } from './utils/lightning';
 import { useAppSelector } from './hooks/redux';
 import { dispatch } from './store/helpers';
@@ -25,8 +25,6 @@ import {
 import { updateSettings } from './store/slices/settings';
 // import { updateExchangeRates } from './store/actions/wallet';
 
-const electrum = getOnChainWalletElectrum();
-
 const AppOnboarded = (): ReactElement => {
 	const { t } = useTranslation('other');
 	const appState = useRef(AppState.currentState);
@@ -59,22 +57,23 @@ const AppOnboarded = (): ReactElement => {
 		// on AppState change
 		const appStateSubscription = AppState.addEventListener(
 			'change',
-			(nextAppState) => {
+			async (nextAppState) => {
+				const electrum = await getOnChainWalletElectrumAsync();
 				// on App to foreground
 				if (
 					appState.current.match(/inactive|background/) &&
 					nextAppState === 'active'
 				) {
 					// resubscribe to electrum connection changes
-					electrum?.startConnectionPolling();
+					electrum.startConnectionPolling();
 				}
 
 				// on App to background
 				if (
 					appState.current.match(/active|inactive/) &&
 					nextAppState === 'background'
 				) {
-					electrum?.stopConnectionPolling();
+					electrum.stopConnectionPolling();
 				}
 
 				appState.current = nextAppState;

src/hooks/wallet.ts

@@ -1,3 +1,5 @@
+import { Wallet as TWallet } from 'beignet';
+import { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 
 import { useAppDispatch, useAppSelector } from '../hooks/redux';
@@ -9,6 +11,7 @@ import { ignoreSwitchUnitToast } from '../store/slices/user';
 import { EUnit } from '../store/types/wallet';
 import i18n from '../utils/i18n';
 import { showToast } from '../utils/notifications';
+import { getOnChainWalletAsync } from '../utils/wallet';
 import { useCurrency } from './displayValues';
 
 /**
@@ -63,3 +66,23 @@ export const useSwitchUnitAnnounced = (): (() => void) => {
 
 	return switchUnitAnnounced;
 };
+
+/**
+ * Wait for the onchain wallet to be loaded.
+ */
+export const useOnchainWallet = (): { wallet: TWallet | null } => {
+	const [wallet, setWallet] = useState<TWallet | null>(null);
+
+	useEffect(() => {
+		const getWallet = async (): Promise<void> => {
+			const w = await getOnChainWalletAsync();
+			setWallet(w);
+		};
+
+		getWallet();
+	}, []);
+
+	return {
+		wallet,
+	};
+};

src/screens/Activity/ActivityDetail.tsx

@@ -95,7 +95,7 @@ import type {
 	RootStackScreenProps,
 } from '../../navigation/types';
 import { i18nTime } from '../../utils/i18n';
-import { useSwitchUnit } from '../../hooks/wallet';
+import { useOnchainWallet, useSwitchUnit } from '../../hooks/wallet';
 import { contactsSelector } from '../../store/reselect/slashtags';
 import { ETransferStatus } from '../../store/types/wallet';
 
@@ -157,6 +157,7 @@ const OnchainActivityDetail = ({
 	const isSend = txType === EPaymentType.sent;
 	const total = isSend ? fee + value : value;
 
+	const { wallet } = useOnchainWallet();
 	const { t } = useTranslation('wallet');
 	const { t: tTime } = useTranslation('intl', { i18n: i18nTime });
 	const switchUnit = useSwitchUnit();
@@ -210,17 +211,21 @@ const OnchainActivityDetail = ({
 	}, [confirmed, isBoosted, txId]);
 
 	const boostedParents = useMemo(() => {
+		if (!wallet) {
+			return [];
+		}
 		return getBoostedTransactionParents({
+			wallet,
 			txId,
 			boostedTransactions,
 		});
-	}, [boostedTransactions, txId]);
+	}, [boostedTransactions, txId, wallet]);
 
 	const hasBoostedParents = useMemo(() => {
 		return boostedParents.length > 0;
 	}, [boostedParents.length]);
 
-	const handleBoostParentPress = (parentTxId): void => {
+	const handleBoostParentPress = (parentTxId: string): void => {
 		const activityItem = activityItems.find((i) => {
 			return i.activityType === EActivityType.onchain && i.txId === parentTxId;
 		});
@@ -301,6 +306,10 @@ const OnchainActivityDetail = ({
 		return <View />;
 	}, [txDetails]);
 
+	if (!wallet) {
+		return <ActivityIndicator />;
+	}
+
 	let fees = fee;
 	let paymentAmount = value;
 	let status = (

src/screens/Settings/GapLimit/index.tsx

@@ -12,7 +12,7 @@ import { gapLimitOptionsSelector } from '../../../store/reselect/wallet';
 import { ScrollView, TextInput, View } from '../../../styles/components';
 import { Caption13Up } from '../../../styles/text';
 import { showToast } from '../../../utils/notifications';
-import { getOnChainWallet, refreshWallet } from '../../../utils/wallet';
+import { getOnChainWalletAsync, refreshWallet } from '../../../utils/wallet';
 
 const GapLimit = ({}: SettingsScreenProps<'GapLimit'>): ReactElement => {
 	const { t } = useTranslation('settings');
@@ -68,7 +68,7 @@ const GapLimit = ({}: SettingsScreenProps<'GapLimit'>): ReactElement => {
 
 	const saveGapLimit = async (): Promise<void> => {
 		setLoading(true);
-		const wallet = getOnChainWallet();
+		const wallet = await getOnChainWalletAsync();
 		const res = wallet.updateGapLimit({
 			lookAhead: Number(lookAhead),
 			lookBehind: Number(lookBehind),

src/store/actions/wallet.ts

@@ -25,11 +25,12 @@ import {
 	createDefaultWallet,
 	getCurrentWallet,
 	getOnChainWallet,
+	getOnChainWalletAsync,
 	getOnChainWalletTransaction,
+	getOnChainWalletTransactionAsync,
 	getSelectedNetwork,
 	getSelectedWallet,
 	refreshWallet,
-	waitForWallet,
 } from '../../utils/wallet';
 import {
 	dispatch,
@@ -125,7 +126,7 @@ export const generateNewReceiveAddress = async ({
 	keyDerivationPath?: IKeyDerivationPath;
 }): Promise<Result<IAddress>> => {
 	try {
-		const wallet = getOnChainWallet();
+		const wallet = await getOnChainWalletAsync();
 		return wallet.generateNewReceiveAddress({ addressType, keyDerivationPath });
 	} catch (e) {
 		console.log(e);
@@ -138,22 +139,22 @@ export const generateNewReceiveAddress = async ({
  * @returns {Promise<string>}
  */
 export const clearUtxos = async (): Promise<string> => {
-	const wallet = getOnChainWallet();
+	const wallet = await getOnChainWalletAsync();
 	return await wallet.clearUtxos();
 };
 
-export const updateWalletBalance = ({
-	balance,
-}: {
-	balance: number;
-}): Result<string> => {
-	try {
-		const wallet = getOnChainWallet();
-		return wallet.updateWalletBalance({ balance });
-	} catch (e) {
-		return err(e);
-	}
-};
+// export const updateWalletBalance = ({
+// 	balance,
+// }: {
+// 	balance: number;
+// }): Result<string> => {
+// 	try {
+// 		const wallet = getOnChainWalletAsync();
+// 		return wallet.updateWalletBalance({ balance });
+// 	} catch (e) {
+// 		return err(e);
+// 	}
+// };
 
 /**
  * Parses and adds unconfirmed transactions to the store.
@@ -216,7 +217,7 @@ export const injectFakeTransaction = (
 // 	scanAllAddresses?: boolean;
 // 	replaceStoredTransactions?: boolean;
 // }): Promise<Result<string | undefined>> => {
-// 	const wallet = getOnChainWallet();
+// 	const wallet = async getOnChainWalletAsync();
 // 	return await wallet.updateTransactions({
 // 		scanAllAddresses,
 // 		replaceStoredTransactions,
@@ -233,7 +234,7 @@ export const deleteOnChainTransactionById = async ({
 }: {
 	txid: string;
 }): Promise<void> => {
-	const wallet = getOnChainWallet();
+	const wallet = await getOnChainWalletAsync();
 	return await wallet.deleteOnChainTransactionById({ txid });
 };
 
@@ -255,7 +256,7 @@ export const addBoostedTransaction = async ({
 	type?: EBoostType;
 	fee: number;
 }): Promise<Result<IBoostedTransaction>> => {
-	const wallet = getOnChainWallet();
+	const wallet = await getOnChainWalletAsync();
 	return await wallet.addBoostedTransaction({
 		newTxId,
 		oldTxId,
@@ -290,7 +291,7 @@ export const setupOnChainTransaction = async ({
 	outputs?: IOutput[]; // Used to pre-specify outputs to use.
 } = {}): Promise<TSetupTransactionResponse> => {
 	rbf = rbf ?? getSettingsStore().rbf;
-	const transaction = getOnChainWalletTransaction();
+	const transaction = await getOnChainWalletTransactionAsync();
 	return await transaction.setupTransaction({
 		inputTxHashes,
 		utxos,
@@ -310,7 +311,7 @@ export const getChangeAddress = async ({
 }: {
 	addressType?: EAddressType;
 }): Promise<Result<IAddress>> => {
-	const wallet = getOnChainWallet();
+	const wallet = await getOnChainWalletAsync();
 	return await wallet.getChangeAddress(addressType);
 };
 
@@ -331,8 +332,7 @@ export const updateSendTransaction = (
  * @returns {Result<string>}
  */
 export const resetSendTransaction = async (): Promise<Result<string>> => {
-	await waitForWallet();
-	const transaction = getOnChainWalletTransaction();
+	const transaction = await getOnChainWalletTransactionAsync();
 	return transaction.resetSendTransaction();
 };
 
@@ -341,7 +341,7 @@ export const updateSelectedAddressType = async ({
 }: {
 	addressType: EAddressType;
 }): Promise<void> => {
-	const wallet = getOnChainWallet();
+	const wallet = await getOnChainWalletAsync();
 	const addressTypesToMonitor = wallet.addressTypesToMonitor;
 	if (!addressTypesToMonitor.includes(addressType)) {
 		// Append the new address type so we monitor it in subsequent sessions.

src/store/utils/activity.ts

@@ -101,7 +101,7 @@ export const updateOnChainActivityList = async (): Promise<Result<string>> => {
 	});
 	const activityItems = await Promise.all(promises);
 
-	const boostFormattedItems = formatBoostedActivityItems({
+	const boostFormattedItems = await formatBoostedActivityItems({
 		items: activityItems,
 		boostedTransactions,
 		selectedWallet,

src/store/utils/fees.ts

@@ -4,7 +4,7 @@ import { dispatch, getFeesStore } from '../helpers';
 import { updateOnchainFees } from '../slices/fees';
 import { getFeeEstimates } from '../../utils/wallet/transactions';
 import { EAvailableNetwork } from '../../utils/networks';
-import { getOnChainWallet, getSelectedNetwork } from '../../utils/wallet';
+import { getOnChainWalletAsync, getSelectedNetwork } from '../../utils/wallet';
 import { IOnchainFees } from 'beignet';
 
 export const REFRESH_INTERVAL = 60 * 30; // in seconds, 30 minutes
@@ -46,6 +46,6 @@ export const refreshOnchainFeeEstimates = async ({
 }: {
 	forceUpdate?: boolean;
 }): Promise<Result<IOnchainFees>> => {
-	const wallet = getOnChainWallet();
+	const wallet = await getOnChainWalletAsync();
 	return await wallet.updateFeeEstimates(forceUpdate);
 };