From 0a8c06b1f8b4df3bc01226705db0371b98ae67d6 Mon Sep 17 00:00:00 2001
From: Mike Cao <mike@mikecao.com>
Date: Sat, 20 Nov 2021 17:18:25 -0800
Subject: [PATCH] Added helper methods for locales.

---
 components/common/Calendar.js | 6 +++---
 hooks/useLocale.js            | 7 ++++---
 lib/date.js                   | 7 +++----
 lib/lang.js                   | 8 ++++++++
 4 files changed, 18 insertions(+), 10 deletions(-)

diff --git a/components/common/Calendar.js b/components/common/Calendar.js
index fd28363c..7aea34c3 100644
--- a/components/common/Calendar.js
+++ b/components/common/Calendar.js
@@ -20,7 +20,7 @@ import Button from './Button';
 import useLocale from 'hooks/useLocale';
 import { dateFormat } from 'lib/date';
 import { chunk } from 'lib/array';
-import { dateLocales } from 'lib/lang';
+import { getDateLocale } from 'lib/lang';
 import Chevron from 'assets/chevron-down.svg';
 import Cross from 'assets/times.svg';
 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 startWeek = startOfWeek(date, { locale: dateLocales[locale] });
-  const startMonth = startOfMonth(date, { locale: dateLocales[locale] });
+  const startWeek = startOfWeek(date, { locale: getDateLocale(locale) });
+  const startMonth = startOfMonth(date, { locale: getDateLocale(locale) });
   const startDay = subDays(startMonth, startMonth.getDay());
   const month = date.getMonth();
   const year = date.getFullYear();
diff --git a/hooks/useLocale.js b/hooks/useLocale.js
index 0a588a46..67e8bbce 100644
--- a/hooks/useLocale.js
+++ b/hooks/useLocale.js
@@ -4,7 +4,7 @@ import { setLocale } from 'redux/actions/app';
 import { useRouter } from 'next/router';
 import { get, setItem } from 'lib/web';
 import { LOCALE_CONFIG } from 'lib/constants';
-import { languages } from 'lib/lang';
+import { getDateLocale, getTextDirection } from 'lib/lang';
 import useForceUpdate from 'hooks/useForceUpdate';
 import enUS from 'public/lang/en-US.json';
 
@@ -17,7 +17,8 @@ export default function useLocale() {
   const dispatch = useDispatch();
   const { basePath } = useRouter();
   const forceUpdate = useForceUpdate();
-  const dir = languages[locale]?.dir || 'ltr';
+  const dir = getTextDirection(locale);
+  const dateLocale = getDateLocale(locale);
 
   async function loadMessages(locale) {
     const { ok, data } = await get(`${basePath}/lang/${locale}.json`);
@@ -47,5 +48,5 @@ export default function useLocale() {
     }
   }, [locale]);
 
-  return { locale, saveLocale, messages, dir };
+  return { locale, saveLocale, messages, dir, dateLocale };
 }
diff --git a/lib/date.js b/lib/date.js
index 5c57e9d0..84516de0 100644
--- a/lib/date.js
+++ b/lib/date.js
@@ -25,8 +25,7 @@ import {
   differenceInCalendarYears,
   format,
 } from 'date-fns';
-import { enUS } from 'date-fns/locale';
-import { languages } from 'lib/lang';
+import { getDateLocale } from 'lib/lang';
 
 export function getTimezone() {
   return moment.tz.guess();
@@ -38,7 +37,7 @@ export function getLocalTime(t) {
 
 export function getDateRange(value, locale = 'en-US') {
   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;
 
@@ -164,6 +163,6 @@ export const customFormats = {
 
 export function dateFormat(date, str, locale = 'en-US') {
   return format(date, customFormats?.[locale]?.[str] || str, {
-    locale: languages[locale]?.dateLocale || enUS,
+    locale: getDateLocale(locale),
   });
 }
diff --git a/lib/lang.js b/lib/lang.js
index 7f8d7dbd..69256497 100644
--- a/lib/lang.js
+++ b/lib/lang.js
@@ -76,3 +76,11 @@ export const languages = {
   'tr-TR': { label: 'Türkçe', dateLocale: tr },
   'uk-UA': { label: 'українська', dateLocale: uk },
 };
+
+export function getDateLocale(locale) {
+  return languages[locale]?.dateLocale || enUS;
+}
+
+export function getTextDirection(locale) {
+  return languages[locale]?.dir || 'ltr';
+}