oreolek/phanpy
1
0
Fork 0
Code Activity

Better segmentation of languages with <hr>

Browse source
This commit is contained in:
Lim Chee Aun 2023-10-30 23:50:15 +08:00
parent 99f81c49c4
commit 3c790ebff4
1 changed files with 39 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

65
src/components/compose.jsx
View file

@ -522,6 +522,34 @@ function Compose({
const [showEmoji2Picker, setShowEmoji2Picker] = useState(false);
const [topSupportedLanguages, restSupportedLanguages] = useMemo(() => {
const topLanguages = [];
const restLanguages = [];
const { contentTranslationHideLanguages = [] } = states.settings;
supportedLanguages.forEach((l) => {
const [code] = l;
if (
code === language ||
code === prevLanguage.current ||
code === DEFAULT_LANG ||
contentTranslationHideLanguages.includes(code)
) {
topLanguages.push(l);
} else {
restLanguages.push(l);
}
});
topLanguages.sort(([codeA, commonA], [codeB, commonB]) => {
if (codeA === language) return -1;
if (codeB === language) return 1;
return commonA.localeCompare(commonB);
});
restLanguages.sort(([codeA, commonA], [codeB, commonB]) =>
commonA.localeCompare(commonB),
);
return [topLanguages, restLanguages];
}, [language]);
return (
<div id="compose-container-outer">
<div id="compose-container" class={standalone ? 'standalone' : ''}>
@ -1126,32 +1154,17 @@ function Compose({
}}
disabled={uiState === 'loading'}
>
{supportedLanguages
.sort(([codeA, commonA], [codeB, commonB]) => {
const { contentTranslationHideLanguages = [] } =
states.settings;
// Sort codes that same as language, prevLanguage, DEFAULT_LANGUAGE and all the ones in states.settings.contentTranslationHideLanguages, to the top
if (
codeA === language ||
codeA === prevLanguage ||
codeA === DEFAULT_LANG ||
contentTranslationHideLanguages?.includes(codeA)
)
return -1;
if (
codeB === language ||
codeB === prevLanguage ||
codeB === DEFAULT_LANG ||
contentTranslationHideLanguages?.includes(codeB)
)
return 1;
return commonA.localeCompare(commonB);
})
.map(([code, common, native]) => (
<option value={code}>
{common} ({native})
</option>
))}
{topSupportedLanguages.map(([code, common, native]) => (
<option value={code} key={code}>
{common} ({native})
</option>
))}
<hr />
{restSupportedLanguages.map(([code, common, native]) => (
<option value={code} key={code}>
{common} ({native})
</option>
))}
</select>
</label>{' '}
<button