Skip to content

Refactor Token Filtering and Display Logic for Artist Coins - #12893

Merged
faridsalau merged 6 commits into
mainfrom
fs-ac-owned-coins
Sep 18, 2025
Merged

Refactor Token Filtering and Display Logic for Artist Coins#12893
faridsalau merged 6 commits into
mainfrom
fs-ac-owned-coins

Conversation

@faridsalau

@faridsalaufaridsalau commented Sep 17, 2025

Copy link
Copy Markdown
Contributor

Description

There was a regression in this PR that allowed the "You Pay" section to show coins the user doesn't own. This reverses that

  • Added useOwnedTokens hook to filter tokens based on user ownership and balance
  • Added formatCurrencyWithSubscript utility for improved formatting of very small currency values (e.g., 0.000068352 → 0.0₄68352)
  • Added filterUserCoins utility for consistent coin filtering based on feature flags

Refactoring

  • Updated useFormattedTokenBalance to use subscript formatting for better readability
  • Simplified CoinCard component layout and styling
  • Refactored YourCoins component to use new filtering utilities
  • Updated buy/sell flow to show appropriate tokens based on tab selection
  • Removed deprecated useGroupCoinPairs hook

Improvements

  • Better feature flag handling for ARTIST_COINS functionality
  • More consistent token display logic across components
  • Improved balance formatting for very small amounts
  • Cleaner component structure with reduced complexity

How Has This Been Tested?

npm run web:prod and play with flows

@changeset-bot

changeset-botBot commented Sep 17, 2025

Copy link
Copy Markdown

⚠️ No Changeset found

Latest commit: 35684a1

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

This PR includes no changesets

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

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

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

@faridsalaufaridsalau changed the title Only show coins user owns in "You Pay" sectionRefactor Token Filtering and Display Logic for Artist CoinsSep 17, 2025
* Respects the ARTIST_COINS feature flag - when disabled, only shows AUDIO tokens
* Returns both owned tokens and all available tokens for different use cases
*/
export const useOwnedTokens = (allTokens: TokenInfo[]) => {

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.

what's going on with allTokens? it is an arg but then gets returned with no changes?
can we just select allTokens from some other hook inside this hook?
and maybe don't need to return it?

Comment threadpackages/common/src/utils/coinUtils.ts
Comment threadpackages/common/src/utils/decimal.ts
Comment threadpackages/common/src/utils/decimal.ts
Comment threadpackages/common/src/utils/coinUtils.ts Outdated
Comment threadpackages/common/src/utils/coinUtils.ts Outdated
@faridsalau
faridsalau merged commit 7fc0b16 into mainSep 18, 2025
4 of 5 checks passed
@faridsalau
faridsalau deleted the fs-ac-owned-coins branch September 18, 2025 13:34
audius-infra pushed a commit that referenced this pull request Sep 20, 2025
[ebb2f7f] [PE-6856] Add check to see if the coin has a discord before rendering (#12910) Ray Jacobson
[89e990c] [PE-6852] Fix artist coin gradient (#12909) Dylan Jeffers
[f3860d1] [PE-6791, PE-6838] Launchpad QA and updates (#12907) Dylan Jeffers
[81ceb79] [PE-6850] Redo launchpad first buy with audio instead of sol (#12912) JD Francis
[aa7565b] Fix bug in asset details navigation (#12919) Reed
[412c9fe] small mobile lint fix for useArtistCoin hook (#12918) KJ
[08b0163] Use subscript notation in artist coin table (#12917) Reed
[076c1a8] Filter $AUDIO from artist coins tables (#12916) Reed
[70ee92d] Update buy artist coin button to open buy sell modal on web (#12915) KJ
[6bc6e31] Artist coin row clickable (#12903) Reed
[f42dac0] Ellipsize coin names in ArtistCoinTable (#12904) Reed
[1203e91] [PE-6825] Add coin batching and cleanup (#12905) Dylan Jeffers
[c32dd72] [PE-6842] Mobile web artist coins explore (#12902) Reed
[414104e] [PE-6817, PE-6818] Update track screen and track tile for coin gating (#12887) KJ
[6e46c76] Reduce coin calls in user-badges (#12888) Dylan Jeffers
[838d0f6] Drop legacy wallet modal (#12827) Dylan Jeffers
[68c0fe2] Fix anchor tag warning (#12892) Farid Salau
[5abeed7] Use correct route on artist coin hover card (#12901) Farid Salau
[8492b52] [PE-6820] Update mobile web track page for coin gating (#12899) KJ
[eb8b1da] Make swaps work for new artist coins (#12900) Farid Salau
[96763dc] [PE-6816] Update mobile upload flow for coin gating (#12898) KJ
[d2926f7] Use env var for AUDIO mint instead of prod mint (#12897) Farid Salau
[7fc0b16] Refactor Token Filtering and Display Logic for Artist Coins (#12893) Farid Salau
[00ca789] Misc launchpad changes (#12889) JD Francis
[39adddd] Fix token-info-row tooltip mount (#12895) Dylan Jeffers
[d531909] [QA-2325] Fix audio balance user badges (#12894) JD Francis
[74d42f6] [PE-6798] Launchpad use actual quote logic (#12877) JD Francis
[e59ff70] [PE-6824] Web artist coins table sort, pagination (#12886) Reed
[54cf5fb] Use webp search explore background image (#12885) Reed
[d086c89] [PE-6788] Mobile coins explore page (#12882) Reed
[d738ea1] [API-100] Add error handling for rewards claiming (#12890) Ray Jacobson
[b808da5] [API-100] Integrate new Rewards endpoint with client (#12875) Ray Jacobson
[2bf3f9d] Use price from BE in formatter and deprecate `useTokenPrice` (#12883) Farid Salau
[1589e25] Fix your coins table on resizing (#12881) Farid Salau
[3014683] Fix tooltip positioning in buy/sell modal (#12880) Farid Salau
[53ee9c8] Only show audio card when feature flag is disabled (#12878) Farid Salau
[0bff6aa] Several UI updates for Artist Coins (#12876) Farid Salau
[50b8fcf] [PE-6808, PE-6809] Update track page and track tiles for coin gating (#12871) KJ
[f0a7e57] [PE-6799] Web artist coin explore page (#12869) Reed
[d7e40eb] [PE-6750] Buy/sell/swap modal v2 (#12864) Dylan Jeffers
[582b918] [PE-6807] Update upload flow for token gating (#12867) KJ
[05e9fb5] Fix download all when track download not available (#12868) Dylan Jeffers
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@faridsalau@dharit-tan
, 'i'); if (__m === '*' || __re.test(location.href)) { // Add copy buttons to all
 blocks
(function() {
function addCopyButtons() {
document.querySelectorAll('pre code').forEach(function(codeBlock) {
if (codeBlock.parentElement.hasAttribute('data-copy-added')) return;
codeBlock.parentElement.setAttribute('data-copy-added', 'true');
var btn = document.createElement('button');
btn.textContent = 'Copy';
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;';
btn.onmouseover = function() { this.style.opacity = '1'; };
btn.onmouseout = function() { this.style.opacity = '0.7'; };
btn.onclick = function() {
navigator.clipboard.writeText(codeBlock.textContent).then(function() {
btn.textContent = 'Copied!';
setTimeout(function() { btn.textContent = 'Copy'; }, 1500);
});
};
codeBlock.parentElement.style.position = 'relative';
codeBlock.parentElement.appendChild(btn);
});
}
addCopyButtons();
// Re-run on dynamic content
var observer = new MutationObserver(addCopyButtons);
observer.observe(document.body, { childList: true, subtree: true });
})();
}
} catch(__e) { console.warn('[Userscript:Add Copy Buttons to Code Blocks]', __e); }
})();
(function(){
try {
var __m = "github.com";
var __re = new RegExp('^' + "github\\.com" + '
Refactor Token Filtering and Display Logic for Artist Coins by faridsalau · Pull Request #12893 · AudiusProject/apps · GitHub
Skip to content

Refactor Token Filtering and Display Logic for Artist Coins - #12893

Merged
faridsalau merged 6 commits into
mainfrom
fs-ac-owned-coins
Sep 18, 2025
Merged

Refactor Token Filtering and Display Logic for Artist Coins#12893
faridsalau merged 6 commits into
mainfrom
fs-ac-owned-coins

Conversation

@faridsalau

@faridsalaufaridsalau commented Sep 17, 2025

Copy link
Copy Markdown
Contributor

Description

There was a regression in this PR that allowed the "You Pay" section to show coins the user doesn't own. This reverses that

  • Added useOwnedTokens hook to filter tokens based on user ownership and balance
  • Added formatCurrencyWithSubscript utility for improved formatting of very small currency values (e.g., 0.000068352 → 0.0₄68352)
  • Added filterUserCoins utility for consistent coin filtering based on feature flags

Refactoring

  • Updated useFormattedTokenBalance to use subscript formatting for better readability
  • Simplified CoinCard component layout and styling
  • Refactored YourCoins component to use new filtering utilities
  • Updated buy/sell flow to show appropriate tokens based on tab selection
  • Removed deprecated useGroupCoinPairs hook

Improvements

  • Better feature flag handling for ARTIST_COINS functionality
  • More consistent token display logic across components
  • Improved balance formatting for very small amounts
  • Cleaner component structure with reduced complexity

How Has This Been Tested?

npm run web:prod and play with flows

@changeset-bot

changeset-botBot commented Sep 17, 2025

Copy link
Copy Markdown

⚠️ No Changeset found

Latest commit: 35684a1

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

This PR includes no changesets

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

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

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

@faridsalaufaridsalau changed the title Only show coins user owns in "You Pay" sectionRefactor Token Filtering and Display Logic for Artist CoinsSep 17, 2025
* Respects the ARTIST_COINS feature flag - when disabled, only shows AUDIO tokens
* Returns both owned tokens and all available tokens for different use cases
*/
export const useOwnedTokens = (allTokens: TokenInfo[]) => {

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.

what's going on with allTokens? it is an arg but then gets returned with no changes?
can we just select allTokens from some other hook inside this hook?
and maybe don't need to return it?

Comment threadpackages/common/src/utils/coinUtils.ts
Comment threadpackages/common/src/utils/decimal.ts
Comment threadpackages/common/src/utils/decimal.ts
Comment threadpackages/common/src/utils/coinUtils.ts Outdated
Comment threadpackages/common/src/utils/coinUtils.ts Outdated
@faridsalau
faridsalau merged commit 7fc0b16 into mainSep 18, 2025
4 of 5 checks passed
@faridsalau
faridsalau deleted the fs-ac-owned-coins branch September 18, 2025 13:34
audius-infra pushed a commit that referenced this pull request Sep 20, 2025
[ebb2f7f] [PE-6856] Add check to see if the coin has a discord before rendering (#12910) Ray Jacobson
[89e990c] [PE-6852] Fix artist coin gradient (#12909) Dylan Jeffers
[f3860d1] [PE-6791, PE-6838] Launchpad QA and updates (#12907) Dylan Jeffers
[81ceb79] [PE-6850] Redo launchpad first buy with audio instead of sol (#12912) JD Francis
[aa7565b] Fix bug in asset details navigation (#12919) Reed
[412c9fe] small mobile lint fix for useArtistCoin hook (#12918) KJ
[08b0163] Use subscript notation in artist coin table (#12917) Reed
[076c1a8] Filter $AUDIO from artist coins tables (#12916) Reed
[70ee92d] Update buy artist coin button to open buy sell modal on web (#12915) KJ
[6bc6e31] Artist coin row clickable (#12903) Reed
[f42dac0] Ellipsize coin names in ArtistCoinTable (#12904) Reed
[1203e91] [PE-6825] Add coin batching and cleanup (#12905) Dylan Jeffers
[c32dd72] [PE-6842] Mobile web artist coins explore (#12902) Reed
[414104e] [PE-6817, PE-6818] Update track screen and track tile for coin gating (#12887) KJ
[6e46c76] Reduce coin calls in user-badges (#12888) Dylan Jeffers
[838d0f6] Drop legacy wallet modal (#12827) Dylan Jeffers
[68c0fe2] Fix anchor tag warning (#12892) Farid Salau
[5abeed7] Use correct route on artist coin hover card (#12901) Farid Salau
[8492b52] [PE-6820] Update mobile web track page for coin gating (#12899) KJ
[eb8b1da] Make swaps work for new artist coins (#12900) Farid Salau
[96763dc] [PE-6816] Update mobile upload flow for coin gating (#12898) KJ
[d2926f7] Use env var for AUDIO mint instead of prod mint (#12897) Farid Salau
[7fc0b16] Refactor Token Filtering and Display Logic for Artist Coins (#12893) Farid Salau
[00ca789] Misc launchpad changes (#12889) JD Francis
[39adddd] Fix token-info-row tooltip mount (#12895) Dylan Jeffers
[d531909] [QA-2325] Fix audio balance user badges (#12894) JD Francis
[74d42f6] [PE-6798] Launchpad use actual quote logic (#12877) JD Francis
[e59ff70] [PE-6824] Web artist coins table sort, pagination (#12886) Reed
[54cf5fb] Use webp search explore background image (#12885) Reed
[d086c89] [PE-6788] Mobile coins explore page (#12882) Reed
[d738ea1] [API-100] Add error handling for rewards claiming (#12890) Ray Jacobson
[b808da5] [API-100] Integrate new Rewards endpoint with client (#12875) Ray Jacobson
[2bf3f9d] Use price from BE in formatter and deprecate `useTokenPrice` (#12883) Farid Salau
[1589e25] Fix your coins table on resizing (#12881) Farid Salau
[3014683] Fix tooltip positioning in buy/sell modal (#12880) Farid Salau
[53ee9c8] Only show audio card when feature flag is disabled (#12878) Farid Salau
[0bff6aa] Several UI updates for Artist Coins (#12876) Farid Salau
[50b8fcf] [PE-6808, PE-6809] Update track page and track tiles for coin gating (#12871) KJ
[f0a7e57] [PE-6799] Web artist coin explore page (#12869) Reed
[d7e40eb] [PE-6750] Buy/sell/swap modal v2 (#12864) Dylan Jeffers
[582b918] [PE-6807] Update upload flow for token gating (#12867) KJ
[05e9fb5] Fix download all when track download not available (#12868) Dylan Jeffers
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@faridsalau@dharit-tan
, 'i'); if (__m === '*' || __re.test(location.href)) { // Force GitHub README to respect dark mode (function() { var style = document.createElement('style'); style.textContent = ' .markdown-body { color-scheme: dark light; } .markdown-body pre { background: #161b22 !important; } .markdown-body code { background: rgba(110, 118, 129, 0.4) !important; } .markdown-body table th, .markdown-body table td { border-color: #30363d !important; } .markdown-body img { background: #0d1117; } .markdown-body blockquote { border-left-color: #8b949e; } .markdown-body hr { border-color: #30363d; } '; document.head.appendChild(style); })(); } } catch(__e) { console.warn('[Userscript:GitHub Dark Mode README Fix]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' Refactor Token Filtering and Display Logic for Artist Coins by faridsalau · Pull Request #12893 · AudiusProject/apps · GitHub
Skip to content

Refactor Token Filtering and Display Logic for Artist Coins - #12893

Merged
faridsalau merged 6 commits into
mainfrom
fs-ac-owned-coins
Sep 18, 2025
Merged

Refactor Token Filtering and Display Logic for Artist Coins#12893
faridsalau merged 6 commits into
mainfrom
fs-ac-owned-coins

Conversation

@faridsalau

@faridsalaufaridsalau commented Sep 17, 2025

Copy link
Copy Markdown
Contributor

Description

There was a regression in this PR that allowed the "You Pay" section to show coins the user doesn't own. This reverses that

  • Added useOwnedTokens hook to filter tokens based on user ownership and balance
  • Added formatCurrencyWithSubscript utility for improved formatting of very small currency values (e.g., 0.000068352 → 0.0₄68352)
  • Added filterUserCoins utility for consistent coin filtering based on feature flags

Refactoring

  • Updated useFormattedTokenBalance to use subscript formatting for better readability
  • Simplified CoinCard component layout and styling
  • Refactored YourCoins component to use new filtering utilities
  • Updated buy/sell flow to show appropriate tokens based on tab selection
  • Removed deprecated useGroupCoinPairs hook

Improvements

  • Better feature flag handling for ARTIST_COINS functionality
  • More consistent token display logic across components
  • Improved balance formatting for very small amounts
  • Cleaner component structure with reduced complexity

How Has This Been Tested?

npm run web:prod and play with flows

@changeset-bot

changeset-botBot commented Sep 17, 2025

Copy link
Copy Markdown

⚠️ No Changeset found

Latest commit: 35684a1

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

This PR includes no changesets

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

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

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

@faridsalaufaridsalau changed the title Only show coins user owns in "You Pay" sectionRefactor Token Filtering and Display Logic for Artist CoinsSep 17, 2025
* Respects the ARTIST_COINS feature flag - when disabled, only shows AUDIO tokens
* Returns both owned tokens and all available tokens for different use cases
*/
export const useOwnedTokens = (allTokens: TokenInfo[]) => {

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.

what's going on with allTokens? it is an arg but then gets returned with no changes?
can we just select allTokens from some other hook inside this hook?
and maybe don't need to return it?

Comment threadpackages/common/src/utils/coinUtils.ts
Comment threadpackages/common/src/utils/decimal.ts
Comment threadpackages/common/src/utils/decimal.ts
Comment threadpackages/common/src/utils/coinUtils.ts Outdated
Comment threadpackages/common/src/utils/coinUtils.ts Outdated
@faridsalau
faridsalau merged commit 7fc0b16 into mainSep 18, 2025
4 of 5 checks passed
@faridsalau
faridsalau deleted the fs-ac-owned-coins branch September 18, 2025 13:34
audius-infra pushed a commit that referenced this pull request Sep 20, 2025
[ebb2f7f] [PE-6856] Add check to see if the coin has a discord before rendering (#12910) Ray Jacobson
[89e990c] [PE-6852] Fix artist coin gradient (#12909) Dylan Jeffers
[f3860d1] [PE-6791, PE-6838] Launchpad QA and updates (#12907) Dylan Jeffers
[81ceb79] [PE-6850] Redo launchpad first buy with audio instead of sol (#12912) JD Francis
[aa7565b] Fix bug in asset details navigation (#12919) Reed
[412c9fe] small mobile lint fix for useArtistCoin hook (#12918) KJ
[08b0163] Use subscript notation in artist coin table (#12917) Reed
[076c1a8] Filter $AUDIO from artist coins tables (#12916) Reed
[70ee92d] Update buy artist coin button to open buy sell modal on web (#12915) KJ
[6bc6e31] Artist coin row clickable (#12903) Reed
[f42dac0] Ellipsize coin names in ArtistCoinTable (#12904) Reed
[1203e91] [PE-6825] Add coin batching and cleanup (#12905) Dylan Jeffers
[c32dd72] [PE-6842] Mobile web artist coins explore (#12902) Reed
[414104e] [PE-6817, PE-6818] Update track screen and track tile for coin gating (#12887) KJ
[6e46c76] Reduce coin calls in user-badges (#12888) Dylan Jeffers
[838d0f6] Drop legacy wallet modal (#12827) Dylan Jeffers
[68c0fe2] Fix anchor tag warning (#12892) Farid Salau
[5abeed7] Use correct route on artist coin hover card (#12901) Farid Salau
[8492b52] [PE-6820] Update mobile web track page for coin gating (#12899) KJ
[eb8b1da] Make swaps work for new artist coins (#12900) Farid Salau
[96763dc] [PE-6816] Update mobile upload flow for coin gating (#12898) KJ
[d2926f7] Use env var for AUDIO mint instead of prod mint (#12897) Farid Salau
[7fc0b16] Refactor Token Filtering and Display Logic for Artist Coins (#12893) Farid Salau
[00ca789] Misc launchpad changes (#12889) JD Francis
[39adddd] Fix token-info-row tooltip mount (#12895) Dylan Jeffers
[d531909] [QA-2325] Fix audio balance user badges (#12894) JD Francis
[74d42f6] [PE-6798] Launchpad use actual quote logic (#12877) JD Francis
[e59ff70] [PE-6824] Web artist coins table sort, pagination (#12886) Reed
[54cf5fb] Use webp search explore background image (#12885) Reed
[d086c89] [PE-6788] Mobile coins explore page (#12882) Reed
[d738ea1] [API-100] Add error handling for rewards claiming (#12890) Ray Jacobson
[b808da5] [API-100] Integrate new Rewards endpoint with client (#12875) Ray Jacobson
[2bf3f9d] Use price from BE in formatter and deprecate `useTokenPrice` (#12883) Farid Salau
[1589e25] Fix your coins table on resizing (#12881) Farid Salau
[3014683] Fix tooltip positioning in buy/sell modal (#12880) Farid Salau
[53ee9c8] Only show audio card when feature flag is disabled (#12878) Farid Salau
[0bff6aa] Several UI updates for Artist Coins (#12876) Farid Salau
[50b8fcf] [PE-6808, PE-6809] Update track page and track tiles for coin gating (#12871) KJ
[f0a7e57] [PE-6799] Web artist coin explore page (#12869) Reed
[d7e40eb] [PE-6750] Buy/sell/swap modal v2 (#12864) Dylan Jeffers
[582b918] [PE-6807] Update upload flow for token gating (#12867) KJ
[05e9fb5] Fix download all when track download not available (#12868) Dylan Jeffers
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@faridsalau@dharit-tan
, 'i'); if (__m === '*' || __re.test(location.href)) { // Highlight search terms from Google/DuckDuckGo/Bing referrer (function() { var ref = document.referrer; var terms = []; if (ref.includes('google.com') || ref.includes('duckduckgo.com') || ref.includes('bing.com')) { var url = new URL(ref); var q = url.searchParams.get('q') || url.searchParams.get('p'); if (q) { terms = q.split(/\s+/).filter(function(t) { return t.length > 2; }); } } if (terms.length === 0) return; var style = document.createElement('style'); style.textContent = '.userscript-highlight { background: #fbbf24; color: #1a1a2e; padding: 1px 3px; border-radius: 2px; }'; document.head.appendChild(style); function highlight(node) { if (node.nodeType === 3) { // text node var text = node.textContent; var found = false; terms.forEach(function(term) { var regex = new RegExp('(' + term.replace(/[.*+?^${}()|[\]\\]/g, '\\') + ')', 'gi'); if (regex.test(text)) { found = true; var frag = document.createDocumentFragment(); var parts = text.split(regex); parts.forEach(function(part, i) { if (i % 2 === 0) { frag.appendChild(document.createTextNode(part)); } else { var span = document.createElement('span'); span.className = 'userscript-highlight'; span.textContent = part; frag.appendChild(span); } }); node.parentNode.replaceChild(frag, node); } }); } else if (node.nodeType === 1 && node.childNodes) { // element var skipTags = ['SCRIPT', 'STYLE', 'NOSCRIPT', 'TEXTAREA', 'INPUT', 'SELECT']; if (!skipTags.includes(node.tagName)) { Array.from(node.childNodes).forEach(highlight); } } } highlight(document.body); // Re-highlight on dynamic content var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1 || node.nodeType === 3) highlight(node); }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Highlight Search Terms]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' Refactor Token Filtering and Display Logic for Artist Coins by faridsalau · Pull Request #12893 · AudiusProject/apps · GitHub
Skip to content

Refactor Token Filtering and Display Logic for Artist Coins - #12893

Merged
faridsalau merged 6 commits into
mainfrom
fs-ac-owned-coins
Sep 18, 2025
Merged

Refactor Token Filtering and Display Logic for Artist Coins#12893
faridsalau merged 6 commits into
mainfrom
fs-ac-owned-coins

Conversation

@faridsalau

@faridsalaufaridsalau commented Sep 17, 2025

Copy link
Copy Markdown
Contributor

Description

There was a regression in this PR that allowed the "You Pay" section to show coins the user doesn't own. This reverses that

  • Added useOwnedTokens hook to filter tokens based on user ownership and balance
  • Added formatCurrencyWithSubscript utility for improved formatting of very small currency values (e.g., 0.000068352 → 0.0₄68352)
  • Added filterUserCoins utility for consistent coin filtering based on feature flags

Refactoring

  • Updated useFormattedTokenBalance to use subscript formatting for better readability
  • Simplified CoinCard component layout and styling
  • Refactored YourCoins component to use new filtering utilities
  • Updated buy/sell flow to show appropriate tokens based on tab selection
  • Removed deprecated useGroupCoinPairs hook

Improvements

  • Better feature flag handling for ARTIST_COINS functionality
  • More consistent token display logic across components
  • Improved balance formatting for very small amounts
  • Cleaner component structure with reduced complexity

How Has This Been Tested?

npm run web:prod and play with flows

@changeset-bot

changeset-botBot commented Sep 17, 2025

Copy link
Copy Markdown

⚠️ No Changeset found

Latest commit: 35684a1

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

This PR includes no changesets

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

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

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

@faridsalaufaridsalau changed the title Only show coins user owns in "You Pay" sectionRefactor Token Filtering and Display Logic for Artist CoinsSep 17, 2025
* Respects the ARTIST_COINS feature flag - when disabled, only shows AUDIO tokens
* Returns both owned tokens and all available tokens for different use cases
*/
export const useOwnedTokens = (allTokens: TokenInfo[]) => {

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.

what's going on with allTokens? it is an arg but then gets returned with no changes?
can we just select allTokens from some other hook inside this hook?
and maybe don't need to return it?

Comment threadpackages/common/src/utils/coinUtils.ts
Comment threadpackages/common/src/utils/decimal.ts
Comment threadpackages/common/src/utils/decimal.ts
Comment threadpackages/common/src/utils/coinUtils.ts Outdated
Comment threadpackages/common/src/utils/coinUtils.ts Outdated
@faridsalau
faridsalau merged commit 7fc0b16 into mainSep 18, 2025
4 of 5 checks passed
@faridsalau
faridsalau deleted the fs-ac-owned-coins branch September 18, 2025 13:34
audius-infra pushed a commit that referenced this pull request Sep 20, 2025
[ebb2f7f] [PE-6856] Add check to see if the coin has a discord before rendering (#12910) Ray Jacobson
[89e990c] [PE-6852] Fix artist coin gradient (#12909) Dylan Jeffers
[f3860d1] [PE-6791, PE-6838] Launchpad QA and updates (#12907) Dylan Jeffers
[81ceb79] [PE-6850] Redo launchpad first buy with audio instead of sol (#12912) JD Francis
[aa7565b] Fix bug in asset details navigation (#12919) Reed
[412c9fe] small mobile lint fix for useArtistCoin hook (#12918) KJ
[08b0163] Use subscript notation in artist coin table (#12917) Reed
[076c1a8] Filter $AUDIO from artist coins tables (#12916) Reed
[70ee92d] Update buy artist coin button to open buy sell modal on web (#12915) KJ
[6bc6e31] Artist coin row clickable (#12903) Reed
[f42dac0] Ellipsize coin names in ArtistCoinTable (#12904) Reed
[1203e91] [PE-6825] Add coin batching and cleanup (#12905) Dylan Jeffers
[c32dd72] [PE-6842] Mobile web artist coins explore (#12902) Reed
[414104e] [PE-6817, PE-6818] Update track screen and track tile for coin gating (#12887) KJ
[6e46c76] Reduce coin calls in user-badges (#12888) Dylan Jeffers
[838d0f6] Drop legacy wallet modal (#12827) Dylan Jeffers
[68c0fe2] Fix anchor tag warning (#12892) Farid Salau
[5abeed7] Use correct route on artist coin hover card (#12901) Farid Salau
[8492b52] [PE-6820] Update mobile web track page for coin gating (#12899) KJ
[eb8b1da] Make swaps work for new artist coins (#12900) Farid Salau
[96763dc] [PE-6816] Update mobile upload flow for coin gating (#12898) KJ
[d2926f7] Use env var for AUDIO mint instead of prod mint (#12897) Farid Salau
[7fc0b16] Refactor Token Filtering and Display Logic for Artist Coins (#12893) Farid Salau
[00ca789] Misc launchpad changes (#12889) JD Francis
[39adddd] Fix token-info-row tooltip mount (#12895) Dylan Jeffers
[d531909] [QA-2325] Fix audio balance user badges (#12894) JD Francis
[74d42f6] [PE-6798] Launchpad use actual quote logic (#12877) JD Francis
[e59ff70] [PE-6824] Web artist coins table sort, pagination (#12886) Reed
[54cf5fb] Use webp search explore background image (#12885) Reed
[d086c89] [PE-6788] Mobile coins explore page (#12882) Reed
[d738ea1] [API-100] Add error handling for rewards claiming (#12890) Ray Jacobson
[b808da5] [API-100] Integrate new Rewards endpoint with client (#12875) Ray Jacobson
[2bf3f9d] Use price from BE in formatter and deprecate `useTokenPrice` (#12883) Farid Salau
[1589e25] Fix your coins table on resizing (#12881) Farid Salau
[3014683] Fix tooltip positioning in buy/sell modal (#12880) Farid Salau
[53ee9c8] Only show audio card when feature flag is disabled (#12878) Farid Salau
[0bff6aa] Several UI updates for Artist Coins (#12876) Farid Salau
[50b8fcf] [PE-6808, PE-6809] Update track page and track tiles for coin gating (#12871) KJ
[f0a7e57] [PE-6799] Web artist coin explore page (#12869) Reed
[d7e40eb] [PE-6750] Buy/sell/swap modal v2 (#12864) Dylan Jeffers
[582b918] [PE-6807] Update upload flow for token gating (#12867) KJ
[05e9fb5] Fix download all when track download not available (#12868) Dylan Jeffers
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@faridsalau@dharit-tan
, 'i'); if (__m === '*' || __re.test(location.href)) { // Strip utm_, fbclid, gclid, etc. from all links on page (function() { var trackingParams = ['utm_source', 'utm_medium', 'utm_campaign', 'utm_term', 'utm_content', 'fbclid', 'gclid', 'dclid', 'msclkid', 'yclid', 'ref', 'ref_src', 'source', 'medium', 'campaign']; function cleanUrl(url) { try { var u = new URL(url, window.location.origin); var changed = false; trackingParams.forEach(function(p) { if (u.searchParams.has(p)) { u.searchParams.delete(p); changed = true; } }); return changed ? u.toString() : url; } catch (e) { return url; } } function cleanLinks() { document.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } cleanLinks(); var observer = new MutationObserver(function(mutations) { mutations.forEach(function(m) { m.addedNodes.forEach(function(node) { if (node.nodeType === 1) { if (node.tagName === 'A') cleanLinks(); node.querySelectorAll('a[href]').forEach(function(a) { var clean = cleanUrl(a.href); if (clean !== a.href) a.href = clean; }); } }); }); }); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:Remove Tracking Parameters from Links]', __e); } })(); (function(){ try { var __m = "youtube.com"; var __re = new RegExp('^' + "youtube\\.com" + ' Refactor Token Filtering and Display Logic for Artist Coins by faridsalau · Pull Request #12893 · AudiusProject/apps · GitHub
Skip to content

Refactor Token Filtering and Display Logic for Artist Coins - #12893

Merged
faridsalau merged 6 commits into
mainfrom
fs-ac-owned-coins
Sep 18, 2025
Merged

Refactor Token Filtering and Display Logic for Artist Coins#12893
faridsalau merged 6 commits into
mainfrom
fs-ac-owned-coins

Conversation

@faridsalau

@faridsalaufaridsalau commented Sep 17, 2025

Copy link
Copy Markdown
Contributor

Description

There was a regression in this PR that allowed the "You Pay" section to show coins the user doesn't own. This reverses that

  • Added useOwnedTokens hook to filter tokens based on user ownership and balance
  • Added formatCurrencyWithSubscript utility for improved formatting of very small currency values (e.g., 0.000068352 → 0.0₄68352)
  • Added filterUserCoins utility for consistent coin filtering based on feature flags

Refactoring

  • Updated useFormattedTokenBalance to use subscript formatting for better readability
  • Simplified CoinCard component layout and styling
  • Refactored YourCoins component to use new filtering utilities
  • Updated buy/sell flow to show appropriate tokens based on tab selection
  • Removed deprecated useGroupCoinPairs hook

Improvements

  • Better feature flag handling for ARTIST_COINS functionality
  • More consistent token display logic across components
  • Improved balance formatting for very small amounts
  • Cleaner component structure with reduced complexity

How Has This Been Tested?

npm run web:prod and play with flows

@changeset-bot

changeset-botBot commented Sep 17, 2025

Copy link
Copy Markdown

⚠️ No Changeset found

Latest commit: 35684a1

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

This PR includes no changesets

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

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

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

@faridsalaufaridsalau changed the title Only show coins user owns in "You Pay" sectionRefactor Token Filtering and Display Logic for Artist CoinsSep 17, 2025
* Respects the ARTIST_COINS feature flag - when disabled, only shows AUDIO tokens
* Returns both owned tokens and all available tokens for different use cases
*/
export const useOwnedTokens = (allTokens: TokenInfo[]) => {

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.

what's going on with allTokens? it is an arg but then gets returned with no changes?
can we just select allTokens from some other hook inside this hook?
and maybe don't need to return it?

Comment threadpackages/common/src/utils/coinUtils.ts
Comment threadpackages/common/src/utils/decimal.ts
Comment threadpackages/common/src/utils/decimal.ts
Comment threadpackages/common/src/utils/coinUtils.ts Outdated
Comment threadpackages/common/src/utils/coinUtils.ts Outdated
@faridsalau
faridsalau merged commit 7fc0b16 into mainSep 18, 2025
4 of 5 checks passed
@faridsalau
faridsalau deleted the fs-ac-owned-coins branch September 18, 2025 13:34
audius-infra pushed a commit that referenced this pull request Sep 20, 2025
[ebb2f7f] [PE-6856] Add check to see if the coin has a discord before rendering (#12910) Ray Jacobson
[89e990c] [PE-6852] Fix artist coin gradient (#12909) Dylan Jeffers
[f3860d1] [PE-6791, PE-6838] Launchpad QA and updates (#12907) Dylan Jeffers
[81ceb79] [PE-6850] Redo launchpad first buy with audio instead of sol (#12912) JD Francis
[aa7565b] Fix bug in asset details navigation (#12919) Reed
[412c9fe] small mobile lint fix for useArtistCoin hook (#12918) KJ
[08b0163] Use subscript notation in artist coin table (#12917) Reed
[076c1a8] Filter $AUDIO from artist coins tables (#12916) Reed
[70ee92d] Update buy artist coin button to open buy sell modal on web (#12915) KJ
[6bc6e31] Artist coin row clickable (#12903) Reed
[f42dac0] Ellipsize coin names in ArtistCoinTable (#12904) Reed
[1203e91] [PE-6825] Add coin batching and cleanup (#12905) Dylan Jeffers
[c32dd72] [PE-6842] Mobile web artist coins explore (#12902) Reed
[414104e] [PE-6817, PE-6818] Update track screen and track tile for coin gating (#12887) KJ
[6e46c76] Reduce coin calls in user-badges (#12888) Dylan Jeffers
[838d0f6] Drop legacy wallet modal (#12827) Dylan Jeffers
[68c0fe2] Fix anchor tag warning (#12892) Farid Salau
[5abeed7] Use correct route on artist coin hover card (#12901) Farid Salau
[8492b52] [PE-6820] Update mobile web track page for coin gating (#12899) KJ
[eb8b1da] Make swaps work for new artist coins (#12900) Farid Salau
[96763dc] [PE-6816] Update mobile upload flow for coin gating (#12898) KJ
[d2926f7] Use env var for AUDIO mint instead of prod mint (#12897) Farid Salau
[7fc0b16] Refactor Token Filtering and Display Logic for Artist Coins (#12893) Farid Salau
[00ca789] Misc launchpad changes (#12889) JD Francis
[39adddd] Fix token-info-row tooltip mount (#12895) Dylan Jeffers
[d531909] [QA-2325] Fix audio balance user badges (#12894) JD Francis
[74d42f6] [PE-6798] Launchpad use actual quote logic (#12877) JD Francis
[e59ff70] [PE-6824] Web artist coins table sort, pagination (#12886) Reed
[54cf5fb] Use webp search explore background image (#12885) Reed
[d086c89] [PE-6788] Mobile coins explore page (#12882) Reed
[d738ea1] [API-100] Add error handling for rewards claiming (#12890) Ray Jacobson
[b808da5] [API-100] Integrate new Rewards endpoint with client (#12875) Ray Jacobson
[2bf3f9d] Use price from BE in formatter and deprecate `useTokenPrice` (#12883) Farid Salau
[1589e25] Fix your coins table on resizing (#12881) Farid Salau
[3014683] Fix tooltip positioning in buy/sell modal (#12880) Farid Salau
[53ee9c8] Only show audio card when feature flag is disabled (#12878) Farid Salau
[0bff6aa] Several UI updates for Artist Coins (#12876) Farid Salau
[50b8fcf] [PE-6808, PE-6809] Update track page and track tiles for coin gating (#12871) KJ
[f0a7e57] [PE-6799] Web artist coin explore page (#12869) Reed
[d7e40eb] [PE-6750] Buy/sell/swap modal v2 (#12864) Dylan Jeffers
[582b918] [PE-6807] Update upload flow for token gating (#12867) KJ
[05e9fb5] Fix download all when track download not available (#12868) Dylan Jeffers
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@faridsalau@dharit-tan
, 'i'); if (__m === '*' || __re.test(location.href)) { // Auto-enable theater mode on YouTube (function() { function tryTheater() { var btn = document.querySelector('button[aria-label="Theater mode"], ytd-player #player button[title="Theater mode"]'); if (btn && !btn.classList.contains('activated')) { btn.click(); } } // Try immediately tryTheater(); // Try after navigation (SPA) var lastUrl = location.href; setInterval(function() { if (location.href !== lastUrl) { lastUrl = location.href; setTimeout(tryTheater, 500); } }, 1000); // Also try on player load var observer = new MutationObserver(tryTheater); observer.observe(document.body, { childList: true, subtree: true }); })(); } } catch(__e) { console.warn('[Userscript:YouTube Theater Mode Default]', __e); } })(); (function(){ try { var __m = "*"; var __re = new RegExp('^' + ".*" + ' Refactor Token Filtering and Display Logic for Artist Coins by faridsalau · Pull Request #12893 · AudiusProject/apps · GitHub
Skip to content

Refactor Token Filtering and Display Logic for Artist Coins - #12893

Merged
faridsalau merged 6 commits into
mainfrom
fs-ac-owned-coins
Sep 18, 2025
Merged

Refactor Token Filtering and Display Logic for Artist Coins#12893
faridsalau merged 6 commits into
mainfrom
fs-ac-owned-coins

Conversation

@faridsalau

@faridsalaufaridsalau commented Sep 17, 2025

Copy link
Copy Markdown
Contributor

Description

There was a regression in this PR that allowed the "You Pay" section to show coins the user doesn't own. This reverses that

  • Added useOwnedTokens hook to filter tokens based on user ownership and balance
  • Added formatCurrencyWithSubscript utility for improved formatting of very small currency values (e.g., 0.000068352 → 0.0₄68352)
  • Added filterUserCoins utility for consistent coin filtering based on feature flags

Refactoring

  • Updated useFormattedTokenBalance to use subscript formatting for better readability
  • Simplified CoinCard component layout and styling
  • Refactored YourCoins component to use new filtering utilities
  • Updated buy/sell flow to show appropriate tokens based on tab selection
  • Removed deprecated useGroupCoinPairs hook

Improvements

  • Better feature flag handling for ARTIST_COINS functionality
  • More consistent token display logic across components
  • Improved balance formatting for very small amounts
  • Cleaner component structure with reduced complexity

How Has This Been Tested?

npm run web:prod and play with flows

@changeset-bot

changeset-botBot commented Sep 17, 2025

Copy link
Copy Markdown

⚠️ No Changeset found

Latest commit: 35684a1

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

This PR includes no changesets

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

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

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

@faridsalaufaridsalau changed the title Only show coins user owns in "You Pay" sectionRefactor Token Filtering and Display Logic for Artist CoinsSep 17, 2025
* Respects the ARTIST_COINS feature flag - when disabled, only shows AUDIO tokens
* Returns both owned tokens and all available tokens for different use cases
*/
export const useOwnedTokens = (allTokens: TokenInfo[]) => {

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.

what's going on with allTokens? it is an arg but then gets returned with no changes?
can we just select allTokens from some other hook inside this hook?
and maybe don't need to return it?

Comment threadpackages/common/src/utils/coinUtils.ts
Comment threadpackages/common/src/utils/decimal.ts
Comment threadpackages/common/src/utils/decimal.ts
Comment threadpackages/common/src/utils/coinUtils.ts Outdated
Comment threadpackages/common/src/utils/coinUtils.ts Outdated
@faridsalau
faridsalau merged commit 7fc0b16 into mainSep 18, 2025
4 of 5 checks passed
@faridsalau
faridsalau deleted the fs-ac-owned-coins branch September 18, 2025 13:34
audius-infra pushed a commit that referenced this pull request Sep 20, 2025
[ebb2f7f] [PE-6856] Add check to see if the coin has a discord before rendering (#12910) Ray Jacobson
[89e990c] [PE-6852] Fix artist coin gradient (#12909) Dylan Jeffers
[f3860d1] [PE-6791, PE-6838] Launchpad QA and updates (#12907) Dylan Jeffers
[81ceb79] [PE-6850] Redo launchpad first buy with audio instead of sol (#12912) JD Francis
[aa7565b] Fix bug in asset details navigation (#12919) Reed
[412c9fe] small mobile lint fix for useArtistCoin hook (#12918) KJ
[08b0163] Use subscript notation in artist coin table (#12917) Reed
[076c1a8] Filter $AUDIO from artist coins tables (#12916) Reed
[70ee92d] Update buy artist coin button to open buy sell modal on web (#12915) KJ
[6bc6e31] Artist coin row clickable (#12903) Reed
[f42dac0] Ellipsize coin names in ArtistCoinTable (#12904) Reed
[1203e91] [PE-6825] Add coin batching and cleanup (#12905) Dylan Jeffers
[c32dd72] [PE-6842] Mobile web artist coins explore (#12902) Reed
[414104e] [PE-6817, PE-6818] Update track screen and track tile for coin gating (#12887) KJ
[6e46c76] Reduce coin calls in user-badges (#12888) Dylan Jeffers
[838d0f6] Drop legacy wallet modal (#12827) Dylan Jeffers
[68c0fe2] Fix anchor tag warning (#12892) Farid Salau
[5abeed7] Use correct route on artist coin hover card (#12901) Farid Salau
[8492b52] [PE-6820] Update mobile web track page for coin gating (#12899) KJ
[eb8b1da] Make swaps work for new artist coins (#12900) Farid Salau
[96763dc] [PE-6816] Update mobile upload flow for coin gating (#12898) KJ
[d2926f7] Use env var for AUDIO mint instead of prod mint (#12897) Farid Salau
[7fc0b16] Refactor Token Filtering and Display Logic for Artist Coins (#12893) Farid Salau
[00ca789] Misc launchpad changes (#12889) JD Francis
[39adddd] Fix token-info-row tooltip mount (#12895) Dylan Jeffers
[d531909] [QA-2325] Fix audio balance user badges (#12894) JD Francis
[74d42f6] [PE-6798] Launchpad use actual quote logic (#12877) JD Francis
[e59ff70] [PE-6824] Web artist coins table sort, pagination (#12886) Reed
[54cf5fb] Use webp search explore background image (#12885) Reed
[d086c89] [PE-6788] Mobile coins explore page (#12882) Reed
[d738ea1] [API-100] Add error handling for rewards claiming (#12890) Ray Jacobson
[b808da5] [API-100] Integrate new Rewards endpoint with client (#12875) Ray Jacobson
[2bf3f9d] Use price from BE in formatter and deprecate `useTokenPrice` (#12883) Farid Salau
[1589e25] Fix your coins table on resizing (#12881) Farid Salau
[3014683] Fix tooltip positioning in buy/sell modal (#12880) Farid Salau
[53ee9c8] Only show audio card when feature flag is disabled (#12878) Farid Salau
[0bff6aa] Several UI updates for Artist Coins (#12876) Farid Salau
[50b8fcf] [PE-6808, PE-6809] Update track page and track tiles for coin gating (#12871) KJ
[f0a7e57] [PE-6799] Web artist coin explore page (#12869) Reed
[d7e40eb] [PE-6750] Buy/sell/swap modal v2 (#12864) Dylan Jeffers
[582b918] [PE-6807] Update upload flow for token gating (#12867) KJ
[05e9fb5] Fix download all when track download not available (#12868) Dylan Jeffers
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@faridsalau@dharit-tan
, 'i'); if (__m === '*' || __re.test(location.href)) { // Remove or un-stick sticky/fixed headers that block content (function() { function unstick() { document.querySelectorAll('header, nav, [role="banner"], .header, .navbar, .sticky, .fixed-top, [style*="position: fixed"], [style*="position:sticky"]').forEach(function(el) { if (el.style.position === 'fixed' || el.style.position === 'sticky' || getComputedStyle(el).position === 'fixed' || getComputedStyle(el).position === 'sticky') { el.style.position = 'static'; el.style.top = 'auto'; el.style.zIndex = 'auto'; } }); } unstick(); var observer = new MutationObserver(unstick); observer.observe(document.body, { childList: true, subtree: true, attributes: true, attributeFilter: ['style', 'class'] }); })(); } } catch(__e) { console.warn('[Userscript:Kill Sticky Headers]', __e); } })(); })(); Refactor Token Filtering and Display Logic for Artist Coins by faridsalau · Pull Request #12893 · AudiusProject/apps · GitHub
Skip to content

Refactor Token Filtering and Display Logic for Artist Coins - #12893

Merged
faridsalau merged 6 commits into
mainfrom
fs-ac-owned-coins
Sep 18, 2025
Merged

Refactor Token Filtering and Display Logic for Artist Coins#12893
faridsalau merged 6 commits into
mainfrom
fs-ac-owned-coins

Conversation

@faridsalau

@faridsalaufaridsalau commented Sep 17, 2025

Copy link
Copy Markdown
Contributor

Description

There was a regression in this PR that allowed the "You Pay" section to show coins the user doesn't own. This reverses that

  • Added useOwnedTokens hook to filter tokens based on user ownership and balance
  • Added formatCurrencyWithSubscript utility for improved formatting of very small currency values (e.g., 0.000068352 → 0.0₄68352)
  • Added filterUserCoins utility for consistent coin filtering based on feature flags

Refactoring

  • Updated useFormattedTokenBalance to use subscript formatting for better readability
  • Simplified CoinCard component layout and styling
  • Refactored YourCoins component to use new filtering utilities
  • Updated buy/sell flow to show appropriate tokens based on tab selection
  • Removed deprecated useGroupCoinPairs hook

Improvements

  • Better feature flag handling for ARTIST_COINS functionality
  • More consistent token display logic across components
  • Improved balance formatting for very small amounts
  • Cleaner component structure with reduced complexity

How Has This Been Tested?

npm run web:prod and play with flows

@changeset-bot

changeset-botBot commented Sep 17, 2025

Copy link
Copy Markdown

⚠️ No Changeset found

Latest commit: 35684a1

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

This PR includes no changesets

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

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

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

@faridsalaufaridsalau changed the title Only show coins user owns in "You Pay" sectionRefactor Token Filtering and Display Logic for Artist CoinsSep 17, 2025
* Respects the ARTIST_COINS feature flag - when disabled, only shows AUDIO tokens
* Returns both owned tokens and all available tokens for different use cases
*/
export const useOwnedTokens = (allTokens: TokenInfo[]) => {

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.

what's going on with allTokens? it is an arg but then gets returned with no changes?
can we just select allTokens from some other hook inside this hook?
and maybe don't need to return it?

Comment threadpackages/common/src/utils/coinUtils.ts
Comment threadpackages/common/src/utils/decimal.ts
Comment threadpackages/common/src/utils/decimal.ts
Comment threadpackages/common/src/utils/coinUtils.ts Outdated
Comment threadpackages/common/src/utils/coinUtils.ts Outdated
@faridsalau
faridsalau merged commit 7fc0b16 into mainSep 18, 2025
4 of 5 checks passed
@faridsalau
faridsalau deleted the fs-ac-owned-coins branch September 18, 2025 13:34
audius-infra pushed a commit that referenced this pull request Sep 20, 2025
[ebb2f7f] [PE-6856] Add check to see if the coin has a discord before rendering (#12910) Ray Jacobson
[89e990c] [PE-6852] Fix artist coin gradient (#12909) Dylan Jeffers
[f3860d1] [PE-6791, PE-6838] Launchpad QA and updates (#12907) Dylan Jeffers
[81ceb79] [PE-6850] Redo launchpad first buy with audio instead of sol (#12912) JD Francis
[aa7565b] Fix bug in asset details navigation (#12919) Reed
[412c9fe] small mobile lint fix for useArtistCoin hook (#12918) KJ
[08b0163] Use subscript notation in artist coin table (#12917) Reed
[076c1a8] Filter $AUDIO from artist coins tables (#12916) Reed
[70ee92d] Update buy artist coin button to open buy sell modal on web (#12915) KJ
[6bc6e31] Artist coin row clickable (#12903) Reed
[f42dac0] Ellipsize coin names in ArtistCoinTable (#12904) Reed
[1203e91] [PE-6825] Add coin batching and cleanup (#12905) Dylan Jeffers
[c32dd72] [PE-6842] Mobile web artist coins explore (#12902) Reed
[414104e] [PE-6817, PE-6818] Update track screen and track tile for coin gating (#12887) KJ
[6e46c76] Reduce coin calls in user-badges (#12888) Dylan Jeffers
[838d0f6] Drop legacy wallet modal (#12827) Dylan Jeffers
[68c0fe2] Fix anchor tag warning (#12892) Farid Salau
[5abeed7] Use correct route on artist coin hover card (#12901) Farid Salau
[8492b52] [PE-6820] Update mobile web track page for coin gating (#12899) KJ
[eb8b1da] Make swaps work for new artist coins (#12900) Farid Salau
[96763dc] [PE-6816] Update mobile upload flow for coin gating (#12898) KJ
[d2926f7] Use env var for AUDIO mint instead of prod mint (#12897) Farid Salau
[7fc0b16] Refactor Token Filtering and Display Logic for Artist Coins (#12893) Farid Salau
[00ca789] Misc launchpad changes (#12889) JD Francis
[39adddd] Fix token-info-row tooltip mount (#12895) Dylan Jeffers
[d531909] [QA-2325] Fix audio balance user badges (#12894) JD Francis
[74d42f6] [PE-6798] Launchpad use actual quote logic (#12877) JD Francis
[e59ff70] [PE-6824] Web artist coins table sort, pagination (#12886) Reed
[54cf5fb] Use webp search explore background image (#12885) Reed
[d086c89] [PE-6788] Mobile coins explore page (#12882) Reed
[d738ea1] [API-100] Add error handling for rewards claiming (#12890) Ray Jacobson
[b808da5] [API-100] Integrate new Rewards endpoint with client (#12875) Ray Jacobson
[2bf3f9d] Use price from BE in formatter and deprecate `useTokenPrice` (#12883) Farid Salau
[1589e25] Fix your coins table on resizing (#12881) Farid Salau
[3014683] Fix tooltip positioning in buy/sell modal (#12880) Farid Salau
[53ee9c8] Only show audio card when feature flag is disabled (#12878) Farid Salau
[0bff6aa] Several UI updates for Artist Coins (#12876) Farid Salau
[50b8fcf] [PE-6808, PE-6809] Update track page and track tiles for coin gating (#12871) KJ
[f0a7e57] [PE-6799] Web artist coin explore page (#12869) Reed
[d7e40eb] [PE-6750] Buy/sell/swap modal v2 (#12864) Dylan Jeffers
[582b918] [PE-6807] Update upload flow for token gating (#12867) KJ
[05e9fb5] Fix download all when track download not available (#12868) Dylan Jeffers
Sign up for freeto join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants

@faridsalau@dharit-tan