@lifi/widget 4.4.0 → 4.6.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/esm/App.js.map +1 -1
- package/dist/esm/AppDrawer.js +2 -1
- package/dist/esm/AppDrawer.js.map +1 -1
- package/dist/esm/AppLayout.js.map +1 -1
- package/dist/esm/AppProvider.js.map +1 -1
- package/dist/esm/components/ActionRow/ActionRow.js.map +1 -1
- package/dist/esm/components/AmountInput/AmountInput.js +13 -7
- package/dist/esm/components/AmountInput/AmountInput.js.map +1 -1
- package/dist/esm/components/AmountInput/AmountInputEndAdornment.js +2 -13
- package/dist/esm/components/AmountInput/AmountInputEndAdornment.js.map +1 -1
- package/dist/esm/components/AmountInput/PriceFormHelperText.js.map +1 -1
- package/dist/esm/components/AmountInputCard/AmountInputCardPair.js.map +1 -1
- package/dist/esm/components/AmountInputCard/BalanceDisplay.js.map +1 -1
- package/dist/esm/components/AmountInputCard/FiatValueToggle.js.map +1 -1
- package/dist/esm/components/AmountInputCard/PercentageChips.js +2 -13
- package/dist/esm/components/AmountInputCard/PercentageChips.js.map +1 -1
- package/dist/esm/components/AmountInputCard/PercentageChips.style.js +1 -1
- package/dist/esm/components/AmountInputCard/PercentageChips.style.js.map +1 -1
- package/dist/esm/components/AmountInputCard/ReceiveAmountCard.js.map +1 -1
- package/dist/esm/components/AmountInputCard/SendAmountCard.js +13 -6
- package/dist/esm/components/AmountInputCard/SendAmountCard.js.map +1 -1
- package/dist/esm/components/AppContainer.js.map +1 -1
- package/dist/esm/components/Avatar/AccountAvatar.js.map +1 -1
- package/dist/esm/components/Avatar/Avatar.js.map +1 -1
- package/dist/esm/components/Avatar/ChainBadgeContent.js.map +1 -1
- package/dist/esm/components/Avatar/TokenAvatar.js.map +1 -1
- package/dist/esm/components/BaseTransactionButton/BaseTransactionButton.js.map +1 -1
- package/dist/esm/components/Card/CardButton.js.map +1 -1
- package/dist/esm/components/ChainSelect/ChainSelect.js.map +1 -1
- package/dist/esm/components/Chains/AllChainsAvatar.js +7 -1
- package/dist/esm/components/Chains/AllChainsAvatar.js.map +1 -1
- package/dist/esm/components/Chains/ChainList.js.map +1 -1
- package/dist/esm/components/Chains/ChainListItem.js.map +1 -1
- package/dist/esm/components/Chains/ChainsExpanded.js.map +1 -1
- package/dist/esm/components/Chains/PinChainButton.js.map +1 -1
- package/dist/esm/components/Chains/SelectChainExpansionContent.js.map +1 -1
- package/dist/esm/components/Chains/SelectChainPageContent.js.map +1 -1
- package/dist/esm/components/Chains/VirtualizedChainList.js.map +1 -1
- package/dist/esm/components/ContextMenu.js.map +1 -1
- package/dist/esm/components/ContractComponent/NFT/NFTBase.js.map +1 -1
- package/dist/esm/components/Dialog/Dialog.js +2 -1
- package/dist/esm/components/Dialog/Dialog.js.map +1 -1
- package/dist/esm/components/ExecutionStatusCard/ExecutionChecklist.js.map +1 -1
- package/dist/esm/components/ExecutionStatusCard/ExecutionStatusCard.js.map +1 -1
- package/dist/esm/components/ExecutionStatusCard/StaggeredRevealTypography.js.map +1 -1
- package/dist/esm/components/ExecutionStatusCard/StatusIcon.js.map +1 -1
- package/dist/esm/components/Expansion/Expansion.js +4 -3
- package/dist/esm/components/Expansion/Expansion.js.map +1 -1
- package/dist/esm/components/Expansion/ExpansionTransition.js.map +1 -1
- package/dist/esm/components/FeeBreakdownTooltip.js.map +1 -1
- package/dist/esm/components/Header/ActivitiesButton.js.map +1 -1
- package/dist/esm/components/Header/BackButton.js.map +1 -1
- package/dist/esm/components/Header/CloseDrawerButton.js.map +1 -1
- package/dist/esm/components/Header/DisconnectIconButton.js.map +1 -1
- package/dist/esm/components/Header/HeaderTabs.js.map +1 -1
- package/dist/esm/components/Header/NavigationHeader.js.map +1 -1
- package/dist/esm/components/Header/SettingsButton.js +2 -1
- package/dist/esm/components/Header/SettingsButton.js.map +1 -1
- package/dist/esm/components/Header/WalletHeader.js.map +1 -1
- package/dist/esm/components/Header/WalletMenu.js.map +1 -1
- package/dist/esm/components/IconCircle/IconCircle.js +2 -1
- package/dist/esm/components/IconCircle/IconCircle.js.map +1 -1
- package/dist/esm/components/LimitOrderSettings/LimitOrderSettings.js.map +1 -1
- package/dist/esm/components/LimitPriceCard/LimitPriceCard.js.map +1 -1
- package/dist/esm/components/LimitPriceCard/LimitPricePresets.js.map +1 -1
- package/dist/esm/components/Messages/AccountDeployedMessage.js.map +1 -1
- package/dist/esm/components/Messages/AccountNotDeployedMessage.js.map +1 -1
- package/dist/esm/components/Messages/AlertMessage.js.map +1 -1
- package/dist/esm/components/Messages/FundsSufficiencyMessage.js.map +1 -1
- package/dist/esm/components/Messages/GasRefuelMessage.js.map +1 -1
- package/dist/esm/components/Messages/GasSufficiencyMessage.js.map +1 -1
- package/dist/esm/components/Messages/MinFromAmountUSDMessage.js.map +1 -1
- package/dist/esm/components/Messages/MissingRouteRequiredAccountMessage.js.map +1 -1
- package/dist/esm/components/Messages/UnsupportedToAddressMessage.js +27 -0
- package/dist/esm/components/Messages/UnsupportedToAddressMessage.js.map +1 -0
- package/dist/esm/components/Messages/WarningMessages.d.ts.map +1 -1
- package/dist/esm/components/Messages/WarningMessages.js +2 -0
- package/dist/esm/components/Messages/WarningMessages.js.map +1 -1
- package/dist/esm/components/Messages/useMessageQueue.js +6 -1
- package/dist/esm/components/Messages/useMessageQueue.js.map +1 -1
- package/dist/esm/components/NotFound.js.map +1 -1
- package/dist/esm/components/PoweredBy/PoweredBy.js.map +1 -1
- package/dist/esm/components/ProgressToNextUpdate.js.map +1 -1
- package/dist/esm/components/ReverseTokensButton/ReverseTokensButton.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteCard.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteCardEssentials.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteCardSkeleton.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteDetails.js +2 -1
- package/dist/esm/components/RouteCard/RouteDetails.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteNotFoundCard.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteProviderCard.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteToken.js.map +1 -1
- package/dist/esm/components/RouteCard/RouteTokens.js.map +1 -1
- package/dist/esm/components/Routes/LimitOrderRoutes.js +2 -2
- package/dist/esm/components/Routes/LimitOrderRoutes.js.map +1 -1
- package/dist/esm/components/Routes/Routes.js.map +1 -1
- package/dist/esm/components/Routes/RoutesContent.js +2 -2
- package/dist/esm/components/Routes/RoutesContent.js.map +1 -1
- package/dist/esm/components/Routes/RoutesExpanded.js.map +1 -1
- package/dist/esm/components/Search/SearchInput.js.map +1 -1
- package/dist/esm/components/SelectChainAndToken.js.map +1 -1
- package/dist/esm/components/SelectTokenButton/SelectTokenButton.js.map +1 -1
- package/dist/esm/components/SendToWallet/SendToWalletButton.js.map +1 -1
- package/dist/esm/components/SendToWallet/SendToWalletExpandButton.js +2 -2
- package/dist/esm/components/SendToWallet/SendToWalletExpandButton.js.map +1 -1
- package/dist/esm/components/SettingsPanel/SettingsPanel.js.map +1 -1
- package/dist/esm/components/Skeleton/WidgetSkeleton.js +2 -1
- package/dist/esm/components/Skeleton/WidgetSkeleton.js.map +1 -1
- package/dist/esm/components/Step/StepActions.js +18 -16
- package/dist/esm/components/Step/StepActions.js.map +1 -1
- package/dist/esm/components/StepActions/SentToWalletRow.js.map +1 -1
- package/dist/esm/components/StepActions/StepActionRow.js +2 -1
- package/dist/esm/components/StepActions/StepActionRow.js.map +1 -1
- package/dist/esm/components/StepActions/StepActionsList.js.map +1 -1
- package/dist/esm/components/SwapButton/SwapButton.js.map +1 -1
- package/dist/esm/components/Switch.js +1 -1
- package/dist/esm/components/Switch.js.map +1 -1
- package/dist/esm/components/Tabs/Tabs.style.js +4 -2
- package/dist/esm/components/Tabs/Tabs.style.js.map +1 -1
- package/dist/esm/components/TextFitter/TextFitter.js.map +1 -1
- package/dist/esm/components/Timer/StepStatusTimer.js.map +1 -1
- package/dist/esm/components/Token/Token.js.map +1 -1
- package/dist/esm/components/TokenList/PinTokenButton.js.map +1 -1
- package/dist/esm/components/TokenList/TokenDetailsSheet.js.map +1 -1
- package/dist/esm/components/TokenList/TokenDetailsSheetContent.js.map +1 -1
- package/dist/esm/components/TokenList/TokenList.js.map +1 -1
- package/dist/esm/components/TokenList/TokenListItem.js +46 -8
- package/dist/esm/components/TokenList/TokenListItem.js.map +1 -1
- package/dist/esm/components/TokenList/VirtualizedTokenList.js +22 -9
- package/dist/esm/components/TokenList/VirtualizedTokenList.js.map +1 -1
- package/dist/esm/components/TokenPillButton/TokenPillButton.js.map +1 -1
- package/dist/esm/components/TokenRate/TokenRate.js +2 -1
- package/dist/esm/components/TokenRate/TokenRate.js.map +1 -1
- package/dist/esm/components/Tools/ToolItem.js.map +1 -1
- package/dist/esm/components/Tools/Tools.js.map +1 -1
- package/dist/esm/components/TransactionCard/ActiveTransactionCard.js +22 -21
- package/dist/esm/components/TransactionCard/ActiveTransactionCard.js.map +1 -1
- package/dist/esm/components/TransactionCard/TransactionCard.js.map +1 -1
- package/dist/esm/components/TransactionCard/TransactionCardSkeleton.js.map +1 -1
- package/dist/esm/config/version.d.ts +1 -1
- package/dist/esm/config/version.js +1 -1
- package/dist/esm/config/version.js.map +1 -1
- package/dist/esm/hooks/timer/time.js +2 -2
- package/dist/esm/hooks/timer/time.js.map +1 -1
- package/dist/esm/hooks/useAccountsBalancesData.js +1 -14
- package/dist/esm/hooks/useAccountsBalancesData.js.map +1 -1
- package/dist/esm/hooks/useAvailableChains.d.ts.map +1 -1
- package/dist/esm/hooks/useAvailableChains.js +2 -1
- package/dist/esm/hooks/useAvailableChains.js.map +1 -1
- package/dist/esm/hooks/useExplorer.d.ts.map +1 -1
- package/dist/esm/hooks/useExplorer.js +4 -0
- package/dist/esm/hooks/useExplorer.js.map +1 -1
- package/dist/esm/hooks/useFlaggedTokenGuard.js +28 -0
- package/dist/esm/hooks/useFlaggedTokenGuard.js.map +1 -0
- package/dist/esm/hooks/useGasSufficiency.js +3 -1
- package/dist/esm/hooks/useGasSufficiency.js.map +1 -1
- package/dist/esm/hooks/useMaxSendAmount.js +15 -0
- package/dist/esm/hooks/useMaxSendAmount.js.map +1 -0
- package/dist/esm/hooks/usePacedRouteExecution.js +3 -2
- package/dist/esm/hooks/usePacedRouteExecution.js.map +1 -1
- package/dist/esm/hooks/useRouteExecutionMessage.js +3 -2
- package/dist/esm/hooks/useRouteExecutionMessage.js.map +1 -1
- package/dist/esm/hooks/useRoutes.d.ts.map +1 -1
- package/dist/esm/hooks/useRoutes.js +3 -1
- package/dist/esm/hooks/useRoutes.js.map +1 -1
- package/dist/esm/hooks/useToAddressAutoPopulate.js.map +1 -1
- package/dist/esm/hooks/useToAddressRequirements.d.ts +2 -0
- package/dist/esm/hooks/useToAddressRequirements.d.ts.map +1 -1
- package/dist/esm/hooks/useToAddressRequirements.js +7 -1
- package/dist/esm/hooks/useToAddressRequirements.js.map +1 -1
- package/dist/esm/hooks/useTokenBalances.d.ts.map +1 -1
- package/dist/esm/hooks/useTokenBalances.js +7 -2
- package/dist/esm/hooks/useTokenBalances.js.map +1 -1
- package/dist/esm/hooks/useTokenBalancesQueries.js +32 -29
- package/dist/esm/hooks/useTokenBalancesQueries.js.map +1 -1
- package/dist/esm/hooks/useTokenSearch.js +3 -5
- package/dist/esm/hooks/useTokenSearch.js.map +1 -1
- package/dist/esm/hooks/useTokens.js +14 -10
- package/dist/esm/hooks/useTokens.js.map +1 -1
- package/dist/esm/hooks/useWideVariant.js +2 -1
- package/dist/esm/hooks/useWideVariant.js.map +1 -1
- package/dist/esm/i18n/bn.json +3 -1
- package/dist/esm/i18n/de.json +3 -1
- package/dist/esm/i18n/en.json +12 -3
- package/dist/esm/i18n/es.json +3 -1
- package/dist/esm/i18n/fr.json +3 -1
- package/dist/esm/i18n/hi.json +3 -1
- package/dist/esm/i18n/id.json +3 -1
- package/dist/esm/i18n/it.json +3 -1
- package/dist/esm/i18n/ja.json +3 -1
- package/dist/esm/i18n/ko.json +3 -1
- package/dist/esm/i18n/pl.json +3 -1
- package/dist/esm/i18n/pt.json +3 -1
- package/dist/esm/i18n/th.json +3 -1
- package/dist/esm/i18n/tr.json +3 -1
- package/dist/esm/i18n/uk.json +3 -1
- package/dist/esm/i18n/vi.json +3 -1
- package/dist/esm/i18n/zh.json +3 -1
- package/dist/esm/pages/ActivitiesPage/ActivitiesPage.js.map +1 -1
- package/dist/esm/pages/ActivitiesPage/ActivitiesPageMenuButton.js.map +1 -1
- package/dist/esm/pages/LanguagesPage.js.map +1 -1
- package/dist/esm/pages/MainPage/LimitPageContent.js.map +1 -1
- package/dist/esm/pages/MainPage/MainPage.js +2 -1
- package/dist/esm/pages/MainPage/MainPage.js.map +1 -1
- package/dist/esm/pages/MainPage/MainPageActions.js.map +1 -1
- package/dist/esm/pages/MainPage/ReviewButton.js +2 -2
- package/dist/esm/pages/MainPage/ReviewButton.js.map +1 -1
- package/dist/esm/pages/RoutePriorityPage.js.map +1 -1
- package/dist/esm/pages/RoutesPage/RoutesPage.js +2 -2
- package/dist/esm/pages/RoutesPage/RoutesPage.js.map +1 -1
- package/dist/esm/pages/SelectChainPage/SelectChainPage.js +13 -12
- package/dist/esm/pages/SelectChainPage/SelectChainPage.js.map +1 -1
- package/dist/esm/pages/SelectEnabledToolsPage.js +8 -5
- package/dist/esm/pages/SelectEnabledToolsPage.js.map +1 -1
- package/dist/esm/pages/SelectTokenPage/SelectTokenPage.js +2 -1
- package/dist/esm/pages/SelectTokenPage/SelectTokenPage.js.map +1 -1
- package/dist/esm/pages/SendToWallet/BookmarkAddressSheet.js.map +1 -1
- package/dist/esm/pages/SendToWallet/BookmarksPage.js.map +1 -1
- package/dist/esm/pages/SendToWallet/ConfirmAddressSheet.js.map +1 -1
- package/dist/esm/pages/SendToWallet/ConnectedWalletsPage.js.map +1 -1
- package/dist/esm/pages/SendToWallet/RecentWalletsPage.js.map +1 -1
- package/dist/esm/pages/SendToWallet/SendToConfiguredWalletPage.js.map +1 -1
- package/dist/esm/pages/SendToWallet/SendToWalletPage.js.map +1 -1
- package/dist/esm/pages/SettingsPage/BridgeAndExchangeSettings.js.map +1 -1
- package/dist/esm/pages/SettingsPage/GasPriceSettings.js.map +1 -1
- package/dist/esm/pages/SettingsPage/LanguageSetting.js.map +1 -1
- package/dist/esm/pages/SettingsPage/ResetSettingsButton.js.map +1 -1
- package/dist/esm/pages/SettingsPage/RoutePrioritySettings.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SettingsCard/BadgedValue.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SettingsCard/SettingCardExpandable.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SettingsPage.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SlippageSettings/SlippagePage.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SlippageSettings/SlippageSettings.js.map +1 -1
- package/dist/esm/pages/SettingsPage/SmallBalanceFilterSettings.js +2 -1
- package/dist/esm/pages/SettingsPage/SmallBalanceFilterSettings.js.map +1 -1
- package/dist/esm/pages/SettingsPage/ThemeSettings.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/ContactSupportButton.js +2 -1
- package/dist/esm/pages/TransactionDetailsPage/ContactSupportButton.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/ReceiptsCard.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/TransactionDetailsPage.js +2 -1
- package/dist/esm/pages/TransactionDetailsPage/TransactionDetailsPage.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/TransactionDetailsSkeleton.js.map +1 -1
- package/dist/esm/pages/TransactionDetailsPage/TransferIdCard.js.map +1 -1
- package/dist/esm/pages/TransactionPage/ConfirmToAddressSheet.js.map +1 -1
- package/dist/esm/pages/TransactionPage/ExchangeRateBottomSheet.js.map +1 -1
- package/dist/esm/pages/TransactionPage/ExecutionDoneCard.js.map +1 -1
- package/dist/esm/pages/TransactionPage/StartTransactionButton.js +4 -3
- package/dist/esm/pages/TransactionPage/StartTransactionButton.js.map +1 -1
- package/dist/esm/pages/TransactionPage/TokenValueBottomSheet.js.map +1 -1
- package/dist/esm/pages/TransactionPage/TokenVerificationBottomSheet.js +64 -0
- package/dist/esm/pages/TransactionPage/TokenVerificationBottomSheet.js.map +1 -0
- package/dist/esm/pages/TransactionPage/TransactionDoneButtons.js.map +1 -1
- package/dist/esm/pages/TransactionPage/TransactionExecutionContent.js +19 -16
- package/dist/esm/pages/TransactionPage/TransactionExecutionContent.js.map +1 -1
- package/dist/esm/pages/TransactionPage/TransactionFailedButtons.js +3 -1
- package/dist/esm/pages/TransactionPage/TransactionFailedButtons.js.map +1 -1
- package/dist/esm/pages/TransactionPage/TransactionPage.js.map +1 -1
- package/dist/esm/pages/TransactionPage/TransactionReview.js +24 -2
- package/dist/esm/pages/TransactionPage/TransactionReview.js.map +1 -1
- package/dist/esm/providers/I18nProvider/I18nProvider.js +37 -36
- package/dist/esm/providers/I18nProvider/I18nProvider.js.map +1 -1
- package/dist/esm/providers/I18nProvider/types.d.ts.map +1 -1
- package/dist/esm/providers/ThemeProvider/ThemeProvider.js +2 -1
- package/dist/esm/providers/ThemeProvider/ThemeProvider.js.map +1 -1
- package/dist/esm/providers/WalletProvider/WalletProvider.js +10 -9
- package/dist/esm/providers/WalletProvider/WalletProvider.js.map +1 -1
- package/dist/esm/providers/WalletProvider/useExternalWalletProvider.js +7 -3
- package/dist/esm/providers/WalletProvider/useExternalWalletProvider.js.map +1 -1
- package/dist/esm/stores/StoreProvider.js.map +1 -1
- package/dist/esm/stores/form/FormStore.js.map +1 -1
- package/dist/esm/stores/form/FormUpdater.js.map +1 -1
- package/dist/esm/stores/navigationTabs/useNavigationTabsStore.js.map +1 -1
- package/dist/esm/stores/routes/useRouteExecutionIndicator.js +4 -3
- package/dist/esm/stores/routes/useRouteExecutionIndicator.js.map +1 -1
- package/dist/esm/types/token.d.ts +4 -1
- package/dist/esm/types/token.d.ts.map +1 -1
- package/dist/esm/utils/compactNumberFormatter.js +1 -3
- package/dist/esm/utils/compactNumberFormatter.js.map +1 -1
- package/dist/esm/utils/customReceiver.js +7 -0
- package/dist/esm/utils/customReceiver.js.map +1 -0
- package/dist/esm/utils/gas.js +24 -0
- package/dist/esm/utils/gas.js.map +1 -0
- package/dist/esm/utils/getErrorMessage.js +0 -1
- package/dist/esm/utils/getErrorMessage.js.map +1 -1
- package/dist/esm/utils/limitOrder.js +1 -1
- package/dist/esm/utils/limitOrder.js.map +1 -1
- package/dist/esm/utils/token.js +21 -4
- package/dist/esm/utils/token.js.map +1 -1
- package/dist/esm/utils/tokenList.js +37 -23
- package/dist/esm/utils/tokenList.js.map +1 -1
- package/package.json +15 -15
- package/src/components/AmountInput/AmountInputEndAdornment.tsx +2 -21
- package/src/components/AmountInputCard/PercentageChips.tsx +2 -18
- package/src/components/Chains/AllChainsAvatar.tsx +7 -1
- package/src/components/Messages/UnsupportedToAddressMessage.tsx +24 -0
- package/src/components/Messages/WarningMessages.tsx +3 -0
- package/src/components/Messages/useMessageQueue.ts +9 -0
- package/src/components/Routes/LimitOrderRoutes.tsx +5 -2
- package/src/components/Routes/RoutesContent.tsx +5 -2
- package/src/components/SendToWallet/SendToWalletExpandButton.tsx +2 -1
- package/src/components/TokenList/TokenListItem.tsx +68 -9
- package/src/components/TokenList/VirtualizedTokenList.tsx +33 -9
- package/src/components/TokenList/types.ts +4 -0
- package/src/config/version.ts +1 -1
- package/src/hooks/useAccountsBalancesData.ts +4 -31
- package/src/hooks/useAvailableChains.ts +1 -0
- package/src/hooks/useExplorer.ts +2 -0
- package/src/hooks/useFlaggedTokenGuard.ts +33 -0
- package/src/hooks/useGasSufficiency.ts +9 -1
- package/src/hooks/useMaxSendAmount.ts +21 -0
- package/src/hooks/useRoutes.ts +7 -0
- package/src/hooks/useToAddressRequirements.ts +17 -1
- package/src/hooks/useTokenBalances.ts +18 -2
- package/src/hooks/useTokenBalancesQueries.ts +12 -4
- package/src/hooks/useTokenSearch.ts +1 -5
- package/src/hooks/useTokens.ts +28 -13
- package/src/pages/MainPage/ReviewButton.tsx +6 -2
- package/src/pages/RoutesPage/RoutesPage.tsx +5 -2
- package/src/pages/TransactionPage/TokenVerificationBottomSheet.tsx +93 -0
- package/src/pages/TransactionPage/TransactionReview.tsx +28 -1
- package/src/providers/WalletProvider/useExternalWalletProvider.ts +9 -1
- package/src/types/token.ts +6 -3
- package/src/utils/customReceiver.ts +7 -0
- package/src/utils/gas.ts +41 -0
- package/src/utils/token.ts +53 -9
- package/src/utils/tokenList.ts +27 -7
- package/dist/esm/hooks/useFilteredByTokenBalances.js +0 -74
- package/dist/esm/hooks/useFilteredByTokenBalances.js.map +0 -1
- package/src/hooks/useFilteredByTokenBalances.ts +0 -145
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReviewButton.js","names":[],"sources":["../../../../src/pages/MainPage/ReviewButton.tsx"],"sourcesContent":["import { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { BaseTransactionButton } from '../../components/BaseTransactionButton/BaseTransactionButton.js'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { useSplitMode } from '../../stores/navigationTabs/useNavigationTabsStore.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\n\nexport const ReviewButton: React.FC = () => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const emitter = useWidgetEvents()\n const { mode, modeOptions } = useWidgetConfig()\n const splitState = useSplitMode()\n const { toAddress, requiredToAddress }
|
|
1
|
+
{"version":3,"file":"ReviewButton.js","names":[],"sources":["../../../../src/pages/MainPage/ReviewButton.tsx"],"sourcesContent":["import { useNavigate } from '@tanstack/react-router'\nimport { useTranslation } from 'react-i18next'\nimport { BaseTransactionButton } from '../../components/BaseTransactionButton/BaseTransactionButton.js'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { useSplitMode } from '../../stores/navigationTabs/useNavigationTabsStore.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\n\nexport const ReviewButton: React.FC = () => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const emitter = useWidgetEvents()\n const { mode, modeOptions } = useWidgetConfig()\n const splitState = useSplitMode()\n const { toAddress, requiredToAddress, unsupportedReceiverBlocking } =\n useToAddressRequirements()\n const { routes, setReviewableRoute } = useRoutes()\n const [selectedRouteId] = useFieldValues('selectedRouteId')\n\n // The provider pick only applies in limit mode (it's the only flow that sets\n // it). Honoring it in other modes would be wrong, since provider/tool keys\n // can collide across modes. Everywhere else, fall back to the best route.\n const currentRoute =\n (mode === 'limit'\n ? routes?.find((route) => route.id === selectedRouteId)\n : undefined) ?? routes?.[0]\n\n const handleClick = async () => {\n if (!currentRoute) {\n return\n }\n\n setReviewableRoute(currentRoute)\n navigate({\n to: navigationRoutes.transactionExecution,\n search: { routeId: currentRoute.id },\n })\n emitter.emit(WidgetEvent.RouteSelected, {\n route: currentRoute,\n routes: routes!,\n })\n }\n\n const getButtonText = (): string => {\n if (currentRoute) {\n switch (mode) {\n case 'custom':\n return t(`button.${modeOptions?.custom?.type ?? 'checkout'}Review`)\n case 'refuel':\n return t('button.getGas')\n case 'limit':\n return t('button.review')\n default: {\n const transactionType =\n currentRoute.fromChainId === currentRoute.toChainId\n ? 'swap'\n : 'bridge'\n return t(`button.${transactionType}Review`)\n }\n }\n }\n switch (mode) {\n case 'custom':\n return modeOptions?.custom?.type === 'deposit'\n ? t('button.deposit')\n : t('button.buy')\n case 'refuel':\n return t('button.getGas')\n case 'limit':\n return t('button.review')\n case 'split':\n if (splitState) {\n return t(`button.${splitState}`)\n }\n return t('button.exchange')\n default:\n return t('button.exchange')\n }\n }\n\n return (\n <BaseTransactionButton\n text={getButtonText()}\n onClick={handleClick}\n disabled={\n currentRoute &&\n (unsupportedReceiverBlocking || (requiredToAddress && !toAddress))\n }\n route={currentRoute}\n sx={{ flex: 1 }}\n />\n )\n}\n"],"mappings":";;;;;;;;;;;;;AAYA,MAAa,qBAA+B;CAC1C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,UAAU,gBAAgB;CAChC,MAAM,EAAE,MAAM,gBAAgB,gBAAgB;CAC9C,MAAM,aAAa,aAAa;CAChC,MAAM,EAAE,WAAW,mBAAmB,gCACpC,yBAAyB;CAC3B,MAAM,EAAE,QAAQ,uBAAuB,UAAU;CACjD,MAAM,CAAC,mBAAmB,eAAe,iBAAiB;CAK1D,MAAM,gBACH,SAAS,UACN,QAAQ,MAAM,UAAU,MAAM,OAAO,eAAe,IACpD,KAAA,MAAc,SAAS;CAE7B,MAAM,cAAc,YAAY;EAC9B,IAAI,CAAC,cACH;EAGF,mBAAmB,YAAY;EAC/B,SAAS;GACP,IAAI,iBAAiB;GACrB,QAAQ,EAAE,SAAS,aAAa,GAAG;EACrC,CAAC;EACD,QAAQ,KAAA,iBAAgC;GACtC,OAAO;GACC;EACV,CAAC;CACH;CAEA,MAAM,sBAA8B;EAClC,IAAI,cACF,QAAQ,MAAR;GACE,KAAK,UACH,OAAO,EAAE,UAAU,aAAa,QAAQ,QAAQ,WAAW,OAAO;GACpE,KAAK,UACH,OAAO,EAAE,eAAe;GAC1B,KAAK,SACH,OAAO,EAAE,eAAe;GAC1B,SAAS;IACP,MAAM,kBACJ,aAAa,gBAAgB,aAAa,YACtC,SACA;IACN,OAAO,EAAE,UAAU,gBAAgB,OAAO;GAC5C;EACF;EAEF,QAAQ,MAAR;GACE,KAAK,UACH,OAAO,aAAa,QAAQ,SAAS,YACjC,EAAE,gBAAgB,IAClB,EAAE,YAAY;GACpB,KAAK,UACH,OAAO,EAAE,eAAe;GAC1B,KAAK,SACH,OAAO,EAAE,eAAe;GAC1B,KAAK;IACH,IAAI,YACF,OAAO,EAAE,UAAU,YAAY;IAEjC,OAAO,EAAE,iBAAiB;GAC5B,SACE,OAAO,EAAE,iBAAiB;EAC9B;CACF;CAEA,OACE,oBAAC,uBAAD;EACE,MAAM,cAAc;EACpB,SAAS;EACT,UACE,iBACC,+BAAgC,qBAAqB,CAAC;EAEzD,OAAO;EACP,IAAI,EAAE,MAAM,EAAE;CACf,CAAA;AAEL"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RoutePriorityPage.js","names":["ListItemText"],"sources":["../../../src/pages/RoutePriorityPage.tsx"],"sourcesContent":["import type { Order } from '@lifi/sdk'\nimport Check from '@mui/icons-material/Check'\nimport { List } from '@mui/material'\nimport { useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ListItemText } from '../components/ListItemText.js'\nimport { PageContainer } from '../components/PageContainer.js'\nimport { SettingsListItemButton } from '../components/SettingsListItemButton.js'\nimport { useHeader } from '../hooks/useHeader.js'\nimport { useListHeight } from '../hooks/useListHeight.js'\nimport { useSettings } from '../stores/settings/useSettings.js'\nimport { useSettingsActions } from '../stores/settings/useSettingsActions.js'\n\nconst routePriorities: Order[] = ['CHEAPEST', 'FASTEST']\n\nexport const RoutePriorityPage: React.FC = () => {\n const { t } = useTranslation()\n const { setValue } = useSettingsActions()\n const { routePriority } = useSettings(['routePriority'])\n const listParentRef = useRef<HTMLUListElement | null>(null)\n const { listHeight } = useListHeight({ listParentRef })\n\n useHeader(t('settings.routePriority'))\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n sx={{\n padding: 1.5,\n }}\n >\n {routePriorities.map((priority) => {\n const key = priority.toLowerCase()\n return (\n <SettingsListItemButton\n key={priority}\n onClick={() => setValue('routePriority', priority)}\n >\n <ListItemText\n primary={t(`settings.routePriorityOptions.${key}.title` as any)}\n secondary={t(\n `settings.routePriorityOptions.${key}.description` as any\n )}\n />\n {routePriority === priority && <Check color=\"primary\" />}\n </SettingsListItemButton>\n )\n })}\n </List>\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;AAaA,MAAM,kBAA2B,CAAC,YAAY,SAAS;AAEvD,MAAa,0BAAoC;CAC/C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,mBAAmB;CACxC,MAAM,EAAE,kBAAkB,YAAY,CAAC,eAAe,CAAC;CACvD,MAAM,gBAAgB,OAAgC,IAAI;CAC1D,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,UAAU,EAAE,wBAAwB,CAAC;CAErC,OACE,oBAAC,eAAD;EAAe,gBAAA;
|
|
1
|
+
{"version":3,"file":"RoutePriorityPage.js","names":["ListItemText"],"sources":["../../../src/pages/RoutePriorityPage.tsx"],"sourcesContent":["import type { Order } from '@lifi/sdk'\nimport Check from '@mui/icons-material/Check'\nimport { List } from '@mui/material'\nimport { useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ListItemText } from '../components/ListItemText.js'\nimport { PageContainer } from '../components/PageContainer.js'\nimport { SettingsListItemButton } from '../components/SettingsListItemButton.js'\nimport { useHeader } from '../hooks/useHeader.js'\nimport { useListHeight } from '../hooks/useListHeight.js'\nimport { useSettings } from '../stores/settings/useSettings.js'\nimport { useSettingsActions } from '../stores/settings/useSettingsActions.js'\n\nconst routePriorities: Order[] = ['CHEAPEST', 'FASTEST']\n\nexport const RoutePriorityPage: React.FC = () => {\n const { t } = useTranslation()\n const { setValue } = useSettingsActions()\n const { routePriority } = useSettings(['routePriority'])\n const listParentRef = useRef<HTMLUListElement | null>(null)\n const { listHeight } = useListHeight({ listParentRef })\n\n useHeader(t('settings.routePriority'))\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n sx={{\n padding: 1.5,\n }}\n >\n {routePriorities.map((priority) => {\n const key = priority.toLowerCase()\n return (\n <SettingsListItemButton\n key={priority}\n onClick={() => setValue('routePriority', priority)}\n >\n <ListItemText\n primary={t(`settings.routePriorityOptions.${key}.title` as any)}\n secondary={t(\n `settings.routePriorityOptions.${key}.description` as any\n )}\n />\n {routePriority === priority && <Check color=\"primary\" />}\n </SettingsListItemButton>\n )\n })}\n </List>\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;AAaA,MAAM,kBAA2B,CAAC,YAAY,SAAS;AAEvD,MAAa,0BAAoC;CAC/C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,mBAAmB;CACxC,MAAM,EAAE,kBAAkB,YAAY,CAAC,eAAe,CAAC;CACvD,MAAM,gBAAgB,OAAgC,IAAI;CAC1D,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,UAAU,EAAE,wBAAwB,CAAC;CAErC,OACE,oBAAC,eAAD;EAAe,gBAAA;EACb,UAAA,oBAAC,MAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;GAC9C,IAAI,EACF,SAAS,IACX;GAEC,UAAA,gBAAgB,KAAK,aAAa;IACjC,MAAM,MAAM,SAAS,YAAY;IACjC,OACE,qBAAC,wBAAD;KAEE,eAAe,SAAS,iBAAiB,QAAQ;KAFnD,UAAA,CAIE,oBAACA,gBAAD;MACE,SAAS,EAAE,iCAAiC,IAAI,OAAc;MAC9D,WAAW,EACT,iCAAiC,IAAI,aACvC;KACD,CAAA,GACA,kBAAkB,YAAY,oBAAC,OAAD,EAAO,OAAM,UAAW,CAAA,CACjC;IAVjB,GAAA,QAUiB;GAE5B,CAAC;EACG,CAAA;CACO,CAAA;AAEnB"}
|
|
@@ -27,7 +27,7 @@ const RoutesPage = () => {
|
|
|
27
27
|
const { routes, isLoading, isFetching, dataUpdatedAt, refetchTime, fromChain, refetch, setReviewableRoute } = useRoutes();
|
|
28
28
|
const { account } = useAccount({ chainType: fromChain?.chainType });
|
|
29
29
|
const [toAddress] = useFieldValues("toAddress");
|
|
30
|
-
const { requiredToAddress } = useToAddressRequirements();
|
|
30
|
+
const { requiredToAddress, unsupportedReceiverBlocking } = useToAddressRequirements();
|
|
31
31
|
const headerAction = useMemo(() => /* @__PURE__ */ jsx(ProgressToNextUpdate, {
|
|
32
32
|
updatedAt: dataUpdatedAt || Date.now(),
|
|
33
33
|
timeToUpdate: refetchTime,
|
|
@@ -55,7 +55,7 @@ const RoutesPage = () => {
|
|
|
55
55
|
});
|
|
56
56
|
};
|
|
57
57
|
const routeNotFound = !routes?.length && !isLoading && !isFetching;
|
|
58
|
-
const toAddressUnsatisfied = routes?.[0] && requiredToAddress && !toAddress;
|
|
58
|
+
const toAddressUnsatisfied = routes?.[0] && (unsupportedReceiverBlocking || requiredToAddress && !toAddress);
|
|
59
59
|
const allowInteraction = account.isConnected && !toAddressUnsatisfied;
|
|
60
60
|
return /* @__PURE__ */ jsx(PageContainer, {
|
|
61
61
|
disableGutters: true,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RoutesPage.js","names":["Stack"],"sources":["../../../../src/pages/RoutesPage/RoutesPage.tsx"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport { useAccount } from '@lifi/wallet-management'\nimport { Box } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useMemo, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { ProgressToNextUpdate } from '../../components/ProgressToNextUpdate.js'\nimport { RouteCard } from '../../components/RouteCard/RouteCard.js'\nimport { RouteCardSkeleton } from '../../components/RouteCard/RouteCardSkeleton.js'\nimport { RouteNotFoundCard } from '../../components/RouteCard/RouteNotFoundCard.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { Stack } from './RoutesPage.style.js'\n\nexport const RoutesPage = (): JSX.Element => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const emitter = useWidgetEvents()\n const listParentRef = useRef<HTMLDivElement>(null)\n const {\n routes,\n isLoading,\n isFetching,\n dataUpdatedAt,\n refetchTime,\n fromChain,\n refetch,\n setReviewableRoute,\n } = useRoutes()\n const { account } = useAccount({ chainType: fromChain?.chainType })\n const [toAddress] = useFieldValues('toAddress')\n const { requiredToAddress }
|
|
1
|
+
{"version":3,"file":"RoutesPage.js","names":["Stack"],"sources":["../../../../src/pages/RoutesPage/RoutesPage.tsx"],"sourcesContent":["import type { Route } from '@lifi/sdk'\nimport { useAccount } from '@lifi/wallet-management'\nimport { Box } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useMemo, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { ProgressToNextUpdate } from '../../components/ProgressToNextUpdate.js'\nimport { RouteCard } from '../../components/RouteCard/RouteCard.js'\nimport { RouteCardSkeleton } from '../../components/RouteCard/RouteCardSkeleton.js'\nimport { RouteNotFoundCard } from '../../components/RouteCard/RouteNotFoundCard.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useRoutes } from '../../hooks/useRoutes.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetEvents } from '../../hooks/useWidgetEvents.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { WidgetEvent } from '../../types/events.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { Stack } from './RoutesPage.style.js'\n\nexport const RoutesPage = (): JSX.Element => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const emitter = useWidgetEvents()\n const listParentRef = useRef<HTMLDivElement>(null)\n const {\n routes,\n isLoading,\n isFetching,\n dataUpdatedAt,\n refetchTime,\n fromChain,\n refetch,\n setReviewableRoute,\n } = useRoutes()\n const { account } = useAccount({ chainType: fromChain?.chainType })\n const [toAddress] = useFieldValues('toAddress')\n const { requiredToAddress, unsupportedReceiverBlocking } =\n useToAddressRequirements()\n\n const headerAction = useMemo(\n () => (\n <ProgressToNextUpdate\n updatedAt={dataUpdatedAt || Date.now()}\n timeToUpdate={refetchTime}\n isLoading={isFetching}\n onClick={() => refetch()}\n sx={{ marginRight: -1 }}\n size=\"medium\"\n />\n ),\n [dataUpdatedAt, isFetching, refetch, refetchTime]\n )\n\n useHeader(t('header.receive'), headerAction)\n\n const { listHeight } = useListHeight({\n listParentRef,\n })\n\n const handleRouteClick = (route: Route) => {\n setReviewableRoute(route)\n navigate({\n to: navigationRoutes.transactionExecution,\n search: { routeId: route.id },\n })\n emitter.emit(WidgetEvent.RouteSelected, {\n route,\n routes: routes!,\n })\n }\n\n const routeNotFound = !routes?.length && !isLoading && !isFetching\n\n const toAddressUnsatisfied =\n routes?.[0] &&\n (unsupportedReceiverBlocking || (requiredToAddress && !toAddress))\n\n const allowInteraction = account.isConnected && !toAddressUnsatisfied\n\n return (\n <PageContainer disableGutters>\n <Box\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n >\n <Stack direction=\"column\" spacing={2} sx={{ pt: 1.5 }}>\n {routeNotFound ? (\n <RouteNotFoundCard />\n ) : isLoading && !routes?.length ? (\n Array.from({ length: 3 }).map((_, index) => (\n <RouteCardSkeleton key={index} />\n ))\n ) : (\n routes?.map((route: Route, index: number) => (\n <RouteCard\n key={index}\n route={route}\n onClick={\n allowInteraction ? () => handleRouteClick(route) : undefined\n }\n active={index === 0}\n expanded={routes?.length === 1}\n />\n ))\n )}\n </Stack>\n </Box>\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;AAqBA,MAAa,mBAAgC;CAC3C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,UAAU,gBAAgB;CAChC,MAAM,gBAAgB,OAAuB,IAAI;CACjD,MAAM,EACJ,QACA,WACA,YACA,eACA,aACA,WACA,SACA,uBACE,UAAU;CACd,MAAM,EAAE,YAAY,WAAW,EAAE,WAAW,WAAW,UAAU,CAAC;CAClE,MAAM,CAAC,aAAa,eAAe,WAAW;CAC9C,MAAM,EAAE,mBAAmB,gCACzB,yBAAyB;CAE3B,MAAM,eAAe,cAEjB,oBAAC,sBAAD;EACE,WAAW,iBAAiB,KAAK,IAAI;EACrC,cAAc;EACd,WAAW;EACX,eAAe,QAAQ;EACvB,IAAI,EAAE,aAAa,GAAG;EACtB,MAAK;CACN,CAAA,GAEH;EAAC;EAAe;EAAY;EAAS;CAAW,CAClD;CAEA,UAAU,EAAE,gBAAgB,GAAG,YAAY;CAE3C,MAAM,EAAE,eAAe,cAAc,EACnC,cACF,CAAC;CAED,MAAM,oBAAoB,UAAiB;EACzC,mBAAmB,KAAK;EACxB,SAAS;GACP,IAAI,iBAAiB;GACrB,QAAQ,EAAE,SAAS,MAAM,GAAG;EAC9B,CAAC;EACD,QAAQ,KAAA,iBAAgC;GACtC;GACQ;EACV,CAAC;CACH;CAEA,MAAM,gBAAgB,CAAC,QAAQ,UAAU,CAAC,aAAa,CAAC;CAExD,MAAM,uBACJ,SAAS,OACR,+BAAgC,qBAAqB,CAAC;CAEzD,MAAM,mBAAmB,QAAQ,eAAe,CAAC;CAEjD,OACE,oBAAC,eAAD;EAAe,gBAAA;EACb,UAAA,oBAAC,KAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;GAE9C,UAAA,oBAACA,SAAD;IAAO,WAAU;IAAS,SAAS;IAAG,IAAI,EAAE,IAAI,IAAI;IACjD,UAAA,gBACC,oBAAC,mBAAD,CAAoB,CAAA,IAClB,aAAa,CAAC,QAAQ,SACxB,MAAM,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,KAAK,GAAG,UAChC,oBAAC,mBAAD,CAAgC,GAAR,KAAQ,CACjC,IAED,QAAQ,KAAK,OAAc,UACzB,oBAAC,WAAD;KAES;KACP,SACE,yBAAyB,iBAAiB,KAAK,IAAI,KAAA;KAErD,QAAQ,UAAU;KAClB,UAAU,QAAQ,WAAW;IAC9B,GAPM,KAON,CACF;GAEE,CAAA;EACJ,CAAA;CACQ,CAAA;AAEnB"}
|
|
@@ -13,20 +13,21 @@ const SelectChainPage = ({ formType, selectNativeToken }) => {
|
|
|
13
13
|
const selectToken = useTokenSelect(formType, navigateBack);
|
|
14
14
|
const { t } = useTranslation();
|
|
15
15
|
useHeader(t("header.selectChain"));
|
|
16
|
+
const handleClick = useCallback(async (chain) => {
|
|
17
|
+
if (selectNativeToken) selectToken(chain.nativeToken.address, chain.id);
|
|
18
|
+
else {
|
|
19
|
+
setCurrentChain(chain.id);
|
|
20
|
+
navigateBack();
|
|
21
|
+
}
|
|
22
|
+
}, [
|
|
23
|
+
navigateBack,
|
|
24
|
+
selectNativeToken,
|
|
25
|
+
selectToken,
|
|
26
|
+
setCurrentChain
|
|
27
|
+
]);
|
|
16
28
|
return /* @__PURE__ */ jsx(SelectChainPageContent, {
|
|
17
29
|
formType,
|
|
18
|
-
onSelect:
|
|
19
|
-
if (selectNativeToken) selectToken(chain.nativeToken.address, chain.id);
|
|
20
|
-
else {
|
|
21
|
-
setCurrentChain(chain.id);
|
|
22
|
-
navigateBack();
|
|
23
|
-
}
|
|
24
|
-
}, [
|
|
25
|
-
navigateBack,
|
|
26
|
-
selectNativeToken,
|
|
27
|
-
selectToken,
|
|
28
|
-
setCurrentChain
|
|
29
|
-
])
|
|
30
|
+
onSelect: handleClick
|
|
30
31
|
});
|
|
31
32
|
};
|
|
32
33
|
//#endregion
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectChainPage.js","names":[],"sources":["../../../../src/pages/SelectChainPage/SelectChainPage.tsx"],"sourcesContent":["import type { ExtendedChain } from '@lifi/sdk'\nimport { useCallback } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useChainSelect } from '../../components/ChainSelect/useChainSelect.js'\nimport { SelectChainPageContent } from '../../components/Chains/SelectChainPageContent.js'\nimport { useTokenSelect } from '../../components/TokenList/useTokenSelect.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useNavigateBack } from '../../hooks/useNavigateBack.js'\nimport type { SelectChainPageProps } from './types.js'\n\nexport const SelectChainPage: React.FC<SelectChainPageProps> = ({\n formType,\n selectNativeToken,\n}) => {\n const navigateBack = useNavigateBack()\n const { setCurrentChain } = useChainSelect(formType)\n const selectToken = useTokenSelect(formType, navigateBack)\n\n const { t } = useTranslation()\n\n useHeader(t('header.selectChain'))\n\n const handleClick = useCallback(\n async (chain: ExtendedChain) => {\n if (selectNativeToken) {\n selectToken(chain.nativeToken.address, chain.id)\n } else {\n setCurrentChain(chain.id)\n navigateBack()\n }\n },\n [navigateBack, selectNativeToken, selectToken, setCurrentChain]\n )\n\n return <SelectChainPageContent formType={formType} onSelect={handleClick} />\n}\n"],"mappings":";;;;;;;;;AAUA,MAAa,mBAAmD,EAC9D,UACA,wBACI;CACJ,MAAM,eAAe,gBAAgB;CACrC,MAAM,EAAE,oBAAoB,eAAe,QAAQ;CACnD,MAAM,cAAc,eAAe,UAAU,YAAY;CAEzD,MAAM,EAAE,MAAM,eAAe;CAE7B,UAAU,EAAE,oBAAoB,CAAC;
|
|
1
|
+
{"version":3,"file":"SelectChainPage.js","names":[],"sources":["../../../../src/pages/SelectChainPage/SelectChainPage.tsx"],"sourcesContent":["import type { ExtendedChain } from '@lifi/sdk'\nimport { useCallback } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { useChainSelect } from '../../components/ChainSelect/useChainSelect.js'\nimport { SelectChainPageContent } from '../../components/Chains/SelectChainPageContent.js'\nimport { useTokenSelect } from '../../components/TokenList/useTokenSelect.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useNavigateBack } from '../../hooks/useNavigateBack.js'\nimport type { SelectChainPageProps } from './types.js'\n\nexport const SelectChainPage: React.FC<SelectChainPageProps> = ({\n formType,\n selectNativeToken,\n}) => {\n const navigateBack = useNavigateBack()\n const { setCurrentChain } = useChainSelect(formType)\n const selectToken = useTokenSelect(formType, navigateBack)\n\n const { t } = useTranslation()\n\n useHeader(t('header.selectChain'))\n\n const handleClick = useCallback(\n async (chain: ExtendedChain) => {\n if (selectNativeToken) {\n selectToken(chain.nativeToken.address, chain.id)\n } else {\n setCurrentChain(chain.id)\n navigateBack()\n }\n },\n [navigateBack, selectNativeToken, selectToken, setCurrentChain]\n )\n\n return <SelectChainPageContent formType={formType} onSelect={handleClick} />\n}\n"],"mappings":";;;;;;;;;AAUA,MAAa,mBAAmD,EAC9D,UACA,wBACI;CACJ,MAAM,eAAe,gBAAgB;CACrC,MAAM,EAAE,oBAAoB,eAAe,QAAQ;CACnD,MAAM,cAAc,eAAe,UAAU,YAAY;CAEzD,MAAM,EAAE,MAAM,eAAe;CAE7B,UAAU,EAAE,oBAAoB,CAAC;CAEjC,MAAM,cAAc,YAClB,OAAO,UAAyB;EAC9B,IAAI,mBACF,YAAY,MAAM,YAAY,SAAS,MAAM,EAAE;OAC1C;GACL,gBAAgB,MAAM,EAAE;GACxB,aAAa;EACf;CACF,GACA;EAAC;EAAc;EAAmB;EAAa;CAAe,CAChE;CAEA,OAAO,oBAAC,wBAAD;EAAkC;EAAU,UAAU;CAAc,CAAA;AAC7E"}
|
|
@@ -13,8 +13,9 @@ import { useTranslation } from "react-i18next";
|
|
|
13
13
|
//#region src/pages/SelectEnabledToolsPage.tsx
|
|
14
14
|
const SelectAllCheckbox = memo(({ allCheckboxesSelected, anyCheckboxesSelected, noCheckboxesAvailable, onClick }) => {
|
|
15
15
|
const { t } = useTranslation();
|
|
16
|
+
const tooltipTitle = noCheckboxesAvailable ? void 0 : allCheckboxesSelected ? t("tooltip.deselectAll") : t("tooltip.selectAll");
|
|
16
17
|
return /* @__PURE__ */ jsx(Tooltip, {
|
|
17
|
-
title:
|
|
18
|
+
title: tooltipTitle,
|
|
18
19
|
children: /* @__PURE__ */ jsx(Checkbox, {
|
|
19
20
|
id: "select-all",
|
|
20
21
|
checked: allCheckboxesSelected,
|
|
@@ -69,6 +70,11 @@ const SelectEnabledToolsPage = ({ type }) => {
|
|
|
69
70
|
filteredTools
|
|
70
71
|
]);
|
|
71
72
|
useHeader(t(`settings.enabled${type}`), headerAction);
|
|
73
|
+
const handleSearchInputChange = useCallback((e) => {
|
|
74
|
+
setSearchValue(e.target.value);
|
|
75
|
+
listRef.current?.scrollTo(0, 0);
|
|
76
|
+
}, []);
|
|
77
|
+
const debouncedSearchInputChange = debounce(handleSearchInputChange, 250);
|
|
72
78
|
return /* @__PURE__ */ jsxs(PageContainer, {
|
|
73
79
|
disableGutters: true,
|
|
74
80
|
children: [/* @__PURE__ */ jsx(Box, {
|
|
@@ -79,10 +85,7 @@ const SelectEnabledToolsPage = ({ type }) => {
|
|
|
79
85
|
pt: 1.5
|
|
80
86
|
},
|
|
81
87
|
children: /* @__PURE__ */ jsx(SearchInput, {
|
|
82
|
-
onChange:
|
|
83
|
-
setSearchValue(e.target.value);
|
|
84
|
-
listRef.current?.scrollTo(0, 0);
|
|
85
|
-
}, []), 250),
|
|
88
|
+
onChange: debouncedSearchInputChange,
|
|
86
89
|
placeholder: t(`main.search${type}`),
|
|
87
90
|
autoFocus: true
|
|
88
91
|
})
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectEnabledToolsPage.js","names":[],"sources":["../../../src/pages/SelectEnabledToolsPage.tsx"],"sourcesContent":["import { Box, Checkbox, debounce, Tooltip } from '@mui/material'\nimport type { ChangeEvent, ChangeEventHandler } from 'react'\nimport { memo, useCallback, useMemo, useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { PageContainer } from '../components/PageContainer.js'\nimport { SearchInput } from '../components/Search/SearchInput.js'\nimport { type ToolCollectionTypes, Tools } from '../components/Tools/Tools.js'\nimport { useHeader } from '../hooks/useHeader.js'\nimport { useListHeight } from '../hooks/useListHeight.js'\nimport { useTools } from '../hooks/useTools.js'\nimport { useSettingsStore } from '../stores/settings/SettingsStore.js'\nimport { useSettingsActions } from '../stores/settings/useSettingsActions.js'\n\ninterface SelectAllCheckboxProps {\n allCheckboxesSelected: boolean\n onClick: (event: ChangeEvent<HTMLInputElement>, checked: boolean) => void\n anyCheckboxesSelected: boolean\n noCheckboxesAvailable: boolean\n}\n\nconst SelectAllCheckbox = memo<SelectAllCheckboxProps>(\n ({\n allCheckboxesSelected,\n anyCheckboxesSelected,\n noCheckboxesAvailable,\n onClick,\n }) => {\n const { t } = useTranslation()\n const tooltipTitle = noCheckboxesAvailable\n ? undefined\n : allCheckboxesSelected\n ? t('tooltip.deselectAll')\n : t('tooltip.selectAll')\n\n return (\n <Tooltip title={tooltipTitle}>\n <Checkbox\n id=\"select-all\"\n checked={allCheckboxesSelected}\n indeterminate={anyCheckboxesSelected && !allCheckboxesSelected}\n onChange={onClick}\n disabled={noCheckboxesAvailable}\n sx={{ mr: -1.5, height: 20 }}\n />\n </Tooltip>\n )\n }\n)\n\nexport const SelectEnabledToolsPage: React.FC<{\n type: 'Bridges' | 'Exchanges'\n}> = ({ type }) => {\n const typeKey = type.toLowerCase() as 'bridges' | 'exchanges'\n const { tools } = useTools()\n const { toggleToolKeys } = useSettingsActions()\n\n const disabledTools = useSettingsStore((state) => state[`disabled${type}`])\n\n const { t } = useTranslation()\n const headerRef = useRef<HTMLElement>(null)\n const listRef = useRef<HTMLDivElement>(null)\n const [searchValue, setSearchValue] = useState('')\n\n const { listHeight } = useListHeight({\n listParentRef: listRef,\n headerRef,\n })\n\n const filteredTools = useMemo(() => {\n const toolsList = tools?.[typeKey] ?? []\n\n if (!searchValue) {\n return toolsList\n }\n\n const lowerSearchValue = searchValue.toLowerCase()\n return toolsList.filter((tool) =>\n tool.name.toLowerCase().includes(lowerSearchValue)\n ) as ToolCollectionTypes\n }, [tools, typeKey, searchValue])\n\n const handleSelectAll = useCallback(() => {\n toggleToolKeys(\n type,\n filteredTools.map((tool) => tool.key)\n )\n }, [toggleToolKeys, type, filteredTools])\n\n const headerAction = useMemo(\n () => (\n <SelectAllCheckbox\n allCheckboxesSelected={\n !!filteredTools.length &&\n filteredTools.every((tool) => !disabledTools.includes(tool.key))\n }\n anyCheckboxesSelected={\n !!filteredTools.length &&\n filteredTools.some((tool) => disabledTools.includes(tool.key))\n }\n noCheckboxesAvailable={!filteredTools.length}\n onClick={handleSelectAll}\n />\n ),\n [disabledTools, handleSelectAll, filteredTools]\n )\n\n useHeader(t(`settings.enabled${type}`), headerAction)\n\n const handleSearchInputChange: ChangeEventHandler<HTMLInputElement> =\n useCallback((e) => {\n setSearchValue(e.target.value)\n listRef.current?.scrollTo(0, 0)\n }, [])\n\n const debouncedSearchInputChange = debounce(handleSearchInputChange, 250)\n\n return (\n <PageContainer disableGutters>\n <Box ref={headerRef} sx={{ px: 3, pb: 2, pt: 1.5 }}>\n <SearchInput\n onChange={debouncedSearchInputChange}\n placeholder={t(`main.search${type}`)}\n autoFocus\n />\n </Box>\n <Box ref={listRef} style={{ height: listHeight, overflow: 'auto' }}>\n <Tools filteredTools={filteredTools} type={type} />\n </Box>\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;AAoBA,MAAM,oBAAoB,MACvB,EACC,uBACA,uBACA,uBACA,cACI;CACJ,MAAM,EAAE,MAAM,eAAe;
|
|
1
|
+
{"version":3,"file":"SelectEnabledToolsPage.js","names":[],"sources":["../../../src/pages/SelectEnabledToolsPage.tsx"],"sourcesContent":["import { Box, Checkbox, debounce, Tooltip } from '@mui/material'\nimport type { ChangeEvent, ChangeEventHandler } from 'react'\nimport { memo, useCallback, useMemo, useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { PageContainer } from '../components/PageContainer.js'\nimport { SearchInput } from '../components/Search/SearchInput.js'\nimport { type ToolCollectionTypes, Tools } from '../components/Tools/Tools.js'\nimport { useHeader } from '../hooks/useHeader.js'\nimport { useListHeight } from '../hooks/useListHeight.js'\nimport { useTools } from '../hooks/useTools.js'\nimport { useSettingsStore } from '../stores/settings/SettingsStore.js'\nimport { useSettingsActions } from '../stores/settings/useSettingsActions.js'\n\ninterface SelectAllCheckboxProps {\n allCheckboxesSelected: boolean\n onClick: (event: ChangeEvent<HTMLInputElement>, checked: boolean) => void\n anyCheckboxesSelected: boolean\n noCheckboxesAvailable: boolean\n}\n\nconst SelectAllCheckbox = memo<SelectAllCheckboxProps>(\n ({\n allCheckboxesSelected,\n anyCheckboxesSelected,\n noCheckboxesAvailable,\n onClick,\n }) => {\n const { t } = useTranslation()\n const tooltipTitle = noCheckboxesAvailable\n ? undefined\n : allCheckboxesSelected\n ? t('tooltip.deselectAll')\n : t('tooltip.selectAll')\n\n return (\n <Tooltip title={tooltipTitle}>\n <Checkbox\n id=\"select-all\"\n checked={allCheckboxesSelected}\n indeterminate={anyCheckboxesSelected && !allCheckboxesSelected}\n onChange={onClick}\n disabled={noCheckboxesAvailable}\n sx={{ mr: -1.5, height: 20 }}\n />\n </Tooltip>\n )\n }\n)\n\nexport const SelectEnabledToolsPage: React.FC<{\n type: 'Bridges' | 'Exchanges'\n}> = ({ type }) => {\n const typeKey = type.toLowerCase() as 'bridges' | 'exchanges'\n const { tools } = useTools()\n const { toggleToolKeys } = useSettingsActions()\n\n const disabledTools = useSettingsStore((state) => state[`disabled${type}`])\n\n const { t } = useTranslation()\n const headerRef = useRef<HTMLElement>(null)\n const listRef = useRef<HTMLDivElement>(null)\n const [searchValue, setSearchValue] = useState('')\n\n const { listHeight } = useListHeight({\n listParentRef: listRef,\n headerRef,\n })\n\n const filteredTools = useMemo(() => {\n const toolsList = tools?.[typeKey] ?? []\n\n if (!searchValue) {\n return toolsList\n }\n\n const lowerSearchValue = searchValue.toLowerCase()\n return toolsList.filter((tool) =>\n tool.name.toLowerCase().includes(lowerSearchValue)\n ) as ToolCollectionTypes\n }, [tools, typeKey, searchValue])\n\n const handleSelectAll = useCallback(() => {\n toggleToolKeys(\n type,\n filteredTools.map((tool) => tool.key)\n )\n }, [toggleToolKeys, type, filteredTools])\n\n const headerAction = useMemo(\n () => (\n <SelectAllCheckbox\n allCheckboxesSelected={\n !!filteredTools.length &&\n filteredTools.every((tool) => !disabledTools.includes(tool.key))\n }\n anyCheckboxesSelected={\n !!filteredTools.length &&\n filteredTools.some((tool) => disabledTools.includes(tool.key))\n }\n noCheckboxesAvailable={!filteredTools.length}\n onClick={handleSelectAll}\n />\n ),\n [disabledTools, handleSelectAll, filteredTools]\n )\n\n useHeader(t(`settings.enabled${type}`), headerAction)\n\n const handleSearchInputChange: ChangeEventHandler<HTMLInputElement> =\n useCallback((e) => {\n setSearchValue(e.target.value)\n listRef.current?.scrollTo(0, 0)\n }, [])\n\n const debouncedSearchInputChange = debounce(handleSearchInputChange, 250)\n\n return (\n <PageContainer disableGutters>\n <Box ref={headerRef} sx={{ px: 3, pb: 2, pt: 1.5 }}>\n <SearchInput\n onChange={debouncedSearchInputChange}\n placeholder={t(`main.search${type}`)}\n autoFocus\n />\n </Box>\n <Box ref={listRef} style={{ height: listHeight, overflow: 'auto' }}>\n <Tools filteredTools={filteredTools} type={type} />\n </Box>\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;AAoBA,MAAM,oBAAoB,MACvB,EACC,uBACA,uBACA,uBACA,cACI;CACJ,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,eAAe,wBACjB,KAAA,IACA,wBACE,EAAE,qBAAqB,IACvB,EAAE,mBAAmB;CAE3B,OACE,oBAAC,SAAD;EAAS,OAAO;EACd,UAAA,oBAAC,UAAD;GACE,IAAG;GACH,SAAS;GACT,eAAe,yBAAyB,CAAC;GACzC,UAAU;GACV,UAAU;GACV,IAAI;IAAE,IAAI;IAAM,QAAQ;GAAG;EAC5B,CAAA;CACM,CAAA;AAEb,CACF;AAEA,MAAa,0BAEP,EAAE,WAAW;CACjB,MAAM,UAAU,KAAK,YAAY;CACjC,MAAM,EAAE,UAAU,SAAS;CAC3B,MAAM,EAAE,mBAAmB,mBAAmB;CAE9C,MAAM,gBAAgB,kBAAkB,UAAU,MAAM,WAAW,OAAO;CAE1E,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,YAAY,OAAoB,IAAI;CAC1C,MAAM,UAAU,OAAuB,IAAI;CAC3C,MAAM,CAAC,aAAa,kBAAkB,SAAS,EAAE;CAEjD,MAAM,EAAE,eAAe,cAAc;EACnC,eAAe;EACf;CACF,CAAC;CAED,MAAM,gBAAgB,cAAc;EAClC,MAAM,YAAY,QAAQ,YAAY,CAAC;EAEvC,IAAI,CAAC,aACH,OAAO;EAGT,MAAM,mBAAmB,YAAY,YAAY;EACjD,OAAO,UAAU,QAAQ,SACvB,KAAK,KAAK,YAAY,CAAC,CAAC,SAAS,gBAAgB,CACnD;CACF,GAAG;EAAC;EAAO;EAAS;CAAW,CAAC;CAEhC,MAAM,kBAAkB,kBAAkB;EACxC,eACE,MACA,cAAc,KAAK,SAAS,KAAK,GAAG,CACtC;CACF,GAAG;EAAC;EAAgB;EAAM;CAAa,CAAC;CAExC,MAAM,eAAe,cAEjB,oBAAC,mBAAD;EACE,uBACE,CAAC,CAAC,cAAc,UAChB,cAAc,OAAO,SAAS,CAAC,cAAc,SAAS,KAAK,GAAG,CAAC;EAEjE,uBACE,CAAC,CAAC,cAAc,UAChB,cAAc,MAAM,SAAS,cAAc,SAAS,KAAK,GAAG,CAAC;EAE/D,uBAAuB,CAAC,cAAc;EACtC,SAAS;CACV,CAAA,GAEH;EAAC;EAAe;EAAiB;CAAa,CAChD;CAEA,UAAU,EAAE,mBAAmB,MAAM,GAAG,YAAY;CAEpD,MAAM,0BACJ,aAAa,MAAM;EACjB,eAAe,EAAE,OAAO,KAAK;EAC7B,QAAQ,SAAS,SAAS,GAAG,CAAC;CAChC,GAAG,CAAC,CAAC;CAEP,MAAM,6BAA6B,SAAS,yBAAyB,GAAG;CAExE,OACE,qBAAC,eAAD;EAAe,gBAAA;EAAf,UAAA,CACE,oBAAC,KAAD;GAAK,KAAK;GAAW,IAAI;IAAE,IAAI;IAAG,IAAI;IAAG,IAAI;GAAI;GAC/C,UAAA,oBAAC,aAAD;IACE,UAAU;IACV,aAAa,EAAE,cAAc,MAAM;IACnC,WAAA;GACD,CAAA;EACE,CAAA,GACL,oBAAC,KAAD;GAAK,KAAK;GAAS,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;GAC/D,UAAA,oBAAC,OAAD;IAAsB;IAAqB;GAAO,CAAA;EAC/C,CAAA,CACQ;;AAEnB"}
|
|
@@ -17,7 +17,8 @@ const SelectTokenPage = ({ formType }) => {
|
|
|
17
17
|
const { mode, hiddenUI } = useWidgetConfig();
|
|
18
18
|
const wideVariant = useWideVariant();
|
|
19
19
|
const { t } = useTranslation();
|
|
20
|
-
|
|
20
|
+
const title = formType === "from" ? mode === "custom" ? t("header.payWith") : t("header.from") : t("header.to");
|
|
21
|
+
useHeader(title);
|
|
21
22
|
const hideChainSelect = wideVariant && !hiddenUI?.chainSidebar || swapOnly && formType === "to" || hiddenUI?.chainSelect;
|
|
22
23
|
const isMobile = useMediaQuery((theme) => theme.breakpoints.down(theme.breakpoints.values.xs));
|
|
23
24
|
const hideSearchTokenInput = hiddenUI?.searchTokenInput;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SelectTokenPage.js","names":[],"sources":["../../../../src/pages/SelectTokenPage/SelectTokenPage.tsx"],"sourcesContent":["import { Box, type Theme, useMediaQuery } from '@mui/material'\nimport type { FC } from 'react'\nimport { useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ChainSelect } from '../../components/ChainSelect/ChainSelect.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { TokenList } from '../../components/TokenList/TokenList.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useSwapOnly } from '../../hooks/useSwapOnly.js'\nimport { useWideVariant } from '../../hooks/useWideVariant.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { SearchTokenInput } from './SearchTokenInput.js'\n\nexport const SelectTokenPage: FC<FormTypeProps> = ({ formType }) => {\n const headerRef = useRef<HTMLElement>(null)\n\n const swapOnly = useSwapOnly()\n\n const { mode, hiddenUI } = useWidgetConfig()\n const wideVariant = useWideVariant()\n\n const { t } = useTranslation()\n const title =\n formType === 'from'\n ? mode === 'custom'\n ? t('header.payWith')\n : t('header.from')\n : t('header.to')\n\n useHeader(title)\n\n const hideChainSelect =\n (wideVariant && !hiddenUI?.chainSidebar) ||\n (swapOnly && formType === 'to') ||\n hiddenUI?.chainSelect\n\n const isMobile = useMediaQuery((theme: Theme) =>\n theme.breakpoints.down(theme.breakpoints.values.xs)\n )\n const hideSearchTokenInput = hiddenUI?.searchTokenInput\n\n const hasHeader = !hideChainSelect || !hideSearchTokenInput\n\n return (\n <PageContainer disableGutters>\n <Box\n ref={headerRef}\n sx={{\n pt: 1.5,\n pb: hasHeader ? 2 : 0,\n px: 3,\n }}\n >\n {!hideChainSelect ? <ChainSelect formType={formType} /> : null}\n {!hideSearchTokenInput && (\n <Box\n sx={{\n mt: !hideChainSelect ? 2 : 0,\n }}\n >\n <SearchTokenInput formType={formType} />\n </Box>\n )}\n </Box>\n <TokenList\n // Rerender component if variant changes (since chains tiles change height)\n key={\n hideChainSelect\n ? 'without-offset'\n : isMobile\n ? 'with-offset-mobile'\n : 'with-offset'\n }\n headerRef={headerRef}\n formType={formType}\n />\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;AAcA,MAAa,mBAAsC,EAAE,eAAe;CAClE,MAAM,YAAY,OAAoB,IAAI;CAE1C,MAAM,WAAW,YAAY;CAE7B,MAAM,EAAE,MAAM,aAAa,gBAAgB;CAC3C,MAAM,cAAc,eAAe;CAEnC,MAAM,EAAE,MAAM,eAAe;
|
|
1
|
+
{"version":3,"file":"SelectTokenPage.js","names":[],"sources":["../../../../src/pages/SelectTokenPage/SelectTokenPage.tsx"],"sourcesContent":["import { Box, type Theme, useMediaQuery } from '@mui/material'\nimport type { FC } from 'react'\nimport { useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { ChainSelect } from '../../components/ChainSelect/ChainSelect.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { TokenList } from '../../components/TokenList/TokenList.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useSwapOnly } from '../../hooks/useSwapOnly.js'\nimport { useWideVariant } from '../../hooks/useWideVariant.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type { FormTypeProps } from '../../stores/form/types.js'\nimport { SearchTokenInput } from './SearchTokenInput.js'\n\nexport const SelectTokenPage: FC<FormTypeProps> = ({ formType }) => {\n const headerRef = useRef<HTMLElement>(null)\n\n const swapOnly = useSwapOnly()\n\n const { mode, hiddenUI } = useWidgetConfig()\n const wideVariant = useWideVariant()\n\n const { t } = useTranslation()\n const title =\n formType === 'from'\n ? mode === 'custom'\n ? t('header.payWith')\n : t('header.from')\n : t('header.to')\n\n useHeader(title)\n\n const hideChainSelect =\n (wideVariant && !hiddenUI?.chainSidebar) ||\n (swapOnly && formType === 'to') ||\n hiddenUI?.chainSelect\n\n const isMobile = useMediaQuery((theme: Theme) =>\n theme.breakpoints.down(theme.breakpoints.values.xs)\n )\n const hideSearchTokenInput = hiddenUI?.searchTokenInput\n\n const hasHeader = !hideChainSelect || !hideSearchTokenInput\n\n return (\n <PageContainer disableGutters>\n <Box\n ref={headerRef}\n sx={{\n pt: 1.5,\n pb: hasHeader ? 2 : 0,\n px: 3,\n }}\n >\n {!hideChainSelect ? <ChainSelect formType={formType} /> : null}\n {!hideSearchTokenInput && (\n <Box\n sx={{\n mt: !hideChainSelect ? 2 : 0,\n }}\n >\n <SearchTokenInput formType={formType} />\n </Box>\n )}\n </Box>\n <TokenList\n // Rerender component if variant changes (since chains tiles change height)\n key={\n hideChainSelect\n ? 'without-offset'\n : isMobile\n ? 'with-offset-mobile'\n : 'with-offset'\n }\n headerRef={headerRef}\n formType={formType}\n />\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;AAcA,MAAa,mBAAsC,EAAE,eAAe;CAClE,MAAM,YAAY,OAAoB,IAAI;CAE1C,MAAM,WAAW,YAAY;CAE7B,MAAM,EAAE,MAAM,aAAa,gBAAgB;CAC3C,MAAM,cAAc,eAAe;CAEnC,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,QACJ,aAAa,SACT,SAAS,WACP,EAAE,gBAAgB,IAClB,EAAE,aAAa,IACjB,EAAE,WAAW;CAEnB,UAAU,KAAK;CAEf,MAAM,kBACH,eAAe,CAAC,UAAU,gBAC1B,YAAY,aAAa,QAC1B,UAAU;CAEZ,MAAM,WAAW,eAAe,UAC9B,MAAM,YAAY,KAAK,MAAM,YAAY,OAAO,EAAE,CACpD;CACA,MAAM,uBAAuB,UAAU;CAIvC,OACE,qBAAC,eAAD;EAAe,gBAAA;EAAf,UAAA,CACE,qBAAC,KAAD;GACE,KAAK;GACL,IAAI;IACF,IAAI;IACJ,IARU,CAAC,mBAAmB,CAAC,uBAQf,IAAI;IACpB,IAAI;GACN;GANF,UAAA,CAQG,CAAC,kBAAkB,oBAAC,aAAD,EAAuB,SAAW,CAAA,IAAI,MACzD,CAAC,wBACA,oBAAC,KAAD;IACE,IAAI,EACF,IAAI,CAAC,kBAAkB,IAAI,EAC7B;IAEA,UAAA,oBAAC,kBAAD,EAA4B,SAAW,CAAA;GACpC,CAAA,CAEJ;EACL,CAAA,GAAA,oBAAC,WAAD;GASa;GACD;EACX,GARG,kBACI,mBACA,WACE,uBACA,aAIT,CACY;;AAEnB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BookmarkAddressSheet.js","names":[],"sources":["../../../../src/pages/SendToWallet/BookmarkAddressSheet.tsx"],"sourcesContent":["import ErrorIcon from '@mui/icons-material/Error'\nimport TurnedIn from '@mui/icons-material/TurnedIn'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Button, Typography } from '@mui/material'\nimport type { ChangeEvent, JSX, Ref, RefObject } from 'react'\nimport { useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { BottomSheet } from '../../components/BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { Input } from '../../components/Input.js'\nimport { AlertMessage } from '../../components/Messages/AlertMessage.js'\nimport { useAddressValidation } from '../../hooks/useAddressValidation.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport {\n AddressInput,\n BookmarkInputFields,\n IconContainer,\n SendToWalletButtonRow,\n SendToWalletCard,\n SendToWalletSheetContainer,\n SheetAddressContainer,\n SheetTitle,\n ValidationAlert,\n} from './SendToWalletPage.style.js'\nimport type { BookmarkError } from './types.js'\n\ninterface BookmarkAddressProps {\n onAddBookmark: (bookmark: Bookmark) => void\n validatedWallet?: Bookmark\n}\n\nexport const BookmarkAddressSheet = ({\n validatedWallet,\n onAddBookmark,\n ref,\n}: BookmarkAddressProps & {\n ref?: Ref<BottomSheetBase>\n}): JSX.Element => {\n const { t } = useTranslation()\n const [name, setName] = useState('')\n const [address, setAddress] = useState('')\n const [error, setError] = useState<BookmarkError>()\n const { validateAddress, isValidating } = useAddressValidation()\n const { getBookmark } = useBookmarkActions()\n\n const nameValue = name.trim() || validatedWallet?.name || ''\n const addressValue = address || validatedWallet?.address || ''\n\n const handleCancel = () => {\n setError(undefined)\n ;(ref as RefObject<BottomSheetBase>).current?.close()\n }\n\n const validateWithAddressFromInput = async () => {\n const validationResult = await validateAddress({ value: address })\n if (!validationResult.isValid) {\n setError({ type: 'address', message: validationResult.error })\n return\n }\n\n return {\n name: nameValue,\n address: validationResult.address,\n chainType: validationResult.chainType,\n }\n }\n\n const validateWithValidatedWallet = (validatedWallet: Bookmark) => {\n if (error) {\n setError(undefined)\n }\n return {\n name: nameValue,\n address: validatedWallet.address,\n chainType: validatedWallet.chainType,\n }\n }\n\n const handleBookmark = async () => {\n if (isValidating) {\n return\n }\n if (!nameValue) {\n setError({\n type: 'name',\n message: t('error.title.bookmarkNameRequired'),\n })\n return\n }\n if (!addressValue) {\n setError({\n type: 'address',\n message: t('error.title.walletAddressRequired'),\n })\n return\n }\n\n // If the validatedWallet is supplied as a prop then we should assume\n // the address has already been validated\n const validatedBookmark = validatedWallet\n ? validateWithValidatedWallet(validatedWallet)\n : await validateWithAddressFromInput()\n\n if (validatedBookmark) {\n const existingBookmark = getBookmark(validatedBookmark.address)\n if (existingBookmark) {\n setError({\n type: 'address',\n message: t('error.title.bookmarkAlreadyExists', {\n name: existingBookmark.name,\n }),\n })\n return\n }\n ;(ref as RefObject<BottomSheetBase>).current?.close()\n\n onAddBookmark({\n name: validatedBookmark.name,\n address: validatedBookmark.address,\n chainType: validatedBookmark.chainType,\n })\n }\n }\n\n const handleAddressInputChange = (e: ChangeEvent) => {\n if (error) {\n setError(undefined)\n }\n setAddress((e.target as HTMLInputElement).value.trim())\n }\n\n const handleNameInputChange = (e: ChangeEvent) => {\n if (error) {\n setError(undefined)\n }\n setName((e.target as HTMLInputElement).value)\n }\n\n const resetValues = () => {\n setName('')\n setAddress('')\n }\n\n return (\n <BottomSheet ref={ref} onClose={resetValues}>\n <SendToWalletSheetContainer>\n <IconContainer>\n <TurnedIn sx={{ fontSize: 40 }} />\n </IconContainer>\n <SheetTitle>{t('sendToWallet.bookmarkWallet')}</SheetTitle>\n {validatedWallet ? (\n <SheetAddressContainer>\n {validatedWallet?.name ? (\n <Typography\n sx={{\n fontWeight: 600,\n mb: 0.5,\n }}\n >\n {validatedWallet?.name}\n </Typography>\n ) : null}\n <Typography>{validatedWallet?.address}</Typography>\n </SheetAddressContainer>\n ) : null}\n <BookmarkInputFields>\n <SendToWalletCard type={error?.type === 'name' ? 'error' : 'default'}>\n <Input\n size=\"small\"\n autoComplete=\"off\"\n autoCorrect=\"off\"\n autoCapitalize=\"off\"\n spellCheck=\"false\"\n onChange={handleNameInputChange}\n value={name}\n placeholder={validatedWallet?.name || t('sendToWallet.enterName')}\n aria-label={validatedWallet?.name || t('sendToWallet.enterName')}\n inputProps={{ maxLength: 128 }}\n />\n </SendToWalletCard>\n {!validatedWallet && (\n <SendToWalletCard\n type={error?.type === 'address' ? 'error' : 'default'}\n >\n <AddressInput\n size=\"small\"\n autoComplete=\"off\"\n autoCorrect=\"off\"\n autoCapitalize=\"off\"\n spellCheck=\"false\"\n onChange={handleAddressInputChange}\n value={address}\n placeholder={t('sendToWallet.enterAddress', {\n context: 'long',\n })}\n aria-label={t('sendToWallet.enterAddress', {\n context: 'long',\n })}\n maxRows={2}\n inputProps={{ maxLength: 128 }}\n multiline\n />\n </SendToWalletCard>\n )}\n {error ? (\n <ValidationAlert icon={<ErrorIcon />}>\n {error.message}\n </ValidationAlert>\n ) : null}\n </BookmarkInputFields>\n <AlertMessage\n title={\n <Typography variant=\"body2\" sx={{ color: 'text.primary' }}>\n {t('warning.message.fundsLossPrevention')}\n </Typography>\n }\n icon={<WarningRounded />}\n />\n <SendToWalletButtonRow>\n <Button variant=\"text\" onClick={handleCancel} fullWidth>\n {t('button.cancel')}\n </Button>\n <Button\n variant=\"contained\"\n onClick={handleBookmark}\n loading={isValidating}\n loadingPosition=\"center\"\n fullWidth\n focusRipple\n >\n {t('button.bookmark')}\n </Button>\n </SendToWalletButtonRow>\n </SendToWalletSheetContainer>\n </BottomSheet>\n )\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"BookmarkAddressSheet.js","names":[],"sources":["../../../../src/pages/SendToWallet/BookmarkAddressSheet.tsx"],"sourcesContent":["import ErrorIcon from '@mui/icons-material/Error'\nimport TurnedIn from '@mui/icons-material/TurnedIn'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Button, Typography } from '@mui/material'\nimport type { ChangeEvent, JSX, Ref, RefObject } from 'react'\nimport { useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { BottomSheet } from '../../components/BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { Input } from '../../components/Input.js'\nimport { AlertMessage } from '../../components/Messages/AlertMessage.js'\nimport { useAddressValidation } from '../../hooks/useAddressValidation.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport {\n AddressInput,\n BookmarkInputFields,\n IconContainer,\n SendToWalletButtonRow,\n SendToWalletCard,\n SendToWalletSheetContainer,\n SheetAddressContainer,\n SheetTitle,\n ValidationAlert,\n} from './SendToWalletPage.style.js'\nimport type { BookmarkError } from './types.js'\n\ninterface BookmarkAddressProps {\n onAddBookmark: (bookmark: Bookmark) => void\n validatedWallet?: Bookmark\n}\n\nexport const BookmarkAddressSheet = ({\n validatedWallet,\n onAddBookmark,\n ref,\n}: BookmarkAddressProps & {\n ref?: Ref<BottomSheetBase>\n}): JSX.Element => {\n const { t } = useTranslation()\n const [name, setName] = useState('')\n const [address, setAddress] = useState('')\n const [error, setError] = useState<BookmarkError>()\n const { validateAddress, isValidating } = useAddressValidation()\n const { getBookmark } = useBookmarkActions()\n\n const nameValue = name.trim() || validatedWallet?.name || ''\n const addressValue = address || validatedWallet?.address || ''\n\n const handleCancel = () => {\n setError(undefined)\n ;(ref as RefObject<BottomSheetBase>).current?.close()\n }\n\n const validateWithAddressFromInput = async () => {\n const validationResult = await validateAddress({ value: address })\n if (!validationResult.isValid) {\n setError({ type: 'address', message: validationResult.error })\n return\n }\n\n return {\n name: nameValue,\n address: validationResult.address,\n chainType: validationResult.chainType,\n }\n }\n\n const validateWithValidatedWallet = (validatedWallet: Bookmark) => {\n if (error) {\n setError(undefined)\n }\n return {\n name: nameValue,\n address: validatedWallet.address,\n chainType: validatedWallet.chainType,\n }\n }\n\n const handleBookmark = async () => {\n if (isValidating) {\n return\n }\n if (!nameValue) {\n setError({\n type: 'name',\n message: t('error.title.bookmarkNameRequired'),\n })\n return\n }\n if (!addressValue) {\n setError({\n type: 'address',\n message: t('error.title.walletAddressRequired'),\n })\n return\n }\n\n // If the validatedWallet is supplied as a prop then we should assume\n // the address has already been validated\n const validatedBookmark = validatedWallet\n ? validateWithValidatedWallet(validatedWallet)\n : await validateWithAddressFromInput()\n\n if (validatedBookmark) {\n const existingBookmark = getBookmark(validatedBookmark.address)\n if (existingBookmark) {\n setError({\n type: 'address',\n message: t('error.title.bookmarkAlreadyExists', {\n name: existingBookmark.name,\n }),\n })\n return\n }\n ;(ref as RefObject<BottomSheetBase>).current?.close()\n\n onAddBookmark({\n name: validatedBookmark.name,\n address: validatedBookmark.address,\n chainType: validatedBookmark.chainType,\n })\n }\n }\n\n const handleAddressInputChange = (e: ChangeEvent) => {\n if (error) {\n setError(undefined)\n }\n setAddress((e.target as HTMLInputElement).value.trim())\n }\n\n const handleNameInputChange = (e: ChangeEvent) => {\n if (error) {\n setError(undefined)\n }\n setName((e.target as HTMLInputElement).value)\n }\n\n const resetValues = () => {\n setName('')\n setAddress('')\n }\n\n return (\n <BottomSheet ref={ref} onClose={resetValues}>\n <SendToWalletSheetContainer>\n <IconContainer>\n <TurnedIn sx={{ fontSize: 40 }} />\n </IconContainer>\n <SheetTitle>{t('sendToWallet.bookmarkWallet')}</SheetTitle>\n {validatedWallet ? (\n <SheetAddressContainer>\n {validatedWallet?.name ? (\n <Typography\n sx={{\n fontWeight: 600,\n mb: 0.5,\n }}\n >\n {validatedWallet?.name}\n </Typography>\n ) : null}\n <Typography>{validatedWallet?.address}</Typography>\n </SheetAddressContainer>\n ) : null}\n <BookmarkInputFields>\n <SendToWalletCard type={error?.type === 'name' ? 'error' : 'default'}>\n <Input\n size=\"small\"\n autoComplete=\"off\"\n autoCorrect=\"off\"\n autoCapitalize=\"off\"\n spellCheck=\"false\"\n onChange={handleNameInputChange}\n value={name}\n placeholder={validatedWallet?.name || t('sendToWallet.enterName')}\n aria-label={validatedWallet?.name || t('sendToWallet.enterName')}\n inputProps={{ maxLength: 128 }}\n />\n </SendToWalletCard>\n {!validatedWallet && (\n <SendToWalletCard\n type={error?.type === 'address' ? 'error' : 'default'}\n >\n <AddressInput\n size=\"small\"\n autoComplete=\"off\"\n autoCorrect=\"off\"\n autoCapitalize=\"off\"\n spellCheck=\"false\"\n onChange={handleAddressInputChange}\n value={address}\n placeholder={t('sendToWallet.enterAddress', {\n context: 'long',\n })}\n aria-label={t('sendToWallet.enterAddress', {\n context: 'long',\n })}\n maxRows={2}\n inputProps={{ maxLength: 128 }}\n multiline\n />\n </SendToWalletCard>\n )}\n {error ? (\n <ValidationAlert icon={<ErrorIcon />}>\n {error.message}\n </ValidationAlert>\n ) : null}\n </BookmarkInputFields>\n <AlertMessage\n title={\n <Typography variant=\"body2\" sx={{ color: 'text.primary' }}>\n {t('warning.message.fundsLossPrevention')}\n </Typography>\n }\n icon={<WarningRounded />}\n />\n <SendToWalletButtonRow>\n <Button variant=\"text\" onClick={handleCancel} fullWidth>\n {t('button.cancel')}\n </Button>\n <Button\n variant=\"contained\"\n onClick={handleBookmark}\n loading={isValidating}\n loadingPosition=\"center\"\n fullWidth\n focusRipple\n >\n {t('button.bookmark')}\n </Button>\n </SendToWalletButtonRow>\n </SendToWalletSheetContainer>\n </BottomSheet>\n )\n}\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BookmarksPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/BookmarksPage.tsx"],"sourcesContent":["import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport DeleteOutline from '@mui/icons-material/DeleteOutlined'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport TurnedIn from '@mui/icons-material/TurnedIn'\nimport { Button, List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { EmptyListIndicator } from '../../components/EmptyListIndicator/EmptyListIndicator.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useBookmarks } from '../../stores/bookmarks/useBookmarks.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { defaultChainIdsByType } from '../../utils/chainType.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { BookmarkAddressSheet } from './BookmarkAddressSheet.js'\nimport { BookmarkButtonContainer } from './SendToWalletPage.style.js'\n\nexport const BookmarksPage = (): JSX.Element => {\n const { t } = useTranslation()\n const bookmarkAddressSheetRef = useRef<BottomSheetBase>(null)\n const listParentRef = useRef<HTMLUListElement | null>(null)\n const buttonRef = useRef<HTMLDivElement | null>(null)\n const { bookmarks } = useBookmarks()\n const { requiredToChainType } = useToAddressRequirements()\n const { addBookmark, removeBookmark, setSelectedBookmark } =\n useBookmarkActions()\n const navigate = useNavigate()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n\n useHeader(t('header.bookmarkedWallets'))\n\n const { listHeight } = useListHeight({\n listParentRef,\n headerRef: buttonRef,\n })\n\n const handleAddBookmark = () => {\n bookmarkAddressSheetRef.current?.open()\n }\n\n const handleBookmarkSelected = (bookmark: Bookmark) => {\n setFieldValue('toAddress', bookmark.address, {\n isTouched: true,\n isDirty: true,\n })\n setSelectedBookmark(bookmark)\n navigate({ to: navigationRoutes.home, replace: true })\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {bookmarks.map((bookmark) => (\n <ListItem key={bookmark.address} sx={{ position: 'relative' }}>\n <ListItemButton\n onClick={() => handleBookmarkSelected(bookmark)}\n disabled={\n requiredToChainType &&\n requiredToChainType !== bookmark.chainType\n }\n >\n <ListItemAvatar>\n <AccountAvatar\n chainId={defaultChainIdsByType[bookmark.chainType]}\n />\n </ListItemAvatar>\n <ListItemText\n primary={bookmark.name}\n secondary={shortenAddress(bookmark.address)}\n />\n </ListItemButton>\n <ContextMenu\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== bookmark.chainType\n )\n }\n items={[\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () =>\n navigator.clipboard.writeText(bookmark.address),\n },\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () =>\n window.open(\n getAddressLink(\n bookmark.address,\n defaultChainIdsByType[bookmark.chainType]\n ),\n '_blank'\n ),\n },\n {\n icon: <DeleteOutline />,\n label: t('button.delete'),\n onClick: () => removeBookmark(bookmark.address),\n },\n ]}\n />\n </ListItem>\n ))}\n {!bookmarks.length && (\n <EmptyListIndicator\n icon={<TurnedIn />}\n title={t('sendToWallet.noBookmarkedWallets')}\n message={t('sendToWallet.noBookmarkedWalletsMessage')}\n />\n )}\n </List>\n <BookmarkButtonContainer ref={buttonRef}>\n <Button variant=\"contained\" onClick={handleAddBookmark}>\n {t('sendToWallet.addBookmark')}\n </Button>\n </BookmarkButtonContainer>\n <BookmarkAddressSheet\n ref={bookmarkAddressSheetRef}\n onAddBookmark={addBookmark}\n />\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BA,MAAa,sBAAmC;CAC9C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,0BAA0B,OAAwB,IAAI;CAC5D,MAAM,gBAAgB,OAAgC,IAAI;CAC1D,MAAM,YAAY,OAA8B,IAAI;CACpD,MAAM,EAAE,cAAc,aAAa;CACnC,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,EAAE,aAAa,gBAAgB,wBACnC,mBAAmB;CACrB,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CAEvC,UAAU,EAAE,0BAA0B,CAAC;CAEvC,MAAM,EAAE,eAAe,cAAc;EACnC;EACA,WAAW;CACb,CAAC;CAED,MAAM,0BAA0B;EAC9B,wBAAwB,SAAS,KAAK;CACxC;CAEA,MAAM,0BAA0B,aAAuB;EACrD,cAAc,aAAa,SAAS,SAAS;GAC3C,WAAW;GACX,SAAS;EACX,CAAC;EACD,oBAAoB,QAAQ;EAC5B,SAAS;GAAE,IAAI,iBAAiB;GAAM,SAAS;EAAK,CAAC;CACvD;CAEA,OACE,qBAAC,eAAD;EAAe,gBAAA;
|
|
1
|
+
{"version":3,"file":"BookmarksPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/BookmarksPage.tsx"],"sourcesContent":["import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport DeleteOutline from '@mui/icons-material/DeleteOutlined'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport TurnedIn from '@mui/icons-material/TurnedIn'\nimport { Button, List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { EmptyListIndicator } from '../../components/EmptyListIndicator/EmptyListIndicator.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useBookmarks } from '../../stores/bookmarks/useBookmarks.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { defaultChainIdsByType } from '../../utils/chainType.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { BookmarkAddressSheet } from './BookmarkAddressSheet.js'\nimport { BookmarkButtonContainer } from './SendToWalletPage.style.js'\n\nexport const BookmarksPage = (): JSX.Element => {\n const { t } = useTranslation()\n const bookmarkAddressSheetRef = useRef<BottomSheetBase>(null)\n const listParentRef = useRef<HTMLUListElement | null>(null)\n const buttonRef = useRef<HTMLDivElement | null>(null)\n const { bookmarks } = useBookmarks()\n const { requiredToChainType } = useToAddressRequirements()\n const { addBookmark, removeBookmark, setSelectedBookmark } =\n useBookmarkActions()\n const navigate = useNavigate()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n\n useHeader(t('header.bookmarkedWallets'))\n\n const { listHeight } = useListHeight({\n listParentRef,\n headerRef: buttonRef,\n })\n\n const handleAddBookmark = () => {\n bookmarkAddressSheetRef.current?.open()\n }\n\n const handleBookmarkSelected = (bookmark: Bookmark) => {\n setFieldValue('toAddress', bookmark.address, {\n isTouched: true,\n isDirty: true,\n })\n setSelectedBookmark(bookmark)\n navigate({ to: navigationRoutes.home, replace: true })\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {bookmarks.map((bookmark) => (\n <ListItem key={bookmark.address} sx={{ position: 'relative' }}>\n <ListItemButton\n onClick={() => handleBookmarkSelected(bookmark)}\n disabled={\n requiredToChainType &&\n requiredToChainType !== bookmark.chainType\n }\n >\n <ListItemAvatar>\n <AccountAvatar\n chainId={defaultChainIdsByType[bookmark.chainType]}\n />\n </ListItemAvatar>\n <ListItemText\n primary={bookmark.name}\n secondary={shortenAddress(bookmark.address)}\n />\n </ListItemButton>\n <ContextMenu\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== bookmark.chainType\n )\n }\n items={[\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () =>\n navigator.clipboard.writeText(bookmark.address),\n },\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () =>\n window.open(\n getAddressLink(\n bookmark.address,\n defaultChainIdsByType[bookmark.chainType]\n ),\n '_blank'\n ),\n },\n {\n icon: <DeleteOutline />,\n label: t('button.delete'),\n onClick: () => removeBookmark(bookmark.address),\n },\n ]}\n />\n </ListItem>\n ))}\n {!bookmarks.length && (\n <EmptyListIndicator\n icon={<TurnedIn />}\n title={t('sendToWallet.noBookmarkedWallets')}\n message={t('sendToWallet.noBookmarkedWalletsMessage')}\n />\n )}\n </List>\n <BookmarkButtonContainer ref={buttonRef}>\n <Button variant=\"contained\" onClick={handleAddBookmark}>\n {t('sendToWallet.addBookmark')}\n </Button>\n </BookmarkButtonContainer>\n <BookmarkAddressSheet\n ref={bookmarkAddressSheetRef}\n onAddBookmark={addBookmark}\n />\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BA,MAAa,sBAAmC;CAC9C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,0BAA0B,OAAwB,IAAI;CAC5D,MAAM,gBAAgB,OAAgC,IAAI;CAC1D,MAAM,YAAY,OAA8B,IAAI;CACpD,MAAM,EAAE,cAAc,aAAa;CACnC,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,EAAE,aAAa,gBAAgB,wBACnC,mBAAmB;CACrB,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CAEvC,UAAU,EAAE,0BAA0B,CAAC;CAEvC,MAAM,EAAE,eAAe,cAAc;EACnC;EACA,WAAW;CACb,CAAC;CAED,MAAM,0BAA0B;EAC9B,wBAAwB,SAAS,KAAK;CACxC;CAEA,MAAM,0BAA0B,aAAuB;EACrD,cAAc,aAAa,SAAS,SAAS;GAC3C,WAAW;GACX,SAAS;EACX,CAAC;EACD,oBAAoB,QAAQ;EAC5B,SAAS;GAAE,IAAI,iBAAiB;GAAM,SAAS;EAAK,CAAC;CACvD;CAEA,OACE,qBAAC,eAAD;EAAe,gBAAA;EAAf,UAAA;GACE,qBAAC,MAAD;IACE,WAAU;IACV,KAAK;IACL,OAAO;KAAE,QAAQ;KAAY,UAAU;IAAO;IAC9C,gBAAA;IACA,IAAI,EAAE,YAAY,IAAI;IALxB,UAAA,CAOG,UAAU,KAAK,aACd,qBAACA,YAAD;KAAiC,IAAI,EAAE,UAAU,WAAW;KAA5D,UAAA,CACE,qBAACC,kBAAD;MACE,eAAe,uBAAuB,QAAQ;MAC9C,UACE,uBACA,wBAAwB,SAAS;MAJrC,UAAA,CAOE,oBAAC,gBAAD,EAAA,UACE,oBAAC,eAAD,EACE,SAAS,sBAAsB,SAAS,WACzC,CAAA,EACa,CAAA,GAChB,oBAAC,cAAD;OACE,SAAS,SAAS;OAClB,WAAW,eAAe,SAAS,OAAO;MAC3C,CAAA,CACa;KAChB,CAAA,GAAA,oBAAC,aAAD;MACE,UACE,CAAC,EACC,uBACA,wBAAwB,SAAS;MAGrC,OAAO;OACL;QACE,MAAM,oBAAC,oBAAD,CAAqB,CAAA;QAC3B,OAAO,EAAE,oBAAoB;QAC7B,eACE,UAAU,UAAU,UAAU,SAAS,OAAO;OAClD;OACA;QACE,MAAM,oBAAC,kBAAD,CAAmB,CAAA;QACzB,OAAO,EAAE,uBAAuB;QAChC,eACE,OAAO,KACL,eACE,SAAS,SACT,sBAAsB,SAAS,UACjC,GACA,QACF;OACJ;OACA;QACE,MAAM,oBAAC,eAAD,CAAgB,CAAA;QACtB,OAAO,EAAE,eAAe;QACxB,eAAe,eAAe,SAAS,OAAO;OAChD;MACF;KACD,CAAA,CACO;IAnDK,GAAA,SAAS,OAmDd,CACX,GACA,CAAC,UAAU,UACV,oBAAC,oBAAD;KACE,MAAM,oBAAC,UAAD,CAAW,CAAA;KACjB,OAAO,EAAE,kCAAkC;KAC3C,SAAS,EAAE,yCAAyC;IACrD,CAAA,CAEC;;GACN,oBAAC,yBAAD;IAAyB,KAAK;IAC5B,UAAA,oBAAC,QAAD;KAAQ,SAAQ;KAAY,SAAS;KAClC,UAAA,EAAE,0BAA0B;IACvB,CAAA;GACe,CAAA;GACzB,oBAAC,sBAAD;IACE,KAAK;IACL,eAAe;GAChB,CAAA;EACY;;AAEnB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConfirmAddressSheet.js","names":[],"sources":["../../../../src/pages/SendToWallet/ConfirmAddressSheet.tsx"],"sourcesContent":["import Wallet from '@mui/icons-material/Wallet'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Button, Typography } from '@mui/material'\nimport type { JSX, Ref, RefObject } from 'react'\nimport { useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { BottomSheet } from '../../components/BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { AlertMessage } from '../../components/Messages/AlertMessage.js'\nimport { useNavigateBack } from '../../hooks/useNavigateBack.js'\nimport { useSetContentHeight } from '../../hooks/useSetContentHeight.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport {\n IconContainer,\n SendToWalletButtonRow,\n SendToWalletSheetContainer,\n SheetAddressContainer,\n SheetTitle,\n} from './SendToWalletPage.style.js'\n\ninterface ConfirmAddressSheetProps {\n onConfirm: (wallet: Bookmark) => void\n validatedBookmark?: Bookmark\n}\n\ninterface ConfirmAddressSheetContentProps extends ConfirmAddressSheetProps {\n onClose: () => void\n}\n\nexport const ConfirmAddressSheet = ({\n ref,\n ...props\n}: ConfirmAddressSheetProps & {\n ref?: Ref<BottomSheetBase>\n}): JSX.Element => {\n const handleClose = () => {\n ;(ref as RefObject<BottomSheetBase>).current?.close()\n }\n\n return (\n <BottomSheet ref={ref}>\n <ConfirmAddressSheetContent {...props} onClose={handleClose} />\n </BottomSheet>\n )\n}\n\nconst ConfirmAddressSheetContent: React.FC<ConfirmAddressSheetContentProps> = ({\n validatedBookmark,\n onConfirm,\n onClose,\n}) => {\n const { t } = useTranslation()\n const navigateBack = useNavigateBack()\n const { setFieldValue } = useFieldActions()\n const containerRef = useRef<HTMLElement>(null)\n useSetContentHeight(containerRef)\n\n const handleConfirm = () => {\n if (validatedBookmark) {\n setFieldValue('toAddress', validatedBookmark.address, {\n isTouched: true,\n isDirty: true,\n })\n onConfirm?.(validatedBookmark)\n onClose()\n navigateBack()\n }\n }\n\n return (\n <SendToWalletSheetContainer ref={containerRef}>\n <IconContainer>\n <Wallet sx={{ fontSize: 40 }} />\n </IconContainer>\n <SheetTitle>{t('sendToWallet.confirmWalletAddress')}</SheetTitle>\n <SheetAddressContainer>\n {validatedBookmark?.name ? (\n <Typography\n sx={{\n fontWeight: 600,\n mb: 0.5,\n }}\n >\n {validatedBookmark?.name}\n </Typography>\n ) : null}\n <Typography>{validatedBookmark?.address}</Typography>\n </SheetAddressContainer>\n <AlertMessage\n severity=\"warning\"\n title={\n <Typography variant=\"body2\" sx={{ color: 'text.primary' }}>\n {t('warning.message.fundsLossPrevention')}\n </Typography>\n }\n icon={<WarningRounded />}\n multiline\n />\n <SendToWalletButtonRow>\n <Button variant=\"text\" onClick={onClose} fullWidth>\n {t('button.cancel')}\n </Button>\n <Button variant=\"contained\" onClick={handleConfirm} fullWidth>\n {t('button.confirm')}\n </Button>\n </SendToWalletButtonRow>\n </SendToWalletSheetContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;AA8BA,MAAa,uBAAuB,EAClC,KACA,GAAG,YAGc;CACjB,MAAM,oBAAoB;EACvB,IAAoC,SAAS,MAAM;CACtD;CAEA,OACE,oBAAC,aAAD;EAAkB;
|
|
1
|
+
{"version":3,"file":"ConfirmAddressSheet.js","names":[],"sources":["../../../../src/pages/SendToWallet/ConfirmAddressSheet.tsx"],"sourcesContent":["import Wallet from '@mui/icons-material/Wallet'\nimport WarningRounded from '@mui/icons-material/WarningRounded'\nimport { Button, Typography } from '@mui/material'\nimport type { JSX, Ref, RefObject } from 'react'\nimport { useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { BottomSheet } from '../../components/BottomSheet/BottomSheet.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { AlertMessage } from '../../components/Messages/AlertMessage.js'\nimport { useNavigateBack } from '../../hooks/useNavigateBack.js'\nimport { useSetContentHeight } from '../../hooks/useSetContentHeight.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport {\n IconContainer,\n SendToWalletButtonRow,\n SendToWalletSheetContainer,\n SheetAddressContainer,\n SheetTitle,\n} from './SendToWalletPage.style.js'\n\ninterface ConfirmAddressSheetProps {\n onConfirm: (wallet: Bookmark) => void\n validatedBookmark?: Bookmark\n}\n\ninterface ConfirmAddressSheetContentProps extends ConfirmAddressSheetProps {\n onClose: () => void\n}\n\nexport const ConfirmAddressSheet = ({\n ref,\n ...props\n}: ConfirmAddressSheetProps & {\n ref?: Ref<BottomSheetBase>\n}): JSX.Element => {\n const handleClose = () => {\n ;(ref as RefObject<BottomSheetBase>).current?.close()\n }\n\n return (\n <BottomSheet ref={ref}>\n <ConfirmAddressSheetContent {...props} onClose={handleClose} />\n </BottomSheet>\n )\n}\n\nconst ConfirmAddressSheetContent: React.FC<ConfirmAddressSheetContentProps> = ({\n validatedBookmark,\n onConfirm,\n onClose,\n}) => {\n const { t } = useTranslation()\n const navigateBack = useNavigateBack()\n const { setFieldValue } = useFieldActions()\n const containerRef = useRef<HTMLElement>(null)\n useSetContentHeight(containerRef)\n\n const handleConfirm = () => {\n if (validatedBookmark) {\n setFieldValue('toAddress', validatedBookmark.address, {\n isTouched: true,\n isDirty: true,\n })\n onConfirm?.(validatedBookmark)\n onClose()\n navigateBack()\n }\n }\n\n return (\n <SendToWalletSheetContainer ref={containerRef}>\n <IconContainer>\n <Wallet sx={{ fontSize: 40 }} />\n </IconContainer>\n <SheetTitle>{t('sendToWallet.confirmWalletAddress')}</SheetTitle>\n <SheetAddressContainer>\n {validatedBookmark?.name ? (\n <Typography\n sx={{\n fontWeight: 600,\n mb: 0.5,\n }}\n >\n {validatedBookmark?.name}\n </Typography>\n ) : null}\n <Typography>{validatedBookmark?.address}</Typography>\n </SheetAddressContainer>\n <AlertMessage\n severity=\"warning\"\n title={\n <Typography variant=\"body2\" sx={{ color: 'text.primary' }}>\n {t('warning.message.fundsLossPrevention')}\n </Typography>\n }\n icon={<WarningRounded />}\n multiline\n />\n <SendToWalletButtonRow>\n <Button variant=\"text\" onClick={onClose} fullWidth>\n {t('button.cancel')}\n </Button>\n <Button variant=\"contained\" onClick={handleConfirm} fullWidth>\n {t('button.confirm')}\n </Button>\n </SendToWalletButtonRow>\n </SendToWalletSheetContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;AA8BA,MAAa,uBAAuB,EAClC,KACA,GAAG,YAGc;CACjB,MAAM,oBAAoB;EACvB,IAAoC,SAAS,MAAM;CACtD;CAEA,OACE,oBAAC,aAAD;EAAkB;EAChB,UAAA,oBAAC,4BAAD;GAA4B,GAAI;GAAO,SAAS;EAAc,CAAA;CACnD,CAAA;AAEjB;AAEA,MAAM,8BAAyE,EAC7E,mBACA,WACA,cACI;CACJ,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,eAAe,gBAAgB;CACrC,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,eAAe,OAAoB,IAAI;CAC7C,oBAAoB,YAAY;CAEhC,MAAM,sBAAsB;EAC1B,IAAI,mBAAmB;GACrB,cAAc,aAAa,kBAAkB,SAAS;IACpD,WAAW;IACX,SAAS;GACX,CAAC;GACD,YAAY,iBAAiB;GAC7B,QAAQ;GACR,aAAa;EACf;CACF;CAEA,OACE,qBAAC,4BAAD;EAA4B,KAAK;EAAjC,UAAA;GACE,oBAAC,eAAD,EAAA,UACE,oBAAC,QAAD,EAAQ,IAAI,EAAE,UAAU,GAAG,EAAI,CAAA,EAClB,CAAA;GACf,oBAAC,YAAD,EAAA,UAAa,EAAE,mCAAmC,EAAc,CAAA;GAChE,qBAAC,uBAAD,EAAA,UAAA,CACG,mBAAmB,OAClB,oBAAC,YAAD;IACE,IAAI;KACF,YAAY;KACZ,IAAI;IACN;IAEC,UAAA,mBAAmB;GACV,CAAA,IACV,MACJ,oBAAC,YAAD,EAAA,UAAa,mBAAmB,QAAoB,CAAA,CAC/B,EAAA,CAAA;GACvB,oBAAC,cAAD;IACE,UAAS;IACT,OACE,oBAAC,YAAD;KAAY,SAAQ;KAAQ,IAAI,EAAE,OAAO,eAAe;KACrD,UAAA,EAAE,qCAAqC;IAC9B,CAAA;IAEd,MAAM,oBAAC,gBAAD,CAAiB,CAAA;IACvB,WAAA;GACD,CAAA;GACD,qBAAC,uBAAD,EAAA,UAAA,CACE,oBAAC,QAAD;IAAQ,SAAQ;IAAO,SAAS;IAAS,WAAA;IACtC,UAAA,EAAE,eAAe;GACZ,CAAA,GACR,oBAAC,QAAD;IAAQ,SAAQ;IAAY,SAAS;IAAe,WAAA;IACjD,UAAA,EAAE,gBAAgB;GACb,CAAA,CACa,EAAA,CAAA;EACG;;AAEhC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ConnectedWalletsPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/ConnectedWalletsPage.tsx"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport type { Account } from '@lifi/widget-provider'\nimport ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport Wallet from '@mui/icons-material/Wallet'\nimport { List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { EmptyListIndicator } from '../../components/EmptyListIndicator/EmptyListIndicator.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { shortenAddress } from '../../utils/wallet.js'\n\nexport const ConnectedWalletsPage = (): JSX.Element => {\n const { t } = useTranslation()\n const { accounts } = useAccount()\n const { setSelectedBookmark } = useBookmarkActions()\n const { requiredToChainType } = useToAddressRequirements()\n const navigate = useNavigate()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n const listParentRef = useRef<HTMLUListElement | null>(null)\n\n useHeader(t('sendToWallet.connectedWallets'))\n\n const { listHeight } = useListHeight({ listParentRef })\n\n const handleWalletSelected = (account: Account) => {\n setFieldValue('toAddress', account.address!, {\n isTouched: true,\n isDirty: true,\n })\n setSelectedBookmark({\n name: account.connector?.name,\n address: account.address!,\n chainType: account.chainType!,\n isConnectedAccount: true,\n })\n navigate({\n to: navigationRoutes.home,\n replace: true,\n })\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {accounts.map((account) => {\n const walletAddress = shortenAddress(account.address)\n const menuItems = [\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () => {\n if (account.address) {\n navigator.clipboard.writeText(account.address)\n }\n },\n },\n ...(account.chainId\n ? [\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () => {\n if (account.address) {\n window.open(\n getAddressLink(account.address, account.chainId),\n '_blank'\n )\n }\n },\n },\n ]\n : []),\n ]\n\n return (\n <ListItem key={account.address} sx={{ position: 'relative' }}>\n <ListItemButton\n onClick={() => handleWalletSelected(account)}\n disabled={\n requiredToChainType &&\n requiredToChainType !== account.chainType\n }\n >\n <ListItemAvatar>\n <AccountAvatar chainId={account.chainId} account={account} />\n </ListItemAvatar>\n <ListItemText\n primary={account.connector?.name}\n secondary={walletAddress}\n />\n </ListItemButton>\n <ContextMenu\n items={menuItems}\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== account.chainType\n )\n }\n />\n </ListItem>\n )\n })}\n {!accounts.length && (\n <EmptyListIndicator\n icon={<Wallet />}\n title={t('sendToWallet.noConnectedWallets')}\n message={t('sendToWallet.noConnectedWalletsMessage')}\n />\n )}\n </List>\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAwBA,MAAa,6BAA0C;CACrD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,WAAW;CAChC,MAAM,EAAE,wBAAwB,mBAAmB;CACnD,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CACvC,MAAM,gBAAgB,OAAgC,IAAI;CAE1D,UAAU,EAAE,+BAA+B,CAAC;CAE5C,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,MAAM,wBAAwB,YAAqB;EACjD,cAAc,aAAa,QAAQ,SAAU;GAC3C,WAAW;GACX,SAAS;EACX,CAAC;EACD,oBAAoB;GAClB,MAAM,QAAQ,WAAW;GACzB,SAAS,QAAQ;GACjB,WAAW,QAAQ;GACnB,oBAAoB;EACtB,CAAC;EACD,SAAS;GACP,IAAI,iBAAiB;GACrB,SAAS;EACX,CAAC;CACH;CAEA,OACE,oBAAC,eAAD;EAAe,gBAAA;
|
|
1
|
+
{"version":3,"file":"ConnectedWalletsPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/ConnectedWalletsPage.tsx"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport type { Account } from '@lifi/widget-provider'\nimport ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport Wallet from '@mui/icons-material/Wallet'\nimport { List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { EmptyListIndicator } from '../../components/EmptyListIndicator/EmptyListIndicator.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { shortenAddress } from '../../utils/wallet.js'\n\nexport const ConnectedWalletsPage = (): JSX.Element => {\n const { t } = useTranslation()\n const { accounts } = useAccount()\n const { setSelectedBookmark } = useBookmarkActions()\n const { requiredToChainType } = useToAddressRequirements()\n const navigate = useNavigate()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n const listParentRef = useRef<HTMLUListElement | null>(null)\n\n useHeader(t('sendToWallet.connectedWallets'))\n\n const { listHeight } = useListHeight({ listParentRef })\n\n const handleWalletSelected = (account: Account) => {\n setFieldValue('toAddress', account.address!, {\n isTouched: true,\n isDirty: true,\n })\n setSelectedBookmark({\n name: account.connector?.name,\n address: account.address!,\n chainType: account.chainType!,\n isConnectedAccount: true,\n })\n navigate({\n to: navigationRoutes.home,\n replace: true,\n })\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {accounts.map((account) => {\n const walletAddress = shortenAddress(account.address)\n const menuItems = [\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () => {\n if (account.address) {\n navigator.clipboard.writeText(account.address)\n }\n },\n },\n ...(account.chainId\n ? [\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () => {\n if (account.address) {\n window.open(\n getAddressLink(account.address, account.chainId),\n '_blank'\n )\n }\n },\n },\n ]\n : []),\n ]\n\n return (\n <ListItem key={account.address} sx={{ position: 'relative' }}>\n <ListItemButton\n onClick={() => handleWalletSelected(account)}\n disabled={\n requiredToChainType &&\n requiredToChainType !== account.chainType\n }\n >\n <ListItemAvatar>\n <AccountAvatar chainId={account.chainId} account={account} />\n </ListItemAvatar>\n <ListItemText\n primary={account.connector?.name}\n secondary={walletAddress}\n />\n </ListItemButton>\n <ContextMenu\n items={menuItems}\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== account.chainType\n )\n }\n />\n </ListItem>\n )\n })}\n {!accounts.length && (\n <EmptyListIndicator\n icon={<Wallet />}\n title={t('sendToWallet.noConnectedWallets')}\n message={t('sendToWallet.noConnectedWalletsMessage')}\n />\n )}\n </List>\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAwBA,MAAa,6BAA0C;CACrD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,EAAE,aAAa,WAAW;CAChC,MAAM,EAAE,wBAAwB,mBAAmB;CACnD,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,WAAW,YAAY;CAC7B,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CACvC,MAAM,gBAAgB,OAAgC,IAAI;CAE1D,UAAU,EAAE,+BAA+B,CAAC;CAE5C,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,MAAM,wBAAwB,YAAqB;EACjD,cAAc,aAAa,QAAQ,SAAU;GAC3C,WAAW;GACX,SAAS;EACX,CAAC;EACD,oBAAoB;GAClB,MAAM,QAAQ,WAAW;GACzB,SAAS,QAAQ;GACjB,WAAW,QAAQ;GACnB,oBAAoB;EACtB,CAAC;EACD,SAAS;GACP,IAAI,iBAAiB;GACrB,SAAS;EACX,CAAC;CACH;CAEA,OACE,oBAAC,eAAD;EAAe,gBAAA;EACb,UAAA,qBAAC,MAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;GAC9C,gBAAA;GACA,IAAI,EAAE,YAAY,IAAI;GALxB,UAAA,CAOG,SAAS,KAAK,YAAY;IACzB,MAAM,gBAAgB,eAAe,QAAQ,OAAO;IACpD,MAAM,YAAY,CAChB;KACE,MAAM,oBAAC,oBAAD,CAAqB,CAAA;KAC3B,OAAO,EAAE,oBAAoB;KAC7B,eAAe;MACb,IAAI,QAAQ,SACV,UAAU,UAAU,UAAU,QAAQ,OAAO;KAEjD;IACF,GACA,GAAI,QAAQ,UACR,CACE;KACE,MAAM,oBAAC,kBAAD,CAAmB,CAAA;KACzB,OAAO,EAAE,uBAAuB;KAChC,eAAe;MACb,IAAI,QAAQ,SACV,OAAO,KACL,eAAe,QAAQ,SAAS,QAAQ,OAAO,GAC/C,QACF;KAEJ;IACF,CACF,IACA,CAAC,CACP;IAEA,OACE,qBAACA,YAAD;KAAgC,IAAI,EAAE,UAAU,WAAW;KAA3D,UAAA,CACE,qBAACC,kBAAD;MACE,eAAe,qBAAqB,OAAO;MAC3C,UACE,uBACA,wBAAwB,QAAQ;MAJpC,UAAA,CAOE,oBAAC,gBAAD,EAAA,UACE,oBAAC,eAAD;OAAe,SAAS,QAAQ;OAAkB;MAAU,CAAA,EAC9C,CAAA,GAChB,oBAAC,cAAD;OACE,SAAS,QAAQ,WAAW;OAC5B,WAAW;MACZ,CAAA,CACa;KAChB,CAAA,GAAA,oBAAC,aAAD;MACE,OAAO;MACP,UACE,CAAC,EACC,uBACA,wBAAwB,QAAQ;KAGrC,CAAA,CACO;IAzBK,GAAA,QAAQ,OAyBb;GAEd,CAAC,GACA,CAAC,SAAS,UACT,oBAAC,oBAAD;IACE,MAAM,oBAAC,QAAD,CAAS,CAAA;IACf,OAAO,EAAE,iCAAiC;IAC1C,SAAS,EAAE,wCAAwC;GACpD,CAAA,CAEC;;CACO,CAAA;AAEnB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RecentWalletsPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/RecentWalletsPage.tsx"],"sourcesContent":["import AccountBalanceWalletIcon from '@mui/icons-material/AccountBalanceWallet'\nimport ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport DeleteOutline from '@mui/icons-material/DeleteOutlined'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport TurnedInNot from '@mui/icons-material/TurnedInNot'\nimport { List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { EmptyListIndicator } from '../../components/EmptyListIndicator/EmptyListIndicator.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useBookmarks } from '../../stores/bookmarks/useBookmarks.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { defaultChainIdsByType } from '../../utils/chainType.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { BookmarkAddressSheet } from './BookmarkAddressSheet.js'\n\nexport const RecentWalletsPage = (): JSX.Element => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const [bookmarkTarget, setBookmarkTarget] = useState<Bookmark>()\n const bookmarkAddressSheetRef = useRef<BottomSheetBase>(null)\n const listParentRef = useRef<HTMLUListElement | null>(null)\n const { recentWallets } = useBookmarks()\n const { requiredToChainType } = useToAddressRequirements()\n const {\n removeRecentWallet,\n addBookmark,\n setSelectedBookmark,\n addRecentWallet,\n } = useBookmarkActions()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n\n useHeader(t('header.recentWallets'))\n\n const { listHeight } = useListHeight({ listParentRef })\n\n const handleRecentSelected = (recentWallet: Bookmark) => {\n addRecentWallet(recentWallet)\n setFieldValue('toAddress', recentWallet.address, {\n isTouched: true,\n isDirty: true,\n })\n setSelectedBookmark(recentWallet)\n navigate({\n to: navigationRoutes.home,\n replace: true,\n })\n }\n\n const handleAddBookmark = (bookmark: Bookmark) => {\n addBookmark(bookmark)\n navigate({ to: navigationRoutes.bookmarks, replace: true })\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {recentWallets.map((recentWallet) => (\n <ListItem key={recentWallet.address} sx={{ position: 'relative' }}>\n <ListItemButton\n disabled={\n requiredToChainType &&\n requiredToChainType !== recentWallet.chainType\n }\n onClick={() => handleRecentSelected(recentWallet)}\n >\n <ListItemAvatar>\n <AccountAvatar\n chainId={defaultChainIdsByType[recentWallet.chainType]}\n />\n </ListItemAvatar>\n <ListItemText\n primary={\n recentWallet.name || shortenAddress(recentWallet.address)\n }\n secondary={\n recentWallet.name\n ? shortenAddress(recentWallet.address)\n : undefined\n }\n />\n </ListItemButton>\n <ContextMenu\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== recentWallet.chainType\n )\n }\n items={[\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () =>\n navigator.clipboard.writeText(recentWallet.address),\n },\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () =>\n window.open(\n getAddressLink(\n recentWallet.address,\n defaultChainIdsByType[recentWallet.chainType]\n ),\n '_blank'\n ),\n },\n {\n icon: <TurnedInNot />,\n label: t('button.bookmark'),\n onClick: () => {\n setBookmarkTarget(recentWallet)\n bookmarkAddressSheetRef.current?.open()\n },\n },\n {\n icon: <DeleteOutline />,\n label: t('button.delete'),\n onClick: () => removeRecentWallet(recentWallet.address),\n },\n ]}\n />\n </ListItem>\n ))}\n {!recentWallets.length && (\n <EmptyListIndicator\n icon={<AccountBalanceWalletIcon />}\n title={t('sendToWallet.noRecentWallets')}\n message={t('sendToWallet.noRecentWalletsMessage')}\n />\n )}\n </List>\n <BookmarkAddressSheet\n ref={bookmarkAddressSheetRef}\n validatedWallet={bookmarkTarget}\n onAddBookmark={handleAddBookmark}\n />\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BA,MAAa,0BAAuC;CAClD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,CAAC,gBAAgB,qBAAqB,SAAmB;CAC/D,MAAM,0BAA0B,OAAwB,IAAI;CAC5D,MAAM,gBAAgB,OAAgC,IAAI;CAC1D,MAAM,EAAE,kBAAkB,aAAa;CACvC,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,EACJ,oBACA,aACA,qBACA,oBACE,mBAAmB;CACvB,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CAEvC,UAAU,EAAE,sBAAsB,CAAC;CAEnC,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,MAAM,wBAAwB,iBAA2B;EACvD,gBAAgB,YAAY;EAC5B,cAAc,aAAa,aAAa,SAAS;GAC/C,WAAW;GACX,SAAS;EACX,CAAC;EACD,oBAAoB,YAAY;EAChC,SAAS;GACP,IAAI,iBAAiB;GACrB,SAAS;EACX,CAAC;CACH;CAEA,MAAM,qBAAqB,aAAuB;EAChD,YAAY,QAAQ;EACpB,SAAS;GAAE,IAAI,iBAAiB;GAAW,SAAS;EAAK,CAAC;CAC5D;CAEA,OACE,qBAAC,eAAD;EAAe,gBAAA;
|
|
1
|
+
{"version":3,"file":"RecentWalletsPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/RecentWalletsPage.tsx"],"sourcesContent":["import AccountBalanceWalletIcon from '@mui/icons-material/AccountBalanceWallet'\nimport ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport DeleteOutline from '@mui/icons-material/DeleteOutlined'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport TurnedInNot from '@mui/icons-material/TurnedInNot'\nimport { List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport { type JSX, useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { EmptyListIndicator } from '../../components/EmptyListIndicator/EmptyListIndicator.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useBookmarks } from '../../stores/bookmarks/useBookmarks.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { defaultChainIdsByType } from '../../utils/chainType.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { shortenAddress } from '../../utils/wallet.js'\nimport { BookmarkAddressSheet } from './BookmarkAddressSheet.js'\n\nexport const RecentWalletsPage = (): JSX.Element => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const [bookmarkTarget, setBookmarkTarget] = useState<Bookmark>()\n const bookmarkAddressSheetRef = useRef<BottomSheetBase>(null)\n const listParentRef = useRef<HTMLUListElement | null>(null)\n const { recentWallets } = useBookmarks()\n const { requiredToChainType } = useToAddressRequirements()\n const {\n removeRecentWallet,\n addBookmark,\n setSelectedBookmark,\n addRecentWallet,\n } = useBookmarkActions()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n\n useHeader(t('header.recentWallets'))\n\n const { listHeight } = useListHeight({ listParentRef })\n\n const handleRecentSelected = (recentWallet: Bookmark) => {\n addRecentWallet(recentWallet)\n setFieldValue('toAddress', recentWallet.address, {\n isTouched: true,\n isDirty: true,\n })\n setSelectedBookmark(recentWallet)\n navigate({\n to: navigationRoutes.home,\n replace: true,\n })\n }\n\n const handleAddBookmark = (bookmark: Bookmark) => {\n addBookmark(bookmark)\n navigate({ to: navigationRoutes.bookmarks, replace: true })\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {recentWallets.map((recentWallet) => (\n <ListItem key={recentWallet.address} sx={{ position: 'relative' }}>\n <ListItemButton\n disabled={\n requiredToChainType &&\n requiredToChainType !== recentWallet.chainType\n }\n onClick={() => handleRecentSelected(recentWallet)}\n >\n <ListItemAvatar>\n <AccountAvatar\n chainId={defaultChainIdsByType[recentWallet.chainType]}\n />\n </ListItemAvatar>\n <ListItemText\n primary={\n recentWallet.name || shortenAddress(recentWallet.address)\n }\n secondary={\n recentWallet.name\n ? shortenAddress(recentWallet.address)\n : undefined\n }\n />\n </ListItemButton>\n <ContextMenu\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== recentWallet.chainType\n )\n }\n items={[\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () =>\n navigator.clipboard.writeText(recentWallet.address),\n },\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () =>\n window.open(\n getAddressLink(\n recentWallet.address,\n defaultChainIdsByType[recentWallet.chainType]\n ),\n '_blank'\n ),\n },\n {\n icon: <TurnedInNot />,\n label: t('button.bookmark'),\n onClick: () => {\n setBookmarkTarget(recentWallet)\n bookmarkAddressSheetRef.current?.open()\n },\n },\n {\n icon: <DeleteOutline />,\n label: t('button.delete'),\n onClick: () => removeRecentWallet(recentWallet.address),\n },\n ]}\n />\n </ListItem>\n ))}\n {!recentWallets.length && (\n <EmptyListIndicator\n icon={<AccountBalanceWalletIcon />}\n title={t('sendToWallet.noRecentWallets')}\n message={t('sendToWallet.noRecentWalletsMessage')}\n />\n )}\n </List>\n <BookmarkAddressSheet\n ref={bookmarkAddressSheetRef}\n validatedWallet={bookmarkTarget}\n onAddBookmark={handleAddBookmark}\n />\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AA6BA,MAAa,0BAAuC;CAClD,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,CAAC,gBAAgB,qBAAqB,SAAmB;CAC/D,MAAM,0BAA0B,OAAwB,IAAI;CAC5D,MAAM,gBAAgB,OAAgC,IAAI;CAC1D,MAAM,EAAE,kBAAkB,aAAa;CACvC,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,EACJ,oBACA,aACA,qBACA,oBACE,mBAAmB;CACvB,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CAEvC,UAAU,EAAE,sBAAsB,CAAC;CAEnC,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,MAAM,wBAAwB,iBAA2B;EACvD,gBAAgB,YAAY;EAC5B,cAAc,aAAa,aAAa,SAAS;GAC/C,WAAW;GACX,SAAS;EACX,CAAC;EACD,oBAAoB,YAAY;EAChC,SAAS;GACP,IAAI,iBAAiB;GACrB,SAAS;EACX,CAAC;CACH;CAEA,MAAM,qBAAqB,aAAuB;EAChD,YAAY,QAAQ;EACpB,SAAS;GAAE,IAAI,iBAAiB;GAAW,SAAS;EAAK,CAAC;CAC5D;CAEA,OACE,qBAAC,eAAD;EAAe,gBAAA;EAAf,UAAA,CACE,qBAAC,MAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;GAC9C,gBAAA;GACA,IAAI,EAAE,YAAY,IAAI;GALxB,UAAA,CAOG,cAAc,KAAK,iBAClB,qBAACA,YAAD;IAAqC,IAAI,EAAE,UAAU,WAAW;IAAhE,UAAA,CACE,qBAACC,kBAAD;KACE,UACE,uBACA,wBAAwB,aAAa;KAEvC,eAAe,qBAAqB,YAAY;KALlD,UAAA,CAOE,oBAAC,gBAAD,EAAA,UACE,oBAAC,eAAD,EACE,SAAS,sBAAsB,aAAa,WAC7C,CAAA,EACa,CAAA,GAChB,oBAAC,cAAD;MACE,SACE,aAAa,QAAQ,eAAe,aAAa,OAAO;MAE1D,WACE,aAAa,OACT,eAAe,aAAa,OAAO,IACnC,KAAA;KAEP,CAAA,CACa;IAChB,CAAA,GAAA,oBAAC,aAAD;KACE,UACE,CAAC,EACC,uBACA,wBAAwB,aAAa;KAGzC,OAAO;MACL;OACE,MAAM,oBAAC,oBAAD,CAAqB,CAAA;OAC3B,OAAO,EAAE,oBAAoB;OAC7B,eACE,UAAU,UAAU,UAAU,aAAa,OAAO;MACtD;MACA;OACE,MAAM,oBAAC,kBAAD,CAAmB,CAAA;OACzB,OAAO,EAAE,uBAAuB;OAChC,eACE,OAAO,KACL,eACE,aAAa,SACb,sBAAsB,aAAa,UACrC,GACA,QACF;MACJ;MACA;OACE,MAAM,oBAAC,aAAD,CAAc,CAAA;OACpB,OAAO,EAAE,iBAAiB;OAC1B,eAAe;QACb,kBAAkB,YAAY;QAC9B,wBAAwB,SAAS,KAAK;OACxC;MACF;MACA;OACE,MAAM,oBAAC,eAAD,CAAgB,CAAA;OACtB,OAAO,EAAE,eAAe;OACxB,eAAe,mBAAmB,aAAa,OAAO;MACxD;KACF;IACD,CAAA,CACO;GAjEK,GAAA,aAAa,OAiElB,CACX,GACA,CAAC,cAAc,UACd,oBAAC,oBAAD;IACE,MAAM,oBAAC,0BAAD,CAA2B,CAAA;IACjC,OAAO,EAAE,8BAA8B;IACvC,SAAS,EAAE,qCAAqC;GACjD,CAAA,CAEC;EACN,CAAA,GAAA,oBAAC,sBAAD;GACE,KAAK;GACL,iBAAiB;GACjB,eAAe;EAChB,CAAA,CACY;;AAEnB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SendToConfiguredWalletPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/SendToConfiguredWalletPage.tsx"],"sourcesContent":["import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport { List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { type JSX, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useNavigateBack } from '../../hooks/useNavigateBack.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport type { ToAddress } from '../../types/widget.js'\nimport { defaultChainIdsByType } from '../../utils/chainType.js'\nimport { shortenAddress } from '../../utils/wallet.js'\n\nexport const SendToConfiguredWalletPage = (): JSX.Element => {\n const { t } = useTranslation()\n const navigateBack = useNavigateBack()\n const { toAddresses } = useWidgetConfig()\n const { requiredToChainType } = useToAddressRequirements()\n const { setSelectedBookmark } = useBookmarkActions()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n const listParentRef = useRef<HTMLUListElement | null>(null)\n\n useHeader(t('header.sendToWallet'))\n\n const { listHeight } = useListHeight({ listParentRef })\n\n const handleCuratedSelected = (toAddress: ToAddress) => {\n setSelectedBookmark(toAddress)\n setFieldValue('toAddress', toAddress.address, {\n isTouched: true,\n isDirty: true,\n })\n navigateBack()\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {toAddresses?.map((toAddress) => (\n <ListItem key={toAddress.address} sx={{ position: 'relative' }}>\n <ListItemButton\n disabled={\n requiredToChainType &&\n requiredToChainType !== toAddress.chainType\n }\n onClick={() => handleCuratedSelected(toAddress)}\n >\n <ListItemAvatar>\n <AccountAvatar\n chainId={defaultChainIdsByType[toAddress.chainType]}\n toAddress={toAddress}\n />\n </ListItemAvatar>\n <ListItemText\n primary={toAddress.name || shortenAddress(toAddress.address)}\n secondary={\n toAddress.name ? shortenAddress(toAddress.address) : undefined\n }\n />\n </ListItemButton>\n <ContextMenu\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== toAddress.chainType\n )\n }\n items={[\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () =>\n navigator.clipboard.writeText(toAddress.address),\n },\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () =>\n window.open(\n getAddressLink(\n toAddress.address,\n defaultChainIdsByType[toAddress.chainType]\n ),\n '_blank'\n ),\n },\n ]}\n />\n </ListItem>\n ))}\n </List>\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAsBA,MAAa,mCAAgD;CAC3D,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,eAAe,gBAAgB;CACrC,MAAM,EAAE,gBAAgB,gBAAgB;CACxC,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,EAAE,wBAAwB,mBAAmB;CACnD,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CACvC,MAAM,gBAAgB,OAAgC,IAAI;CAE1D,UAAU,EAAE,qBAAqB,CAAC;CAElC,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,MAAM,yBAAyB,cAAyB;EACtD,oBAAoB,SAAS;EAC7B,cAAc,aAAa,UAAU,SAAS;GAC5C,WAAW;GACX,SAAS;EACX,CAAC;EACD,aAAa;CACf;CAEA,OACE,oBAAC,eAAD;EAAe,gBAAA;
|
|
1
|
+
{"version":3,"file":"SendToConfiguredWalletPage.js","names":["ListItem","ListItemButton"],"sources":["../../../../src/pages/SendToWallet/SendToConfiguredWalletPage.tsx"],"sourcesContent":["import ContentCopyRounded from '@mui/icons-material/ContentCopyRounded'\nimport OpenInNewRounded from '@mui/icons-material/OpenInNewRounded'\nimport { List, ListItemAvatar, ListItemText } from '@mui/material'\nimport { type JSX, useRef } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport { AccountAvatar } from '../../components/Avatar/AccountAvatar.js'\nimport { ContextMenu } from '../../components/ContextMenu.js'\nimport { ListItem } from '../../components/ListItem/ListItem.js'\nimport { ListItemButton } from '../../components/ListItem/ListItemButton.js'\nimport { PageContainer } from '../../components/PageContainer.js'\nimport { useExplorer } from '../../hooks/useExplorer.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useListHeight } from '../../hooks/useListHeight.js'\nimport { useNavigateBack } from '../../hooks/useNavigateBack.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport type { ToAddress } from '../../types/widget.js'\nimport { defaultChainIdsByType } from '../../utils/chainType.js'\nimport { shortenAddress } from '../../utils/wallet.js'\n\nexport const SendToConfiguredWalletPage = (): JSX.Element => {\n const { t } = useTranslation()\n const navigateBack = useNavigateBack()\n const { toAddresses } = useWidgetConfig()\n const { requiredToChainType } = useToAddressRequirements()\n const { setSelectedBookmark } = useBookmarkActions()\n const { setFieldValue } = useFieldActions()\n const { getAddressLink } = useExplorer()\n const listParentRef = useRef<HTMLUListElement | null>(null)\n\n useHeader(t('header.sendToWallet'))\n\n const { listHeight } = useListHeight({ listParentRef })\n\n const handleCuratedSelected = (toAddress: ToAddress) => {\n setSelectedBookmark(toAddress)\n setFieldValue('toAddress', toAddress.address, {\n isTouched: true,\n isDirty: true,\n })\n navigateBack()\n }\n\n return (\n <PageContainer disableGutters>\n <List\n className=\"long-list\"\n ref={listParentRef}\n style={{ height: listHeight, overflow: 'auto' }}\n disablePadding\n sx={{ paddingTop: 1.5 }}\n >\n {toAddresses?.map((toAddress) => (\n <ListItem key={toAddress.address} sx={{ position: 'relative' }}>\n <ListItemButton\n disabled={\n requiredToChainType &&\n requiredToChainType !== toAddress.chainType\n }\n onClick={() => handleCuratedSelected(toAddress)}\n >\n <ListItemAvatar>\n <AccountAvatar\n chainId={defaultChainIdsByType[toAddress.chainType]}\n toAddress={toAddress}\n />\n </ListItemAvatar>\n <ListItemText\n primary={toAddress.name || shortenAddress(toAddress.address)}\n secondary={\n toAddress.name ? shortenAddress(toAddress.address) : undefined\n }\n />\n </ListItemButton>\n <ContextMenu\n disabled={\n !!(\n requiredToChainType &&\n requiredToChainType !== toAddress.chainType\n )\n }\n items={[\n {\n icon: <ContentCopyRounded />,\n label: t('button.copyAddress'),\n onClick: () =>\n navigator.clipboard.writeText(toAddress.address),\n },\n {\n icon: <OpenInNewRounded />,\n label: t('button.viewOnExplorer'),\n onClick: () =>\n window.open(\n getAddressLink(\n toAddress.address,\n defaultChainIdsByType[toAddress.chainType]\n ),\n '_blank'\n ),\n },\n ]}\n />\n </ListItem>\n ))}\n </List>\n </PageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAsBA,MAAa,mCAAgD;CAC3D,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,eAAe,gBAAgB;CACrC,MAAM,EAAE,gBAAgB,gBAAgB;CACxC,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,EAAE,wBAAwB,mBAAmB;CACnD,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,EAAE,mBAAmB,YAAY;CACvC,MAAM,gBAAgB,OAAgC,IAAI;CAE1D,UAAU,EAAE,qBAAqB,CAAC;CAElC,MAAM,EAAE,eAAe,cAAc,EAAE,cAAc,CAAC;CAEtD,MAAM,yBAAyB,cAAyB;EACtD,oBAAoB,SAAS;EAC7B,cAAc,aAAa,UAAU,SAAS;GAC5C,WAAW;GACX,SAAS;EACX,CAAC;EACD,aAAa;CACf;CAEA,OACE,oBAAC,eAAD;EAAe,gBAAA;EACb,UAAA,oBAAC,MAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO;IAAE,QAAQ;IAAY,UAAU;GAAO;GAC9C,gBAAA;GACA,IAAI,EAAE,YAAY,IAAI;GAErB,UAAA,aAAa,KAAK,cACjB,qBAACA,YAAD;IAAkC,IAAI,EAAE,UAAU,WAAW;IAA7D,UAAA,CACE,qBAACC,kBAAD;KACE,UACE,uBACA,wBAAwB,UAAU;KAEpC,eAAe,sBAAsB,SAAS;KALhD,UAAA,CAOE,oBAAC,gBAAD,EAAA,UACE,oBAAC,eAAD;MACE,SAAS,sBAAsB,UAAU;MAC9B;KACZ,CAAA,EACa,CAAA,GAChB,oBAAC,cAAD;MACE,SAAS,UAAU,QAAQ,eAAe,UAAU,OAAO;MAC3D,WACE,UAAU,OAAO,eAAe,UAAU,OAAO,IAAI,KAAA;KAExD,CAAA,CACa;IAChB,CAAA,GAAA,oBAAC,aAAD;KACE,UACE,CAAC,EACC,uBACA,wBAAwB,UAAU;KAGtC,OAAO,CACL;MACE,MAAM,oBAAC,oBAAD,CAAqB,CAAA;MAC3B,OAAO,EAAE,oBAAoB;MAC7B,eACE,UAAU,UAAU,UAAU,UAAU,OAAO;KACnD,GACA;MACE,MAAM,oBAAC,kBAAD,CAAmB,CAAA;MACzB,OAAO,EAAE,uBAAuB;MAChC,eACE,OAAO,KACL,eACE,UAAU,SACV,sBAAsB,UAAU,UAClC,GACA,QACF;KACJ,CACF;IACD,CAAA,CACO;GAjDK,GAAA,UAAU,OAiDf,CACX;EACG,CAAA;CACO,CAAA;AAEnB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SendToWalletPage.js","names":[],"sources":["../../../../src/pages/SendToWallet/SendToWalletPage.tsx"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport AccountBalanceWalletIcon from '@mui/icons-material/AccountBalanceWallet'\nimport ErrorIcon from '@mui/icons-material/Error'\nimport TurnedIn from '@mui/icons-material/TurnedIn'\nimport Wallet from '@mui/icons-material/Wallet'\nimport { Box, Tooltip, Typography } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport type { ChangeEvent } from 'react'\nimport { useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { ButtonTertiary } from '../../components/ButtonTertiary.js'\nimport { CardButton } from '../../components/Card/CardButton.js'\nimport { AccountDeployedMessage } from '../../components/Messages/AccountDeployedMessage.js'\nimport {\n AddressType,\n useAddressValidation,\n} from '../../hooks/useAddressValidation.js'\nimport { useChain } from '../../hooks/useChain.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useBookmarks } from '../../stores/bookmarks/useBookmarks.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { BookmarkAddressSheet } from './BookmarkAddressSheet.js'\nimport { ConfirmAddressSheet } from './ConfirmAddressSheet.js'\nimport {\n AddressInput,\n FullHeightAdjustablePageContainer,\n SendToWalletButtonRow,\n SendToWalletCard,\n SendToWalletIconButton,\n ValidationAlert,\n} from './SendToWalletPage.style.js'\n\nexport const SendToWalletPage: React.FC = () => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const bookmarkAddressSheetRef = useRef<BottomSheetBase>(null)\n const confirmAddressSheetRef = useRef<BottomSheetBase>(null)\n const { bookmarks, recentWallets } = useBookmarks()\n const {\n addBookmark,\n getBookmark,\n setSelectedBookmark,\n getSelectedBookmark,\n addRecentWallet,\n } = useBookmarkActions()\n const { setFieldValue } = useFieldActions()\n const [inputAddressValue, setInputAddressValue] = useState(\n () => getSelectedBookmark()?.address ?? ''\n )\n const [validatedWallet, setValidatedWallet] = useState<Bookmark>()\n const [errorMessage, setErrorMessage] = useState('')\n const { validateAddress, isValidating } = useAddressValidation()\n const { requiredToChainType } = useToAddressRequirements()\n const [toChainId] = useFieldValues('toChain')\n const { chain: toChain } = useChain(toChainId)\n const [isDoneButtonLoading, setIsDoneButtonLoading] = useState(false)\n const [isBookmarkButtonLoading, setIsBookmarkButtonLoading] = useState(false)\n const { variant, hiddenUI, requiredUI } = useWidgetConfig()\n\n const { accounts } = useAccount()\n const connectedWallets = accounts.filter((account) => account.isConnected)\n\n useHeader(t('header.sendToWallet'))\n\n const handleInputChange = (e: ChangeEvent) => {\n if (errorMessage) {\n setErrorMessage('')\n }\n if (getSelectedBookmark()) {\n setFieldValue('toAddress', '', { isTouched: true })\n setSelectedBookmark()\n }\n setInputAddressValue((e.target as HTMLInputElement).value.trim())\n }\n\n const handleDone = async () => {\n if (isValidating) {\n return\n }\n if (!inputAddressValue) {\n setErrorMessage(t('error.title.walletAddressRequired'))\n return\n }\n setIsDoneButtonLoading(true)\n const validationResult = await validateAddress({\n value: inputAddressValue,\n chainType: requiredToChainType,\n chain: toChain,\n })\n setIsDoneButtonLoading(false)\n if (!validationResult.isValid) {\n setErrorMessage(validationResult.error)\n return\n }\n\n if (\n requiredToChainType &&\n requiredToChainType !== validationResult.chainType\n ) {\n setErrorMessage(\n t('error.title.walletChainTypeInvalid', {\n chainName: toChain?.name,\n })\n )\n return\n }\n\n setValidatedWallet({\n name:\n validationResult.addressType === AddressType.NameService\n ? inputAddressValue\n : undefined,\n address: validationResult.address,\n chainType: validationResult.chainType,\n })\n confirmAddressSheetRef.current?.open()\n }\n\n const handleBookmarkAddress = async () => {\n if (isValidating) {\n return\n }\n if (!inputAddressValue) {\n setErrorMessage(t('error.title.walletAddressRequired'))\n return\n }\n\n const existingBookmarkWallet = getBookmark(inputAddressValue)\n if (existingBookmarkWallet) {\n setErrorMessage(\n t('error.title.bookmarkAlreadyExists', {\n name: existingBookmarkWallet.name,\n })\n )\n return\n }\n setIsBookmarkButtonLoading(true)\n const validationResult = await validateAddress({\n value: inputAddressValue,\n })\n setIsBookmarkButtonLoading(false)\n\n if (validationResult.isValid) {\n setValidatedWallet({\n name:\n validationResult.addressType === AddressType.NameService\n ? inputAddressValue\n : undefined,\n address: validationResult.address,\n chainType: validationResult.chainType,\n })\n bookmarkAddressSheetRef.current?.open()\n } else {\n setErrorMessage(validationResult.error)\n }\n }\n\n const handleRecentWalletsClick = () => {\n navigate({ to: navigationRoutes.recentWallets })\n }\n\n const handleConnectedWalletsClick = () => {\n navigate({ to: navigationRoutes.connectedWallets })\n }\n const handleBookmarkedWalletsClick = () => {\n navigate({ to: navigationRoutes.bookmarks })\n }\n\n const handleAddBookmark = (bookmark: Bookmark) => {\n addBookmark(bookmark)\n navigate({ to: navigationRoutes.bookmarks })\n }\n\n const handleOnConfirm = (confirmedWallet: Bookmark) => {\n setSelectedBookmark(confirmedWallet)\n addRecentWallet(confirmedWallet)\n }\n\n const placeholder = t('sendToWallet.enterAddress', {\n context: 'long',\n })\n\n return (\n <FullHeightAdjustablePageContainer\n topGutters\n bottomGutters\n enableFullHeight={variant !== 'drawer'}\n >\n <Box\n sx={{\n display: 'flex',\n flexDirection: 'column',\n gap: 2,\n marginBottom: 6,\n }}\n >\n <SendToWalletCard type={errorMessage ? 'error' : 'default'}>\n <AddressInput\n size=\"small\"\n autoComplete=\"off\"\n autoCorrect=\"off\"\n autoCapitalize=\"off\"\n spellCheck=\"false\"\n onChange={handleInputChange}\n value={inputAddressValue}\n placeholder={placeholder}\n aria-label={placeholder}\n maxRows={2}\n inputProps={{ maxLength: 128 }}\n multiline\n />\n {errorMessage ? (\n <ValidationAlert icon={<ErrorIcon />} sx={{ pb: 2, paddingX: 2 }}>\n {errorMessage}\n </ValidationAlert>\n ) : null}\n <SendToWalletButtonRow sx={{ paddingX: 2, paddingBottom: 2 }}>\n <ButtonTertiary\n variant=\"text\"\n onClick={handleDone}\n loading={isDoneButtonLoading}\n loadingPosition=\"center\"\n sx={{ flexGrow: 1 }}\n >\n {t('button.done')}\n </ButtonTertiary>\n <Tooltip title={t('button.bookmark')}>\n <SendToWalletIconButton\n onClick={handleBookmarkAddress}\n loading={isBookmarkButtonLoading}\n loadingPosition=\"center\"\n >\n <TurnedIn fontSize=\"small\" />\n </SendToWalletIconButton>\n </Tooltip>\n </SendToWalletButtonRow>\n <ConfirmAddressSheet\n ref={confirmAddressSheetRef}\n validatedBookmark={validatedWallet}\n onConfirm={handleOnConfirm}\n />\n <BookmarkAddressSheet\n ref={bookmarkAddressSheetRef}\n validatedWallet={validatedWallet}\n onAddBookmark={handleAddBookmark}\n />\n </SendToWalletCard>\n {requiredUI?.accountDeployedMessage && <AccountDeployedMessage />}\n </Box>\n <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }}>\n <CardButton\n title={t('header.recentWallets')}\n icon={<AccountBalanceWalletIcon />}\n onClick={handleRecentWalletsClick}\n >\n {!!recentWallets.length && (\n <Typography\n sx={{\n color: 'text.secondary',\n }}\n >\n {recentWallets.length}\n </Typography>\n )}\n </CardButton>\n {!hiddenUI?.addressBookConnectedWallets && (\n <CardButton\n title={t('sendToWallet.connectedWallets')}\n icon={<Wallet />}\n onClick={handleConnectedWalletsClick}\n >\n {!!connectedWallets.length && (\n <Typography\n sx={{\n color: 'text.secondary',\n }}\n >\n {connectedWallets.length}\n </Typography>\n )}\n </CardButton>\n )}\n <CardButton\n title={t('header.bookmarkedWallets')}\n icon={<TurnedIn />}\n onClick={handleBookmarkedWalletsClick}\n >\n {!!bookmarks.length && (\n <Typography\n sx={{\n color: 'text.secondary',\n }}\n >\n {bookmarks.length}\n </Typography>\n )}\n </CardButton>\n </Box>\n </FullHeightAdjustablePageContainer>\n )\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;AAuCA,MAAa,yBAAmC;CAC9C,MAAM,EAAE,MAAM,eAAe;CAC7B,MAAM,WAAW,YAAY;CAC7B,MAAM,0BAA0B,OAAwB,IAAI;CAC5D,MAAM,yBAAyB,OAAwB,IAAI;CAC3D,MAAM,EAAE,WAAW,kBAAkB,aAAa;CAClD,MAAM,EACJ,aACA,aACA,qBACA,qBACA,oBACE,mBAAmB;CACvB,MAAM,EAAE,kBAAkB,gBAAgB;CAC1C,MAAM,CAAC,mBAAmB,wBAAwB,eAC1C,oBAAoB,CAAC,EAAE,WAAW,EAC1C;CACA,MAAM,CAAC,iBAAiB,sBAAsB,SAAmB;CACjE,MAAM,CAAC,cAAc,mBAAmB,SAAS,EAAE;CACnD,MAAM,EAAE,iBAAiB,iBAAiB,qBAAqB;CAC/D,MAAM,EAAE,wBAAwB,yBAAyB;CACzD,MAAM,CAAC,aAAa,eAAe,SAAS;CAC5C,MAAM,EAAE,OAAO,YAAY,SAAS,SAAS;CAC7C,MAAM,CAAC,qBAAqB,0BAA0B,SAAS,KAAK;CACpE,MAAM,CAAC,yBAAyB,8BAA8B,SAAS,KAAK;CAC5E,MAAM,EAAE,SAAS,UAAU,eAAe,gBAAgB;CAE1D,MAAM,EAAE,aAAa,WAAW;CAChC,MAAM,mBAAmB,SAAS,QAAQ,YAAY,QAAQ,WAAW;CAEzE,UAAU,EAAE,qBAAqB,CAAC;CAElC,MAAM,qBAAqB,MAAmB;EAC5C,IAAI,cACF,gBAAgB,EAAE;EAEpB,IAAI,oBAAoB,GAAG;GACzB,cAAc,aAAa,IAAI,EAAE,WAAW,KAAK,CAAC;GAClD,oBAAoB;EACtB;EACA,qBAAsB,EAAE,OAA4B,MAAM,KAAK,CAAC;CAClE;CAEA,MAAM,aAAa,YAAY;EAC7B,IAAI,cACF;EAEF,IAAI,CAAC,mBAAmB;GACtB,gBAAgB,EAAE,mCAAmC,CAAC;GACtD;EACF;EACA,uBAAuB,IAAI;EAC3B,MAAM,mBAAmB,MAAM,gBAAgB;GAC7C,OAAO;GACP,WAAW;GACX,OAAO;EACT,CAAC;EACD,uBAAuB,KAAK;EAC5B,IAAI,CAAC,iBAAiB,SAAS;GAC7B,gBAAgB,iBAAiB,KAAK;GACtC;EACF;EAEA,IACE,uBACA,wBAAwB,iBAAiB,WACzC;GACA,gBACE,EAAE,sCAAsC,EACtC,WAAW,SAAS,KACtB,CAAC,CACH;GACA;EACF;EAEA,mBAAmB;GACjB,MACE,iBAAiB,gBAAA,IACb,oBACA,KAAA;GACN,SAAS,iBAAiB;GAC1B,WAAW,iBAAiB;EAC9B,CAAC;EACD,uBAAuB,SAAS,KAAK;CACvC;CAEA,MAAM,wBAAwB,YAAY;EACxC,IAAI,cACF;EAEF,IAAI,CAAC,mBAAmB;GACtB,gBAAgB,EAAE,mCAAmC,CAAC;GACtD;EACF;EAEA,MAAM,yBAAyB,YAAY,iBAAiB;EAC5D,IAAI,wBAAwB;GAC1B,gBACE,EAAE,qCAAqC,EACrC,MAAM,uBAAuB,KAC/B,CAAC,CACH;GACA;EACF;EACA,2BAA2B,IAAI;EAC/B,MAAM,mBAAmB,MAAM,gBAAgB,EAC7C,OAAO,kBACT,CAAC;EACD,2BAA2B,KAAK;EAEhC,IAAI,iBAAiB,SAAS;GAC5B,mBAAmB;IACjB,MACE,iBAAiB,gBAAA,IACb,oBACA,KAAA;IACN,SAAS,iBAAiB;IAC1B,WAAW,iBAAiB;GAC9B,CAAC;GACD,wBAAwB,SAAS,KAAK;EACxC,OACE,gBAAgB,iBAAiB,KAAK;CAE1C;CAEA,MAAM,iCAAiC;EACrC,SAAS,EAAE,IAAI,iBAAiB,cAAc,CAAC;CACjD;CAEA,MAAM,oCAAoC;EACxC,SAAS,EAAE,IAAI,iBAAiB,iBAAiB,CAAC;CACpD;CACA,MAAM,qCAAqC;EACzC,SAAS,EAAE,IAAI,iBAAiB,UAAU,CAAC;CAC7C;CAEA,MAAM,qBAAqB,aAAuB;EAChD,YAAY,QAAQ;EACpB,SAAS,EAAE,IAAI,iBAAiB,UAAU,CAAC;CAC7C;CAEA,MAAM,mBAAmB,oBAA8B;EACrD,oBAAoB,eAAe;EACnC,gBAAgB,eAAe;CACjC;CAEA,MAAM,cAAc,EAAE,6BAA6B,EACjD,SAAS,OACX,CAAC;CAED,OACE,qBAAC,mCAAD;EACE,YAAA;EACA,eAAA;EACA,kBAAkB,YAAY;YAHhC,CAKE,qBAAC,KAAD;GACE,IAAI;IACF,SAAS;IACT,eAAe;IACf,KAAK;IACL,cAAc;GAChB;aANF,CAQE,qBAAC,kBAAD;IAAkB,MAAM,eAAe,UAAU;cAAjD;KACE,oBAAC,cAAD;MACE,MAAK;MACL,cAAa;MACb,aAAY;MACZ,gBAAe;MACf,YAAW;MACX,UAAU;MACV,OAAO;MACM;MACb,cAAY;MACZ,SAAS;MACT,YAAY,EAAE,WAAW,IAAI;MAC7B,WAAA;KACD,CAAA;KACA,eACC,oBAAC,iBAAD;MAAiB,MAAM,oBAAC,WAAD,CAAY,CAAA;MAAG,IAAI;OAAE,IAAI;OAAG,UAAU;MAAE;gBAC5D;KACc,CAAA,IACf;KACJ,qBAAC,uBAAD;MAAuB,IAAI;OAAE,UAAU;OAAG,eAAe;MAAE;gBAA3D,CACE,oBAAC,gBAAD;OACE,SAAQ;OACR,SAAS;OACT,SAAS;OACT,iBAAgB;OAChB,IAAI,EAAE,UAAU,EAAE;iBAEjB,EAAE,aAAa;MACF,CAAA,GAChB,oBAAC,SAAD;OAAS,OAAO,EAAE,iBAAiB;iBACjC,oBAAC,wBAAD;QACE,SAAS;QACT,SAAS;QACT,iBAAgB;kBAEhB,oBAAC,UAAD,EAAU,UAAS,QAAS,CAAA;OACN,CAAA;MACjB,CAAA,CACY;;KACvB,oBAAC,qBAAD;MACE,KAAK;MACL,mBAAmB;MACnB,WAAW;KACZ,CAAA;KACD,oBAAC,sBAAD;MACE,KAAK;MACY;MACjB,eAAe;KAChB,CAAA;IACe;OACjB,YAAY,0BAA0B,oBAAC,wBAAD,CAAyB,CAAA,CAC7D;MACL,qBAAC,KAAD;GAAK,IAAI;IAAE,SAAS;IAAQ,eAAe;IAAU,KAAK;GAAE;aAA5D;IACE,oBAAC,YAAD;KACE,OAAO,EAAE,sBAAsB;KAC/B,MAAM,oBAAC,0BAAD,CAA2B,CAAA;KACjC,SAAS;eAER,CAAC,CAAC,cAAc,UACf,oBAAC,YAAD;MACE,IAAI,EACF,OAAO,iBACT;gBAEC,cAAc;KACL,CAAA;IAEJ,CAAA;IACX,CAAC,UAAU,+BACV,oBAAC,YAAD;KACE,OAAO,EAAE,+BAA+B;KACxC,MAAM,oBAAC,QAAD,CAAS,CAAA;KACf,SAAS;eAER,CAAC,CAAC,iBAAiB,UAClB,oBAAC,YAAD;MACE,IAAI,EACF,OAAO,iBACT;gBAEC,iBAAiB;KACR,CAAA;IAEJ,CAAA;IAEd,oBAAC,YAAD;KACE,OAAO,EAAE,0BAA0B;KACnC,MAAM,oBAAC,UAAD,CAAW,CAAA;KACjB,SAAS;eAER,CAAC,CAAC,UAAU,UACX,oBAAC,YAAD;MACE,IAAI,EACF,OAAO,iBACT;gBAEC,UAAU;KACD,CAAA;IAEJ,CAAA;GACT;IAC4B;;AAEvC"}
|
|
1
|
+
{"version":3,"file":"SendToWalletPage.js","names":[],"sources":["../../../../src/pages/SendToWallet/SendToWalletPage.tsx"],"sourcesContent":["import { useAccount } from '@lifi/wallet-management'\nimport AccountBalanceWalletIcon from '@mui/icons-material/AccountBalanceWallet'\nimport ErrorIcon from '@mui/icons-material/Error'\nimport TurnedIn from '@mui/icons-material/TurnedIn'\nimport Wallet from '@mui/icons-material/Wallet'\nimport { Box, Tooltip, Typography } from '@mui/material'\nimport { useNavigate } from '@tanstack/react-router'\nimport type { ChangeEvent } from 'react'\nimport { useRef, useState } from 'react'\nimport { useTranslation } from 'react-i18next'\nimport type { BottomSheetBase } from '../../components/BottomSheet/types.js'\nimport { ButtonTertiary } from '../../components/ButtonTertiary.js'\nimport { CardButton } from '../../components/Card/CardButton.js'\nimport { AccountDeployedMessage } from '../../components/Messages/AccountDeployedMessage.js'\nimport {\n AddressType,\n useAddressValidation,\n} from '../../hooks/useAddressValidation.js'\nimport { useChain } from '../../hooks/useChain.js'\nimport { useHeader } from '../../hooks/useHeader.js'\nimport { useToAddressRequirements } from '../../hooks/useToAddressRequirements.js'\nimport { useWidgetConfig } from '../../providers/WidgetProvider/WidgetProvider.js'\nimport type { Bookmark } from '../../stores/bookmarks/types.js'\nimport { useBookmarkActions } from '../../stores/bookmarks/useBookmarkActions.js'\nimport { useBookmarks } from '../../stores/bookmarks/useBookmarks.js'\nimport { useFieldActions } from '../../stores/form/useFieldActions.js'\nimport { useFieldValues } from '../../stores/form/useFieldValues.js'\nimport { navigationRoutes } from '../../utils/navigationRoutes.js'\nimport { BookmarkAddressSheet } from './BookmarkAddressSheet.js'\nimport { ConfirmAddressSheet } from './ConfirmAddressSheet.js'\nimport {\n AddressInput,\n FullHeightAdjustablePageContainer,\n SendToWalletButtonRow,\n SendToWalletCard,\n SendToWalletIconButton,\n ValidationAlert,\n} from './SendToWalletPage.style.js'\n\nexport const SendToWalletPage: React.FC = () => {\n const { t } = useTranslation()\n const navigate = useNavigate()\n const bookmarkAddressSheetRef = useRef<BottomSheetBase>(null)\n const confirmAddressSheetRef = useRef<BottomSheetBase>(null)\n const { bookmarks, recentWallets } = useBookmarks()\n const {\n addBookmark,\n getBookmark,\n setSelectedBookmark,\n getSelectedBookmark,\n addRecentWallet,\n } = useBookmarkActions()\n const { setFieldValue } = useFieldActions()\n const [inputAddressValue, setInputAddressValue] = useState(\n () => getSelectedBookmark()?.address ?? ''\n )\n const [validatedWallet, setValidatedWallet] = useState<Bookmark>()\n const [errorMessage, setErrorMessage] = useState('')\n const { validateAddress, isValidating } = useAddressValidation()\n const { requiredToChainType } = useToAddressRequirements()\n const [toChainId] = useFieldValues('toChain')\n const { chain: toChain } = useChain(toChainId)\n const [isDoneButtonLoading, setIsDoneButtonLoading] = useState(false)\n const [isBookmarkButtonLoading, setIsBookmarkButtonLoading] = useState(false)\n const { variant, hiddenUI, requiredUI } = useWidgetConfig()\n\n const { accounts } = useAccount()\n const connectedWallets = accounts.filter((account) => account.isConnected)\n\n useHeader(t('header.sendToWallet'))\n\n const handleInputChange = (e: ChangeEvent) => {\n if (errorMessage) {\n setErrorMessage('')\n }\n if (getSelectedBookmark()) {\n setFieldValue('toAddress', '', { isTouched: true })\n setSelectedBookmark()\n }\n setInputAddressValue((e.target as HTMLInputElement).value.trim())\n }\n\n const handleDone = async () => {\n if (isValidating) {\n return\n }\n if (!inputAddressValue) {\n setErrorMessage(t('error.title.walletAddressRequired'))\n return\n }\n setIsDoneButtonLoading(true)\n const validationResult = await validateAddress({\n value: inputAddressValue,\n chainType: requiredToChainType,\n chain: toChain,\n })\n setIsDoneButtonLoading(false)\n if (!validationResult.isValid) {\n setErrorMessage(validationResult.error)\n return\n }\n\n if (\n requiredToChainType &&\n requiredToChainType !== validationResult.chainType\n ) {\n setErrorMessage(\n t('error.title.walletChainTypeInvalid', {\n chainName: toChain?.name,\n })\n )\n return\n }\n\n setValidatedWallet({\n name:\n validationResult.addressType === AddressType.NameService\n ? inputAddressValue\n : undefined,\n address: validationResult.address,\n chainType: validationResult.chainType,\n })\n confirmAddressSheetRef.current?.open()\n }\n\n const handleBookmarkAddress = async () => {\n if (isValidating) {\n return\n }\n if (!inputAddressValue) {\n setErrorMessage(t('error.title.walletAddressRequired'))\n return\n }\n\n const existingBookmarkWallet = getBookmark(inputAddressValue)\n if (existingBookmarkWallet) {\n setErrorMessage(\n t('error.title.bookmarkAlreadyExists', {\n name: existingBookmarkWallet.name,\n })\n )\n return\n }\n setIsBookmarkButtonLoading(true)\n const validationResult = await validateAddress({\n value: inputAddressValue,\n })\n setIsBookmarkButtonLoading(false)\n\n if (validationResult.isValid) {\n setValidatedWallet({\n name:\n validationResult.addressType === AddressType.NameService\n ? inputAddressValue\n : undefined,\n address: validationResult.address,\n chainType: validationResult.chainType,\n })\n bookmarkAddressSheetRef.current?.open()\n } else {\n setErrorMessage(validationResult.error)\n }\n }\n\n const handleRecentWalletsClick = () => {\n navigate({ to: navigationRoutes.recentWallets })\n }\n\n const handleConnectedWalletsClick = () => {\n navigate({ to: navigationRoutes.connectedWallets })\n }\n const handleBookmarkedWalletsClick = () => {\n navigate({ to: navigationRoutes.bookmarks })\n }\n\n const handleAddBookmark = (bookmark: Bookmark) => {\n addBookmark(bookmark)\n navigate({ to: navigationRoutes.bookmarks })\n }\n\n const handleOnConfirm = (confirmedWallet: Bookmark) => {\n setSelectedBookmark(confirmedWallet)\n addRecentWallet(confirmedWallet)\n }\n\n const placeholder = t('sendToWallet.enterAddress', {\n context: 'long',\n })\n\n return (\n <FullHeightAdjustablePageContainer\n topGutters\n bottomGutters\n enableFullHeight={variant !== 'drawer'}\n >\n <Box\n sx={{\n display: 'flex',\n flexDirection: 'column',\n gap: 2,\n marginBottom: 6,\n }}\n >\n <SendToWalletCard type={errorMessage ? 'error' : 'default'}>\n <AddressInput\n size=\"small\"\n autoComplete=\"off\"\n autoCorrect=\"off\"\n autoCapitalize=\"off\"\n spellCheck=\"false\"\n onChange={handleInputChange}\n value={inputAddressValue}\n placeholder={placeholder}\n aria-label={placeholder}\n maxRows={2}\n inputProps={{ maxLength: 128 }}\n multiline\n />\n {errorMessage ? (\n <ValidationAlert icon={<ErrorIcon />} sx={{ pb: 2, paddingX: 2 }}>\n {errorMessage}\n </ValidationAlert>\n ) : null}\n <SendToWalletButtonRow sx={{ paddingX: 2, paddingBottom: 2 }}>\n <ButtonTertiary\n variant=\"text\"\n onClick={handleDone}\n loading={isDoneButtonLoading}\n loadingPosition=\"center\"\n sx={{ flexGrow: 1 }}\n >\n {t('button.done')}\n </ButtonTertiary>\n <Tooltip title={t('button.bookmark')}>\n <SendToWalletIconButton\n onClick={handleBookmarkAddress}\n loading={isBookmarkButtonLoading}\n loadingPosition=\"center\"\n >\n <TurnedIn fontSize=\"small\" />\n </SendToWalletIconButton>\n </Tooltip>\n </SendToWalletButtonRow>\n <ConfirmAddressSheet\n ref={confirmAddressSheetRef}\n validatedBookmark={validatedWallet}\n onConfirm={handleOnConfirm}\n />\n <BookmarkAddressSheet\n ref={bookmarkAddressSheetRef}\n validatedWallet={validatedWallet}\n onAddBookmark={handleAddBookmark}\n />\n </SendToWalletCard>\n {requiredUI?.accountDeployedMessage && <AccountDeployedMessage />}\n </Box>\n <Box sx={{ display: 'flex', flexDirection: 'column', gap: 1 }}>\n <CardButton\n title={t('header.recentWallets')}\n icon={<AccountBalanceWalletIcon />}\n onClick={handleRecentWalletsClick}\n >\n {!!recentWallets.length && (\n <Typography\n sx={{\n color: 'text.secondary',\n }}\n >\n {recentWallets.length}\n </Typography>\n )}\n </CardButton>\n {!hiddenUI?.addressBookConnectedWallets && (\n <CardButton\n title={t('sendToWallet.connectedWallets')}\n icon={<Wallet />}\n onClick={handleConnectedWalletsClick}\n >\n {!!connectedWallets.length && (\n <Typography\n sx={{\n color: 'text.secondary',\n }}\n >\n {connectedWallets.length}\n </Typography>\n )}\n </CardButton>\n )}\n <CardButton\n title={t('header.bookmarkedWallets')}\n icon={<TurnedIn />}\n onClick={handleBookmarkedWalletsClick}\n >\n {!!bookmarks.length && (\n <Typography\n sx={{\n color: 'text.secondary',\n }}\n >\n {bookmarks.length}\n </Typography>\n )}\n </CardButton>\n </Box>\n </FullHeightAdjustablePageContainer>\n )\n}\n"],"mappings":"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"}
|