How to display complete information about the selected object by clicking on the search result?

Question

React

There is a customer database in the form of a json file. It is required to create a search form for this database with the output of cards with brief information about the clients found. A similar implementation is https://react.semantic-ui.com/modules/search/#type...
By clicking on one of the cards with brief information, a card with full information (from the same database) about the selected client should be displayed. In this case, the rest of the search results disappear, and only the search form and a card with full information about the selected client remain.
For implementation, use the React / Redux stack and preferably the Reselect
library. I have already created a working search form with brief information output, but I just can’t implement the second phase - displaying full information about the client by clicking on the search result.
Here is the current result of my work https://codesandbox.io/s/4qxlnlpqww

Answer 1

Didn't see redux in your implementation.
You need to add two fields to the store: a list of customers and an active customer.
As long as your active client is null, we show the list of clients.
When clicking on a client, we add an object from the list of all clients to the "active client" field and display information on it.
Accordingly, we keep the client list and active client fields in selectors, for this we use Reselect