fix(#2469): saving user language in database
parent
72441047c3
commit
6a9808cb28
@ -1,90 +0,0 @@ |
||||
import map from 'lodash/map' |
||||
|
||||
import { getSortedLangs } from 'helpers/getSortedLangs' |
||||
|
||||
export const langs = [ |
||||
{ |
||||
className: 'ru', |
||||
locale: 'ru', |
||||
title: 'Русский', |
||||
}, |
||||
{ |
||||
className: 'gb', |
||||
locale: 'en', |
||||
title: 'English', |
||||
}, |
||||
{ |
||||
className: 'cz', |
||||
locale: 'cs', |
||||
title: 'Čeština', |
||||
}, |
||||
{ |
||||
className: 'pl', |
||||
locale: 'pl', |
||||
title: 'Polska', |
||||
}, |
||||
{ |
||||
className: 'ua', |
||||
locale: 'uk', |
||||
title: 'Українська', |
||||
}, |
||||
{ |
||||
className: 'fr', |
||||
locale: 'fr', |
||||
title: 'Français', |
||||
}, |
||||
{ |
||||
className: 'de', |
||||
locale: 'de', |
||||
title: 'Deutsch', |
||||
}, |
||||
{ |
||||
className: 'nl', |
||||
locale: 'nl', |
||||
title: 'Dutch', |
||||
}, |
||||
{ |
||||
className: 'es', |
||||
locale: 'es', |
||||
title: 'Español', |
||||
}, |
||||
{ |
||||
className: 'pt', |
||||
locale: 'pt', |
||||
title: 'Português', |
||||
}, |
||||
{ |
||||
className: 'it', |
||||
locale: 'it', |
||||
title: 'Italiano', |
||||
}, |
||||
{ |
||||
className: 'zh', |
||||
locale: 'zh', |
||||
title: '中文', |
||||
}, |
||||
{ |
||||
className: 'bg', |
||||
locale: 'bg', |
||||
title: 'Български', |
||||
}, |
||||
{ |
||||
className: 'lv', |
||||
locale: 'lv', |
||||
title: 'latviešu', |
||||
}, |
||||
] as const |
||||
|
||||
export const getLangsOrder = () => { |
||||
const commonLangsLocaleList = map(langs, (lang) => lang.locale).sort() |
||||
const clientLanglocaleIndex = commonLangsLocaleList.findIndex( |
||||
(locale) => locale === 'en', |
||||
) |
||||
commonLangsLocaleList.splice(clientLanglocaleIndex, 1).unshift('en') |
||||
return commonLangsLocaleList |
||||
} |
||||
|
||||
// @ts-expect-error
|
||||
export const langsList = getSortedLangs(langs) |
||||
|
||||
export type Languages = typeof langsList[number]['locale'] |
||||
@ -1,30 +1,56 @@ |
||||
import { useCallback } from 'react' |
||||
import { |
||||
useCallback, |
||||
useEffect, |
||||
useState, |
||||
} from 'react' |
||||
|
||||
import filter from 'lodash/filter' |
||||
import isNull from 'lodash/isNull' |
||||
import map from 'lodash/map' |
||||
|
||||
import { useLocalStore } from 'hooks' |
||||
|
||||
import type { Languages } from 'config/languages' |
||||
import { client } from 'config/clients' |
||||
|
||||
import { isSupportedLang } from 'helpers/isSupportedLang' |
||||
import { getLanguages, ReferenceLanguages } from 'requests/getLanguages' |
||||
import { getSortedLangs } from 'helpers/getSortedLangs' |
||||
|
||||
const LANG_KEY = 'lang' |
||||
const DEFAULT_LANG = client.defaultLanguage || 'en' |
||||
|
||||
export const useLang = (initialLanguage?: Languages) => { |
||||
const [lang, setLang] = useLocalStore<Languages>({ |
||||
export const useLang = (initialLanguage?: string) => { |
||||
const [lang, setLang] = useLocalStore<string>({ |
||||
defaultValue: DEFAULT_LANG, |
||||
initialValue: initialLanguage, |
||||
key: LANG_KEY, |
||||
validator: isSupportedLang, |
||||
}) |
||||
const [languageList, setLanguageList] = useState<ReferenceLanguages>([]) |
||||
const [languageLexics, setLanguageLexics] = useState<Array<number>>([]) |
||||
|
||||
const fetchLanguages = useCallback(async () => { |
||||
const languages = await getLanguages() |
||||
const langsWithLexic = filter(languages, (language) => !isNull(language.lexic)) |
||||
const sortedLangs = getSortedLangs(langsWithLexic) |
||||
setLanguageList(sortedLangs) |
||||
setLanguageLexics(map(langsWithLexic, ({ lexic }) => lexic)) |
||||
}, []) |
||||
|
||||
useEffect(() => { |
||||
fetchLanguages() |
||||
}, [fetchLanguages]) |
||||
|
||||
const changeLang = useCallback( |
||||
(newLang: Languages) => { |
||||
(newLang: string) => { |
||||
if (newLang === lang) return |
||||
setLang(newLang) |
||||
}, |
||||
[lang, setLang], |
||||
) |
||||
|
||||
return { changeLang, lang } |
||||
return { |
||||
changeLang, |
||||
lang, |
||||
languageLexics, |
||||
languageList, |
||||
} |
||||
} |
||||
|
||||
@ -1,14 +0,0 @@ |
||||
import map from 'lodash/map' |
||||
|
||||
import type { Languages } from 'config/languages' |
||||
import { langsList } from 'config/languages' |
||||
|
||||
export type Lang = { |
||||
id: Languages, |
||||
name: string, |
||||
} |
||||
|
||||
export const langOptions = map(langsList, (lang) => ({ |
||||
id: lang.locale, |
||||
name: lang.title, |
||||
})) |
||||
@ -1,19 +1,11 @@ |
||||
import { getLangsOrder } from 'config/languages' |
||||
import sortBy from 'lodash/sortBy' |
||||
import { ReferenceLanguages } from 'requests/getLanguages' |
||||
|
||||
type TLang = { |
||||
className: string, |
||||
locale: string, |
||||
title: string, |
||||
} |
||||
|
||||
const getOrder = (locale: string) => { |
||||
const langsOrder = getLangsOrder() |
||||
return langsOrder.findIndex((item) => item === locale) |
||||
} |
||||
|
||||
export const getSortedLangs = (langs: Array<TLang>): Array<TLang> => { |
||||
langs.sort((lang1, lang2) => ( |
||||
getOrder(lang1.locale) - getOrder(lang2.locale) |
||||
)) |
||||
return langs |
||||
export const getSortedLangs = (langs: ReferenceLanguages): ReferenceLanguages => { |
||||
const languagesSorted = sortBy(langs, ['name_en']) |
||||
const engLocaleIndex = languagesSorted.findIndex((language) => language.iso_639_1 === 'en') |
||||
const engLanguage = languagesSorted[engLocaleIndex] |
||||
languagesSorted.splice(engLocaleIndex, 1) |
||||
languagesSorted.unshift(engLanguage) |
||||
return languagesSorted |
||||
} |
||||
|
||||
@ -1,21 +0,0 @@ |
||||
import { isSupportedLang } from '..' |
||||
|
||||
it('returns true for supported languages', () => { |
||||
expect(isSupportedLang('ru')).toBe(true) |
||||
expect(isSupportedLang('en')).toBe(true) |
||||
expect(isSupportedLang('cs')).toBe(true) |
||||
expect(isSupportedLang('lv')).toBe(true) |
||||
expect(isSupportedLang('uk')).toBe(true) |
||||
expect(isSupportedLang('fr')).toBe(true) |
||||
expect(isSupportedLang('de')).toBe(true) |
||||
expect(isSupportedLang('es')).toBe(true) |
||||
expect(isSupportedLang('pt')).toBe(true) |
||||
expect(isSupportedLang('it')).toBe(true) |
||||
expect(isSupportedLang('pl')).toBe(true) |
||||
}) |
||||
|
||||
it('returns false for not supported languages', () => { |
||||
expect(isSupportedLang('ja')).toBe(false) |
||||
expect(isSupportedLang('ro')).toBe(false) |
||||
expect(isSupportedLang('tr')).toBe(false) |
||||
}) |
||||
@ -1,10 +0,0 @@ |
||||
import map from 'lodash/map' |
||||
import includes from 'lodash/includes' |
||||
|
||||
import type { Languages } from 'config/languages' |
||||
import { langsList } from 'config/languages' |
||||
|
||||
export const isSupportedLang = (lang: string): lang is Languages => { |
||||
const supportedLangs = map(langsList, ({ locale }) => locale) |
||||
return includes(supportedLangs, lang) |
||||
} |
||||
@ -0,0 +1,35 @@ |
||||
import { |
||||
DATA_URL, |
||||
PROCEDURES, |
||||
} from 'config' |
||||
import { callApi } from 'helpers' |
||||
|
||||
const proc = PROCEDURES.get_languages |
||||
|
||||
export type ReferenceLanguage = { |
||||
id: number, |
||||
iso_639_1: string, |
||||
lexic: number, |
||||
name_en: string, |
||||
name_ru: string, |
||||
short_name: string, |
||||
ts: number, |
||||
} |
||||
|
||||
export type ReferenceLanguages = Array<ReferenceLanguage> |
||||
|
||||
export const getLanguages = async (): Promise<ReferenceLanguages> => { |
||||
const config = { |
||||
body: { |
||||
params: {}, |
||||
proc, |
||||
}, |
||||
} |
||||
|
||||
const response = await callApi({ |
||||
config, |
||||
url: DATA_URL, |
||||
}) |
||||
|
||||
return response |
||||
} |
||||
Loading…
Reference in new issue