Description

The PredictSearchOverlay component was triggering API requests for every character typed in the search input. This caused excessive network requests and poor UX.

Solution: Added a 200ms debounce to the search query using the existing useDebouncedValue hook, which is already used throughout the codebase for similar search functionality (Bridge, Card onboarding, Trending tokens, etc.).

Changes:

• Import and use useDebouncedValue hook in PredictSearchOverlay
• Pass debounced query to usePredictMarketData instead of raw search query
• Track debouncing state to show loading indicator during debounce period
• Combined isDebouncing and isFetching states for seamless loading UX

Changelog

CHANGELOG entry: Fixed search input triggering excessive API calls in Predictions

Related issues

Fixes: https://consensyssoftware.atlassian.net/browse/PRED-486

Manual testing steps

Feature: Debounced search in Predictions

  Scenario: user types in search field
    Given user has opened the Predictions feed
    And user has tapped the search button

    When user types "bitcoin" quickly
    Then only one API request is made after typing stops
    And skeleton loaders appear while debouncing
    And search results appear after debounce completes

Screenshots/Recordings

Before

API call triggered on every keystroke (network tab shows multiple requests)

After

Single API call after 200ms debounce delay

Pre-merge author checklist

• I've followed MetaMask Contributor Docs and MetaMask Mobile Coding Standards.
• I've completed the PR template to the best of my ability
• I've included tests if applicable
• I've documented my code using JSDoc format if applicable
• I've applied the right labels on the PR (see labeling guidelines). Not required for external contributors.

Pre-merge reviewer checklist

• I've manually tested the PR (e.g. pull and build branch, run the app, test code being changed).
• I confirm that this PR addresses all acceptance criteria described in the ticket it closes and includes the necessary testing evidence such as recordings and or screenshots.