Skip to content

feat(picker): lead the flag list with the 48 World Cup 26 teams (#54)#65

Merged
Younesfdj merged 2 commits into
Younesfdj:masterfrom
Amayyas:feat/wc26-qualified-teams
Jul 14, 2026
Merged

feat(picker): lead the flag list with the 48 World Cup 26 teams (#54)#65
Younesfdj merged 2 commits into
Younesfdj:masterfrom
Amayyas:feat/wc26-qualified-teams

Conversation

@Amayyas

@Amayyas Amayyas commented Jul 14, 2026

Copy link
Copy Markdown
Contributor

Closes #54.

What

Opening the flag picker landed you on Afghanistan, with your national team somewhere in the next 250 entries. gitfut is a World-Cup-26 app that had no idea which countries are actually in the World Cup.

Browsing now leads with a World Cup 26 block of the 48 qualified teams, then All countries below it.

Scope

As flagged in #54: the "pick your national team" part of that issue already existed (FlagPicker + ?country= + flagPriority), and the brackets/simulations part doesn't map to anything in the codebase. The genuine gap was that nothing knew the 48. That's all this does — the card itself is untouched. (Still happy to add a WC26 marker on the card if you want one; I left it out on purpose.)

Club leagues (@0xjuanma) stay out: they'd need crest assets and a new taxonomy, and shouldn't ride along with this.

Two things it deliberately does not do

It doesn't reorder a search. searchCountries ranks prefix matches above substring ones on purpose. Floating the qualified teams through that ranking surfaces Germany and Panama above Madagascar when you type "ma" — plainly wrong. Typing is the user steering; only the browse list is regrouped. There's a test pinning exactly this.

It doesn't nest the options. The combobox addresses its options by index for arrow keys and aria-activedescendant, so the list stays flat and the two headers are role="presentation" — outside the listbox's index space, impossible to land on. I drove it in a real browser to confirm: headers render, ArrowDown still walks option 0 → 1, and searching shows no headers.

The data

The 48 are cross-checked against two sources, including the three hosts and both inter-confederation play-off winners (Iraq, DR Congo). All 48 flags already ship — no new assets.

The codes are our flag keys, not ISO: England and Scotland are eng/sct (UK_NATIONS). That's the kind of thing a hand-written list gets wrong and nobody notices until a flag silently fails to render — so the tests treat the list as data. Every code must resolve to a real country and to a flag PNG that exists on disk, and the confederation quotas are pinned (AFC 9, CAF 10, CONCACAF 6, CONMEBOL 6, OFC 1, UEFA 16 = 48).

If a result gets corrected later, the tests tell you immediately which code broke.

Result

237 passed (+20), lint clean, build green. Two commits.

Amayyas added 2 commits July 14, 2026 17:52
gitfut is a World-Cup-26 app, but it has no idea which countries are
actually in the tournament: the flag list is a flat ISO dump of ~250. This
adds the 48, each with its confederation, plus the ordering helpers the
picker needs.

Codes are OUR flag asset keys, not ISO — England and Scotland are "eng" and
"sct" (countries.ts UK_NATIONS). That's exactly the kind of thing a
hand-written list gets wrong and nobody notices until a flag silently fails
to render, so the tests treat the list as data: every code must resolve to a
real country AND to a flag PNG that exists on disk. Confederation quotas are
pinned too (AFC 9, CAF 10, CONCACAF 6, CONMEBOL 6, OFC 1, UEFA 16 = 48).

The list is cross-checked against two sources and includes the three hosts
and both inter-confederation play-off winners (Iraq, DR Congo). All 48 flags
already ship, so no new assets.

qualifiedFirst() is a stable partition — it floats the qualified teams up
without scrambling the order they arrived in, which matters because
searchCountries has its own ranking to preserve.
Opening the flag picker landed you on Afghanistan, with your national team
somewhere in the next 250 entries. Browsing now leads with a "World Cup 26"
block of the 48, then "All countries" — so on a World-Cup app, the teams in
the World Cup are the ones you see first.

Two things this deliberately does NOT do:

- It doesn't reorder a SEARCH. searchCountries ranks prefix matches above
  substring ones on purpose, and floating the qualified teams through that
  would surface Germany and Panama above Madagascar for "ma". Typing is the
  user steering; only the browse list is regrouped (see flagPickerList).
- It doesn't nest the options. The combobox addresses its options by index
  for arrow keys and aria-activedescendant, so the list stays FLAT and the
  two group headers are role="presentation" — they sit outside the listbox's
  index space and can't be landed on. Verified in a browser: headers render,
  ArrowDown still walks option 0 → 1.
@Younesfdj
Younesfdj merged commit 4c7ebaa into Younesfdj:master Jul 14, 2026
1 check passed
@Amayyas
Amayyas deleted the feat/wc26-qualified-teams branch July 15, 2026 07:31
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add qualified nationals team of the wc2026

2 participants