How do I hide a load more button when data coming from api is empty using react and redux

Question

GitHub link : https://github.com/rakeshvora2007/github-search-using-react

I am able to create an action using SerachBar.js and send it to reducer and then displaying using UserGithubHandle.js, also I am sending an initial page for first user using searchBar.js.

After displaying the user I am able to show the loadmore button when clicked increments the page number and gets the next payload from api using function loadMoreUserFollower from ../actions/index.js which then passes the data to reducer which takes the previous data and new data and send it to UserFollower.js. Now the USerFollower.js dispplays the data.

Problem is once the data coming in has ended the loadMore button should not be displayed. How do I do it using react and redux pattern.

Answer 1

I found the solution.

When data is coming from reducer to UserFollower.js check for the size of data coming in and based on that setState of isHidden to true if incoming data is less than expected or else it is false. Load more button is displayed based on state of isHidden