Add 300ms debounce to the token contract address search field

[Lakes41]

Difficulty: Intermediate
Type: performance, UI/UX

Background

In the Swap modal, users can paste custom token contract addresses to import unverified assets. The app validates these addresses against an RPC provider.

Problem

The input field triggers an RPC verification call on every single keystroke. When a user pastes or types quickly, this spams the RPC node, causing UI lag and potential rate limits.

Expected outcome

The input validation and subsequent RPC network request are wrapped in a 300ms debounce, ensuring only the final intended string is processed.

Suggested implementation

1. Use a custom hook like useDebounce(value, delay) or a library like lodash.debounce.
2. Delay the state update that triggers the useEffect checking the token validity.
3. Display a subtle loading spinner inside the input field while the debounced validation is pending.

Acceptance criteria

• Typing rapidly does not trigger multiple network requests.
• Pasting an address resolves within a reasonable timeframe (300ms + network delay).
• UI feedback clearly indicates when a search is processing.

Likely affected files/directories

• src/components/Swap/TokenSearchModal.tsx

Requirements

• Do not break standard ERC20 symbol searches (which search the localized cache instead of hitting RPC).

[subheeksh5599]

lemme do it