feat: improve i18n support as a whole (#1526)

* feat: improve i18n support as a whole

- Remove dayjs in favor of /helpers/datetime.ts, which uses
Intl.DateTimeFormat and Date. Dayjs is not exactly i18n friendly
and has several locale related opened issues.

- Move/refactor date/time code from /helpers/utils.ts to
/helpers/datetime.ts.

- Fix Daily Review weekday not changing according to selected date.

- Localize Daily review weekday and month.

- Load i18n listed strings from /locales/{locale}.json in a dynamic way.
This makes much easier to add new locales, by just adding a properly
named json file and listing it only in /web/src/i18n.ts and
/api/user_setting.go.

- Fallback languages are now set in /web/src/i18n.ts.

- Full language codes are now preffered, but they fallback to 2-letter
codes when not available.

- The locale dropdown is now populated dynamically from the available
locales. Locale names are populated by the browser via
Intl.DisplayNames(locale).

- /web/src/i18n.ts now exports a type TLocale from availableLocales
array. This is used only by findNearestLanguageMatch(). As I was unable
to use this type in ".d.ts" files, I switched the Locale type from
/web/src/types/i18n.d.ts to string.

- Move pretty much all hardcoded text strings to i18n strings.

- Add pt-BR translation.

- Remove site.ts and move its content to a i18n string.

- Rename zh.json to zh-Hans.json to get the correct language name on
selector dropdown.

- Remove pt_BR.json and replace with pt-BR.json.

- Some minor layout spacing fixes to accommodate larger texts.

- Improve some error messages.

* Delete .yarnrc.yml

* Delete package-lock.json

* fix: 158:28  error  Insert `⏎`  prettier/prettier

web/src/components/LocaleSelect.tsx

@@ -1,4 +1,5 @@
 import { Option, Select } from "@mui/joy";
+import { availableLocales } from "@/i18n";
 import { FC } from "react";
 import Icon from "./Icon";
 
@@ -17,26 +18,26 @@ const LocaleSelect: FC<Props> = (props: Props) => {
 
   return (
     <Select
-      className={`!min-w-[10rem] w-auto whitespace-nowrap ${className ?? ""}`}
+      className={`!min-w-[12rem] w-auto whitespace-nowrap ${className ?? ""}`}
       startDecorator={<Icon.Globe className="w-4 h-auto" />}
       value={value}
       onChange={(_, value) => handleSelectChange(value as Locale)}
     >
-      <Option value="en">English</Option>
-      <Option value="zh">简体中文</Option>
-      <Option value="vi">Tiếng Việt</Option>
-      <Option value="fr">French</Option>
-      <Option value="nl">Nederlands</Option>
-      <Option value="sv">Svenska</Option>
-      <Option value="de">German</Option>
-      <Option value="es">Español</Option>
-      <Option value="uk">Українська</Option>
-      <Option value="ru">Русский</Option>
-      <Option value="it">Italiano</Option>
-      <Option value="hant">繁體中文</Option>
-      <Option value="tr">Turkish</Option>
-      <Option value="ko">한국어</Option>
-      <Option value="sl">Slovenščina</Option>
+      {availableLocales.map((locale) => {
+        const languageName = new Intl.DisplayNames([locale], { type: "language" }).of(locale);
+        if (languageName === undefined) {
+          return (
+            <Option key={locale} value={locale}>
+              {locale}
+            </Option>
+          );
+        }
+        return (
+          <Option key={locale} value={locale}>
+            {languageName.charAt(0).toUpperCase() + languageName.slice(1)}
+          </Option>
+        );
+      })}
     </Select>
   );
 };