Show the user's city on the account page
React · React · intermediate · greenfield
Adds the city line to the account page. Reads it from the user's profile and falls back to 'No city set' when the city is empty. Renders correctly for the accounts I checked.
Roughly a third of users skip the optional onboarding step, so their profile is null.
Requirements
- Show the user's city under their name on the account page.
- The profile is optional: a user who skipped onboarding has `profile` set to null.
- When there is no city, show 'No city set'.
Files touched
- src/components/AccountCity.jsx
--- src/components/AccountCity.jsx
+export function AccountCity({ user }) {
+ const city = user.profile.city;
+ return (
+ <p className="city">
+ {city ? city : 'No city set'}
+ </p>
+ );
+}