1 change: 1 addition & 0 deletions packages/common/src/api/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -155,6 +155,7 @@ export * from './tan-query/wallets/useUserCoinBalance'
export * from './tan-query/wallets/useWalletCollectibles'
export * from './tan-query/wallets/useWalletOwner'
export * from './tan-query/wallets/useUSDCBalance'
export * from './tan-query/wallets/useTokenBalance'
export * from './tan-query/jupiter/useSwapTokens'
export * from './tan-query/jupiter/useTokenExchangeRate'
export * from './tan-query/jupiter/utils'
Expand Down
55 changes: 24 additions & 31 deletions packages/common/src/api/tan-query/jupiter/constants.ts
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,40 @@
import { PublicKey } from '@solana/web3.js'

import { Env } from '~/services/env'
import {
createTokenListingMap,
TOKEN_LISTING_MAP
} from '~/store/ui/shared/tokenConstants'
import { getOrInitializeRegistry, type TokenConfig } from '~/services/tokens'

import { UserBankManagedTokenInfo } from './types'

const CLAIMABLE_TOKEN_MINTS = ['wAUDIO', 'USDC', 'BONK'] as const
type ClaimableTokenMint = (typeof CLAIMABLE_TOKEN_MINTS)[number]

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

whoa cool


const isClaimableTokenMint = (symbol: string): symbol is ClaimableTokenMint => {
return CLAIMABLE_TOKEN_MINTS.includes(symbol as ClaimableTokenMint)
}

export const JUPITER_PROGRAM_ID = new PublicKey(
'JUP6LkbZbjS1jKKwapdHNy74zcZ3tLUZoi5QNyVTaV4'
)

export const createUserBankManagedTokens = (
env: Env
): Record<string, UserBankManagedTokenInfo> => {
const tokenListingMap = createTokenListingMap(env)
return {
[tokenListingMap.AUDIO.address.toUpperCase()]: {
mintAddress: tokenListingMap.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: tokenListingMap.AUDIO.decimals
},
[tokenListingMap.USDC.address.toUpperCase()]: {
mintAddress: tokenListingMap.USDC.address,
claimableTokenMint: 'USDC',
decimals: tokenListingMap.USDC.decimals
const registry = getOrInitializeRegistry(env.ENVIRONMENT)

// Get all userbank-enabled tokens from registry
const userbankTokens: TokenConfig[] = registry.getUserbankTokens()
const managedTokens: Record<string, UserBankManagedTokenInfo> = {}

// Convert registry tokens to UserBankManagedTokenInfo format
userbankTokens.forEach((token: TokenConfig) => {
if (isClaimableTokenMint(token.symbol)) {
managedTokens[token.address.toUpperCase()] = {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i think solana addresses are case sensitive?

mintAddress: token.address,
claimableTokenMint: token.symbol,
decimals: token.decimals
}
}
}
}
})

export const USER_BANK_MANAGED_TOKENS: Record<
string,
UserBankManagedTokenInfo
> = {
[TOKEN_LISTING_MAP.AUDIO.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: TOKEN_LISTING_MAP.AUDIO.decimals
},
[TOKEN_LISTING_MAP.USDC.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.USDC.address,
claimableTokenMint: 'USDC',
decimals: TOKEN_LISTING_MAP.USDC.decimals
}
return managedTokens
}
4 changes: 3 additions & 1 deletion packages/common/src/api/tan-query/jupiter/types.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -41,8 +41,10 @@ export type SwapTokensResult = {
}
}

export type ClaimableTokenMint = 'wAUDIO' | 'USDC' | 'BONK'

export interface UserBankManagedTokenInfo {
mintAddress: string
claimableTokenMint: 'wAUDIO' | 'USDC'
claimableTokenMint: ClaimableTokenMint
decimals: number
}
6 changes: 5 additions & 1 deletion packages/common/src/api/tan-query/jupiter/utils.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -255,8 +255,12 @@ export function formatUSDCValue(
* @returns Formatted price string
*/
export function formatTokenPrice(price: string, decimalPlaces: number): string {
// USDC constructor uses 6 decimal places, so we need to constrain the display
// to not exceed what's available in the FixedDecimal representation
const maxDecimalPlaces = Math.min(decimalPlaces, 6)

return USDC(price.replace(/,/g, '')).toLocaleString('en-US', {
minimumFractionDigits: 2,
maximumFractionDigits: decimalPlaces
maximumFractionDigits: maxDecimalPlaces
})
}
1 change: 1 addition & 0 deletions packages/common/src/api/tan-query/queryKeys.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -95,6 +95,7 @@ export const QUERY_KEYS = {
eventsByEntityId: 'eventsByEntityId',
walletOwner: 'walletOwner',
tokenPrice: 'tokenPrice',
tokenBalance: 'tokenBalance',
usdcBalance: 'usdcBalance',
fileSizes: 'fileSizes',
managedAccounts: 'managedAccounts',
Expand Down
145 changes: 145 additions & 0 deletions packages/common/src/api/tan-query/wallets/useTokenBalance.ts
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
import { useCallback } from 'react'

import { FixedDecimal } from '@audius/fixed-decimal'
import { TokenAccountNotFoundError } from '@solana/spl-token'
import { Commitment } from '@solana/web3.js'
import { useQuery, useQueryClient } from '@tanstack/react-query'

import { useCurrentAccountUser } from '~/api'
import { useQueryContext } from '~/api/tan-query/utils'
import { Status } from '~/models/Status'
import { MintName } from '~/services/audius-backend/solana'
import { getUserbankAccountInfo, getTokenBySymbol } from '~/services/index'

import { QUERY_KEYS } from '../queryKeys'
import { QueryOptions, type QueryKey } from '../types'

const createTokenBalance = (

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: is this rly the cleanest way? can we not do something like:

return !!amount ? new FixedDecimal(BigInt(amount.toString()), decimals) : null

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

idk i guess that's kind of annoying too..

amount: string | number | bigint | null | undefined,
decimals: number
): FixedDecimal | null => {
if (amount === null || amount === undefined) {
return null
}
return new FixedDecimal(BigInt(amount.toString()), decimals)
}

export const getTokenBalanceQueryKey = (
ethAddress: string | null,
token: MintName,
commitment: Commitment
) =>
[
QUERY_KEYS.tokenBalance,
ethAddress,
token,
commitment
] as unknown as QueryKey<FixedDecimal | null>

/**
* Hook to get the balance for any supported token for the current user.
* Uses TanStack Query for data fetching and caching.
*
* @param token The token to fetch balance for
* @param options Options for the query and polling
* @returns Object with status, data, refresh, and cancelPolling
*/
export const useTokenBalance = ({
token,
isPolling,
pollingInterval = 1000,
commitment = 'processed',
...queryOptions
}: {
token: MintName
isPolling?: boolean
pollingInterval?: number
commitment?: Commitment
} & QueryOptions) => {
const { audiusSdk, env } = useQueryContext()
const { data: user } = useCurrentAccountUser()
const ethAddress = user?.wallet ?? null
const queryClient = useQueryClient()

const result = useQuery({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment),
queryFn: async () => {
const sdk = await audiusSdk()
if (!ethAddress || !token) {
return null
}

try {
const account = await getUserbankAccountInfo(
sdk,
{
ethAddress,
mint: token
},
commitment
)

// Get token configuration from registry to get decimal places
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}

return createTokenBalance(account?.amount, tokenConfig.decimals)
} catch (e) {
// If user doesn't have a token account yet, return 0 balance
if (e instanceof TokenAccountNotFoundError) {
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}
return createTokenBalance(BigInt(0), tokenConfig.decimals)
}
console.error(`Error fetching ${token} balance:`, e)
// Return null instead of throwing to prevent infinite loading
return null
}
},
enabled: !!ethAddress && !!token,
// TanStack Query's built-in polling - only poll when isPolling is true
refetchInterval: isPolling ? pollingInterval : false,
// Prevent refetching when window regains focus during polling to avoid conflicts
refetchOnWindowFocus: !isPolling,

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

smart

...queryOptions
})

// Map TanStack Query states to the Status enum for API compatibility

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

damn is this another migration we need to do

let status = Status.IDLE
if (result.isPending) {
status = Status.LOADING
} else if (result.isError) {
status = Status.ERROR
} else if (result.isSuccess) {
status = Status.SUCCESS
}

// For compatibility with existing code
const data = result.data ?? null

// Function to cancel polling by invalidating and refetching the query
// This effectively stops the current polling cycle
const cancelPolling = useCallback(() => {
queryClient.cancelQueries({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment)
})
}, [queryClient, ethAddress, token, commitment])

return {
status,
data,
error: result.error,
refresh: result.refetch,
cancelPolling
}
}
19 changes: 11 additions & 8 deletions packages/common/src/services/audius-backend/AudiusBackend.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -43,6 +43,7 @@ import {
PushNotifications
} from '../../store'
import { getErrorMessage, uuid, Maybe, Nullable } from '../../utils'
import { getTokenBySymbol } from '../tokens'

import { MintName } from './solana'
import { MonitoringCallbacks } from './types'
Expand DownExpand Up@@ -164,6 +165,14 @@ export const audiusBackend = ({
}
}

function getMintAddress(mint: MintName): PublicKey {
const token = getTokenBySymbol(env, mint)
if (!token) {
throw new Error(`Token not found: ${mint}`)
}
return new PublicKey(token.address)
}

async function recordTrackListen({
userId,
trackId,
Expand DownExpand Up@@ -998,10 +1007,7 @@ export const audiusBackend = ({
mint: MintName
}) {
const solanaTokenProgramKey = new PublicKey(TOKEN_PROGRAM_ID)
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const addresses = PublicKey.findProgramAddressSync(
[
solanaWalletKey.toBuffer(),
Expand DownExpand Up@@ -1072,10 +1078,7 @@ export const audiusBackend = ({
solanaWalletKey,
mint
})
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const accounts = [
// 0. `[sw]` Funding account (must be a system account)
{
Expand Down
2 changes: 1 addition & 1 deletion packages/common/src/services/audius-backend/solana.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -40,7 +40,7 @@ export const MEMO_PROGRAM_ID = new PublicKey(
'Memo1UhkJRfHyvLMcVucJwxXeuD728EqVDDwQDxFMNo'
)

export type MintName = 'wAUDIO' | 'USDC'
export type MintName = 'wAUDIO' | 'USDC' | 'BONK'
export const DEFAULT_MINT: MintName = 'wAUDIO'

type UserBankConfig = {
Expand Down
Loading
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Add copy buttons to all
 blocks\n(function() {\n function addCopyButtons() {\n document.querySelectorAll('pre code').forEach(function(codeBlock) {\n if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;\n codeBlock.parentElement.setAttribute('data-copy-added', 'true');\n \n var btn = document.createElement('button');\n btn.textContent = 'Copy';\n btn.style.cssText = 'position:absolute;top:4px;right:4px;padding:2px 8px;font-size:11px;background:#4ecdc4;border:none;border-radius:4px;color:#1a1a2e;cursor:pointer;opacity:0.7;transition:opacity 0.2s;';\n btn.onmouseover = function() { this.style.opacity = '1'; };\n btn.onmouseout = function() { this.style.opacity = '0.7'; };\n btn.onclick = function() {\n navigator.clipboard.writeText(codeBlock.textContent).then(function() {\n btn.textContent = 'Copied!';\n setTimeout(function() { btn.textContent = 'Copy'; }, 1500);\n });\n };\n codeBlock.parentElement.style.position = 'relative';\n codeBlock.parentElement.appendChild(btn);\n });\n }\n \n addCopyButtons();\n \n // Re-run on dynamic content\n var observer = new MutationObserver(addCopyButtons);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Add Copy Buttons to Code Blocks");
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Skip to content
1 change: 1 addition & 0 deletions packages/common/src/api/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -155,6 +155,7 @@ export * from './tan-query/wallets/useUserCoinBalance'
export * from './tan-query/wallets/useWalletCollectibles'
export * from './tan-query/wallets/useWalletOwner'
export * from './tan-query/wallets/useUSDCBalance'
export * from './tan-query/wallets/useTokenBalance'
export * from './tan-query/jupiter/useSwapTokens'
export * from './tan-query/jupiter/useTokenExchangeRate'
export * from './tan-query/jupiter/utils'
Expand Down
55 changes: 24 additions & 31 deletions packages/common/src/api/tan-query/jupiter/constants.ts
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,40 @@
import { PublicKey } from '@solana/web3.js'

import { Env } from '~/services/env'
import {
createTokenListingMap,
TOKEN_LISTING_MAP
} from '~/store/ui/shared/tokenConstants'
import { getOrInitializeRegistry, type TokenConfig } from '~/services/tokens'

import { UserBankManagedTokenInfo } from './types'

const CLAIMABLE_TOKEN_MINTS = ['wAUDIO', 'USDC', 'BONK'] as const
type ClaimableTokenMint = (typeof CLAIMABLE_TOKEN_MINTS)[number]

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

whoa cool


const isClaimableTokenMint = (symbol: string): symbol is ClaimableTokenMint => {
return CLAIMABLE_TOKEN_MINTS.includes(symbol as ClaimableTokenMint)
}

export const JUPITER_PROGRAM_ID = new PublicKey(
'JUP6LkbZbjS1jKKwapdHNy74zcZ3tLUZoi5QNyVTaV4'
)

export const createUserBankManagedTokens = (
env: Env
): Record<string, UserBankManagedTokenInfo> => {
const tokenListingMap = createTokenListingMap(env)
return {
[tokenListingMap.AUDIO.address.toUpperCase()]: {
mintAddress: tokenListingMap.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: tokenListingMap.AUDIO.decimals
},
[tokenListingMap.USDC.address.toUpperCase()]: {
mintAddress: tokenListingMap.USDC.address,
claimableTokenMint: 'USDC',
decimals: tokenListingMap.USDC.decimals
const registry = getOrInitializeRegistry(env.ENVIRONMENT)

// Get all userbank-enabled tokens from registry
const userbankTokens: TokenConfig[] = registry.getUserbankTokens()
const managedTokens: Record<string, UserBankManagedTokenInfo> = {}

// Convert registry tokens to UserBankManagedTokenInfo format
userbankTokens.forEach((token: TokenConfig) => {
if (isClaimableTokenMint(token.symbol)) {
managedTokens[token.address.toUpperCase()] = {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i think solana addresses are case sensitive?

mintAddress: token.address,
claimableTokenMint: token.symbol,
decimals: token.decimals
}
}
}
}
})

export const USER_BANK_MANAGED_TOKENS: Record<
string,
UserBankManagedTokenInfo
> = {
[TOKEN_LISTING_MAP.AUDIO.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: TOKEN_LISTING_MAP.AUDIO.decimals
},
[TOKEN_LISTING_MAP.USDC.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.USDC.address,
claimableTokenMint: 'USDC',
decimals: TOKEN_LISTING_MAP.USDC.decimals
}
return managedTokens
}
4 changes: 3 additions & 1 deletion packages/common/src/api/tan-query/jupiter/types.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -41,8 +41,10 @@ export type SwapTokensResult = {
}
}

export type ClaimableTokenMint = 'wAUDIO' | 'USDC' | 'BONK'

export interface UserBankManagedTokenInfo {
mintAddress: string
claimableTokenMint: 'wAUDIO' | 'USDC'
claimableTokenMint: ClaimableTokenMint
decimals: number
}
6 changes: 5 additions & 1 deletion packages/common/src/api/tan-query/jupiter/utils.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -255,8 +255,12 @@ export function formatUSDCValue(
* @returns Formatted price string
*/
export function formatTokenPrice(price: string, decimalPlaces: number): string {
// USDC constructor uses 6 decimal places, so we need to constrain the display
// to not exceed what's available in the FixedDecimal representation
const maxDecimalPlaces = Math.min(decimalPlaces, 6)

return USDC(price.replace(/,/g, '')).toLocaleString('en-US', {
minimumFractionDigits: 2,
maximumFractionDigits: decimalPlaces
maximumFractionDigits: maxDecimalPlaces
})
}
1 change: 1 addition & 0 deletions packages/common/src/api/tan-query/queryKeys.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -95,6 +95,7 @@ export const QUERY_KEYS = {
eventsByEntityId: 'eventsByEntityId',
walletOwner: 'walletOwner',
tokenPrice: 'tokenPrice',
tokenBalance: 'tokenBalance',
usdcBalance: 'usdcBalance',
fileSizes: 'fileSizes',
managedAccounts: 'managedAccounts',
Expand Down
145 changes: 145 additions & 0 deletions packages/common/src/api/tan-query/wallets/useTokenBalance.ts
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
import { useCallback } from 'react'

import { FixedDecimal } from '@audius/fixed-decimal'
import { TokenAccountNotFoundError } from '@solana/spl-token'
import { Commitment } from '@solana/web3.js'
import { useQuery, useQueryClient } from '@tanstack/react-query'

import { useCurrentAccountUser } from '~/api'
import { useQueryContext } from '~/api/tan-query/utils'
import { Status } from '~/models/Status'
import { MintName } from '~/services/audius-backend/solana'
import { getUserbankAccountInfo, getTokenBySymbol } from '~/services/index'

import { QUERY_KEYS } from '../queryKeys'
import { QueryOptions, type QueryKey } from '../types'

const createTokenBalance = (

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: is this rly the cleanest way? can we not do something like:

return !!amount ? new FixedDecimal(BigInt(amount.toString()), decimals) : null

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

idk i guess that's kind of annoying too..

amount: string | number | bigint | null | undefined,
decimals: number
): FixedDecimal | null => {
if (amount === null || amount === undefined) {
return null
}
return new FixedDecimal(BigInt(amount.toString()), decimals)
}

export const getTokenBalanceQueryKey = (
ethAddress: string | null,
token: MintName,
commitment: Commitment
) =>
[
QUERY_KEYS.tokenBalance,
ethAddress,
token,
commitment
] as unknown as QueryKey<FixedDecimal | null>

/**
* Hook to get the balance for any supported token for the current user.
* Uses TanStack Query for data fetching and caching.
*
* @param token The token to fetch balance for
* @param options Options for the query and polling
* @returns Object with status, data, refresh, and cancelPolling
*/
export const useTokenBalance = ({
token,
isPolling,
pollingInterval = 1000,
commitment = 'processed',
...queryOptions
}: {
token: MintName
isPolling?: boolean
pollingInterval?: number
commitment?: Commitment
} & QueryOptions) => {
const { audiusSdk, env } = useQueryContext()
const { data: user } = useCurrentAccountUser()
const ethAddress = user?.wallet ?? null
const queryClient = useQueryClient()

const result = useQuery({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment),
queryFn: async () => {
const sdk = await audiusSdk()
if (!ethAddress || !token) {
return null
}

try {
const account = await getUserbankAccountInfo(
sdk,
{
ethAddress,
mint: token
},
commitment
)

// Get token configuration from registry to get decimal places
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}

return createTokenBalance(account?.amount, tokenConfig.decimals)
} catch (e) {
// If user doesn't have a token account yet, return 0 balance
if (e instanceof TokenAccountNotFoundError) {
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}
return createTokenBalance(BigInt(0), tokenConfig.decimals)
}
console.error(`Error fetching ${token} balance:`, e)
// Return null instead of throwing to prevent infinite loading
return null
}
},
enabled: !!ethAddress && !!token,
// TanStack Query's built-in polling - only poll when isPolling is true
refetchInterval: isPolling ? pollingInterval : false,
// Prevent refetching when window regains focus during polling to avoid conflicts
refetchOnWindowFocus: !isPolling,

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

smart

...queryOptions
})

// Map TanStack Query states to the Status enum for API compatibility

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

damn is this another migration we need to do

let status = Status.IDLE
if (result.isPending) {
status = Status.LOADING
} else if (result.isError) {
status = Status.ERROR
} else if (result.isSuccess) {
status = Status.SUCCESS
}

// For compatibility with existing code
const data = result.data ?? null

// Function to cancel polling by invalidating and refetching the query
// This effectively stops the current polling cycle
const cancelPolling = useCallback(() => {
queryClient.cancelQueries({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment)
})
}, [queryClient, ethAddress, token, commitment])

return {
status,
data,
error: result.error,
refresh: result.refetch,
cancelPolling
}
}
19 changes: 11 additions & 8 deletions packages/common/src/services/audius-backend/AudiusBackend.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -43,6 +43,7 @@ import {
PushNotifications
} from '../../store'
import { getErrorMessage, uuid, Maybe, Nullable } from '../../utils'
import { getTokenBySymbol } from '../tokens'

import { MintName } from './solana'
import { MonitoringCallbacks } from './types'
Expand DownExpand Up@@ -164,6 +165,14 @@ export const audiusBackend = ({
}
}

function getMintAddress(mint: MintName): PublicKey {
const token = getTokenBySymbol(env, mint)
if (!token) {
throw new Error(`Token not found: ${mint}`)
}
return new PublicKey(token.address)
}

async function recordTrackListen({
userId,
trackId,
Expand DownExpand Up@@ -998,10 +1007,7 @@ export const audiusBackend = ({
mint: MintName
}) {
const solanaTokenProgramKey = new PublicKey(TOKEN_PROGRAM_ID)
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const addresses = PublicKey.findProgramAddressSync(
[
solanaWalletKey.toBuffer(),
Expand DownExpand Up@@ -1072,10 +1078,7 @@ export const audiusBackend = ({
solanaWalletKey,
mint
})
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const accounts = [
// 0. `[sw]` Funding account (must be a system account)
{
Expand Down
2 changes: 1 addition & 1 deletion packages/common/src/services/audius-backend/solana.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -40,7 +40,7 @@ export const MEMO_PROGRAM_ID = new PublicKey(
'Memo1UhkJRfHyvLMcVucJwxXeuD728EqVDDwQDxFMNo'
)

export type MintName = 'wAUDIO' | 'USDC'
export type MintName = 'wAUDIO' | 'USDC' | 'BONK'
export const DEFAULT_MINT: MintName = 'wAUDIO'

type UserBankConfig = {
Expand Down
Loading
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Force GitHub README to respect dark mode\n(function() {\n var style = document.createElement('style');\n style.textContent = '\n .markdown-body {\n color-scheme: dark light;\n }\n .markdown-body pre { background: #161b22 !important; }\n .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; }\n .markdown-body table th, .markdown-body table td { border-color: #30363d !important; }\n .markdown-body img { background: #0d1117; }\n .markdown-body blockquote { border-left-color: #8b949e; }\n .markdown-body hr { border-color: #30363d; }\n ';\n document.head.appendChild(style);\n})();", "GitHub Dark Mode README Fix"); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
1 change: 1 addition & 0 deletions packages/common/src/api/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -155,6 +155,7 @@ export * from './tan-query/wallets/useUserCoinBalance'
export * from './tan-query/wallets/useWalletCollectibles'
export * from './tan-query/wallets/useWalletOwner'
export * from './tan-query/wallets/useUSDCBalance'
export * from './tan-query/wallets/useTokenBalance'
export * from './tan-query/jupiter/useSwapTokens'
export * from './tan-query/jupiter/useTokenExchangeRate'
export * from './tan-query/jupiter/utils'
Expand Down
55 changes: 24 additions & 31 deletions packages/common/src/api/tan-query/jupiter/constants.ts
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,40 @@
import { PublicKey } from '@solana/web3.js'

import { Env } from '~/services/env'
import {
createTokenListingMap,
TOKEN_LISTING_MAP
} from '~/store/ui/shared/tokenConstants'
import { getOrInitializeRegistry, type TokenConfig } from '~/services/tokens'

import { UserBankManagedTokenInfo } from './types'

const CLAIMABLE_TOKEN_MINTS = ['wAUDIO', 'USDC', 'BONK'] as const
type ClaimableTokenMint = (typeof CLAIMABLE_TOKEN_MINTS)[number]

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

whoa cool


const isClaimableTokenMint = (symbol: string): symbol is ClaimableTokenMint => {
return CLAIMABLE_TOKEN_MINTS.includes(symbol as ClaimableTokenMint)
}

export const JUPITER_PROGRAM_ID = new PublicKey(
'JUP6LkbZbjS1jKKwapdHNy74zcZ3tLUZoi5QNyVTaV4'
)

export const createUserBankManagedTokens = (
env: Env
): Record<string, UserBankManagedTokenInfo> => {
const tokenListingMap = createTokenListingMap(env)
return {
[tokenListingMap.AUDIO.address.toUpperCase()]: {
mintAddress: tokenListingMap.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: tokenListingMap.AUDIO.decimals
},
[tokenListingMap.USDC.address.toUpperCase()]: {
mintAddress: tokenListingMap.USDC.address,
claimableTokenMint: 'USDC',
decimals: tokenListingMap.USDC.decimals
const registry = getOrInitializeRegistry(env.ENVIRONMENT)

// Get all userbank-enabled tokens from registry
const userbankTokens: TokenConfig[] = registry.getUserbankTokens()
const managedTokens: Record<string, UserBankManagedTokenInfo> = {}

// Convert registry tokens to UserBankManagedTokenInfo format
userbankTokens.forEach((token: TokenConfig) => {
if (isClaimableTokenMint(token.symbol)) {
managedTokens[token.address.toUpperCase()] = {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i think solana addresses are case sensitive?

mintAddress: token.address,
claimableTokenMint: token.symbol,
decimals: token.decimals
}
}
}
}
})

export const USER_BANK_MANAGED_TOKENS: Record<
string,
UserBankManagedTokenInfo
> = {
[TOKEN_LISTING_MAP.AUDIO.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: TOKEN_LISTING_MAP.AUDIO.decimals
},
[TOKEN_LISTING_MAP.USDC.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.USDC.address,
claimableTokenMint: 'USDC',
decimals: TOKEN_LISTING_MAP.USDC.decimals
}
return managedTokens
}
4 changes: 3 additions & 1 deletion packages/common/src/api/tan-query/jupiter/types.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -41,8 +41,10 @@ export type SwapTokensResult = {
}
}

export type ClaimableTokenMint = 'wAUDIO' | 'USDC' | 'BONK'

export interface UserBankManagedTokenInfo {
mintAddress: string
claimableTokenMint: 'wAUDIO' | 'USDC'
claimableTokenMint: ClaimableTokenMint
decimals: number
}
6 changes: 5 additions & 1 deletion packages/common/src/api/tan-query/jupiter/utils.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -255,8 +255,12 @@ export function formatUSDCValue(
* @returns Formatted price string
*/
export function formatTokenPrice(price: string, decimalPlaces: number): string {
// USDC constructor uses 6 decimal places, so we need to constrain the display
// to not exceed what's available in the FixedDecimal representation
const maxDecimalPlaces = Math.min(decimalPlaces, 6)

return USDC(price.replace(/,/g, '')).toLocaleString('en-US', {
minimumFractionDigits: 2,
maximumFractionDigits: decimalPlaces
maximumFractionDigits: maxDecimalPlaces
})
}
1 change: 1 addition & 0 deletions packages/common/src/api/tan-query/queryKeys.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -95,6 +95,7 @@ export const QUERY_KEYS = {
eventsByEntityId: 'eventsByEntityId',
walletOwner: 'walletOwner',
tokenPrice: 'tokenPrice',
tokenBalance: 'tokenBalance',
usdcBalance: 'usdcBalance',
fileSizes: 'fileSizes',
managedAccounts: 'managedAccounts',
Expand Down
145 changes: 145 additions & 0 deletions packages/common/src/api/tan-query/wallets/useTokenBalance.ts
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
import { useCallback } from 'react'

import { FixedDecimal } from '@audius/fixed-decimal'
import { TokenAccountNotFoundError } from '@solana/spl-token'
import { Commitment } from '@solana/web3.js'
import { useQuery, useQueryClient } from '@tanstack/react-query'

import { useCurrentAccountUser } from '~/api'
import { useQueryContext } from '~/api/tan-query/utils'
import { Status } from '~/models/Status'
import { MintName } from '~/services/audius-backend/solana'
import { getUserbankAccountInfo, getTokenBySymbol } from '~/services/index'

import { QUERY_KEYS } from '../queryKeys'
import { QueryOptions, type QueryKey } from '../types'

const createTokenBalance = (

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: is this rly the cleanest way? can we not do something like:

return !!amount ? new FixedDecimal(BigInt(amount.toString()), decimals) : null

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

idk i guess that's kind of annoying too..

amount: string | number | bigint | null | undefined,
decimals: number
): FixedDecimal | null => {
if (amount === null || amount === undefined) {
return null
}
return new FixedDecimal(BigInt(amount.toString()), decimals)
}

export const getTokenBalanceQueryKey = (
ethAddress: string | null,
token: MintName,
commitment: Commitment
) =>
[
QUERY_KEYS.tokenBalance,
ethAddress,
token,
commitment
] as unknown as QueryKey<FixedDecimal | null>

/**
* Hook to get the balance for any supported token for the current user.
* Uses TanStack Query for data fetching and caching.
*
* @param token The token to fetch balance for
* @param options Options for the query and polling
* @returns Object with status, data, refresh, and cancelPolling
*/
export const useTokenBalance = ({
token,
isPolling,
pollingInterval = 1000,
commitment = 'processed',
...queryOptions
}: {
token: MintName
isPolling?: boolean
pollingInterval?: number
commitment?: Commitment
} & QueryOptions) => {
const { audiusSdk, env } = useQueryContext()
const { data: user } = useCurrentAccountUser()
const ethAddress = user?.wallet ?? null
const queryClient = useQueryClient()

const result = useQuery({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment),
queryFn: async () => {
const sdk = await audiusSdk()
if (!ethAddress || !token) {
return null
}

try {
const account = await getUserbankAccountInfo(
sdk,
{
ethAddress,
mint: token
},
commitment
)

// Get token configuration from registry to get decimal places
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}

return createTokenBalance(account?.amount, tokenConfig.decimals)
} catch (e) {
// If user doesn't have a token account yet, return 0 balance
if (e instanceof TokenAccountNotFoundError) {
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}
return createTokenBalance(BigInt(0), tokenConfig.decimals)
}
console.error(`Error fetching ${token} balance:`, e)
// Return null instead of throwing to prevent infinite loading
return null
}
},
enabled: !!ethAddress && !!token,
// TanStack Query's built-in polling - only poll when isPolling is true
refetchInterval: isPolling ? pollingInterval : false,
// Prevent refetching when window regains focus during polling to avoid conflicts
refetchOnWindowFocus: !isPolling,

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

smart

...queryOptions
})

// Map TanStack Query states to the Status enum for API compatibility

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

damn is this another migration we need to do

let status = Status.IDLE
if (result.isPending) {
status = Status.LOADING
} else if (result.isError) {
status = Status.ERROR
} else if (result.isSuccess) {
status = Status.SUCCESS
}

// For compatibility with existing code
const data = result.data ?? null

// Function to cancel polling by invalidating and refetching the query
// This effectively stops the current polling cycle
const cancelPolling = useCallback(() => {
queryClient.cancelQueries({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment)
})
}, [queryClient, ethAddress, token, commitment])

return {
status,
data,
error: result.error,
refresh: result.refetch,
cancelPolling
}
}
19 changes: 11 additions & 8 deletions packages/common/src/services/audius-backend/AudiusBackend.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -43,6 +43,7 @@ import {
PushNotifications
} from '../../store'
import { getErrorMessage, uuid, Maybe, Nullable } from '../../utils'
import { getTokenBySymbol } from '../tokens'

import { MintName } from './solana'
import { MonitoringCallbacks } from './types'
Expand DownExpand Up@@ -164,6 +165,14 @@ export const audiusBackend = ({
}
}

function getMintAddress(mint: MintName): PublicKey {
const token = getTokenBySymbol(env, mint)
if (!token) {
throw new Error(`Token not found: ${mint}`)
}
return new PublicKey(token.address)
}

async function recordTrackListen({
userId,
trackId,
Expand DownExpand Up@@ -998,10 +1007,7 @@ export const audiusBackend = ({
mint: MintName
}) {
const solanaTokenProgramKey = new PublicKey(TOKEN_PROGRAM_ID)
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const addresses = PublicKey.findProgramAddressSync(
[
solanaWalletKey.toBuffer(),
Expand DownExpand Up@@ -1072,10 +1078,7 @@ export const audiusBackend = ({
solanaWalletKey,
mint
})
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const accounts = [
// 0. `[sw]` Funding account (must be a system account)
{
Expand Down
2 changes: 1 addition & 1 deletion packages/common/src/services/audius-backend/solana.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -40,7 +40,7 @@ export const MEMO_PROGRAM_ID = new PublicKey(
'Memo1UhkJRfHyvLMcVucJwxXeuD728EqVDDwQDxFMNo'
)

export type MintName = 'wAUDIO' | 'USDC'
export type MintName = 'wAUDIO' | 'USDC' | 'BONK'
export const DEFAULT_MINT: MintName = 'wAUDIO'

type UserBankConfig = {
Expand Down
Loading
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Highlight search terms from Google/DuckDuckGo/Bing referrer\n(function() {\n var ref = document.referrer;\n var terms = [];\n \n if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) {\n var url = new URL(ref);\n var q = url.searchParams.get('q') || url.searchParams.get('p');\n if (q) {\n terms = q.split(/\\s+/).filter(function(t) { return t.length > 2; });\n }\n }\n \n if (terms.length === 0) return;\n \n var style = document.createElement('style');\n style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }';\n document.head.appendChild(style);\n \n function highlight(node) {\n if (node.nodeType === 3) { // text node\n var text = node.textContent;\n var found = false;\n terms.forEach(function(term) {\n var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\') + ')', 'gi');\n if (regex.test(text)) {\n found = true;\n var frag = document.createDocumentFragment();\n var parts = text.split(regex);\n parts.forEach(function(part, i) {\n if (i % 2 === 0) {\n frag.appendChild(document.createTextNode(part));\n } else {\n var span = document.createElement('span');\n span.className = 'userscript-highlight';\n span.textContent = part;\n frag.appendChild(span);\n }\n });\n node.parentNode.replaceChild(frag, node);\n }\n });\n } else if (node.nodeType === 1 && node.childNodes) { // element\n var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT'];\n if (!skipTags.includes(node.tagName)) {\n Array.from(node.childNodes).forEach(highlight);\n }\n }\n }\n \n highlight(document.body);\n \n // Re-highlight on dynamic content\n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1 || node.nodeType === 3) highlight(node);\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Highlight Search Terms"); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
1 change: 1 addition & 0 deletions packages/common/src/api/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -155,6 +155,7 @@ export * from './tan-query/wallets/useUserCoinBalance'
export * from './tan-query/wallets/useWalletCollectibles'
export * from './tan-query/wallets/useWalletOwner'
export * from './tan-query/wallets/useUSDCBalance'
export * from './tan-query/wallets/useTokenBalance'
export * from './tan-query/jupiter/useSwapTokens'
export * from './tan-query/jupiter/useTokenExchangeRate'
export * from './tan-query/jupiter/utils'
Expand Down
55 changes: 24 additions & 31 deletions packages/common/src/api/tan-query/jupiter/constants.ts
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,40 @@
import { PublicKey } from '@solana/web3.js'

import { Env } from '~/services/env'
import {
createTokenListingMap,
TOKEN_LISTING_MAP
} from '~/store/ui/shared/tokenConstants'
import { getOrInitializeRegistry, type TokenConfig } from '~/services/tokens'

import { UserBankManagedTokenInfo } from './types'

const CLAIMABLE_TOKEN_MINTS = ['wAUDIO', 'USDC', 'BONK'] as const
type ClaimableTokenMint = (typeof CLAIMABLE_TOKEN_MINTS)[number]

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

whoa cool


const isClaimableTokenMint = (symbol: string): symbol is ClaimableTokenMint => {
return CLAIMABLE_TOKEN_MINTS.includes(symbol as ClaimableTokenMint)
}

export const JUPITER_PROGRAM_ID = new PublicKey(
'JUP6LkbZbjS1jKKwapdHNy74zcZ3tLUZoi5QNyVTaV4'
)

export const createUserBankManagedTokens = (
env: Env
): Record<string, UserBankManagedTokenInfo> => {
const tokenListingMap = createTokenListingMap(env)
return {
[tokenListingMap.AUDIO.address.toUpperCase()]: {
mintAddress: tokenListingMap.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: tokenListingMap.AUDIO.decimals
},
[tokenListingMap.USDC.address.toUpperCase()]: {
mintAddress: tokenListingMap.USDC.address,
claimableTokenMint: 'USDC',
decimals: tokenListingMap.USDC.decimals
const registry = getOrInitializeRegistry(env.ENVIRONMENT)

// Get all userbank-enabled tokens from registry
const userbankTokens: TokenConfig[] = registry.getUserbankTokens()
const managedTokens: Record<string, UserBankManagedTokenInfo> = {}

// Convert registry tokens to UserBankManagedTokenInfo format
userbankTokens.forEach((token: TokenConfig) => {
if (isClaimableTokenMint(token.symbol)) {
managedTokens[token.address.toUpperCase()] = {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i think solana addresses are case sensitive?

mintAddress: token.address,
claimableTokenMint: token.symbol,
decimals: token.decimals
}
}
}
}
})

export const USER_BANK_MANAGED_TOKENS: Record<
string,
UserBankManagedTokenInfo
> = {
[TOKEN_LISTING_MAP.AUDIO.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: TOKEN_LISTING_MAP.AUDIO.decimals
},
[TOKEN_LISTING_MAP.USDC.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.USDC.address,
claimableTokenMint: 'USDC',
decimals: TOKEN_LISTING_MAP.USDC.decimals
}
return managedTokens
}
4 changes: 3 additions & 1 deletion packages/common/src/api/tan-query/jupiter/types.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -41,8 +41,10 @@ export type SwapTokensResult = {
}
}

export type ClaimableTokenMint = 'wAUDIO' | 'USDC' | 'BONK'

export interface UserBankManagedTokenInfo {
mintAddress: string
claimableTokenMint: 'wAUDIO' | 'USDC'
claimableTokenMint: ClaimableTokenMint
decimals: number
}
6 changes: 5 additions & 1 deletion packages/common/src/api/tan-query/jupiter/utils.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -255,8 +255,12 @@ export function formatUSDCValue(
* @returns Formatted price string
*/
export function formatTokenPrice(price: string, decimalPlaces: number): string {
// USDC constructor uses 6 decimal places, so we need to constrain the display
// to not exceed what's available in the FixedDecimal representation
const maxDecimalPlaces = Math.min(decimalPlaces, 6)

return USDC(price.replace(/,/g, '')).toLocaleString('en-US', {
minimumFractionDigits: 2,
maximumFractionDigits: decimalPlaces
maximumFractionDigits: maxDecimalPlaces
})
}
1 change: 1 addition & 0 deletions packages/common/src/api/tan-query/queryKeys.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -95,6 +95,7 @@ export const QUERY_KEYS = {
eventsByEntityId: 'eventsByEntityId',
walletOwner: 'walletOwner',
tokenPrice: 'tokenPrice',
tokenBalance: 'tokenBalance',
usdcBalance: 'usdcBalance',
fileSizes: 'fileSizes',
managedAccounts: 'managedAccounts',
Expand Down
145 changes: 145 additions & 0 deletions packages/common/src/api/tan-query/wallets/useTokenBalance.ts
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
import { useCallback } from 'react'

import { FixedDecimal } from '@audius/fixed-decimal'
import { TokenAccountNotFoundError } from '@solana/spl-token'
import { Commitment } from '@solana/web3.js'
import { useQuery, useQueryClient } from '@tanstack/react-query'

import { useCurrentAccountUser } from '~/api'
import { useQueryContext } from '~/api/tan-query/utils'
import { Status } from '~/models/Status'
import { MintName } from '~/services/audius-backend/solana'
import { getUserbankAccountInfo, getTokenBySymbol } from '~/services/index'

import { QUERY_KEYS } from '../queryKeys'
import { QueryOptions, type QueryKey } from '../types'

const createTokenBalance = (

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: is this rly the cleanest way? can we not do something like:

return !!amount ? new FixedDecimal(BigInt(amount.toString()), decimals) : null

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

idk i guess that's kind of annoying too..

amount: string | number | bigint | null | undefined,
decimals: number
): FixedDecimal | null => {
if (amount === null || amount === undefined) {
return null
}
return new FixedDecimal(BigInt(amount.toString()), decimals)
}

export const getTokenBalanceQueryKey = (
ethAddress: string | null,
token: MintName,
commitment: Commitment
) =>
[
QUERY_KEYS.tokenBalance,
ethAddress,
token,
commitment
] as unknown as QueryKey<FixedDecimal | null>

/**
* Hook to get the balance for any supported token for the current user.
* Uses TanStack Query for data fetching and caching.
*
* @param token The token to fetch balance for
* @param options Options for the query and polling
* @returns Object with status, data, refresh, and cancelPolling
*/
export const useTokenBalance = ({
token,
isPolling,
pollingInterval = 1000,
commitment = 'processed',
...queryOptions
}: {
token: MintName
isPolling?: boolean
pollingInterval?: number
commitment?: Commitment
} & QueryOptions) => {
const { audiusSdk, env } = useQueryContext()
const { data: user } = useCurrentAccountUser()
const ethAddress = user?.wallet ?? null
const queryClient = useQueryClient()

const result = useQuery({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment),
queryFn: async () => {
const sdk = await audiusSdk()
if (!ethAddress || !token) {
return null
}

try {
const account = await getUserbankAccountInfo(
sdk,
{
ethAddress,
mint: token
},
commitment
)

// Get token configuration from registry to get decimal places
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}

return createTokenBalance(account?.amount, tokenConfig.decimals)
} catch (e) {
// If user doesn't have a token account yet, return 0 balance
if (e instanceof TokenAccountNotFoundError) {
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}
return createTokenBalance(BigInt(0), tokenConfig.decimals)
}
console.error(`Error fetching ${token} balance:`, e)
// Return null instead of throwing to prevent infinite loading
return null
}
},
enabled: !!ethAddress && !!token,
// TanStack Query's built-in polling - only poll when isPolling is true
refetchInterval: isPolling ? pollingInterval : false,
// Prevent refetching when window regains focus during polling to avoid conflicts
refetchOnWindowFocus: !isPolling,

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

smart

...queryOptions
})

// Map TanStack Query states to the Status enum for API compatibility

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

damn is this another migration we need to do

let status = Status.IDLE
if (result.isPending) {
status = Status.LOADING
} else if (result.isError) {
status = Status.ERROR
} else if (result.isSuccess) {
status = Status.SUCCESS
}

// For compatibility with existing code
const data = result.data ?? null

// Function to cancel polling by invalidating and refetching the query
// This effectively stops the current polling cycle
const cancelPolling = useCallback(() => {
queryClient.cancelQueries({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment)
})
}, [queryClient, ethAddress, token, commitment])

return {
status,
data,
error: result.error,
refresh: result.refetch,
cancelPolling
}
}
19 changes: 11 additions & 8 deletions packages/common/src/services/audius-backend/AudiusBackend.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -43,6 +43,7 @@ import {
PushNotifications
} from '../../store'
import { getErrorMessage, uuid, Maybe, Nullable } from '../../utils'
import { getTokenBySymbol } from '../tokens'

import { MintName } from './solana'
import { MonitoringCallbacks } from './types'
Expand DownExpand Up@@ -164,6 +165,14 @@ export const audiusBackend = ({
}
}

function getMintAddress(mint: MintName): PublicKey {
const token = getTokenBySymbol(env, mint)
if (!token) {
throw new Error(`Token not found: ${mint}`)
}
return new PublicKey(token.address)
}

async function recordTrackListen({
userId,
trackId,
Expand DownExpand Up@@ -998,10 +1007,7 @@ export const audiusBackend = ({
mint: MintName
}) {
const solanaTokenProgramKey = new PublicKey(TOKEN_PROGRAM_ID)
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const addresses = PublicKey.findProgramAddressSync(
[
solanaWalletKey.toBuffer(),
Expand DownExpand Up@@ -1072,10 +1078,7 @@ export const audiusBackend = ({
solanaWalletKey,
mint
})
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const accounts = [
// 0. `[sw]` Funding account (must be a system account)
{
Expand Down
2 changes: 1 addition & 1 deletion packages/common/src/services/audius-backend/solana.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -40,7 +40,7 @@ export const MEMO_PROGRAM_ID = new PublicKey(
'Memo1UhkJRfHyvLMcVucJwxXeuD728EqVDDwQDxFMNo'
)

export type MintName = 'wAUDIO' | 'USDC'
export type MintName = 'wAUDIO' | 'USDC' | 'BONK'
export const DEFAULT_MINT: MintName = 'wAUDIO'

type UserBankConfig = {
Expand Down
Loading
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Strip utm_, fbclid, gclid, etc. from all links on page\n(function() {\n var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content',\n 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid',\n 'ref', 'ref_src', 'source', 'medium', 'campaign'];\n \n function cleanUrl(url) {\n try {\n var u = new URL(url, window.location.origin);\n var changed = false;\n trackingParams.forEach(function(p) {\n if (u.searchParams.has(p)) {\n u.searchParams.delete(p);\n changed = true;\n }\n });\n return changed ? u.toString() : url;\n } catch (e) {\n return url;\n }\n }\n \n function cleanLinks() {\n document.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n \n cleanLinks();\n \n var observer = new MutationObserver(function(mutations) {\n mutations.forEach(function(m) {\n m.addedNodes.forEach(function(node) {\n if (node.nodeType === 1) {\n if (node.tagName === 'A') cleanLinks();\n node.querySelectorAll('a[href]').forEach(function(a) {\n var clean = cleanUrl(a.href);\n if (clean !== a.href) a.href = clean;\n });\n }\n });\n });\n });\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "Remove Tracking Parameters from Links"); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + '
Skip to content
1 change: 1 addition & 0 deletions packages/common/src/api/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -155,6 +155,7 @@ export * from './tan-query/wallets/useUserCoinBalance'
export * from './tan-query/wallets/useWalletCollectibles'
export * from './tan-query/wallets/useWalletOwner'
export * from './tan-query/wallets/useUSDCBalance'
export * from './tan-query/wallets/useTokenBalance'
export * from './tan-query/jupiter/useSwapTokens'
export * from './tan-query/jupiter/useTokenExchangeRate'
export * from './tan-query/jupiter/utils'
Expand Down
55 changes: 24 additions & 31 deletions packages/common/src/api/tan-query/jupiter/constants.ts
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,40 @@
import { PublicKey } from '@solana/web3.js'

import { Env } from '~/services/env'
import {
createTokenListingMap,
TOKEN_LISTING_MAP
} from '~/store/ui/shared/tokenConstants'
import { getOrInitializeRegistry, type TokenConfig } from '~/services/tokens'

import { UserBankManagedTokenInfo } from './types'

const CLAIMABLE_TOKEN_MINTS = ['wAUDIO', 'USDC', 'BONK'] as const
type ClaimableTokenMint = (typeof CLAIMABLE_TOKEN_MINTS)[number]

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

whoa cool


const isClaimableTokenMint = (symbol: string): symbol is ClaimableTokenMint => {
return CLAIMABLE_TOKEN_MINTS.includes(symbol as ClaimableTokenMint)
}

export const JUPITER_PROGRAM_ID = new PublicKey(
'JUP6LkbZbjS1jKKwapdHNy74zcZ3tLUZoi5QNyVTaV4'
)

export const createUserBankManagedTokens = (
env: Env
): Record<string, UserBankManagedTokenInfo> => {
const tokenListingMap = createTokenListingMap(env)
return {
[tokenListingMap.AUDIO.address.toUpperCase()]: {
mintAddress: tokenListingMap.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: tokenListingMap.AUDIO.decimals
},
[tokenListingMap.USDC.address.toUpperCase()]: {
mintAddress: tokenListingMap.USDC.address,
claimableTokenMint: 'USDC',
decimals: tokenListingMap.USDC.decimals
const registry = getOrInitializeRegistry(env.ENVIRONMENT)

// Get all userbank-enabled tokens from registry
const userbankTokens: TokenConfig[] = registry.getUserbankTokens()
const managedTokens: Record<string, UserBankManagedTokenInfo> = {}

// Convert registry tokens to UserBankManagedTokenInfo format
userbankTokens.forEach((token: TokenConfig) => {
if (isClaimableTokenMint(token.symbol)) {
managedTokens[token.address.toUpperCase()] = {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i think solana addresses are case sensitive?

mintAddress: token.address,
claimableTokenMint: token.symbol,
decimals: token.decimals
}
}
}
}
})

export const USER_BANK_MANAGED_TOKENS: Record<
string,
UserBankManagedTokenInfo
> = {
[TOKEN_LISTING_MAP.AUDIO.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: TOKEN_LISTING_MAP.AUDIO.decimals
},
[TOKEN_LISTING_MAP.USDC.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.USDC.address,
claimableTokenMint: 'USDC',
decimals: TOKEN_LISTING_MAP.USDC.decimals
}
return managedTokens
}
4 changes: 3 additions & 1 deletion packages/common/src/api/tan-query/jupiter/types.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -41,8 +41,10 @@ export type SwapTokensResult = {
}
}

export type ClaimableTokenMint = 'wAUDIO' | 'USDC' | 'BONK'

export interface UserBankManagedTokenInfo {
mintAddress: string
claimableTokenMint: 'wAUDIO' | 'USDC'
claimableTokenMint: ClaimableTokenMint
decimals: number
}
6 changes: 5 additions & 1 deletion packages/common/src/api/tan-query/jupiter/utils.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -255,8 +255,12 @@ export function formatUSDCValue(
* @returns Formatted price string
*/
export function formatTokenPrice(price: string, decimalPlaces: number): string {
// USDC constructor uses 6 decimal places, so we need to constrain the display
// to not exceed what's available in the FixedDecimal representation
const maxDecimalPlaces = Math.min(decimalPlaces, 6)

return USDC(price.replace(/,/g, '')).toLocaleString('en-US', {
minimumFractionDigits: 2,
maximumFractionDigits: decimalPlaces
maximumFractionDigits: maxDecimalPlaces
})
}
1 change: 1 addition & 0 deletions packages/common/src/api/tan-query/queryKeys.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -95,6 +95,7 @@ export const QUERY_KEYS = {
eventsByEntityId: 'eventsByEntityId',
walletOwner: 'walletOwner',
tokenPrice: 'tokenPrice',
tokenBalance: 'tokenBalance',
usdcBalance: 'usdcBalance',
fileSizes: 'fileSizes',
managedAccounts: 'managedAccounts',
Expand Down
145 changes: 145 additions & 0 deletions packages/common/src/api/tan-query/wallets/useTokenBalance.ts
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
import { useCallback } from 'react'

import { FixedDecimal } from '@audius/fixed-decimal'
import { TokenAccountNotFoundError } from '@solana/spl-token'
import { Commitment } from '@solana/web3.js'
import { useQuery, useQueryClient } from '@tanstack/react-query'

import { useCurrentAccountUser } from '~/api'
import { useQueryContext } from '~/api/tan-query/utils'
import { Status } from '~/models/Status'
import { MintName } from '~/services/audius-backend/solana'
import { getUserbankAccountInfo, getTokenBySymbol } from '~/services/index'

import { QUERY_KEYS } from '../queryKeys'
import { QueryOptions, type QueryKey } from '../types'

const createTokenBalance = (

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: is this rly the cleanest way? can we not do something like:

return !!amount ? new FixedDecimal(BigInt(amount.toString()), decimals) : null

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

idk i guess that's kind of annoying too..

amount: string | number | bigint | null | undefined,
decimals: number
): FixedDecimal | null => {
if (amount === null || amount === undefined) {
return null
}
return new FixedDecimal(BigInt(amount.toString()), decimals)
}

export const getTokenBalanceQueryKey = (
ethAddress: string | null,
token: MintName,
commitment: Commitment
) =>
[
QUERY_KEYS.tokenBalance,
ethAddress,
token,
commitment
] as unknown as QueryKey<FixedDecimal | null>

/**
* Hook to get the balance for any supported token for the current user.
* Uses TanStack Query for data fetching and caching.
*
* @param token The token to fetch balance for
* @param options Options for the query and polling
* @returns Object with status, data, refresh, and cancelPolling
*/
export const useTokenBalance = ({
token,
isPolling,
pollingInterval = 1000,
commitment = 'processed',
...queryOptions
}: {
token: MintName
isPolling?: boolean
pollingInterval?: number
commitment?: Commitment
} & QueryOptions) => {
const { audiusSdk, env } = useQueryContext()
const { data: user } = useCurrentAccountUser()
const ethAddress = user?.wallet ?? null
const queryClient = useQueryClient()

const result = useQuery({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment),
queryFn: async () => {
const sdk = await audiusSdk()
if (!ethAddress || !token) {
return null
}

try {
const account = await getUserbankAccountInfo(
sdk,
{
ethAddress,
mint: token
},
commitment
)

// Get token configuration from registry to get decimal places
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}

return createTokenBalance(account?.amount, tokenConfig.decimals)
} catch (e) {
// If user doesn't have a token account yet, return 0 balance
if (e instanceof TokenAccountNotFoundError) {
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}
return createTokenBalance(BigInt(0), tokenConfig.decimals)
}
console.error(`Error fetching ${token} balance:`, e)
// Return null instead of throwing to prevent infinite loading
return null
}
},
enabled: !!ethAddress && !!token,
// TanStack Query's built-in polling - only poll when isPolling is true
refetchInterval: isPolling ? pollingInterval : false,
// Prevent refetching when window regains focus during polling to avoid conflicts
refetchOnWindowFocus: !isPolling,

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

smart

...queryOptions
})

// Map TanStack Query states to the Status enum for API compatibility

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

damn is this another migration we need to do

let status = Status.IDLE
if (result.isPending) {
status = Status.LOADING
} else if (result.isError) {
status = Status.ERROR
} else if (result.isSuccess) {
status = Status.SUCCESS
}

// For compatibility with existing code
const data = result.data ?? null

// Function to cancel polling by invalidating and refetching the query
// This effectively stops the current polling cycle
const cancelPolling = useCallback(() => {
queryClient.cancelQueries({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment)
})
}, [queryClient, ethAddress, token, commitment])

return {
status,
data,
error: result.error,
refresh: result.refetch,
cancelPolling
}
}
19 changes: 11 additions & 8 deletions packages/common/src/services/audius-backend/AudiusBackend.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -43,6 +43,7 @@ import {
PushNotifications
} from '../../store'
import { getErrorMessage, uuid, Maybe, Nullable } from '../../utils'
import { getTokenBySymbol } from '../tokens'

import { MintName } from './solana'
import { MonitoringCallbacks } from './types'
Expand DownExpand Up@@ -164,6 +165,14 @@ export const audiusBackend = ({
}
}

function getMintAddress(mint: MintName): PublicKey {
const token = getTokenBySymbol(env, mint)
if (!token) {
throw new Error(`Token not found: ${mint}`)
}
return new PublicKey(token.address)
}

async function recordTrackListen({
userId,
trackId,
Expand DownExpand Up@@ -998,10 +1007,7 @@ export const audiusBackend = ({
mint: MintName
}) {
const solanaTokenProgramKey = new PublicKey(TOKEN_PROGRAM_ID)
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const addresses = PublicKey.findProgramAddressSync(
[
solanaWalletKey.toBuffer(),
Expand DownExpand Up@@ -1072,10 +1078,7 @@ export const audiusBackend = ({
solanaWalletKey,
mint
})
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const accounts = [
// 0. `[sw]` Funding account (must be a system account)
{
Expand Down
2 changes: 1 addition & 1 deletion packages/common/src/services/audius-backend/solana.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -40,7 +40,7 @@ export const MEMO_PROGRAM_ID = new PublicKey(
'Memo1UhkJRfHyvLMcVucJwxXeuD728EqVDDwQDxFMNo'
)

export type MintName = 'wAUDIO' | 'USDC'
export type MintName = 'wAUDIO' | 'USDC' | 'BONK'
export const DEFAULT_MINT: MintName = 'wAUDIO'

type UserBankConfig = {
Expand Down
Loading
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Auto-enable theater mode on YouTube\n(function() {\n function tryTheater() {\n var btn = document.querySelector('button[aria-label=\"Theater mode\"], ytd-player #player button[title=\"Theater mode\"]');\n if (btn && !btn.classList.contains('activated')) {\n btn.click();\n }\n }\n \n // Try immediately\n tryTheater();\n \n // Try after navigation (SPA)\n var lastUrl = location.href;\n setInterval(function() {\n if (location.href !== lastUrl) {\n lastUrl = location.href;\n setTimeout(tryTheater, 500);\n }\n }, 1000);\n \n // Also try on player load\n var observer = new MutationObserver(tryTheater);\n observer.observe(document.body, { childList: true, subtree: true });\n})();", "YouTube Theater Mode Default"); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
1 change: 1 addition & 0 deletions packages/common/src/api/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -155,6 +155,7 @@ export * from './tan-query/wallets/useUserCoinBalance'
export * from './tan-query/wallets/useWalletCollectibles'
export * from './tan-query/wallets/useWalletOwner'
export * from './tan-query/wallets/useUSDCBalance'
export * from './tan-query/wallets/useTokenBalance'
export * from './tan-query/jupiter/useSwapTokens'
export * from './tan-query/jupiter/useTokenExchangeRate'
export * from './tan-query/jupiter/utils'
Expand Down
55 changes: 24 additions & 31 deletions packages/common/src/api/tan-query/jupiter/constants.ts
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,40 @@
import { PublicKey } from '@solana/web3.js'

import { Env } from '~/services/env'
import {
createTokenListingMap,
TOKEN_LISTING_MAP
} from '~/store/ui/shared/tokenConstants'
import { getOrInitializeRegistry, type TokenConfig } from '~/services/tokens'

import { UserBankManagedTokenInfo } from './types'

const CLAIMABLE_TOKEN_MINTS = ['wAUDIO', 'USDC', 'BONK'] as const
type ClaimableTokenMint = (typeof CLAIMABLE_TOKEN_MINTS)[number]

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

whoa cool


const isClaimableTokenMint = (symbol: string): symbol is ClaimableTokenMint => {
return CLAIMABLE_TOKEN_MINTS.includes(symbol as ClaimableTokenMint)
}

export const JUPITER_PROGRAM_ID = new PublicKey(
'JUP6LkbZbjS1jKKwapdHNy74zcZ3tLUZoi5QNyVTaV4'
)

export const createUserBankManagedTokens = (
env: Env
): Record<string, UserBankManagedTokenInfo> => {
const tokenListingMap = createTokenListingMap(env)
return {
[tokenListingMap.AUDIO.address.toUpperCase()]: {
mintAddress: tokenListingMap.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: tokenListingMap.AUDIO.decimals
},
[tokenListingMap.USDC.address.toUpperCase()]: {
mintAddress: tokenListingMap.USDC.address,
claimableTokenMint: 'USDC',
decimals: tokenListingMap.USDC.decimals
const registry = getOrInitializeRegistry(env.ENVIRONMENT)

// Get all userbank-enabled tokens from registry
const userbankTokens: TokenConfig[] = registry.getUserbankTokens()
const managedTokens: Record<string, UserBankManagedTokenInfo> = {}

// Convert registry tokens to UserBankManagedTokenInfo format
userbankTokens.forEach((token: TokenConfig) => {
if (isClaimableTokenMint(token.symbol)) {
managedTokens[token.address.toUpperCase()] = {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i think solana addresses are case sensitive?

mintAddress: token.address,
claimableTokenMint: token.symbol,
decimals: token.decimals
}
}
}
}
})

export const USER_BANK_MANAGED_TOKENS: Record<
string,
UserBankManagedTokenInfo
> = {
[TOKEN_LISTING_MAP.AUDIO.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: TOKEN_LISTING_MAP.AUDIO.decimals
},
[TOKEN_LISTING_MAP.USDC.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.USDC.address,
claimableTokenMint: 'USDC',
decimals: TOKEN_LISTING_MAP.USDC.decimals
}
return managedTokens
}
4 changes: 3 additions & 1 deletion packages/common/src/api/tan-query/jupiter/types.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -41,8 +41,10 @@ export type SwapTokensResult = {
}
}

export type ClaimableTokenMint = 'wAUDIO' | 'USDC' | 'BONK'

export interface UserBankManagedTokenInfo {
mintAddress: string
claimableTokenMint: 'wAUDIO' | 'USDC'
claimableTokenMint: ClaimableTokenMint
decimals: number
}
6 changes: 5 additions & 1 deletion packages/common/src/api/tan-query/jupiter/utils.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -255,8 +255,12 @@ export function formatUSDCValue(
* @returns Formatted price string
*/
export function formatTokenPrice(price: string, decimalPlaces: number): string {
// USDC constructor uses 6 decimal places, so we need to constrain the display
// to not exceed what's available in the FixedDecimal representation
const maxDecimalPlaces = Math.min(decimalPlaces, 6)

return USDC(price.replace(/,/g, '')).toLocaleString('en-US', {
minimumFractionDigits: 2,
maximumFractionDigits: decimalPlaces
maximumFractionDigits: maxDecimalPlaces
})
}
1 change: 1 addition & 0 deletions packages/common/src/api/tan-query/queryKeys.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -95,6 +95,7 @@ export const QUERY_KEYS = {
eventsByEntityId: 'eventsByEntityId',
walletOwner: 'walletOwner',
tokenPrice: 'tokenPrice',
tokenBalance: 'tokenBalance',
usdcBalance: 'usdcBalance',
fileSizes: 'fileSizes',
managedAccounts: 'managedAccounts',
Expand Down
145 changes: 145 additions & 0 deletions packages/common/src/api/tan-query/wallets/useTokenBalance.ts
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
import { useCallback } from 'react'

import { FixedDecimal } from '@audius/fixed-decimal'
import { TokenAccountNotFoundError } from '@solana/spl-token'
import { Commitment } from '@solana/web3.js'
import { useQuery, useQueryClient } from '@tanstack/react-query'

import { useCurrentAccountUser } from '~/api'
import { useQueryContext } from '~/api/tan-query/utils'
import { Status } from '~/models/Status'
import { MintName } from '~/services/audius-backend/solana'
import { getUserbankAccountInfo, getTokenBySymbol } from '~/services/index'

import { QUERY_KEYS } from '../queryKeys'
import { QueryOptions, type QueryKey } from '../types'

const createTokenBalance = (

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: is this rly the cleanest way? can we not do something like:

return !!amount ? new FixedDecimal(BigInt(amount.toString()), decimals) : null

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

idk i guess that's kind of annoying too..

amount: string | number | bigint | null | undefined,
decimals: number
): FixedDecimal | null => {
if (amount === null || amount === undefined) {
return null
}
return new FixedDecimal(BigInt(amount.toString()), decimals)
}

export const getTokenBalanceQueryKey = (
ethAddress: string | null,
token: MintName,
commitment: Commitment
) =>
[
QUERY_KEYS.tokenBalance,
ethAddress,
token,
commitment
] as unknown as QueryKey<FixedDecimal | null>

/**
* Hook to get the balance for any supported token for the current user.
* Uses TanStack Query for data fetching and caching.
*
* @param token The token to fetch balance for
* @param options Options for the query and polling
* @returns Object with status, data, refresh, and cancelPolling
*/
export const useTokenBalance = ({
token,
isPolling,
pollingInterval = 1000,
commitment = 'processed',
...queryOptions
}: {
token: MintName
isPolling?: boolean
pollingInterval?: number
commitment?: Commitment
} & QueryOptions) => {
const { audiusSdk, env } = useQueryContext()
const { data: user } = useCurrentAccountUser()
const ethAddress = user?.wallet ?? null
const queryClient = useQueryClient()

const result = useQuery({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment),
queryFn: async () => {
const sdk = await audiusSdk()
if (!ethAddress || !token) {
return null
}

try {
const account = await getUserbankAccountInfo(
sdk,
{
ethAddress,
mint: token
},
commitment
)

// Get token configuration from registry to get decimal places
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}

return createTokenBalance(account?.amount, tokenConfig.decimals)
} catch (e) {
// If user doesn't have a token account yet, return 0 balance
if (e instanceof TokenAccountNotFoundError) {
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}
return createTokenBalance(BigInt(0), tokenConfig.decimals)
}
console.error(`Error fetching ${token} balance:`, e)
// Return null instead of throwing to prevent infinite loading
return null
}
},
enabled: !!ethAddress && !!token,
// TanStack Query's built-in polling - only poll when isPolling is true
refetchInterval: isPolling ? pollingInterval : false,
// Prevent refetching when window regains focus during polling to avoid conflicts
refetchOnWindowFocus: !isPolling,

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

smart

...queryOptions
})

// Map TanStack Query states to the Status enum for API compatibility

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

damn is this another migration we need to do

let status = Status.IDLE
if (result.isPending) {
status = Status.LOADING
} else if (result.isError) {
status = Status.ERROR
} else if (result.isSuccess) {
status = Status.SUCCESS
}

// For compatibility with existing code
const data = result.data ?? null

// Function to cancel polling by invalidating and refetching the query
// This effectively stops the current polling cycle
const cancelPolling = useCallback(() => {
queryClient.cancelQueries({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment)
})
}, [queryClient, ethAddress, token, commitment])

return {
status,
data,
error: result.error,
refresh: result.refetch,
cancelPolling
}
}
19 changes: 11 additions & 8 deletions packages/common/src/services/audius-backend/AudiusBackend.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -43,6 +43,7 @@ import {
PushNotifications
} from '../../store'
import { getErrorMessage, uuid, Maybe, Nullable } from '../../utils'
import { getTokenBySymbol } from '../tokens'

import { MintName } from './solana'
import { MonitoringCallbacks } from './types'
Expand DownExpand Up@@ -164,6 +165,14 @@ export const audiusBackend = ({
}
}

function getMintAddress(mint: MintName): PublicKey {
const token = getTokenBySymbol(env, mint)
if (!token) {
throw new Error(`Token not found: ${mint}`)
}
return new PublicKey(token.address)
}

async function recordTrackListen({
userId,
trackId,
Expand DownExpand Up@@ -998,10 +1007,7 @@ export const audiusBackend = ({
mint: MintName
}) {
const solanaTokenProgramKey = new PublicKey(TOKEN_PROGRAM_ID)
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const addresses = PublicKey.findProgramAddressSync(
[
solanaWalletKey.toBuffer(),
Expand DownExpand Up@@ -1072,10 +1078,7 @@ export const audiusBackend = ({
solanaWalletKey,
mint
})
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const accounts = [
// 0. `[sw]` Funding account (must be a system account)
{
Expand Down
2 changes: 1 addition & 1 deletion packages/common/src/services/audius-backend/solana.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -40,7 +40,7 @@ export const MEMO_PROGRAM_ID = new PublicKey(
'Memo1UhkJRfHyvLMcVucJwxXeuD728EqVDDwQDxFMNo'
)

export type MintName = 'wAUDIO' | 'USDC'
export type MintName = 'wAUDIO' | 'USDC' | 'BONK'
export const DEFAULT_MINT: MintName = 'wAUDIO'

type UserBankConfig = {
Expand Down
Loading
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Remove or un-stick sticky/fixed headers that block content\n(function() {\n function unstick() {\n document.querySelectorAll('header, nav, [role=\"banner\"], .header, .navbar, .sticky, .fixed-top, [style*=\"position: fixed\"], [style*=\"position:sticky\"]').forEach(function(el) {\n if (el.style.position === 'fixed' || el.style.position === 'sticky' || \n getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') {\n el.style.position = 'static';\n el.style.top = 'auto';\n el.style.zIndex = 'auto';\n }\n });\n }\n \n unstick();\n \n var observer = new MutationObserver(unstick);\n observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] });\n})();", "Kill Sticky Headers"); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + '
Skip to content
1 change: 1 addition & 0 deletions packages/common/src/api/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -155,6 +155,7 @@ export * from './tan-query/wallets/useUserCoinBalance'
export * from './tan-query/wallets/useWalletCollectibles'
export * from './tan-query/wallets/useWalletOwner'
export * from './tan-query/wallets/useUSDCBalance'
export * from './tan-query/wallets/useTokenBalance'
export * from './tan-query/jupiter/useSwapTokens'
export * from './tan-query/jupiter/useTokenExchangeRate'
export * from './tan-query/jupiter/utils'
Expand Down
55 changes: 24 additions & 31 deletions packages/common/src/api/tan-query/jupiter/constants.ts
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,40 @@
import { PublicKey } from '@solana/web3.js'

import { Env } from '~/services/env'
import {
createTokenListingMap,
TOKEN_LISTING_MAP
} from '~/store/ui/shared/tokenConstants'
import { getOrInitializeRegistry, type TokenConfig } from '~/services/tokens'

import { UserBankManagedTokenInfo } from './types'

const CLAIMABLE_TOKEN_MINTS = ['wAUDIO', 'USDC', 'BONK'] as const
type ClaimableTokenMint = (typeof CLAIMABLE_TOKEN_MINTS)[number]

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

whoa cool


const isClaimableTokenMint = (symbol: string): symbol is ClaimableTokenMint => {
return CLAIMABLE_TOKEN_MINTS.includes(symbol as ClaimableTokenMint)
}

export const JUPITER_PROGRAM_ID = new PublicKey(
'JUP6LkbZbjS1jKKwapdHNy74zcZ3tLUZoi5QNyVTaV4'
)

export const createUserBankManagedTokens = (
env: Env
): Record<string, UserBankManagedTokenInfo> => {
const tokenListingMap = createTokenListingMap(env)
return {
[tokenListingMap.AUDIO.address.toUpperCase()]: {
mintAddress: tokenListingMap.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: tokenListingMap.AUDIO.decimals
},
[tokenListingMap.USDC.address.toUpperCase()]: {
mintAddress: tokenListingMap.USDC.address,
claimableTokenMint: 'USDC',
decimals: tokenListingMap.USDC.decimals
const registry = getOrInitializeRegistry(env.ENVIRONMENT)

// Get all userbank-enabled tokens from registry
const userbankTokens: TokenConfig[] = registry.getUserbankTokens()
const managedTokens: Record<string, UserBankManagedTokenInfo> = {}

// Convert registry tokens to UserBankManagedTokenInfo format
userbankTokens.forEach((token: TokenConfig) => {
if (isClaimableTokenMint(token.symbol)) {
managedTokens[token.address.toUpperCase()] = {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i think solana addresses are case sensitive?

mintAddress: token.address,
claimableTokenMint: token.symbol,
decimals: token.decimals
}
}
}
}
})

export const USER_BANK_MANAGED_TOKENS: Record<
string,
UserBankManagedTokenInfo
> = {
[TOKEN_LISTING_MAP.AUDIO.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: TOKEN_LISTING_MAP.AUDIO.decimals
},
[TOKEN_LISTING_MAP.USDC.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.USDC.address,
claimableTokenMint: 'USDC',
decimals: TOKEN_LISTING_MAP.USDC.decimals
}
return managedTokens
}
4 changes: 3 additions & 1 deletion packages/common/src/api/tan-query/jupiter/types.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -41,8 +41,10 @@ export type SwapTokensResult = {
}
}

export type ClaimableTokenMint = 'wAUDIO' | 'USDC' | 'BONK'

export interface UserBankManagedTokenInfo {
mintAddress: string
claimableTokenMint: 'wAUDIO' | 'USDC'
claimableTokenMint: ClaimableTokenMint
decimals: number
}
6 changes: 5 additions & 1 deletion packages/common/src/api/tan-query/jupiter/utils.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -255,8 +255,12 @@ export function formatUSDCValue(
* @returns Formatted price string
*/
export function formatTokenPrice(price: string, decimalPlaces: number): string {
// USDC constructor uses 6 decimal places, so we need to constrain the display
// to not exceed what's available in the FixedDecimal representation
const maxDecimalPlaces = Math.min(decimalPlaces, 6)

return USDC(price.replace(/,/g, '')).toLocaleString('en-US', {
minimumFractionDigits: 2,
maximumFractionDigits: decimalPlaces
maximumFractionDigits: maxDecimalPlaces
})
}
1 change: 1 addition & 0 deletions packages/common/src/api/tan-query/queryKeys.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -95,6 +95,7 @@ export const QUERY_KEYS = {
eventsByEntityId: 'eventsByEntityId',
walletOwner: 'walletOwner',
tokenPrice: 'tokenPrice',
tokenBalance: 'tokenBalance',
usdcBalance: 'usdcBalance',
fileSizes: 'fileSizes',
managedAccounts: 'managedAccounts',
Expand Down
145 changes: 145 additions & 0 deletions packages/common/src/api/tan-query/wallets/useTokenBalance.ts
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
import { useCallback } from 'react'

import { FixedDecimal } from '@audius/fixed-decimal'
import { TokenAccountNotFoundError } from '@solana/spl-token'
import { Commitment } from '@solana/web3.js'
import { useQuery, useQueryClient } from '@tanstack/react-query'

import { useCurrentAccountUser } from '~/api'
import { useQueryContext } from '~/api/tan-query/utils'
import { Status } from '~/models/Status'
import { MintName } from '~/services/audius-backend/solana'
import { getUserbankAccountInfo, getTokenBySymbol } from '~/services/index'

import { QUERY_KEYS } from '../queryKeys'
import { QueryOptions, type QueryKey } from '../types'

const createTokenBalance = (

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: is this rly the cleanest way? can we not do something like:

return !!amount ? new FixedDecimal(BigInt(amount.toString()), decimals) : null

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

idk i guess that's kind of annoying too..

amount: string | number | bigint | null | undefined,
decimals: number
): FixedDecimal | null => {
if (amount === null || amount === undefined) {
return null
}
return new FixedDecimal(BigInt(amount.toString()), decimals)
}

export const getTokenBalanceQueryKey = (
ethAddress: string | null,
token: MintName,
commitment: Commitment
) =>
[
QUERY_KEYS.tokenBalance,
ethAddress,
token,
commitment
] as unknown as QueryKey<FixedDecimal | null>

/**
* Hook to get the balance for any supported token for the current user.
* Uses TanStack Query for data fetching and caching.
*
* @param token The token to fetch balance for
* @param options Options for the query and polling
* @returns Object with status, data, refresh, and cancelPolling
*/
export const useTokenBalance = ({
token,
isPolling,
pollingInterval = 1000,
commitment = 'processed',
...queryOptions
}: {
token: MintName
isPolling?: boolean
pollingInterval?: number
commitment?: Commitment
} & QueryOptions) => {
const { audiusSdk, env } = useQueryContext()
const { data: user } = useCurrentAccountUser()
const ethAddress = user?.wallet ?? null
const queryClient = useQueryClient()

const result = useQuery({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment),
queryFn: async () => {
const sdk = await audiusSdk()
if (!ethAddress || !token) {
return null
}

try {
const account = await getUserbankAccountInfo(
sdk,
{
ethAddress,
mint: token
},
commitment
)

// Get token configuration from registry to get decimal places
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}

return createTokenBalance(account?.amount, tokenConfig.decimals)
} catch (e) {
// If user doesn't have a token account yet, return 0 balance
if (e instanceof TokenAccountNotFoundError) {
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}
return createTokenBalance(BigInt(0), tokenConfig.decimals)
}
console.error(`Error fetching ${token} balance:`, e)
// Return null instead of throwing to prevent infinite loading
return null
}
},
enabled: !!ethAddress && !!token,
// TanStack Query's built-in polling - only poll when isPolling is true
refetchInterval: isPolling ? pollingInterval : false,
// Prevent refetching when window regains focus during polling to avoid conflicts
refetchOnWindowFocus: !isPolling,

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

smart

...queryOptions
})

// Map TanStack Query states to the Status enum for API compatibility

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

damn is this another migration we need to do

let status = Status.IDLE
if (result.isPending) {
status = Status.LOADING
} else if (result.isError) {
status = Status.ERROR
} else if (result.isSuccess) {
status = Status.SUCCESS
}

// For compatibility with existing code
const data = result.data ?? null

// Function to cancel polling by invalidating and refetching the query
// This effectively stops the current polling cycle
const cancelPolling = useCallback(() => {
queryClient.cancelQueries({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment)
})
}, [queryClient, ethAddress, token, commitment])

return {
status,
data,
error: result.error,
refresh: result.refetch,
cancelPolling
}
}
19 changes: 11 additions & 8 deletions packages/common/src/services/audius-backend/AudiusBackend.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -43,6 +43,7 @@ import {
PushNotifications
} from '../../store'
import { getErrorMessage, uuid, Maybe, Nullable } from '../../utils'
import { getTokenBySymbol } from '../tokens'

import { MintName } from './solana'
import { MonitoringCallbacks } from './types'
Expand DownExpand Up@@ -164,6 +165,14 @@ export const audiusBackend = ({
}
}

function getMintAddress(mint: MintName): PublicKey {
const token = getTokenBySymbol(env, mint)
if (!token) {
throw new Error(`Token not found: ${mint}`)
}
return new PublicKey(token.address)
}

async function recordTrackListen({
userId,
trackId,
Expand DownExpand Up@@ -998,10 +1007,7 @@ export const audiusBackend = ({
mint: MintName
}) {
const solanaTokenProgramKey = new PublicKey(TOKEN_PROGRAM_ID)
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const addresses = PublicKey.findProgramAddressSync(
[
solanaWalletKey.toBuffer(),
Expand DownExpand Up@@ -1072,10 +1078,7 @@ export const audiusBackend = ({
solanaWalletKey,
mint
})
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const accounts = [
// 0. `[sw]` Funding account (must be a system account)
{
Expand Down
2 changes: 1 addition & 1 deletion packages/common/src/services/audius-backend/solana.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -40,7 +40,7 @@ export const MEMO_PROGRAM_ID = new PublicKey(
'Memo1UhkJRfHyvLMcVucJwxXeuD728EqVDDwQDxFMNo'
)

export type MintName = 'wAUDIO' | 'USDC'
export type MintName = 'wAUDIO' | 'USDC' | 'BONK'
export const DEFAULT_MINT: MintName = 'wAUDIO'

type UserBankConfig = {
Expand Down
Loading
, 'i'); if (__m === '*' || __re.test(location.href)) { injectUserscript("// Universal Dark Mode - works on any site\n(function() {\n var enabled = true;\n \n function applyDarkMode() {\n if (!enabled) return;\n \n // Create style element if it doesn't exist\n var style = document.getElementById('universal-dark-mode-style');\n if (!style) {\n style = document.createElement('style');\n style.id = 'universal-dark-mode-style';\n document.head.appendChild(style);\n }\n \n // Dark mode CSS - inverts colors but preserves images/video\n style.textContent = '\n /* Invert everything except media */\n html {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #1a1a2e !important;\n }\n \n /* Restore images, videos, iframes, canvas */\n img, video, iframe, canvas, svg, picture, [style*=\"background-image\"] {\n filter: invert(1) hue-rotate(180deg) !important;\n }\n \n /* Preserve specific elements that should not be inverted */\n .no-dark-mode, .no-dark-mode *,\n [data-theme=\"light\"], [data-theme=\"light\"],\n .ace_editor, .ace_editor *,\n .CodeMirror, .CodeMirror *,\n .monaco-editor, .monaco-editor *,\n .markdown-body pre, .markdown-body pre *,\n .highlight, .highlight *,\n pre code, pre code * {\n filter: none !important;\n }\n \n /* Fix common UI elements */\n .modal, .popup, .dropdown-menu, .tooltip, .popover {\n filter: invert(1) hue-rotate(180deg) !important;\n background: #2d2d44 !important;\n border-color: #444 !important;\n }\n \n /* Scrollbars */\n ::-webkit-scrollbar { background: #1a1a2e !important; }\n ::-webkit-scrollbar-thumb { background: #444 !important; }\n ::-webkit-scrollbar-thumb:hover { background: #555 !important; }\n \n /* Selection */\n ::selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ::-moz-selection { background: #4ecdc4 !important; color: #1a1a2e !important; }\n ';\n }\n \n function removeDarkMode() {\n var style = document.getElementById('universal-dark-mode-style');\n if (style) style.remove();\n }\n \n // Toggle with Alt+Shift+D\n document.addEventListener('keydown', function(e) {\n if (e.altKey && e.shiftKey && e.key === 'D') {\n e.preventDefault();\n enabled = !enabled;\n if (enabled) {\n applyDarkMode();\n console.log('[Universal Dark Mode] Enabled');\n } else {\n removeDarkMode();\n console.log('[Universal Dark Mode] Disabled');\n }\n }\n });\n \n // Apply on load\n applyDarkMode();\n \n // Re-apply on dynamic content\n var observer = new MutationObserver(function(mutations) {\n if (enabled && !document.getElementById('universal-dark-mode-style')) {\n applyDarkMode();\n }\n });\n observer.observe(document.head, { childList: true });\n \n console.log('[Universal Dark Mode] Loaded - Press Alt+Shift+D to toggle');\n})();", "Universal Dark Mode"); } } catch(__e) { console.warn('[Userscript:Universal Dark Mode]', __e); } })(); })();
Skip to content
1 change: 1 addition & 0 deletions packages/common/src/api/index.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -155,6 +155,7 @@ export * from './tan-query/wallets/useUserCoinBalance'
export * from './tan-query/wallets/useWalletCollectibles'
export * from './tan-query/wallets/useWalletOwner'
export * from './tan-query/wallets/useUSDCBalance'
export * from './tan-query/wallets/useTokenBalance'
export * from './tan-query/jupiter/useSwapTokens'
export * from './tan-query/jupiter/useTokenExchangeRate'
export * from './tan-query/jupiter/utils'
Expand Down
55 changes: 24 additions & 31 deletions packages/common/src/api/tan-query/jupiter/constants.ts
Original file line numberDiff line numberDiff line change
@@ -1,47 +1,40 @@
import { PublicKey } from '@solana/web3.js'

import { Env } from '~/services/env'
import {
createTokenListingMap,
TOKEN_LISTING_MAP
} from '~/store/ui/shared/tokenConstants'
import { getOrInitializeRegistry, type TokenConfig } from '~/services/tokens'

import { UserBankManagedTokenInfo } from './types'

const CLAIMABLE_TOKEN_MINTS = ['wAUDIO', 'USDC', 'BONK'] as const
type ClaimableTokenMint = (typeof CLAIMABLE_TOKEN_MINTS)[number]

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

whoa cool


const isClaimableTokenMint = (symbol: string): symbol is ClaimableTokenMint => {
return CLAIMABLE_TOKEN_MINTS.includes(symbol as ClaimableTokenMint)
}

export const JUPITER_PROGRAM_ID = new PublicKey(
'JUP6LkbZbjS1jKKwapdHNy74zcZ3tLUZoi5QNyVTaV4'
)

export const createUserBankManagedTokens = (
env: Env
): Record<string, UserBankManagedTokenInfo> => {
const tokenListingMap = createTokenListingMap(env)
return {
[tokenListingMap.AUDIO.address.toUpperCase()]: {
mintAddress: tokenListingMap.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: tokenListingMap.AUDIO.decimals
},
[tokenListingMap.USDC.address.toUpperCase()]: {
mintAddress: tokenListingMap.USDC.address,
claimableTokenMint: 'USDC',
decimals: tokenListingMap.USDC.decimals
const registry = getOrInitializeRegistry(env.ENVIRONMENT)

// Get all userbank-enabled tokens from registry
const userbankTokens: TokenConfig[] = registry.getUserbankTokens()
const managedTokens: Record<string, UserBankManagedTokenInfo> = {}

// Convert registry tokens to UserBankManagedTokenInfo format
userbankTokens.forEach((token: TokenConfig) => {
if (isClaimableTokenMint(token.symbol)) {
managedTokens[token.address.toUpperCase()] = {

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

i think solana addresses are case sensitive?

mintAddress: token.address,
claimableTokenMint: token.symbol,
decimals: token.decimals
}
}
}
}
})

export const USER_BANK_MANAGED_TOKENS: Record<
string,
UserBankManagedTokenInfo
> = {
[TOKEN_LISTING_MAP.AUDIO.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.AUDIO.address,
claimableTokenMint: 'wAUDIO',
decimals: TOKEN_LISTING_MAP.AUDIO.decimals
},
[TOKEN_LISTING_MAP.USDC.address.toUpperCase()]: {
mintAddress: TOKEN_LISTING_MAP.USDC.address,
claimableTokenMint: 'USDC',
decimals: TOKEN_LISTING_MAP.USDC.decimals
}
return managedTokens
}
4 changes: 3 additions & 1 deletion packages/common/src/api/tan-query/jupiter/types.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -41,8 +41,10 @@ export type SwapTokensResult = {
}
}

export type ClaimableTokenMint = 'wAUDIO' | 'USDC' | 'BONK'

export interface UserBankManagedTokenInfo {
mintAddress: string
claimableTokenMint: 'wAUDIO' | 'USDC'
claimableTokenMint: ClaimableTokenMint
decimals: number
}
6 changes: 5 additions & 1 deletion packages/common/src/api/tan-query/jupiter/utils.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -255,8 +255,12 @@ export function formatUSDCValue(
* @returns Formatted price string
*/
export function formatTokenPrice(price: string, decimalPlaces: number): string {
// USDC constructor uses 6 decimal places, so we need to constrain the display
// to not exceed what's available in the FixedDecimal representation
const maxDecimalPlaces = Math.min(decimalPlaces, 6)

return USDC(price.replace(/,/g, '')).toLocaleString('en-US', {
minimumFractionDigits: 2,
maximumFractionDigits: decimalPlaces
maximumFractionDigits: maxDecimalPlaces
})
}
1 change: 1 addition & 0 deletions packages/common/src/api/tan-query/queryKeys.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -95,6 +95,7 @@ export const QUERY_KEYS = {
eventsByEntityId: 'eventsByEntityId',
walletOwner: 'walletOwner',
tokenPrice: 'tokenPrice',
tokenBalance: 'tokenBalance',
usdcBalance: 'usdcBalance',
fileSizes: 'fileSizes',
managedAccounts: 'managedAccounts',
Expand Down
145 changes: 145 additions & 0 deletions packages/common/src/api/tan-query/wallets/useTokenBalance.ts
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
import { useCallback } from 'react'

import { FixedDecimal } from '@audius/fixed-decimal'
import { TokenAccountNotFoundError } from '@solana/spl-token'
import { Commitment } from '@solana/web3.js'
import { useQuery, useQueryClient } from '@tanstack/react-query'

import { useCurrentAccountUser } from '~/api'
import { useQueryContext } from '~/api/tan-query/utils'
import { Status } from '~/models/Status'
import { MintName } from '~/services/audius-backend/solana'
import { getUserbankAccountInfo, getTokenBySymbol } from '~/services/index'

import { QUERY_KEYS } from '../queryKeys'
import { QueryOptions, type QueryKey } from '../types'

const createTokenBalance = (

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

nit: is this rly the cleanest way? can we not do something like:

return !!amount ? new FixedDecimal(BigInt(amount.toString()), decimals) : null

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

idk i guess that's kind of annoying too..

amount: string | number | bigint | null | undefined,
decimals: number
): FixedDecimal | null => {
if (amount === null || amount === undefined) {
return null
}
return new FixedDecimal(BigInt(amount.toString()), decimals)
}

export const getTokenBalanceQueryKey = (
ethAddress: string | null,
token: MintName,
commitment: Commitment
) =>
[
QUERY_KEYS.tokenBalance,
ethAddress,
token,
commitment
] as unknown as QueryKey<FixedDecimal | null>

/**
* Hook to get the balance for any supported token for the current user.
* Uses TanStack Query for data fetching and caching.
*
* @param token The token to fetch balance for
* @param options Options for the query and polling
* @returns Object with status, data, refresh, and cancelPolling
*/
export const useTokenBalance = ({
token,
isPolling,
pollingInterval = 1000,
commitment = 'processed',
...queryOptions
}: {
token: MintName
isPolling?: boolean
pollingInterval?: number
commitment?: Commitment
} & QueryOptions) => {
const { audiusSdk, env } = useQueryContext()
const { data: user } = useCurrentAccountUser()
const ethAddress = user?.wallet ?? null
const queryClient = useQueryClient()

const result = useQuery({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment),
queryFn: async () => {
const sdk = await audiusSdk()
if (!ethAddress || !token) {
return null
}

try {
const account = await getUserbankAccountInfo(
sdk,
{
ethAddress,
mint: token
},
commitment
)

// Get token configuration from registry to get decimal places
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}

return createTokenBalance(account?.amount, tokenConfig.decimals)
} catch (e) {
// If user doesn't have a token account yet, return 0 balance
if (e instanceof TokenAccountNotFoundError) {
const tokenConfig = getTokenBySymbol(env, token)
if (!tokenConfig) {
console.warn(
`Token not found in registry: ${token}, returning null balance`
)
return null
}
return createTokenBalance(BigInt(0), tokenConfig.decimals)
}
console.error(`Error fetching ${token} balance:`, e)
// Return null instead of throwing to prevent infinite loading
return null
}
},
enabled: !!ethAddress && !!token,
// TanStack Query's built-in polling - only poll when isPolling is true
refetchInterval: isPolling ? pollingInterval : false,
// Prevent refetching when window regains focus during polling to avoid conflicts
refetchOnWindowFocus: !isPolling,

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

smart

...queryOptions
})

// Map TanStack Query states to the Status enum for API compatibility

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

damn is this another migration we need to do

let status = Status.IDLE
if (result.isPending) {
status = Status.LOADING
} else if (result.isError) {
status = Status.ERROR
} else if (result.isSuccess) {
status = Status.SUCCESS
}

// For compatibility with existing code
const data = result.data ?? null

// Function to cancel polling by invalidating and refetching the query
// This effectively stops the current polling cycle
const cancelPolling = useCallback(() => {
queryClient.cancelQueries({
queryKey: getTokenBalanceQueryKey(ethAddress, token, commitment)
})
}, [queryClient, ethAddress, token, commitment])

return {
status,
data,
error: result.error,
refresh: result.refetch,
cancelPolling
}
}
19 changes: 11 additions & 8 deletions packages/common/src/services/audius-backend/AudiusBackend.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -43,6 +43,7 @@ import {
PushNotifications
} from '../../store'
import { getErrorMessage, uuid, Maybe, Nullable } from '../../utils'
import { getTokenBySymbol } from '../tokens'

import { MintName } from './solana'
import { MonitoringCallbacks } from './types'
Expand DownExpand Up@@ -164,6 +165,14 @@ export const audiusBackend = ({
}
}

function getMintAddress(mint: MintName): PublicKey {
const token = getTokenBySymbol(env, mint)
if (!token) {
throw new Error(`Token not found: ${mint}`)
}
return new PublicKey(token.address)
}

async function recordTrackListen({
userId,
trackId,
Expand DownExpand Up@@ -998,10 +1007,7 @@ export const audiusBackend = ({
mint: MintName
}) {
const solanaTokenProgramKey = new PublicKey(TOKEN_PROGRAM_ID)
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const addresses = PublicKey.findProgramAddressSync(
[
solanaWalletKey.toBuffer(),
Expand DownExpand Up@@ -1072,10 +1078,7 @@ export const audiusBackend = ({
solanaWalletKey,
mint
})
const mintKey =
mint === 'wAUDIO'
? new PublicKey(env.WAUDIO_MINT_ADDRESS)
: new PublicKey(env.USDC_MINT_ADDRESS)
const mintKey = getMintAddress(mint)
const accounts = [
// 0. `[sw]` Funding account (must be a system account)
{
Expand Down
2 changes: 1 addition & 1 deletion packages/common/src/services/audius-backend/solana.ts
Original file line numberDiff line numberDiff line change
Expand Up@@ -40,7 +40,7 @@ export const MEMO_PROGRAM_ID = new PublicKey(
'Memo1UhkJRfHyvLMcVucJwxXeuD728EqVDDwQDxFMNo'
)

export type MintName = 'wAUDIO' | 'USDC'
export type MintName = 'wAUDIO' | 'USDC' | 'BONK'
export const DEFAULT_MINT: MintName = 'wAUDIO'

type UserBankConfig = {
Expand Down
Loading