...

/

Thunk Dispatch and Handling the UI Loading State

Thunk Dispatch and Handling the UI Loading State

Dispatching thunks and handing remote data loading state in a Redux toolkit application.

We'll cover the following...

Introduction

In the last section, we set up a thunk. Now we get to actually integrate it into the application UI.

Consider the current click handler for the search button:

const handleSearch = async () => {
    if (searchValue) {
      setSearchValue("");
      // note that the numberOfResults is hardcoded to ten(10)
      const data = await findTweets(searchValue, 10);
      setData(data);
    }
  };

findTweets is invoked and the data received is set to the local state. ...