[PE-7191] External wallet swap flow by DejayJD · Pull Request #13276 · AudiusProject/apps

DejayJD · 2025-10-20T19:03:03Z

Description

Wallet connection flow

Swap Flow

Adds UI for external wallet swaps
Updates useBuySellSwap hook to not handle the actual swap hook any more, this is now handled by web/mobile respectively
Aligns the input/output types of internal & external swap hooks

How Has This Been Tested?

✅ internal wallet swaps still work
✅ launchpad swaps still work
✅ mobile swaps still work
✅ tested swaps for USDC<>Coin, Audio<>Coin, and Coin<>Coin

changeset-bot · 2025-10-20T19:03:07Z

⚠️ No Changeset found

Latest commit: ca2c984

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

dylanjeffers

super solid

dylanjeffers · 2025-10-20T21:52:23Z

+  prefix: string = '$'
 ): string => {
-  if (num === 0) return '$0.00'
+  if (num === 0) return `${prefix}0.00`


what's this for?

Allows replacing the $ that gets prefixed to these strings - in this case removing it

still confused, seems like it's doing the same as before?

dylanjeffers · 2025-10-20T21:52:42Z

    selectedPair: safeSelectedPair,
-    onClose
+    swapHookData: swapHookState,
+    handleSwap: (params) => {


handleSwap: performSwap

dylanjeffers · 2025-10-20T21:53:04Z

    selectedPair,
-    onClose: () => navigation.goBack()
+    swapHookData: swapHookState,
+    handleSwap: (params) => {


same, is it the case the types are a bit different or something?

dylanjeffers · 2025-10-20T21:53:53Z

+  const externalWalletAccount = appkitModal.getAccount()
+  const internalSwapHook = useSwapCoins()
+  const externalSwapHook = useExternalWalletSwap()
+  const { mutateAsync: performSwap, ...swapHookState } =


dylanjeffers · 2025-10-20T21:55:22Z

+  | typeof IconMetamask
+  | typeof IconSolana
+
+const getWalletIcon = (): WalletIconComponent => {


in your demo video, looks like this is showing audio icon when it should show phantom?

dylanjeffers · 2025-10-20T21:56:47Z

+
+  const tokenBalanceString = isUsingExternalWallet
+    ? externalWalletTokenBalance
+      ? formatCurrency(


we have a ton of helpers, but this still feels awk

to follow on this:

this nesting is not the clearest to read, can we break up pls

we shouldn't default to showing 0 balances ever in case there's an error upstream. we should only show 0 as a balance if the user truly has 0 balance

dylanjeffers · 2025-10-20T21:57:26Z

+              border='default'
+              alignItems='center'
+              justifyContent='center'
+              css={(theme) => ({


in your demo the circle seems a bit too large compared to the icon itself

dylanjeffers · 2025-10-20T21:58:05Z

+  SwapStatus,
+  SwapTokensParams,
+  SwapTokensResult
+} from '@audius/common/src/api/tan-query/jupiter/types'


should not import from source

dylanjeffers · 2025-10-20T22:00:11Z

-              const outputAmount = result.outputAmount!
+              const outputAmount = result.outputAmount!.uiAmount
              const newAmount = currentAmount + outputAmount
              return new FixedDecimal(newAmount, oldBalance.decimalPlaces)


Excellent job in this file

dylanjeffers · 2025-10-20T22:01:08Z

-              address: mintAddress,
-              decimals: LAUNCHPAD_COIN_DECIMALS
-            },
+            inputMint: TOKEN_LISTING_MAP.AUDIO.address,


so just to confirm, you were able to use the same external swap flow for both buy audio and external buy/sell/swap?

you mean the launchpad buy flow? Yes

faridsalau · 2025-10-21T11:15:35Z

+  swapHookData: {
+    data?: SwapTokensResult
+    status: MutationStatus
+    error?: Error | null
+  }
+  // The swap is handled externally to allow for external wallet swaps
+  // Web and mobile use different services for these so we let each repo handle the logic
+  handleSwap: (params: {
+    inputMint: string
+    outputMint: string
+    amountUi: number
+    slippageBps: number
+  }) => void


can make these their own types

faridsalau · 2025-10-21T11:19:28Z

+import { useConnectExternalWallets } from 'hooks/useConnectExternalWallets'
+import { env } from 'services/env'
+
+const messages = {


nit: we have walletMessages.ts

faridsalau · 2025-10-21T11:20:43Z

+  if (typeof window !== 'undefined' && window.ethereum) {
+    return IconMetamask


is this the spec from design?

faridsalau · 2025-10-21T11:21:11Z

+  inputToken: { mint: string; symbol: string }
+}) => {
+  const { data: currentUser } = useCurrentAccountUser()
+  const isAnonymousUser = !currentUser


nit: isLoggedOutUser feels more clear to me or isUnauthed tbh not bad to just use !currentUser everywhere isAnonymousUser is used. probably the most clear and is less chars haha

faridsalau · 2025-10-21T11:26:27Z

+  } = useExternalWalletBalance({
+    walletAddress: externalWalletAccount?.address,
+    mint: inputToken.mint
+  })
+
+  const {
+    data: internalWalletTokenBalanceData,
+    isPending: isInternalWalletTokenBalanceLoading
+  } = useCoinBalance({
+    mint: inputToken.mint,


should we not disable these if the other is being used?

faridsalau · 2025-10-21T11:28:26Z

+    ? isExternalWalletTokenBalanceLoading
+    : isInternalWalletTokenBalanceLoading
+
+  const noCurrentWallet = isAnonymousUser && !isUsingExternalWallet


let's do const hasUnauthedWallet = isAnonymousUser && isUsingExternalWallet and then we dont' have to do the negation on a negative below

faridsalau · 2025-10-21T11:30:01Z

+              ? messages.builtInWalletNotAvailable
+              : messages.tradeWith}
+          </Text>
+          {/* Wallet pill */}


don't we have a pill component in harmony?

faridsalau · 2025-10-21T11:30:36Z

+        </Flex>
+        <TextLink
+          variant='visible'
+          href='#'


intentional?

faridsalau · 2025-10-21T11:33:14Z

  }, [coins, coinsLoading])

  // Get tokens that user owns (includes USDC if user has balance)
+  // TODO : modify this to account for external wallets


#antiTodoComments 😿

faridsalau · 2025-10-21T11:36:15Z

  const shouldShowError =
    !!displayErrorMessage || (activeTab === 'buy' && !hasSufficientBalance)

+  const userHasNoWallet = !externalWalletAccount?.address && !currentUser


we should try to use affirmative var names, so something like userHasWallet and using negation thing applies here as well

faridsalau · 2025-10-21T11:37:23Z

@@ -4,15 +4,19 @@ import {
  TEMP_ARTIST_COINS_PAGE_SIZE,


faridsalau · 2025-10-21T11:38:26Z

      setCurrentStep(BuyModalStep.Loading)
    }
-    if (swapError || swapData?.isError) {
+    if (swapError || swapData?.error) {


faridsalau · 2025-10-21T11:39:38Z

@@ -352,7 +356,7 @@ type AssetDetailProps = {

 const BalanceSectionContent = ({ mint }: AssetDetailProps) => {
  const { data: coin, isPending: coinsLoading } = useArtistCoin(mint)
-  const { data: tokenBalance, isPending: tokenBalanceLoading } = useCoinBalance(
+  const { data: tokenBalance, isLoading: tokenBalanceLoading } = useCoinBalance(


just curious why we're using isLoading instead of isPending?

isPending = "wait until data shows up" - if there's no data ever (cause no user) isPending is permanently false. isLoading just means "is it trying to fetch data right now"

faridsalau · 2025-10-21T11:43:30Z

+  amountUi: number
  walletAddress: string
-  isAMM: boolean
+  solanaConnection: any


can we avoid using any here

also, there's a bit of overlap with these types. can we create a base types? maybe that's SwapTokenParams

faridsalau · 2025-10-21T11:45:17Z

+  transaction: VersionedTransaction
+  inputAmount: { amount: number; uiAmount: number }
+  outputAmount: { amount: number; uiAmount: number }


nit: make into its own type

faridsalau · 2025-10-21T11:45:57Z

+    quoteResponse: firstQuote.quote,
+    userPublicKey: walletAddress,
+    dynamicSlippage: true,
+    useSharedAccounts: false


have u tried with true?

faridsalau · 2025-10-21T11:47:21Z

+    // Retry without shared accounts if it fails
+    swapRequest1.useSharedAccounts = false


it's already false. also, we try 3 more times in internal flow, can perhaps try more times here?

faridsalau · 2025-10-21T11:47:44Z

+    })
+  } catch (e) {
+    // Retry without shared accounts if it fails
+    swapRequest2.useSharedAccounts = false


faridsalau · 2025-10-21T11:49:33Z

+  }
+
+  // Convert instructions to TransactionInstructions
+  const firstSetupInstructions = convertJupiterInstructions(


can we just use convertJupiterInstructions([...allInstructions]) instead of having to use it for each ix?

faridsalau · 2025-10-21T11:52:41Z


-        hookProgress.receivedQuote = true
+        let transaction: VersionedTransaction
+        let inputAmount: { amount: number; uiAmount: number }


we should make a type for { amount: number; uiAmount: number } it's used all over the place, maybe SwapAmount or something

faridsalau · 2025-10-21T11:55:16Z

+            audioMint: env.WAUDIO_MINT_ADDRESS,
+            inputDecimals,
+            outputDecimals,
+            audioDecimals: 8, // AUDIO has 8 decimals


let's use this from TOKEN_LISTING_MAP

cursor · 2025-10-21T18:42:26Z

+        // External wallet swaps require some extra params. These are unused for internal swaps
+        inputDecimals: swapTokens.inputTokenInfo!.decimals,
+        outputDecimals: swapTokens.outputTokenInfo!.decimals,
+        walletAddress: externalWalletAccount?.address as string


Bug: Token Info Nullability Causes Assertion Failures

Non-null assertions on swapTokens.inputTokenInfo!.decimals and swapTokens.outputTokenInfo!.decimals can cause runtime errors. This occurs because inputTokenInfo and outputTokenInfo can be null when currentTokenPair.baseToken or currentTokenPair.quoteToken are unavailable.

### Description Wallet connection flow ![2025-10-20 14 16 20](https://github.com/user-attachments/assets/ae8847c5-5d67-4248-8a8c-695ade1c5673) Swap Flow ![2025-10-20 10 54 46](https://github.com/user-attachments/assets/d94283f3-c764-41fc-b680-da0c4d8f4d0d) - Adds UI for external wallet swaps - Updates useBuySellSwap hook to not handle the actual swap hook any more, this is now handled by web/mobile respectively - Aligns the input/output types of internal & external swap hooks ### How Has This Been Tested? ✅ internal wallet swaps still work ✅ launchpad swaps still work ✅ mobile swaps still work ✅ tested swaps for USDC<>Coin, Audio<>Coin, and Coin<>Coin --------- Co-authored-by: Farid Salau <faridsalau@gmail.com>

[4b1ce10] [PE-7239] Fix issues due to stale local storage data (#13311) Dylan Jeffers [7a88ddf] Artist coins page size 1000 (#13313) Reed [3d246f6] Some additional analytics around wallets & launchpad (#13312) JD Francis [f22659e] [PE-7238] Add analytics for external wallet swaps (#13309) JD Francis [421a9e9] 💚🟢🐸🥬 (#13308) JD Francis [ffb4af9] Fix wallet connect not triggering success in claim flow (#13305) JD Francis [68fa1a4] [PE-7229] Fix referrer signup (#13306) Dylan Jeffers [6ed86b5] Version Packages (#13254) github-actions[bot] [b9b22cd] [PE-7204] Associate wallets on solana /relay calls (#13299) JD Francis [ad01774] Revert "[PE-7211] Claim fees after connect" (#13303) JD Francis [1819c1e] fix mobile ci (#13302) JD Francis [afeceae] Fix AUDIO breakdown (#13298) Farid Salau [68eace6] birdeye.so (#13301) Marcus Pasell [30f3e66] [PE-7215] Add sol back into the list of tokens + Dont show 'add cash' (#13295) JD Francis [6e74a41] Fix CI (#13297) Farid Salau [e68b261] [PE-7212] Claim fees optimistic updates (#13290) Dylan Jeffers [d1000f1] [PE-7211] Claim fees after connect (#13291) Dylan Jeffers [f1f1e94] [PE-7210] Handle lowercase coin urls (#13284) Dylan Jeffers [8eade23] [PE-7226] Fix issues with confirmation screen (#13294) JD Francis [0b58a67] [PE-7198] Update mobile profile edit flow UI (#13271) Farid Salau [dd17039] eth key exporter (#13293) alecsavvy [a6d5e9d] Use production wAUDIO on stage (#13288) Marcus Pasell [0bd603d] [PE-7213] Prevent claiming dust (#13289) Dylan Jeffers [b4dde83] Add polling for audio balance changes (#13228) JD Francis [315865f] Fix lint (#13285) Dylan Jeffers [ee7ee7f] [PE-7209] External wallet coin dropdown (#13283) Dylan Jeffers [d4f7649] [PE-7191] External wallet swap flow (#13276) JD Francis [4a38e63] Rename asset to coin (#13275) Dylan Jeffers [c3ffa17] Show DAMM V2 Fees in UI (#13280) Marcus Pasell [172f129] Remove extra dbcpool arg (#13269) Ray Jacobson [3dafa35] [PE-7199] Refactor buy/sell flow coin filtering logic (#13272) Farid Salau [c1d796d] [PE-7193] Announcement notifs link to artist coin explore (#13266) Reed [3e561d2] [PE-7197] Update ArtistCoinHoverCard to include member vs creator (#13270) Farid Salau [50878b5] Small QA items (#13273) Farid Salau [932fbdb] Remove search explore flag (#13261) Dylan Jeffers [5da716e] [PE-7163] Redirect mispelled coins to 404 (#13274) Ray Jacobson [6866949] Finalize mobile search explore (#13260) Dylan Jeffers [0ec2f5f] [PE-7189] Add balance breakdown component (#13262) Farid Salau

DejayJD added 4 commits October 20, 2025 10:56

External wallet swap buy/sell working

37d45ad

Finish refactoring hooks to align formats closer

6486f8c

lint fixes

f91f6e4

ts fies

73b93df

pull-request-size Bot added the size/XL label Oct 20, 2025

DejayJD requested review from a team, dylanjeffers and faridsalau October 20, 2025 19:03

DejayJD added 5 commits October 20, 2025 14:12

lint fix & use wallet icon appropriately

909f2f2

Add $ in for USDC and tweak colors

51b64ac

fix balance not working on convert flow

942e96e

update mobile flow

49c6ea8

Add in indirect swapping logic

6bdf5eb

pull-request-size Bot added size/XXL and removed size/XL labels Oct 20, 2025

dylanjeffers approved these changes Oct 20, 2025

View reviewed changes

DejayJD added 3 commits October 20, 2025 17:51

working unauthed swaps

69844a7

PR feedback

57d06b1

cleanup

9e19101

faridsalau reviewed Oct 21, 2025

View reviewed changes

faridsalau added 2 commits October 21, 2025 13:22

Force solana

6cea01e

Comments

410b5b0

This comment was marked as outdated.

Sign in to view

faridsalau added 2 commits October 21, 2025 13:34

Resolve merge conflicts: keep Coin naming and accept @Branch changes

973b5fb

Revert changes

ca2c984

faridsalau merged commit d4f7649 into main Oct 21, 2025
4 of 5 checks passed

faridsalau deleted the jd/external-wallet-swap branch October 21, 2025 18:39

cursor Bot reviewed Oct 21, 2025

View reviewed changes

		if (typeof window !== 'undefined' && window.ethereum) {
		return IconMetamask

		// Retry without shared accounts if it fails
		swapRequest1.useSharedAccounts = false

Uh oh!

Conversation

DejayJD commented Oct 20, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

How Has This Been Tested?

Uh oh!

changeset-bot Bot commented Oct 20, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

⚠️ No Changeset found

Uh oh!

dylanjeffers left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

faridsalau Oct 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

faridsalau Oct 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

faridsalau Oct 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

faridsalau Oct 21, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

DejayJD commented Oct 20, 2025 •

edited

Loading

changeset-bot Bot commented Oct 20, 2025 •

edited

Loading

faridsalau Oct 21, 2025 •

edited

Loading

faridsalau Oct 21, 2025 •

edited

Loading

faridsalau Oct 21, 2025 •

edited

Loading

faridsalau Oct 21, 2025 •

edited

Loading

faridsalau Oct 21, 2025 •

edited

Loading

faridsalau Oct 21, 2025 •

edited

Loading