Course lesson

Use Type Narrowing without early function returns with React Query

When handling your loading and error states, you don't always want to render a result in place of the entire component.

Duration
2 min
Access
Included
Transcript
Retained from source evidence

When handling your loading and error states, you don't always want to render a result in place of the entire component.

In our server-side search component, since we are making a new query when we update our input, the entire component re-renders, including the search input itself.

To fix this we'd move those conditional renders into a ternary inside the component render.