React State Patterns You Will Use Every Day

Prefer derived state

If a value can be computed from existing state or props, do not store it in another useState.

const [items, setItems] = useState([]);
const total = items.length; // derived

Lift state only when needed

Lift state to the nearest shared parent when two siblings must stay in sync. Otherwise keep it local.