I’m working on a React application where I have a component that displays a list of added equipment. I’m using context to manage the state of the added equipment. The issue I’m facing is that when I remove an item from the list, the UI doesn’t always update correctly.
Here’s a brief overview of the problem:

Bit stuck on this. I have a Main parent component that goes to a Search component which then goes to a Select component. The search asks for a city and then goes to an API and brings back 5 search results and i send them to the select component where I map the results into a selection form. Once the user selects the city and submits it i need the selection to be stored somewhere in the main so i can use it on other children. Any help is appreciated, still getting a handle on React.

I was told that I have been using too many states in my react project and that I should use computed state instead of using regular state but I am unable to understand what computed state really is, how to use it and when it is appropriate to use it and how it differs from regular state?