bug: Profile Mailing Address — State/Province field appears blank because Country must be selected first, but Country comes after State in the form
#114
In the Profile > Mailing Address section, the State/Province dropdown renders blank (empty) when the user first arrives at the form. This is because the State dropdown is populated dynamically based on the selected Country, but the Country field is positioned below the State field in the form layout.
The user encounters the fields in top-to-bottom order:
Street Address
Street Address 2
City | State/Province ← blank, no options
Postal Code | Country ← must be selected first to populate State
This is confusing — the user reaches State before Country and has no way to fill it without scrolling past it, selecting a country, then scrolling back up.
Expected behavior
Either:
Move Country above State/Province (or above the City/State row entirely) so the user naturally selects the country first and the state dropdown is already populated by the time they reach it, OR
Default the Country field to a sensible value (e.g. the user's existing saved country, or inferred from locale/IP) so State is pre-populated on load, OR
Show all states/provinces across all countries in the State dropdown initially (grouped by country header) and auto-filter once a country is selected.
The first option (reorder Country above State) is the simplest fix and matches the convention most address forms use (Country → State → City → Street → Postal).
Steps to reproduce
Navigate to Profile settings.
Scroll to the Mailing Address section.
Observe that State/Province is blank/empty with no selectable options.
Select a Country (e.g. "United States") — State/Province then populates.
Screenshot
(State shows "Nebraska" in the screenshot because a country was already selected in this session, but on a fresh load without a saved country it renders empty.)
## Problem
In the Profile > Mailing Address section, the **State/Province** dropdown renders blank (empty) when the user first arrives at the form. This is because the State dropdown is populated dynamically based on the selected **Country**, but the Country field is positioned _below_ the State field in the form layout.
The user encounters the fields in top-to-bottom order:
1. Street Address
2. Street Address 2
3. City | **State/Province** ← blank, no options
4. Postal Code | **Country** ← must be selected first to populate State
This is confusing — the user reaches State before Country and has no way to fill it without scrolling past it, selecting a country, then scrolling back up.
## Expected behavior
Either:
- **Move Country above State/Province** (or above the City/State row entirely) so the user naturally selects the country first and the state dropdown is already populated by the time they reach it, OR
- **Default the Country field** to a sensible value (e.g. the user's existing saved country, or inferred from locale/IP) so State is pre-populated on load, OR
- **Show all states/provinces across all countries** in the State dropdown initially (grouped by country header) and auto-filter once a country is selected.
The first option (reorder Country above State) is the simplest fix and matches the convention most address forms use (Country → State → City → Street → Postal).
## Steps to reproduce
1. Navigate to Profile settings.
2. Scroll to the Mailing Address section.
3. Observe that State/Province is blank/empty with no selectable options.
4. Select a Country (e.g. "United States") — State/Province then populates.
## Screenshot

_(State shows "Nebraska" in the screenshot because a country was already selected in this session, but on a fresh load without a saved country it renders empty.)_
The Mailing Address form was reordered to the conventional Country -> City/State -> Postal Code layout. Country now sits above State/Province, so the country-driven State list is populated by the time the user reaches it (no more blank dropdown on first load). Template-only change in address-section.component.html; the country->availableStates wiring is unchanged.
Resolved in spikersoft-angular PR #31 (merged).
The Mailing Address form was reordered to the conventional **Country -> City/State -> Postal Code** layout. Country now sits above State/Province, so the country-driven State list is populated by the time the user reaches it (no more blank dropdown on first load). Template-only change in `address-section.component.html`; the country->`availableStates` wiring is unchanged.
Blocking a user prevents them from interacting with repositories, such as opening or commenting on pull requests or issues. Learn more about blocking a user.
Problem
In the Profile > Mailing Address section, the State/Province dropdown renders blank (empty) when the user first arrives at the form. This is because the State dropdown is populated dynamically based on the selected Country, but the Country field is positioned below the State field in the form layout.
The user encounters the fields in top-to-bottom order:
This is confusing — the user reaches State before Country and has no way to fill it without scrolling past it, selecting a country, then scrolling back up.
Expected behavior
Either:
The first option (reorder Country above State) is the simplest fix and matches the convention most address forms use (Country → State → City → Street → Postal).
Steps to reproduce
Screenshot
(State shows "Nebraska" in the screenshot because a country was already selected in this session, but on a fresh load without a saved country it renders empty.)
Resolved in spikersoft-angular PR #31 (merged).
The Mailing Address form was reordered to the conventional Country -> City/State -> Postal Code layout. Country now sits above State/Province, so the country-driven State list is populated by the time the user reaches it (no more blank dropdown on first load). Template-only change in
address-section.component.html; the country->availableStateswiring is unchanged.