As part of the Section translation workflow (T243495), allow users to pick a section to translate for a given article in two languages.
[[ https://pauginer.github.io/prototypes/translation/sections/dash-mob/#SectionSelector | View this step in prototype ]] for a general overview.
# General concept
Selecting a section to translate is the first step of the workflow. At this point, the article and language pairs are known, determined by different entry points in different ways. At this step the users are provided a menu with the sections for them to translate, and contextual information they may need to make a decision.
|Overview| Layout diagram|Layout detail|
|---|---|---|
|{F31714508, size=full}|{F31714515, size=full}|{F31714517, size=full}|
Users are provided a list of sections for them to pick one to translate:
- The sections of the source article are shown in a menu. The sections are grouped, based on whether they are present or not in the target article.
-- Selecting a section will lead the user to preview the contents (supported as a separate ticket: {T241589}). Until the preview step is supported, it is ok to lead directly to the translation editor.
-- Initially a basic approach (T243430) will be used for section mapping, until a more advanced one (T224234) is supported.
- The solution will be responsive to support both mobile and desktop devices.
Below are described in more detail the different pieces supporting this step.
# Header
|{F31771594, size=full}|{F31771596, size=full}|
Header instructions:
> **Select a section to translate**
> Next you’ll see the section contents to decide what to translate.
# Language Selector
|{F31714543, size=full}|{F31714546, size=full}|
The language selector follows a different design on narrower screens using the whole width to get additional space.
# Lists of sections
|{F31714548, size=full}|{F31714550, size=full}|{F31714554, size=full}|
List titles:
> Sections missing in {Source Language}
> Sections present in {Target Language]
# Access to the source and target pages
|{F31714642, size=full}|{F31714644, size=full}|
# Additional considerations about possible issues
|{F31714646, size=full}|{F31714648, size=full}|
Block messages:
> **Automatic section matching **
> Sections are identified automatically and the results are not always accurate.
> [Learn more]
>
>
> **Unsupported sections**
> Some sections may not appear in the list because their contents are not supported yet.
> [Learn more]
# Navigation and transitions to other steps
|{F31742893, size=full}|{F31742895, size=full}|
___
This ticket is focused on the section selection step. Other tickets will provide support for previous steps such as entry points (T241590, T241591, T239699) and following steps such as previewing the section contents (T241589).