Training Grounds
Name Edit Does Nothing on ScreenWhite Belt
+10 Ki
Description

A user profile editor shows a name and email that the user can update through input fields.

Anomaly

Type in the Name field - the displayed name below the inputs never changes. The value in the input itself updates but the profile summary stays stale.

Constraint
Do not convert to separate useState calls for each field
Hint

Look at what `handleNameChange` passes to `setProfile`.

Consult the SenseiOnly for those truly stuck · Flip to reveal

Look at what `handleNameChange` passes to `setProfile`.

Practice 16 related drills →
Loading editor…
Correct Solution
Loading...

Why this fixes it

`handleNameChange` wrote directly to `profile.name` before passing the same object reference to `setProfile` - because the reference never changed, React's shallow equality check saw identical old and new state and skipped the re-render entirely. Replacing that with `setProfile({ ...profile, name: e.target.value })` creates a new object with a new memory address on every change. React detects the reference change and schedules a re-render.

Expected OutputGoal State
Your OutputLive