VPN language list keeps changing when selecting certain languages

[data-sync-user]

Important details: 

• Issue occurs with a lot of different languages but mostly the ones that require the user to scroll halfway through the list;
• Having the VPN on LTR or RTL mode has no impact, the issue still reproduces;
• Not reproducing on Windows;

Affected versions:

• 2.13.0 (2.202212260749);
• 2.13.0 (2.13.0~nightly20221223-kinetic1)

Tested Platforms:

• MacOS 12.5.1;
• Linux 22.04 Jammy;

Prerequisites:

• Have a FxA account with an active subscription for Mozilla VPN;
• Have Mozilla VPN app installed and open;

Steps to reproduce:

1. Sign in and tap on “Settings”;
2. Go to System Preferences;
3. Select a language from the bottom of the list (e.g. Japanese);
4. Observe behavior;

Expected result:

• Radio button is checked and the list doesn’t suffer any other changes;

Actual result:

• Selected language is moved to the top of the list;

Notes:

• See attached video and logs;

┆Issue is synchronized with this Jira Bug ┆Reporter: Robert Vass

[data-sync-user]

➤ Santiago Andrigo commented:

Marking as High - very visible and likely frustrating / disconcerting for users.

[data-sync-user]

➤ Andrea Marchesini commented:

With Santiago we decided the following approach:

1. each language has 2 "values": the native language name and the localized language name. Native language name is a fix string. The localized one follows the language settings.
2. the language list is sorted by native language name

Implementation-wise I suggest this:

1. similarly to the country/city localization, the localized language names are fetch from wikidata via the SPARQL endpoint
2. this is done via script (included in this PR)
3. the strings are stored in a languages.json file that is included as a resource in the app
4. LanguageI18N is a component that uses languages.json to translate language codes.

[data-sync-user]

➤ Robert Vass commented:

Have re-tested using 2.13.0 (2.202301192209), which is the latest available and the issue still reproduces. From what I can see, the build appears to have failed.

Will re-test once we have the correct build.

[data-sync-user]

➤ Andrea Marchesini commented:

This is not landed in 2.13. It’s a 2.14 issue.

Please test it using the latest build from the main branch. Thanks!

[data-sync-user]

➤ Robert Vass commented:

Verified as fixed on Linux and MacOS using 2.14.0 (2.14.0~rc20230206185346-kinetic1) and 2.14.0 (2.202301312151). The language options are no longer changing positions upon selecting them.