Skip to content
Aabha AI Academy
Skip to reading

React/TypeScript

Practice 04 · State ownership

In checkpoint 04, search for garden, then a padded uppercase version, then a term that does not occur. Draw the path from input event to state setter to next render to filtered cards. Identify which values are stored and which are derived. Inspect the supplied Clear search button and confirm it preserves the chosen category. Then add a distinct Reset filters button in your copy that clears the query and returns category to All categories.

B. Repair queued updates

A counter starts at zero. One click runs setCount(count + 1) three times. Predict the next rendered value. Repair it so a click adds three using three queued transformations. Explain why logging count immediately after a setter can still print the previous value.

C. Transfer

Add an “Only events with places” checkbox to a copy of checkpoint 04. Combine it with the existing search and category filters. Do not store a second filtered-results array. Show a useful zero-results message. Test each filter alone and all three together; explain why the checkbox state belongs where you placed it.

Completion evidence: state diagram, queue explanation, filter combinations and keyboard operation. Separate solutions.

Download this source file