@dynamic-labs/sdk-react-core 4.80.0 → 4.82.0

package/src/lib/utils/hooks/useAleoShieldedBalances/useAleoShieldedBalances.js

@@ -0,0 +1,439 @@
+'use client'
+import { __awaiter } from '../../../../../_virtual/_tslib.js';
+import { useState, useRef, useCallback, useEffect } from 'react';
+import { ChainEnum } from '@dynamic-labs/sdk-api-core';
+import '../../../context/DynamicContext/DynamicContext.js';
+import '../../../store/state/loadingAndLifecycle/loadingAndLifecycle.js';
+import '@dynamic-labs/iconic';
+import '@dynamic-labs/wallet-connector-core';
+import 'react/jsx-runtime';
+import '../../../context/ViewContext/ViewContext.js';
+import '../../../shared/logger.js';
+import '@dynamic-labs/wallet-book';
+import '@dynamic-labs/utils';
+import '../../constants/colors.js';
+import '../../constants/values.js';
+import '../../../shared/consts/index.js';
+import '../../../events/dynamicEvents.js';
+import '../../../context/CaptchaContext/CaptchaContext.js';
+import '../../../context/ErrorContext/ErrorContext.js';
+import '@dynamic-labs/multi-wallet';
+import 'react-international-phone';
+import '../../../store/state/nonce/nonce.js';
+import '@dynamic-labs-sdk/client/core';
+import 'eventemitter3';
+import '@dynamic-labs-sdk/client';
+import '../../../config/ApiEndpoint.js';
+import '@dynamic-labs/locale';
+import { getEnvironmentId } from '../../../store/state/dynamicContextProps/dynamicContextProps.js';
+import '../../../store/state/primaryWalletId/primaryWalletId.js';
+import '../../../store/state/connectedWalletsInfo/connectedWalletsInfo.js';
+import '../../functions/getWaasAddressTypeLabel/getWaasAddressTypeLabel.js';
+import '../../../context/AccessDeniedContext/AccessDeniedContext.js';
+import '../../../context/AccountExistsContext/AccountExistsContext.js';
+import '../../../context/UserWalletsContext/UserWalletsContext.js';
+import '../../../store/state/authMode/authMode.js';
+import '../../../context/VerificationContext/VerificationContext.js';
+import 'react-dom';
+import '../../functions/compareChains/compareChains.js';
+import '../../../views/Passkey/utils/findPrimaryEmbeddedChain/findPrimaryEmbeddedChain.js';
+import '../../../context/ThemeContext/ThemeContext.js';
+import '../useUserUpdateRequest/useUpdateUser/userFieldsSchema.js';
+import 'bs58';
+import '@dynamic-labs/types';
+import '../../../context/SocialRedirectContext/SocialRedirectContext.js';
+import '../../../context/LoadingContext/LoadingContext.js';
+import '../../../context/WalletContext/WalletContext.js';
+import '../useEmbeddedWallet/useSecureEnclaveEmbeddedWallet/constants.js';
+import 'yup';
+import '../../../context/MockContext/MockContext.js';
+import '../../../views/CollectUserDataView/useFields.js';
+import '../../../context/FieldsStateContext/FieldsStateContext.js';
+import '../../../context/UserFieldEditorContext/UserFieldEditorContext.js';
+import '@dynamic-labs/rpc-providers';
+import '../../../store/state/walletOptions/walletOptions.js';
+import 'react-i18next';
+import '../../../components/Accordion/components/AccordionItem/AccordionItem.js';
+import '../../../components/Alert/Alert.js';
+import '../../../components/ShadowDOM/ShadowDOM.js';
+import '../../../components/IconButton/IconButton.js';
+import '../../../components/InlineWidget/InlineWidget.js';
+import '../../../components/Input/Input.js';
+import '../../../components/IsBrowser/IsBrowser.js';
+import '../../../components/MenuList/Dropdown/Dropdown.js';
+import '../../../components/OverlayCard/OverlayCard.js';
+import '../../../components/Transition/ZoomTransition/ZoomTransition.js';
+import '../../../components/Transition/SlideInUpTransition/SlideInUpTransition.js';
+import '../../../components/Transition/OpacityTransition/OpacityTransition.js';
+import '../../../components/PasskeyCreatedSuccessBanner/PasskeyCreatedSuccessBanner.js';
+import '../../../components/Popper/Popper/Popper.js';
+import '../../../components/Popper/PopperContext/PopperContext.js';
+import 'react-focus-lock';
+import 'qrcode';
+import 'formik';
+import '../useSubdomainCheck/useSubdomainCheck.js';
+import '../../../context/WalletGroupContext/WalletGroupContext.js';
+import '../../../widgets/DynamicWidget/context/DynamicWidgetContext.js';
+import '../useGetMfaToken/useGetMfaToken.js';
+import '../useWalletBackup/useWalletBackup.js';
+import '../useWalletBackup/types.js';
+import '../useWalletBackup/cloudProviders.js';
+import '../../../context/IpConfigurationContext/IpConfigurationContext.js';
+import '../../../context/ConnectWithOtpContext/ConnectWithOtpContext.js';
+import '../../../widgets/DynamicBridgeWidget/views/WalletsView/components/SecondaryWallets/SecondaryWallets.js';
+import '@hcaptcha/react-hcaptcha';
+import '../../../widgets/DynamicWidget/helpers/convertExchangeKeyAndProviderEnum.js';
+import '../../../views/ExchangeWhitelistWarning/ExchangeWhitelistWarning.js';
+import '../../../context/ErrorContext/hooks/useErrorText/useErrorText.js';
+import '../../../context/FooterAnimationContext/index.js';
+import '../../../views/MfaChooseDeviceView/useGetMfaOptions/useGetMfaOptions.js';
+import '../../../context/PasskeyContext/PasskeyContext.js';
+import '../../../context/OnrampContext/OnrampContext.js';
+import '../../../store/state/sendBalances.js';
+import '../../../store/state/connectorsInitializing/connectorsInitializing.js';
+import '../../../components/OverlayCardBase/OverlayCardTarget/OverlayCardTarget.js';
+import '../../../widgets/DynamicWidget/components/DynamicWidgetHeader/DynamicWidgetHeader.js';
+import '../../../views/TransactionConfirmationView/TransactionConfirmationView.js';
+import '../../../widgets/DynamicWidget/components/PasskeyCard/PasskeyCard.js';
+import '../../../widgets/DynamicWidget/views/CryptoComOnramp/CryptoComOnramp.js';
+import '../../../../index.js';
+import '../../../widgets/DynamicWidget/views/ManagePasskeysMfaWidgetView/ManagePasskeysMfaWidgetView.js';
+import '../../../widgets/DynamicWidget/views/ManageTotpMfaWidgetView/ManageTotpMfaWidgetView.js';
+import '../../../widgets/DynamicWidget/views/ReceiveWalletFunds/ReceiveWalletFunds.js';
+import '../../../store/state/tokenBalances.js';
+import '../../../store/state/multichainBalances.js';
+import '@dynamic-labs/store';
+import '../../../shared/utils/functions/getInitialUrl/getInitialUrl.js';
+import { useInternalDynamicContext } from '../../../context/DynamicContext/useDynamicContext/useInternalDynamicContext/useInternalDynamicContext.js';
+import { getAleoCuratedPrices } from '../../../data/api/aleo/getAleoCuratedPrices.js';
+
+const MICROCREDITS_PER_CREDIT = 1000000;
+const ALEO_CREDITS_LOGO = 'https://app.dynamic.xyz/assets/networks/aleo.svg';
+// Generic dark "?" token icon — matches redcoast's `DEFAULT_TOKEN_LOGO_URI`
+//  used by the multichain endpoint when an unshielded token has no curated
+//  logo. Reusing it here keeps the Shielded tab visually consistent with
+//  the Unshielded tab for the same token.
+const UNKNOWN_TOKEN_LOGO = 'https://app.dynamic.xyz/assets/tokens/unknown.svg';
+const TOKEN_REGISTRY_PROGRAM = 'token_registry.aleo';
+const TOKEN_REGISTRY_RECORD = 'Token';
+// Non-credits tokens deliberately omit `logoURI` — Aleo doesn't have a
+//  curated icon list yet, so leaving it undefined surfaces the widget's
+//  generic placeholder (`?` skeleton) consistent with the unshielded feed.
+const KNOWN_SHIELDED_TOKENS = [
+    {
+        contractAddress: 'usad_stablecoin.aleo',
+        decimals: 6,
+        name: 'USAD',
+        programName: 'usad_stablecoin.aleo',
+        recordName: 'Token',
+        symbol: 'USAD',
+    },
+    {
+        contractAddress: 'test_usad_stablecoin.aleo',
+        decimals: 6,
+        name: 'USAD',
+        programName: 'test_usad_stablecoin.aleo',
+        recordName: 'Token',
+        symbol: 'USAD',
+    },
+    {
+        contractAddress: 'usdcx_stablecoin.aleo',
+        decimals: 6,
+        name: 'USDCx',
+        programName: 'usdcx_stablecoin.aleo',
+        recordName: 'Token',
+        symbol: 'USDCx',
+    },
+    {
+        contractAddress: 'test_usdcx_stablecoin.aleo',
+        decimals: 6,
+        name: 'USDCx',
+        programName: 'test_usdcx_stablecoin.aleo',
+        recordName: 'Token',
+        symbol: 'USDCx',
+    },
+    // ARC-21 (Hyperlane warp routes) — mainnet only. Token IDs match the
+    //  values pinned in `packages/aleo/src/utils/aleoSendableTokens` and the
+    //  redcoast `aleoArc21Tokens` registry. Decimals match each token's
+    //  `token_info` metadata on-chain.
+    {
+        contractAddress: 'hyp_warp_token_sol.aleo',
+        decimals: 9,
+        name: 'Wrapped SOL',
+        programName: TOKEN_REGISTRY_PROGRAM,
+        recordName: TOKEN_REGISTRY_RECORD,
+        symbol: 'wSOL',
+        tokenId: '2045969100091121326225168054634646230244820821909676777152465722877810201564field',
+    },
+    {
+        contractAddress: 'hyp_warp_token_eth.aleo',
+        decimals: 18,
+        name: 'Wrapped ETH',
+        programName: TOKEN_REGISTRY_PROGRAM,
+        recordName: TOKEN_REGISTRY_RECORD,
+        symbol: 'wETH',
+        tokenId: '8189585964265444162798552221009403350643900573290534096996249214099143169251field',
+    },
+    {
+        contractAddress: 'hyp_warp_token_wbtc.aleo',
+        decimals: 8,
+        name: 'Wrapped BTC',
+        programName: TOKEN_REGISTRY_PROGRAM,
+        recordName: TOKEN_REGISTRY_RECORD,
+        symbol: 'wBTC',
+        tokenId: '3491859903473482085250871387962132231204352466326026409883548131580582527809field',
+    },
+    {
+        contractAddress: 'hyp_warp_token_usdt.aleo',
+        decimals: 6,
+        name: 'Tether USD',
+        programName: TOKEN_REGISTRY_PROGRAM,
+        recordName: TOKEN_REGISTRY_RECORD,
+        symbol: 'USDT',
+        tokenId: '7881654794448182580124231856035865816599796419758925654292946277940935117913field',
+    },
+    {
+        contractAddress: 'hyp_warp_token_usdc.aleo',
+        decimals: 6,
+        name: 'USD Coin',
+        programName: TOKEN_REGISTRY_PROGRAM,
+        recordName: TOKEN_REGISTRY_RECORD,
+        symbol: 'USDC',
+        tokenId: '4697275201844475848710842677807162058146139844643350200269139278887318953049field',
+    },
+];
+/**
+ * Match a record to a shielded-token spec. Stablecoins match on
+ * (program, record); ARC-21 entries additionally require the spec's
+ * `tokenId` to appear inside `record_plaintext` (since every ARC-21 token
+ * shares `token_registry.aleo / Token`).
+ */
+const findTokenSpec = (record) => {
+    for (const spec of KNOWN_SHIELDED_TOKENS) {
+        if (record.program_name !== spec.programName)
+            continue;
+        if (record.record_name !== spec.recordName)
+            continue;
+        if (spec.tokenId) {
+            if (typeof record.record_plaintext !== 'string' ||
+                !record.record_plaintext.includes(`token_id: ${spec.tokenId}`)) {
+                continue;
+            }
+        }
+        return spec;
+    }
+    return undefined;
+};
+/**
+ * Coerces the widget-context `network` value into an Aleo network id
+ * (`0 = mainnet`, `1 = testnet`) and the matching param string for the
+ * `/waas/aleo/prices` endpoint. Pulled out of the callback to flatten
+ * cognitive complexity AND to avoid a SonarCloud-flagged nested
+ * ternary.
+ */
+const resolveAleoNetwork = (networkKey) => {
+    const numeric = Number(networkKey);
+    const safeNetworkId = Number.isFinite(numeric) ? numeric : undefined;
+    if (safeNetworkId === 0)
+        return { aleoNetworkParam: 'mainnet', safeNetworkId };
+    if (safeNetworkId === 1)
+        return { aleoNetworkParam: 'testnet', safeNetworkId };
+    return { aleoNetworkParam: undefined, safeNetworkId };
+};
+/**
+ * Build a `(address, isNative) → price` lookup from the curated-prices
+ * endpoint response. The key shape matches the multichain balance feed
+ * (native ALEO at `'0x0' + isNative=true`, every other token at its
+ * program id + `isNative=false`) so the join is a straight read.
+ */
+const buildPriceLookup = (priceList) => {
+    const priceByKey = new Map();
+    for (const entry of priceList) {
+        priceByKey.set(`${entry.address}|${entry.isNative ? 1 : 0}`, entry.price);
+    }
+    return (address, isNative) => { var _a; return (_a = priceByKey.get(`${address}|${isNative ? 1 : 0}`)) !== null && _a !== void 0 ? _a : null; };
+};
+/**
+ * Aggregate `credits.aleo / credits` records into the native ALEO
+ * `TokenBalance`. Returns `undefined` when the wallet owns no credits
+ * records so the caller can omit the row entirely.
+ */
+const buildCreditsBalance = (records, networkId, priceFor) => {
+    const creditsRecords = records.filter((r) => (r === null || r === void 0 ? void 0 : r.program_name) === 'credits.aleo' &&
+        (r === null || r === void 0 ? void 0 : r.record_name) === 'credits' &&
+        typeof (r === null || r === void 0 ? void 0 : r.microcredits) === 'string');
+    if (creditsRecords.length === 0)
+        return undefined;
+    const totalMicrocredits = creditsRecords.reduce((sum, r) => sum + BigInt(r.microcredits), BigInt(0));
+    // BigInt → number for the TokenBalance shape. Aleo balances stay well
+    // below Number.MAX_SAFE_INTEGER for a single wallet (max u64 supply is
+    // 1.5B credits = 1.5e15 microcredits; Number can hold up to ~9e15).
+    const rawBalance = Number(totalMicrocredits);
+    const balance = rawBalance / MICROCREDITS_PER_CREDIT;
+    const price = priceFor('0x0', true);
+    return {
+        address: '0x0',
+        balance,
+        decimals: 6,
+        isNative: true,
+        logoURI: ALEO_CREDITS_LOGO,
+        marketValue: price !== null ? balance * price : undefined,
+        name: 'Aleo Credits',
+        networkId,
+        price: price !== null ? price : undefined,
+        rawBalance,
+        symbol: 'ALEO',
+    };
+};
+/**
+ * Aggregate stablecoin + ARC-21 `Token` records by `(program, tokenId)`
+ * and emit one `TokenBalance` per matched spec. Records that don't
+ * match a curated spec, lack an `amount`, or have a malformed amount
+ * string are silently skipped.
+ */
+const buildTokenBalances = (records, networkId, priceFor) => {
+    var _a, _b;
+    const sumsByContract = new Map();
+    const specsByContract = new Map();
+    for (const r of records) {
+        const spec = findTokenSpec(r);
+        if (!spec || typeof r.amount !== 'string')
+            continue;
+        try {
+            const prev = (_a = sumsByContract.get(spec.contractAddress)) !== null && _a !== void 0 ? _a : BigInt(0);
+            sumsByContract.set(spec.contractAddress, prev + BigInt(r.amount));
+            specsByContract.set(spec.contractAddress, spec);
+        }
+        catch (_c) {
+            /* ignore — malformed amount string */
+        }
+    }
+    const out = [];
+    for (const [contractAddress, total] of sumsByContract.entries()) {
+        const spec = specsByContract.get(contractAddress);
+        if (!spec)
+            continue;
+        const rawBalance = Number(total);
+        const balance = rawBalance / Math.pow(10, spec.decimals);
+        const price = priceFor(spec.contractAddress, false);
+        out.push({
+            address: spec.contractAddress,
+            balance,
+            decimals: spec.decimals,
+            // Use redcoast's `DEFAULT_TOKEN_LOGO_URI` for stablecoins + ARC-21
+            //  so they render the same dark "?" icon the Unshielded tab shows
+            //  for these tokens (the multichain endpoint applies that fallback
+            //  itself; we mirror it here for visual parity).
+            logoURI: (_b = spec.logoURI) !== null && _b !== void 0 ? _b : UNKNOWN_TOKEN_LOGO,
+            marketValue: price !== null ? balance * price : undefined,
+            name: spec.name,
+            networkId,
+            price: price !== null ? price : undefined,
+            rawBalance,
+            symbol: spec.symbol,
+        });
+    }
+    return out;
+};
+/**
+ * Hook that returns the active wallet's shielded (private) Aleo token
+ * balances as a `TokenBalance[]` so the widget can render them through the
+ * same TokenBalanceList path it uses for unshielded balances.
+ *
+ * - Records come from the iframe via `connector.listOwnedRecords()` (the
+ *   Provable RecordScanner; view key never leaves the iframe).
+ * - Aggregates `credits.aleo/credits` (sum `microcredits` → ALEO) plus any
+ *   tier-3 stablecoin Token records (sum `amount` per program → USAD/USDCx).
+ *   ARC-21 multi-token grouped-by-`token_id` is Phase 2B.
+ *
+ * Returns an empty list when:
+ *   - The wallet isn't Aleo
+ *   - The connector doesn't expose `listOwnedRecords` (e.g. external Aleo wallet)
+ *   - The user owns no records that match a known program/record pair
+ */
+const useAleoShieldedBalances = () => {
+    const { primaryWallet, network } = useInternalDynamicContext();
+    const [tokenBalances, setTokenBalances] = useState([]);
+    const [isLoading, setIsLoading] = useState(false);
+    const [error, setError] = useState();
+    const connector = primaryWallet === null || primaryWallet === void 0 ? void 0 : primaryWallet.connector;
+    const isAleo = (connector === null || connector === void 0 ? void 0 : connector.connectedChain) === ChainEnum.Aleo;
+    const supportsShielded = isAleo &&
+        typeof (connector === null || connector === void 0 ? void 0 : connector.listOwnedRecords) === 'function';
+    // Mirror the live connector into a ref so `fetchShielded` can read it
+    //  without depending on the (often unstable) object reference. Some test
+    //  setups mock context with a factory that returns a fresh `primaryWallet`
+    //  every render — depending on that ref directly turned this into an
+    //  infinite render loop.
+    const connectorRef = useRef(connector);
+    connectorRef.current = connector;
+    const connectorKey = connector === null || connector === void 0 ? void 0 : connector.key;
+    const networkKey = network !== undefined && network !== null ? String(network) : undefined;
+    const fetchShielded = useCallback(() => __awaiter(void 0, void 0, void 0, function* () {
+        var _a;
+        const liveConnector = connectorRef.current;
+        if (!supportsShielded || !liveConnector) {
+            setTokenBalances((prev) => (prev.length === 0 ? prev : []));
+            return;
+        }
+        setIsLoading(true);
+        setError(undefined);
+        try {
+            // Fetch records and the curated-token price list in parallel. The
+            //  price list comes from the Aleo-only `/waas/aleo/prices` endpoint
+            //  (independent of balance) so the join works even when the user
+            //  holds a shielded token with zero unshielded balance — the
+            //  multichain `/accountBalances` endpoint would have stripped that
+            //  token row, leaving the widget with no price source. Prices are
+            //  best-effort: a failure leaves balances unpriced rather than
+            //  dropping the shielded list entirely.
+            const { safeNetworkId, aleoNetworkParam } = resolveAleoNetwork(networkKey);
+            const environmentId = getEnvironmentId();
+            const shouldFetchPrices = Boolean(aleoNetworkParam && environmentId);
+            const [result, priceList] = yield Promise.all([
+                liveConnector.listOwnedRecords(),
+                shouldFetchPrices && aleoNetworkParam
+                    ? getAleoCuratedPrices({
+                        environmentId,
+                        network: aleoNetworkParam,
+                    }).catch(() => [])
+                    : Promise.resolve([]),
+            ]);
+            const records = (_a = result === null || result === void 0 ? void 0 : result.records) !== null && _a !== void 0 ? _a : [];
+            const priceFor = buildPriceLookup(priceList);
+            const balances = [];
+            const credits = buildCreditsBalance(records, safeNetworkId, priceFor);
+            if (credits)
+                balances.push(credits);
+            balances.push(...buildTokenBalances(records, safeNetworkId, priceFor));
+            setTokenBalances(balances);
+        }
+        catch (err) {
+            const msg = err instanceof Error ? err.message : String(err);
+            setError(msg);
+            setTokenBalances((prev) => (prev.length === 0 ? prev : []));
+        }
+        finally {
+            setIsLoading(false);
+        }
+    }), [connectorKey, networkKey, supportsShielded]);
+    useEffect(() => {
+        if (!supportsShielded) {
+            setTokenBalances((prev) => (prev.length === 0 ? prev : []));
+            return;
+        }
+        fetchShielded().catch(() => {
+            // fetchShielded already records the error in component state;
+            //  the .catch keeps the fire-and-forget shape lint-clean.
+        });
+    }, [supportsShielded, fetchShielded]);
+    return {
+        error,
+        isLoading,
+        refetch: fetchShielded,
+        supportsShielded,
+        tokenBalances,
+    };
+};
+
+export { useAleoShieldedBalances };

package/src/lib/utils/hooks/useEmbeddedWallet/useEmbeddedWallet.cjs

@@ -119,6 +119,7 @@ var useInternalDynamicContext = require('../../../context/DynamicContext/useDyna
 
 // Hook exposed to customers and used internally to trigger embedded wallet creation
 /**
+ * @deprecated This hook is deprecated and will be removed in a future release. Use `useDynamicWaas` instead.
  * @returns {
  *  createEmbeddedWallet, - creates Dynamic embedded wallet according to the settings
  *  createOrRestoreSession, - creates or restores session for the embedded wallet

package/src/lib/utils/hooks/useEmbeddedWallet/useEmbeddedWallet.d.ts

@@ -1,6 +1,7 @@
 import { EmbeddedWalletChainEnum, EmbeddedWalletVersionEnum } from '@dynamic-labs/sdk-api-core';
 import { Wallet } from '../../../shared';
 /**
+ * @deprecated This hook is deprecated and will be removed in a future release. Use `useDynamicWaas` instead.
  * @returns {
  *  createEmbeddedWallet, - creates Dynamic embedded wallet according to the settings
  *  createOrRestoreSession, - creates or restores session for the embedded wallet

package/src/lib/utils/hooks/useEmbeddedWallet/useEmbeddedWallet.js

@@ -115,6 +115,7 @@ import { useInternalDynamicContext } from '../../../context/DynamicContext/useDy
 
 // Hook exposed to customers and used internally to trigger embedded wallet creation
 /**
+ * @deprecated This hook is deprecated and will be removed in a future release. Use `useDynamicWaas` instead.
  * @returns {
  *  createEmbeddedWallet, - creates Dynamic embedded wallet according to the settings
  *  createOrRestoreSession, - creates or restores session for the embedded wallet

package/src/lib/views/BackupUnsuccessfulView/BackupUnsuccessfulView.cjs

@@ -132,8 +132,19 @@ const BackupUnsuccessfulView = () => {
     const refreshPage = () => {
         window.location.reload();
     };
+    const onTryAgainClick = () => {
+        logger.logger.instrument('Wallet creation retry modal try again clicked', {
+            key: 'wallet_creation_retry_modal_try_again_clicked',
+            time: 0,
+        });
+        refreshPage();
+    };
     // force refresh on component unmount
     React.useEffect(() => {
+        logger.logger.instrument('Wallet creation retry modal shown', {
+            key: 'wallet_creation_retry_modal_shown',
+            time: 0,
+        });
         const timer = setTimeout(() => {
             isProperlyMounted.current = true;
         }, 100);
@@ -154,7 +165,7 @@ const BackupUnsuccessfulView = () => {
                                             transform: 'translate(-50%, -50%)',
                                         } })] })] }), jsxRuntime.jsx(Typography.Typography, { variant: 'body_normal', className: 'backup-message', color: 'primary', copykey: 'dyn_waas.backup_unsuccessful.description', children: t('dyn_waas.backup_unsuccessful.description') }), jsxRuntime.jsx("div", { className: classNames.classNames('button-group', {
                             'button-group--with-help-section': hasContactInfo,
-                        }), children: jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonClassName: 'retry-button', buttonVariant: 'brand-primary', type: 'submit', onClick: () => refreshPage(), copykey: 'dyn_waas.backup_unsuccessful.try_again', typographyProps: {
+                        }), children: jsxRuntime.jsx(TypographyButton.TypographyButton, { buttonClassName: 'retry-button', buttonVariant: 'brand-primary', type: 'submit', onClick: onTryAgainClick, copykey: 'dyn_waas.backup_unsuccessful.try_again', typographyProps: {
                                 color: 'inherit',
                             }, children: t('dyn_waas.backup_unsuccessful.try_again') }) }), jsxRuntime.jsx("div", { className: classNames.classNames('button-group', 'logout-group', {
                             'button-group--with-help-section': hasContactInfo,

package/src/lib/views/BackupUnsuccessfulView/BackupUnsuccessfulView.js

@@ -128,8 +128,19 @@ const BackupUnsuccessfulView = () => {
     const refreshPage = () => {
         window.location.reload();
     };
+    const onTryAgainClick = () => {
+        logger.instrument('Wallet creation retry modal try again clicked', {
+            key: 'wallet_creation_retry_modal_try_again_clicked',
+            time: 0,
+        });
+        refreshPage();
+    };
     // force refresh on component unmount
     useEffect(() => {
+        logger.instrument('Wallet creation retry modal shown', {
+            key: 'wallet_creation_retry_modal_shown',
+            time: 0,
+        });
         const timer = setTimeout(() => {
             isProperlyMounted.current = true;
         }, 100);
@@ -150,7 +161,7 @@ const BackupUnsuccessfulView = () => {
                                             transform: 'translate(-50%, -50%)',
                                         } })] })] }), jsx(Typography, { variant: 'body_normal', className: 'backup-message', color: 'primary', copykey: 'dyn_waas.backup_unsuccessful.description', children: t('dyn_waas.backup_unsuccessful.description') }), jsx("div", { className: classNames('button-group', {
                             'button-group--with-help-section': hasContactInfo,
-                        }), children: jsx(TypographyButton, { buttonClassName: 'retry-button', buttonVariant: 'brand-primary', type: 'submit', onClick: () => refreshPage(), copykey: 'dyn_waas.backup_unsuccessful.try_again', typographyProps: {
+                        }), children: jsx(TypographyButton, { buttonClassName: 'retry-button', buttonVariant: 'brand-primary', type: 'submit', onClick: onTryAgainClick, copykey: 'dyn_waas.backup_unsuccessful.try_again', typographyProps: {
                                 color: 'inherit',
                             }, children: t('dyn_waas.backup_unsuccessful.try_again') }) }), jsx("div", { className: classNames('button-group', 'logout-group', {
                             'button-group--with-help-section': hasContactInfo,

package/src/lib/views/SendBalanceView/SendBalanceView.cjs

@@ -183,6 +183,52 @@ const SendBalanceView = ({ initialRecipientAddress = '', initialValue, onClickBa
         if (orderedTokenBalances)
             setTokenBalances(orderedTokenBalances);
     }, [orderedTokenBalances]);
+    // Chain override: when the active IUITransaction provides
+    // `getSendableTokenBalances`, prefer that list for the picker. Used by
+    // chains where the spendable balance source diverges from
+    // `useTokenBalances` (e.g. Aleo Send always spends from private
+    // records, not the public-balance mapping redcoast returns). Chains
+    // that don't implement the method get the default fetcher unchanged.
+    //
+    // Also re-anchors `currentToken` to the matching entry in the override
+    // list. Without this, the picker's row renders the override balance
+    // (it reads from `tokenBalances`) but the form's "Available" line
+    // renders the original public balance (it reads from `currentToken`),
+    // which is stale.
+    React.useEffect(() => {
+        if (!(transaction === null || transaction === void 0 ? void 0 : transaction.getSendableTokenBalances))
+            return;
+        let cancelled = false;
+        transaction
+            .getSendableTokenBalances()
+            .then((overrideBalances) => {
+            if (cancelled)
+                return;
+            if (!overrideBalances || overrideBalances.length === 0)
+                return;
+            setTokenBalances(overrideBalances);
+            setCurrentToken((prev) => {
+                if (!prev)
+                    return overrideBalances[0];
+                const match = overrideBalances.find((t) => t.address === prev.address);
+                if (!match)
+                    return overrideBalances[0];
+                // Skip the swap if values are unchanged — avoids a re-render
+                // loop when transaction recreation re-fires this effect.
+                if (match.rawBalance === prev.rawBalance &&
+                    match.balance === prev.balance) {
+                    return prev;
+                }
+                return match;
+            });
+        })
+            .catch((err) => {
+            logger.logger.debug('[SendBalanceView] getSendableTokenBalances threw — falling back to default token list', err);
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [transaction]);
     React.useEffect(() => {
         if (!walletConnector)
             return;
@@ -201,6 +247,13 @@ const SendBalanceView = ({ initialRecipientAddress = '', initialValue, onClickBa
                 transaction.nonNativeValue = BigInt(0);
                 transaction.nonNativeDecimal = currentToken === null || currentToken === void 0 ? void 0 : currentToken.decimals;
             }
+            // Chain hook: tells the transaction which picker entry the user
+            // landed on (or just switched to). Aleo uses this to flip submit
+            // between credits / stablecoin / ARC-21 program signatures + to
+            // re-anchor decimals for parse/format.
+            if (currentToken && transaction.setSelectedToken) {
+                transaction.setSelectedToken(currentToken.address);
+            }
             setTransaction(transaction);
         })
             .catch((error) => {

package/src/lib/views/SendBalanceView/SendBalanceView.js

@@ -179,6 +179,52 @@ const SendBalanceView = ({ initialRecipientAddress = '', initialValue, onClickBa
         if (orderedTokenBalances)
             setTokenBalances(orderedTokenBalances);
     }, [orderedTokenBalances]);
+    // Chain override: when the active IUITransaction provides
+    // `getSendableTokenBalances`, prefer that list for the picker. Used by
+    // chains where the spendable balance source diverges from
+    // `useTokenBalances` (e.g. Aleo Send always spends from private
+    // records, not the public-balance mapping redcoast returns). Chains
+    // that don't implement the method get the default fetcher unchanged.
+    //
+    // Also re-anchors `currentToken` to the matching entry in the override
+    // list. Without this, the picker's row renders the override balance
+    // (it reads from `tokenBalances`) but the form's "Available" line
+    // renders the original public balance (it reads from `currentToken`),
+    // which is stale.
+    useEffect(() => {
+        if (!(transaction === null || transaction === void 0 ? void 0 : transaction.getSendableTokenBalances))
+            return;
+        let cancelled = false;
+        transaction
+            .getSendableTokenBalances()
+            .then((overrideBalances) => {
+            if (cancelled)
+                return;
+            if (!overrideBalances || overrideBalances.length === 0)
+                return;
+            setTokenBalances(overrideBalances);
+            setCurrentToken((prev) => {
+                if (!prev)
+                    return overrideBalances[0];
+                const match = overrideBalances.find((t) => t.address === prev.address);
+                if (!match)
+                    return overrideBalances[0];
+                // Skip the swap if values are unchanged — avoids a re-render
+                // loop when transaction recreation re-fires this effect.
+                if (match.rawBalance === prev.rawBalance &&
+                    match.balance === prev.balance) {
+                    return prev;
+                }
+                return match;
+            });
+        })
+            .catch((err) => {
+            logger.debug('[SendBalanceView] getSendableTokenBalances threw — falling back to default token list', err);
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [transaction]);
     useEffect(() => {
         if (!walletConnector)
             return;
@@ -197,6 +243,13 @@ const SendBalanceView = ({ initialRecipientAddress = '', initialValue, onClickBa
                 transaction.nonNativeValue = BigInt(0);
                 transaction.nonNativeDecimal = currentToken === null || currentToken === void 0 ? void 0 : currentToken.decimals;
             }
+            // Chain hook: tells the transaction which picker entry the user
+            // landed on (or just switched to). Aleo uses this to flip submit
+            // between credits / stablecoin / ARC-21 program signatures + to
+            // re-anchor decimals for parse/format.
+            if (currentToken && transaction.setSelectedToken) {
+                transaction.setSelectedToken(currentToken.address);
+            }
             setTransaction(transaction);
         })
             .catch((error) => {