Added helper methods for locales.

This commit is contained in:
Mike Cao 2021-11-20 17:18:25 -08:00
parent ef616cc98d
commit 0a8c06b1f8
4 changed files with 18 additions and 10 deletions

View File

@ -20,7 +20,7 @@ import Button from './Button';
import useLocale from 'hooks/useLocale'; import useLocale from 'hooks/useLocale';
import { dateFormat } from 'lib/date'; import { dateFormat } from 'lib/date';
import { chunk } from 'lib/array'; import { chunk } from 'lib/array';
import { dateLocales } from 'lib/lang'; import { getDateLocale } from 'lib/lang';
import Chevron from 'assets/chevron-down.svg'; import Chevron from 'assets/chevron-down.svg';
import Cross from 'assets/times.svg'; import Cross from 'assets/times.svg';
import styles from './Calendar.module.css'; import styles from './Calendar.module.css';
@ -106,8 +106,8 @@ export default function Calendar({ date, minDate, maxDate, onChange }) {
} }
const DaySelector = ({ date, minDate, maxDate, locale, onSelect }) => { const DaySelector = ({ date, minDate, maxDate, locale, onSelect }) => {
const startWeek = startOfWeek(date, { locale: dateLocales[locale] }); const startWeek = startOfWeek(date, { locale: getDateLocale(locale) });
const startMonth = startOfMonth(date, { locale: dateLocales[locale] }); const startMonth = startOfMonth(date, { locale: getDateLocale(locale) });
const startDay = subDays(startMonth, startMonth.getDay()); const startDay = subDays(startMonth, startMonth.getDay());
const month = date.getMonth(); const month = date.getMonth();
const year = date.getFullYear(); const year = date.getFullYear();

View File

@ -4,7 +4,7 @@ import { setLocale } from 'redux/actions/app';
import { useRouter } from 'next/router'; import { useRouter } from 'next/router';
import { get, setItem } from 'lib/web'; import { get, setItem } from 'lib/web';
import { LOCALE_CONFIG } from 'lib/constants'; import { LOCALE_CONFIG } from 'lib/constants';
import { languages } from 'lib/lang'; import { getDateLocale, getTextDirection } from 'lib/lang';
import useForceUpdate from 'hooks/useForceUpdate'; import useForceUpdate from 'hooks/useForceUpdate';
import enUS from 'public/lang/en-US.json'; import enUS from 'public/lang/en-US.json';
@ -17,7 +17,8 @@ export default function useLocale() {
const dispatch = useDispatch(); const dispatch = useDispatch();
const { basePath } = useRouter(); const { basePath } = useRouter();
const forceUpdate = useForceUpdate(); const forceUpdate = useForceUpdate();
const dir = languages[locale]?.dir || 'ltr'; const dir = getTextDirection(locale);
const dateLocale = getDateLocale(locale);
async function loadMessages(locale) { async function loadMessages(locale) {
const { ok, data } = await get(`${basePath}/lang/${locale}.json`); const { ok, data } = await get(`${basePath}/lang/${locale}.json`);
@ -47,5 +48,5 @@ export default function useLocale() {
} }
}, [locale]); }, [locale]);
return { locale, saveLocale, messages, dir }; return { locale, saveLocale, messages, dir, dateLocale };
} }

View File

@ -25,8 +25,7 @@ import {
differenceInCalendarYears, differenceInCalendarYears,
format, format,
} from 'date-fns'; } from 'date-fns';
import { enUS } from 'date-fns/locale'; import { getDateLocale } from 'lib/lang';
import { languages } from 'lib/lang';
export function getTimezone() { export function getTimezone() {
return moment.tz.guess(); return moment.tz.guess();
@ -38,7 +37,7 @@ export function getLocalTime(t) {
export function getDateRange(value, locale = 'en-US') { export function getDateRange(value, locale = 'en-US') {
const now = new Date(); const now = new Date();
const dateLocale = languages[locale]?.dateLocale || enUS; const dateLocale = getDateLocale(locale);
const { num, unit } = value.match(/^(?<num>[0-9]+)(?<unit>hour|day|week|month|year)$/).groups; const { num, unit } = value.match(/^(?<num>[0-9]+)(?<unit>hour|day|week|month|year)$/).groups;
@ -164,6 +163,6 @@ export const customFormats = {
export function dateFormat(date, str, locale = 'en-US') { export function dateFormat(date, str, locale = 'en-US') {
return format(date, customFormats?.[locale]?.[str] || str, { return format(date, customFormats?.[locale]?.[str] || str, {
locale: languages[locale]?.dateLocale || enUS, locale: getDateLocale(locale),
}); });
} }

View File

@ -76,3 +76,11 @@ export const languages = {
'tr-TR': { label: 'Türkçe', dateLocale: tr }, 'tr-TR': { label: 'Türkçe', dateLocale: tr },
'uk-UA': { label: 'українська', dateLocale: uk }, 'uk-UA': { label: 'українська', dateLocale: uk },
}; };
export function getDateLocale(locale) {
return languages[locale]?.dateLocale || enUS;
}
export function getTextDirection(locale) {
return languages[locale]?.dir || 'ltr';
}