Standardize display of common + native languages list

This commit is contained in:
Lim Chee Aun 2024-08-16 19:17:57 +08:00
parent 6d68232e45
commit 18b3ee8c92
5 changed files with 109 additions and 75 deletions

View file

@ -1439,10 +1439,10 @@ function Compose({
code,
fallback: common,
});
const same = commonText === native;
const showCommon = commonText !== native;
return (
<option value={code} key={code}>
{same ? commonText : `${commonText} (${native})`}
{showCommon ? `${native} - ${commonText}` : commonText}
</option>
);
})}
@ -1452,10 +1452,10 @@ function Compose({
code,
fallback: common,
});
const same = commonText === native;
const showCommon = commonText !== native;
return (
<option value={code} key={code}>
{same ? commonText : `${commonText} (${native})`}
{showCommon ? `${native} - ${commonText}` : commonText}
</option>
);
})}

View file

@ -1,4 +1,5 @@
import { useLingui } from '@lingui/react';
import { useMemo } from 'preact/hooks';
import { DEFAULT_LANG, LOCALES } from '../locales';
import { activateLang } from '../utils/lang';
@ -7,6 +8,28 @@ import localeCode2Text from '../utils/localeCode2Text';
export default function LangSelector() {
const { i18n } = useLingui();
const populatedLocales = useMemo(() => {
return LOCALES.map((lang) => {
const native = localeCode2Text({ code: lang, locale: lang });
const common = localeCode2Text(lang);
const showCommon = !!common && common !== native;
return {
code: lang,
native,
common,
showCommon,
};
}).sort((a, b) => {
// If pseudo-LOCALE, always put it at the bottom
if (a.code === 'pseudo-LOCALE') return 1;
if (b.code === 'pseudo-LOCALE') return -1;
// Sort by code
if (a.code < b.code) return -1;
if (a.code > b.code) return 1;
return 0;
});
}, [i18n.locale]);
return (
<label class="lang-selector">
🌐{' '}
@ -18,23 +41,20 @@ export default function LangSelector() {
activateLang(e.target.value);
}}
>
{LOCALES.map((lang) => {
if (lang === 'pseudo-LOCALE') {
{populatedLocales.map(({ code, native, common, showCommon }) => {
if (code === 'pseudo-LOCALE') {
return (
<>
<hr />
<option value={lang} key={lang}>
<option value={code} key={code}>
Pseudolocalization (test)
</option>
</>
);
}
const native = localeCode2Text({ code: lang, locale: lang });
const common = localeCode2Text(lang);
const showCommon = !!common && common !== native;
return (
<option value={lang} key={lang}>
{showCommon ? `${native} (${common})` : native}
<option value={code} key={code}>
{showCommon ? `${native} - ${common}` : native}
</option>
);
})}

View file

@ -206,19 +206,26 @@ function TranslationBlock({
translate();
}}
>
{sourceLanguages.map((l) => (
{sourceLanguages.map((l) => {
const common = localeCode2Text({
code: l.code,
fallback: l.name,
});
const native = localeCode2Text({
code: l.code,
locale: l.code,
});
const showCommon = common !== native;
return (
<option value={l.code}>
{l.code === 'auto'
? t`Auto (${detectedLang ?? '…'})`
: `${localeCode2Text({
code: l.code,
fallback: l.name,
})} (${localeCode2Text({
code: l.code,
locale: l.code,
})})`}
: showCommon
? `${native} - ${common}`
: native}
</option>
))}
);
})}
</select>{' '}
<span> {targetLangText}</span>
<Loader abrupt hidden={uiState !== 'loading'} />

View file

@ -194,7 +194,7 @@ msgstr ""
#: src/pages/catchup.jsx:72
#: src/pages/catchup.jsx:1414
#: src/pages/catchup.jsx:2035
#: src/pages/settings.jsx:1008
#: src/pages/settings.jsx:1015
msgid "Boosts"
msgstr ""
@ -858,7 +858,7 @@ msgid "Error loading GIFs"
msgstr ""
#: src/components/drafts.jsx:63
#: src/pages/settings.jsx:664
#: src/pages/settings.jsx:671
msgid "Unsent drafts"
msgstr ""
@ -1242,7 +1242,7 @@ msgstr ""
#: src/pages/home.jsx:223
#: src/pages/mentions.jsx:20
#: src/pages/mentions.jsx:167
#: src/pages/settings.jsx:1000
#: src/pages/settings.jsx:1007
#: src/pages/trending.jsx:347
msgid "Mentions"
msgstr ""
@ -1297,7 +1297,7 @@ msgstr ""
#: src/pages/catchup.jsx:2029
#: src/pages/favourites.jsx:11
#: src/pages/favourites.jsx:23
#: src/pages/settings.jsx:1004
#: src/pages/settings.jsx:1011
msgid "Likes"
msgstr ""
@ -2284,7 +2284,7 @@ msgid "<0/> <1/> boosted"
msgstr ""
#: src/components/timeline.jsx:447
#: src/pages/settings.jsx:1028
#: src/pages/settings.jsx:1035
msgid "New posts"
msgstr ""
@ -2322,11 +2322,11 @@ msgstr ""
msgid "Translate from {sourceLangText}"
msgstr ""
#: src/components/translation-block.jsx:212
#: src/components/translation-block.jsx:222
msgid "Auto ({0})"
msgstr ""
#: src/components/translation-block.jsx:228
#: src/components/translation-block.jsx:235
msgid "Failed to translate"
msgstr ""
@ -3081,7 +3081,7 @@ msgid "{0, plural, one {Announcement} other {Announcements}}"
msgstr ""
#: src/pages/notifications.jsx:599
#: src/pages/settings.jsx:1016
#: src/pages/settings.jsx:1023
msgid "Follow requests"
msgstr ""
@ -3336,152 +3336,152 @@ msgstr ""
msgid "{0, plural, =0 {Hide \"Translate\" button for:} other {Hide \"Translate\" button for (#):}}"
msgstr ""
#: src/pages/settings.jsx:451
#: src/pages/settings.jsx:458
msgid "Note: This feature uses external translation services, powered by <0>Lingva API</0> & <1>Lingva Translate</1>."
msgstr ""
#: src/pages/settings.jsx:485
#: src/pages/settings.jsx:492
msgid "Auto inline translation"
msgstr ""
#: src/pages/settings.jsx:489
#: src/pages/settings.jsx:496
msgid "Automatically show translation for posts in timeline. Only works for <0>short</0> posts without content warning, media and poll."
msgstr ""
#: src/pages/settings.jsx:509
#: src/pages/settings.jsx:516
msgid "GIF Picker for composer"
msgstr ""
#: src/pages/settings.jsx:513
#: src/pages/settings.jsx:520
msgid "Note: This feature uses external GIF search service, powered by <0>GIPHY</0>. G-rated (suitable for viewing by all ages), tracking parameters are stripped, referrer information is omitted from requests, but search queries and IP address information will still reach their servers."
msgstr ""
#: src/pages/settings.jsx:542
#: src/pages/settings.jsx:549
msgid "Image description generator"
msgstr ""
#: src/pages/settings.jsx:547
#: src/pages/settings.jsx:554
msgid "Only for new images while composing new posts."
msgstr ""
#: src/pages/settings.jsx:554
#: src/pages/settings.jsx:561
msgid "Note: This feature uses external AI service, powered by <0>img-alt-api</0>. May not work well. Only for images and in English."
msgstr ""
#: src/pages/settings.jsx:580
#: src/pages/settings.jsx:587
msgid "Server-side grouped notifications"
msgstr ""
#: src/pages/settings.jsx:584
#: src/pages/settings.jsx:591
msgid "Alpha-stage feature. Potentially improved grouping window but basic grouping logic."
msgstr ""
#: src/pages/settings.jsx:605
#: src/pages/settings.jsx:612
msgid "\"Cloud\" import/export for shortcuts settings"
msgstr ""
#: src/pages/settings.jsx:610
#: src/pages/settings.jsx:617
msgid "⚠️⚠️⚠️ Very experimental.<0/>Stored in your own profiles notes. Profile (private) notes are mainly used for other profiles, and hidden for own profile."
msgstr ""
#: src/pages/settings.jsx:621
#: src/pages/settings.jsx:628
msgid "Note: This feature uses currently-logged-in instance server API."
msgstr ""
#: src/pages/settings.jsx:638
#: src/pages/settings.jsx:645
msgid "Cloak mode <0>(<1>Text</1> → <2>████</2>)</0>"
msgstr ""
#: src/pages/settings.jsx:647
#: src/pages/settings.jsx:654
msgid "Replace text as blocks, useful when taking screenshots, for privacy reasons."
msgstr ""
#: src/pages/settings.jsx:672
#: src/pages/settings.jsx:679
msgid "About"
msgstr ""
#: src/pages/settings.jsx:711
#: src/pages/settings.jsx:718
msgid "<0>Built</0> by <1>@cheeaun</1>"
msgstr ""
#: src/pages/settings.jsx:740
#: src/pages/settings.jsx:747
msgid "Sponsor"
msgstr ""
#: src/pages/settings.jsx:748
#: src/pages/settings.jsx:755
msgid "Donate"
msgstr ""
#: src/pages/settings.jsx:756
#: src/pages/settings.jsx:763
msgid "Privacy Policy"
msgstr ""
#: src/pages/settings.jsx:763
#: src/pages/settings.jsx:770
msgid "<0>Site:</0> {0}"
msgstr ""
#: src/pages/settings.jsx:770
#: src/pages/settings.jsx:777
msgid "<0>Version:</0> <1/> {0}"
msgstr ""
#: src/pages/settings.jsx:785
#: src/pages/settings.jsx:792
msgid "Version string copied"
msgstr ""
#: src/pages/settings.jsx:788
#: src/pages/settings.jsx:795
msgid "Unable to copy version string"
msgstr ""
#: src/pages/settings.jsx:913
#: src/pages/settings.jsx:918
#: src/pages/settings.jsx:920
#: src/pages/settings.jsx:925
msgid "Failed to update subscription. Please try again."
msgstr ""
#: src/pages/settings.jsx:924
#: src/pages/settings.jsx:931
msgid "Failed to remove subscription. Please try again."
msgstr ""
#: src/pages/settings.jsx:931
#: src/pages/settings.jsx:938
msgid "Push Notifications (beta)"
msgstr ""
#: src/pages/settings.jsx:953
#: src/pages/settings.jsx:960
msgid "Push notifications are blocked. Please enable them in your browser settings."
msgstr ""
#: src/pages/settings.jsx:962
#: src/pages/settings.jsx:969
msgid "Allow from <0>{0}</0>"
msgstr ""
#: src/pages/settings.jsx:971
#: src/pages/settings.jsx:978
msgid "anyone"
msgstr ""
#: src/pages/settings.jsx:975
#: src/pages/settings.jsx:982
msgid "people I follow"
msgstr ""
#: src/pages/settings.jsx:979
#: src/pages/settings.jsx:986
msgid "followers"
msgstr ""
#: src/pages/settings.jsx:1012
#: src/pages/settings.jsx:1019
msgid "Follows"
msgstr ""
#: src/pages/settings.jsx:1020
#: src/pages/settings.jsx:1027
msgid "Polls"
msgstr ""
#: src/pages/settings.jsx:1024
#: src/pages/settings.jsx:1031
msgid "Post edits"
msgstr ""
#: src/pages/settings.jsx:1045
#: src/pages/settings.jsx:1052
msgid "Push permission was not granted since your last login. You'll need to <0><1>log in</1> again to grant push permission</0>."
msgstr ""
#: src/pages/settings.jsx:1061
#: src/pages/settings.jsx:1068
msgid "NOTE: Push notifications only work for <0>one account</0>."
msgstr ""

View file

@ -389,10 +389,10 @@ function Settings({ onClose }) {
code: lang.code,
locale: lang.code,
});
const same = !native || common === native;
const showCommon = common !== native;
return (
<option value={lang.code}>
{same ? common : `${common} (${native})`}
{showCommon ? `${native} - ${common}` : common}
</option>
);
})}
@ -418,7 +418,7 @@ function Settings({ onClose }) {
code: lang.code,
locale: lang.code,
});
const same = !native || common === native;
const showCommon = common !== native;
return (
<label>
<input
@ -440,7 +440,14 @@ function Settings({ onClose }) {
}
}}
/>{' '}
{same ? common : `${common} (${native})`}
{showCommon ? (
<span>
{native}{' '}
<span class="insignificant">- {common}</span>
</span>
) : (
common
)}
</label>
);
})}