The new ORES topic models have a more extensive ontology than what we originally implemented for the `morelike` version in {T238610} and {T238612}.
In the `morelike` version we have 27 topics, and we show 12 by default, with the other 15 appearing when the user clicks "show more".
The way we will use the ORES ontology (as described in {T244192}) will give us 39 topics, and we have broken them into four headers. Therefore, below are specifications on how we want to change the topic selection experience in //both// the topic overlay and the topic filter dialog.
**Prototype**
This interactive prototype shows how the topic filter should behave with the new topics:
* [[ http://reetssydney.github.io/prototypes/newcomer-topics/index.html | English ]]
Though the prototype only shows the topic filter, the same changes should be made to the topic overlay, shown when the user initiates the suggested edits module.
And if we want to see how this will look in our target languages, there are also the analogous prototypes below, which are controlled by [[ https://docs.google.com/spreadsheets/d/1xI0MVrzwwwqwQ41YtivDZ69BIGXun2tlSD-JNa4Nl08/edit#gid=1286844945 | this spreadsheet ]] (which initially has Google Translate translations, but can be altered by our ambassadors if we wish):
* [[ http://reetssydney.github.io/prototypes/newcomer-topics/index-ar.html | Arabic ]]
* [[ http://reetssydney.github.io/prototypes/newcomer-topics/index-cs.html | Czech ]]
* [[ http://reetssydney.github.io/prototypes/newcomer-topics/index-ko.html | Korean ]]
* [[ http://reetssydney.github.io/prototypes/newcomer-topics/index-vi.html | Vietnamese ]]
**Specifications**
* The topic pill buttons should be organized under four headers, in this order (regardless of language):
** Culture
** History and Society
** Science, Technology, and Math
** Geography
* Under each header, the relevant topic pills should be shown alphabetized, according to alphabetization of the language.
* We should implement the "select all" and "deselect all" links that are shown in the mockup. If there are no buttons selected under a header, the link should read "select all". If there are any selected, it should read "remove all". Note that this language is slightly different than what is shown in the mockup.
* These additions will require the topic overlay and the topic filter dialog to be scrollable on both desktop and mobile.
* The topic overlay and topic filter dialog mock should be the same fixed height as each other, and as the difficulty overlay. To display more content than fits, the contents should scroll within the dialog as can be seen in the **Search widget** and **Continuous outlined booklet** dialogs on the [[ https://doc.wikimedia.org/oojs-ui/master/demos/?page=dialogs&theme=wikimediaui&direction=ltr&platform=desktop | OOUI demo page ]].