feat(picker): lead the flag list with the 48 World Cup 26 teams (#54)#65
Merged
Merged
Conversation
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.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
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.
searchCountriesranks 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 arerole="presentation"— outside the listbox's index space, impossible to land on. I drove it in a real browser to confirm: headers render,ArrowDownstill 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.