github/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2024-11-25 11:16:31 -05:00
Code Issues Projects Releases Packages Wiki Activity

Extract language codes into object (#246)

Browse source 
* Extract language codes into object
* Restructure language search so it would find more specific language codes first.

Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>
This commit is contained in:
mrdrogdrog 2020-06-21 14:09:53 +02:00 committed by GitHub
parent fd378cf89b
commit b3899cd1a5
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 49 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

91
src/components/landing/layout/footer/language-picker.tsx
View file

@ -1,62 +1,69 @@
import moment from 'moment'
import React from 'react'
import React, { useCallback } from 'react'
import { Form } from 'react-bootstrap'
import { useTranslation } from 'react-i18next'
const languages = {
en: 'English',
'zh-CN': '简体中文',
'zh-TW': '繁體中文',
fr: 'Français',
de: 'Deutsch',
ja: '日本語',
es: 'Español',
ca: 'Català',
el: 'Ελληνικά',
pt: 'Português',
it: 'Italiano',
tr: 'Türkçe',
ru: 'Русский',
nl: 'Nederlands',
hr: 'Hrvatski',
pl: 'Polski',
uk: 'Українська',
hi: 'हिन्दी',
sv: 'Svenska',
eo: 'Esperanto',
da: 'Dansk',
ko: '한국어',
id: 'Bahasa Indonesia',
sr: 'Cрпски',
vi: 'Tiếng Việt',
ar: 'العربية',
cs: 'Česky',
sk: 'Slovensky'
}
const findLanguageCode = (wantedLanguage: string): string => {
let foundLanguage = Object.keys(languages).find((supportedLanguage) => wantedLanguage === supportedLanguage)
if (!foundLanguage) {
foundLanguage = Object.keys(languages).find((supportedLanguage) => wantedLanguage.substr(0, 2) === supportedLanguage)
}
return foundLanguage || ''
}
const LanguagePicker: React.FC = () => {
const { i18n } = useTranslation()
const onChangeLang = async (event: React.ChangeEvent<HTMLSelectElement>) => {
const onChangeLang = useCallback(() => async (event: React.ChangeEvent<HTMLSelectElement>) => {
const language = event.currentTarget.value
moment.locale(language)
await i18n.changeLanguage(language)
}
const shortenLanguageCode = (language: string): string => {
const languageWithoutArea = language.substr(0, 2)
if (languageWithoutArea === 'zh') {
return language
} else {
return languageWithoutArea
}
}
}, [i18n])
return (
<Form.Control
as="select"
size="sm"
className="mb-2 mx-auto w-auto"
value={shortenLanguageCode(i18n.language)}
onChange={onChangeLang}
value={findLanguageCode(i18n.language)}
onChange={onChangeLang()}
>
<option value="en">English</option>
<option value="zh-CN">简体中文</option>
<option value="zh-TW">繁體中文</option>
<option value="fr">Français</option>
<option value="de">Deutsch</option>
<option value="ja">日本語</option>
<option value="es">Español</option>
<option value="ca">Català</option>
<option value="el">Ελληνικά</option>
<option value="pt">Português</option>
<option value="it">Italiano</option>
<option value="tr">Türkçe</option>
<option value="ru">Русский</option>
<option value="nl">Nederlands</option>
<option value="hr">Hrvatski</option>
<option value="pl">Polski</option>
<option value="uk">Українська</option>
<option value="hi">हिन्दी</option>
<option value="sv">Svenska</option>
<option value="eo">Esperanto</option>
<option value="da">Dansk</option>
<option value="ko">한국어</option>
<option value="id">Bahasa Indonesia</option>
<option value="sr">Cрпски</option>
<option value="vi">Tiếng Việt</option>
<option value="ar">العربية</option>
<option value="cs">Česky</option>
<option value="sk">Slovensky</option>
{
Object.entries(languages).map(([language, languageName]) => {
return <option key={language} value={language}>{languageName}</option>
})
}
</Form.Control>
)
}