fix: make WalletConnect network selection list scrollable

[premiumjibles]

Description

The network list in the WalletConnect "Choose Network" modal was overflowing without scrollability when many chains were available (e.g. 15+ networks). Added overflowY='auto' and minH={0} to the list container so it scrolls within the modal bounds instead of clipping.

Risk

Low — CSS-only change to a single component. No logic, transaction, or wallet interaction changes.

No protocols, transaction types, wallets or contract interactions are affected.

Testing

Engineering

1. Connect a WalletConnect dApp that requests many chains
2. Observe the "Choose Network" modal now scrolls instead of overflowing
3. Verify the "Done" button remains visible and sticky at the bottom

Operations

• 🏁 My feature is behind a flag and doesn't require operations testing (yet)

Connect any WalletConnect dApp and verify the network selection list scrolls properly when there are many networks.

Screenshots (if applicable)

🤖 Generated with Claude Code

Summary by CodeRabbit

• Bug Fixes
  • Fixed layout issues in the network selection modal including improved container sizing and vertical scrolling functionality, enabling smoother navigation through network options and enhancing overall usability when managing multiple networks.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 4726b167-cd67-4562-b1b3-c1a7de2ca0e1

📥 Commits

Reviewing files that changed from the base of the PR and between 71777c4 and 4ab583a.

📒 Files selected for processing (1)

• src/plugins/walletConnectToDapps/components/modals/NetworkSelection.tsx

---

📝 Walkthrough

Walkthrough

A layout refinement to the NetworkSelection modal component adjusts flex container behavior and enables vertical scrolling for the network list by adding minH={0} and overflow properties to container elements.

Changes

Cohort / File(s)	Summary
Layout & Scroll Enhancements src/plugins/walletConnectToDapps/components/modals/NetworkSelection.tsx	Added flex={1} and minH={0} to outer vertical stack for proper flex growth; added minH={0} and overflowY='auto' to inner vertical stack to enable vertical scrolling for network list.

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

Poem

🐰 A hop through flex and scroll so fine,
The networks now in columns align,
With minH zero and overflow's grace,
The list finds its perfect space!
✨

🚥 Pre-merge checks | ✅ 3

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title directly and accurately reflects the main change: making the WalletConnect network selection list scrollable by adding overflow and flex constraints to layout.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

• 📝 Generate docstrings (stacked PR)
• 📝 Generate docstrings (commit on current branch)

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch fix/wc-network-selection-scroll

📝 Coding Plan

• Generate coding plan for human review comments

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[NeOMakinG]

✅ QA Approved

Verification:

• Code reviewed: NetworkSelection.tsx line 251 correctly adds minH={0} and overflowY='auto' to the VStack containing network options
• This is a CSS-only change that enables scrolling when many networks are available
• No logic, transaction, or wallet interaction changes

Risk: Low - CSS properties only

Testing notes: The WalletConnect network selection modal with many chains (15+) will now scroll properly instead of overflowing. The "Done" button remains visible at the bottom.

🤖 Automated QA by OpenClaw

[gomesalexandre]

CSS fix looks clean and correct ser 👌

The minH={0} is the key move here - flexbox default min-height: auto prevents children from shrinking below content size, which is what causes the overflow. Setting it to 0 lets the container shrink, then overflowY='auto' handles the rest with a scrollbar. "Done" button stays sticky in its own <Box> outside the scroll container.

Two lines, low risk, does what it says on the box.