Skip to content

Commit 31e24f1

Browse files
committed
[MNY-331] SDK: Alphabetically sort chains in SwapWidget UI (#8551)
<!-- ## title your PR with this format: "[SDK/Dashboard/Portal] Feature/Fix: Concise title for the changes" If you did not copy the branch name from Linear, paste the issue tag here (format is TEAM-0000): ## Notes for the reviewer Anything important to call out? Be sure to also clarify these in your comments. ## How to test Unit tests, playground, etc. --> <!-- start pr-codex --> --- ## PR-Codex overview This PR focuses on improving the `SwapWidget` UI by alphabetically sorting the chains returned by the `use-bridge-chains.ts` module, ensuring that chains with names starting with numbers are placed at the end of the list. ### Detailed summary - Updated the `queryFn` in `use-bridge-chains.ts` to be asynchronous. - Introduced a copy of the fetched data to sort it. - Implemented sorting logic to place chains starting with numbers at the end. - Used `localeCompare` for alphabetical sorting of chain names. > ✨ Ask PR-Codex anything about this PR by commenting with `/codex {your question}` <!-- end pr-codex --> <!-- This is an auto-generated comment: release notes by coderabbit.ai --> ## Summary by CodeRabbit * **New Features** * Chains in the SwapWidget are now alphabetically sorted for improved navigation; chain names beginning with digits appear after alphabetic entries. * **Chores** * Patch release entry added to the changelog. <sub>✏️ Tip: You can customize this high-level summary in your review settings.</sub> <!-- end of auto-generated comment: release notes by coderabbit.ai -->
1 parent 2bb6a4f commit 31e24f1

File tree

2 files changed

+24
-2
lines changed

2 files changed

+24
-2
lines changed

.changeset/ninety-trains-tell.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"thirdweb": patch
3+
---
4+
5+
Alphabetically sort the chains in SwapWidget UI

packages/thirdweb/src/react/web/ui/Bridge/swap-widget/use-bridge-chains.ts

Lines changed: 19 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,25 @@ import type { ThirdwebClient } from "../../../../../client/client.js";
55
export function useBridgeChains(client: ThirdwebClient) {
66
return useQuery({
77
queryKey: ["bridge-chains"],
8-
queryFn: () => {
9-
return chains({ client });
8+
queryFn: async () => {
9+
const data = await chains({ client });
10+
const dataCopy = [...data];
11+
// sort by name, but if name starts with number, put it at the end
12+
13+
return dataCopy.sort((a, b) => {
14+
const aStartsWithNumber = a.name[0]?.match(/^\d/);
15+
const bStartsWithNumber = b.name[0]?.match(/^\d/);
16+
17+
if (aStartsWithNumber && !bStartsWithNumber) {
18+
return 1;
19+
}
20+
21+
if (!aStartsWithNumber && bStartsWithNumber) {
22+
return -1;
23+
}
24+
25+
return a.name.localeCompare(b.name);
26+
});
1027
},
1128
refetchOnMount: false,
1229
refetchOnWindowFocus: false,

0 commit comments

Comments
 (0)