paulmataruso/zulip
1
0
Fork 0
mirror of https://github.com/zulip/zulip.git synced 2025-11-09 00:18:12 +00:00
Code Issues Packages Projects Releases Wiki Activity

default_language_modal: Add more space around languages displayed.

Browse Source 
We use 3 columns on wide screens and come down to 1 column on
narrow screens to ensure that the languages are properly
displayed.
This commit is contained in:
Aman Agrawal
2022-06-06 13:38:17 +00:00
committed by Tim Abbott
parent 084b054827
commit df6ad8154a
4 changed files with 70 additions and 114 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
static/js/i18n.ts
View File

@@ -78,61 +78,32 @@ export function initialize(language_params: {language_list: typeof language_list
}
}
// This formats language data for the language selection modal in a
// 2-column format.
type LanguageListColumn = {
[prop in "first" | "second"]?: {
code: string;
name: string;
name_with_percent: string;
selected: boolean;
};
type Language = {
code: string;
name: string;
name_with_percent: string;
selected: boolean;
};
export function get_language_list_columns(default_language: string): LanguageListColumn[] {
const formatted_list: LanguageListColumn[] = [];
const language_len = language_list.length;
const firsts_end = Math.floor(language_len / 2) + (language_len % 2);
const firsts = _.range(0, firsts_end);
const seconds = _.range(firsts_end, language_len);
const longest_zip: [number, number][] = [];
// Create a zip (itertools.zip_longest in python)
for (const value of firsts) {
longest_zip.push([value, seconds[value]]);
}
for (const row of longest_zip) {
const item: LanguageListColumn = {};
const zip_row = [
["first", row[0]],
["second", row[1]],
] as const;
for (const zip_value of zip_row) {
if (zip_value[1] !== undefined) {
const lang = language_list[zip_value[1]];
const name = lang.name;
let name_with_percent = name;
if (lang.percent_translated !== undefined) {
name_with_percent = `${name} (${lang.percent_translated}%)`;
}
let selected = false;
if (default_language === lang.code || default_language === lang.locale) {
selected = true;
}
item[zip_value[0]] = {
name,
code: lang.code,
name_with_percent,
selected,
};
}
export function get_language_list_columns(default_language: string): Language[] {
const formatted_list: Language[] = [];
for (const language of language_list) {
let name_with_percent = language.name;
if (language.percent_translated !== undefined) {
name_with_percent = `${language.name} (${language.percent_translated}%)`;
}
formatted_list.push(item);
let selected = false;
if (default_language === language.code || default_language === language.locale) {
selected = true;
}
formatted_list.push({
code: language.code,
name: language.name,
name_with_percent,
selected,
});
}
return formatted_list;
}