feat(lang): add Greek display language (#1605)

* feat(lang): add Greek & Polish display languages

Also:
* rename zh-TW display language to 繁體中文‬
* fix plurality of AvailableLocale type name
* consistently use 'en' as fallback/default language

* revert(lang): remove Polish display language due to lack of translation activity

overseerr-api.yml

@@ -4536,7 +4536,7 @@ paths:
           name: language
           schema:
             type: string
-            example: en-US
+            example: en
       responses:
         '200':
           description: TV details

server/api/themoviedb/index.ts

@@ -399,7 +399,7 @@ class TheMovieDb extends ExternalAPI {
   public getDiscoverTv = async ({
     sortBy = 'popularity.desc',
     page = 1,
-    language = 'en-US',
+    language = 'en',
     firstAirDateGte,
     firstAirDateLte,
     includeEmptyReleaseDate = false,

src/components/Layout/LanguagePicker/index.tsx

@@ -3,7 +3,7 @@ import React, { useRef, useState } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
 import {
   availableLanguages,
-  AvailableLocales,
+  AvailableLocale,
 } from '../../../context/LanguageContext';
 import useClickOutside from '../../../hooks/useClickOutside';
 import useLocale from '../../../hooks/useLocale';
@@ -58,10 +58,10 @@ const LanguagePicker: React.FC = () => {
                 id="language"
                 className="rounded-md"
                 onChange={(e) =>
-                  setLocale && setLocale(e.target.value as AvailableLocales)
+                  setLocale && setLocale(e.target.value as AvailableLocale)
                 }
                 onBlur={(e) =>
-                  setLocale && setLocale(e.target.value as AvailableLocales)
+                  setLocale && setLocale(e.target.value as AvailableLocale)
                 }
                 defaultValue={locale}
               >

src/components/Layout/index.tsx

@@ -3,7 +3,7 @@ import { ArrowLeftIcon, InformationCircleIcon } from '@heroicons/react/solid';
 import { useRouter } from 'next/router';
 import React, { useEffect, useState } from 'react';
 import { defineMessages, useIntl } from 'react-intl';
-import { AvailableLocales } from '../../context/LanguageContext';
+import { AvailableLocale } from '../../context/LanguageContext';
 import useLocale from '../../hooks/useLocale';
 import useSettings from '../../hooks/useSettings';
 import { Permission, useUser } from '../../hooks/useUser';
@@ -30,7 +30,7 @@ const Layout: React.FC = ({ children }) => {
       setLocale(
         (user?.settings?.locale
           ? user.settings.locale
-          : currentSettings.locale) as AvailableLocales
+          : currentSettings.locale) as AvailableLocale
       );
     }
   }, [setLocale, currentSettings.locale, user]);

src/components/Settings/SettingsMain.tsx

@@ -10,7 +10,7 @@ import { UserSettingsGeneralResponse } from '../../../server/interfaces/api/user
 import type { MainSettings } from '../../../server/lib/settings';
 import {
   availableLanguages,
-  AvailableLocales,
+  AvailableLocale,
 } from '../../context/LanguageContext';
 import useLocale from '../../hooks/useLocale';
 import { Permission, useUser } from '../../hooks/useUser';
@@ -160,7 +160,7 @@ const SettingsMain: React.FC = () => {
                 setLocale(
                   (userData?.locale
                     ? userData.locale
-                    : values.locale) as AvailableLocales
+                    : values.locale) as AvailableLocale
                 );
               }
 

src/components/UserProfile/UserSettings/UserGeneralSettings/index.tsx

@@ -8,7 +8,7 @@ import useSWR from 'swr';
 import { UserSettingsGeneralResponse } from '../../../../../server/interfaces/api/userSettingsInterfaces';
 import {
   availableLanguages,
-  AvailableLocales,
+  AvailableLocale,
 } from '../../../../context/LanguageContext';
 import useLocale from '../../../../hooks/useLocale';
 import useSettings from '../../../../hooks/useSettings';
@@ -124,7 +124,7 @@ const UserGeneralSettings: React.FC = () => {
               setLocale(
                 (values.locale
                   ? values.locale
-                  : currentSettings.locale) as AvailableLocales
+                  : currentSettings.locale) as AvailableLocale
               );
             }
 

src/context/LanguageContext.tsx

@@ -1,9 +1,10 @@
 import React, { ReactNode } from 'react';
 
-export type AvailableLocales =
+export type AvailableLocale =
   | 'ca'
   | 'de'
   | 'en'
+  | 'el'
   | 'es'
   | 'it'
   | 'ja'
@@ -20,7 +21,7 @@ export type AvailableLocales =
 
 type AvailableLanguageObject = Record<
   string,
-  { code: AvailableLocales; display: string }
+  { code: AvailableLocale; display: string }
 >;
 
 export const availableLanguages: AvailableLanguageObject = {
@@ -72,6 +73,10 @@ export const availableLanguages: AvailableLanguageObject = {
     code: 'sv',
     display: 'Svenska',
   },
+  el: {
+    code: 'el',
+    display: 'Ελληνικά',
+  },
   ru: {
     code: 'ru',
     display: 'pусский',
@@ -86,14 +91,14 @@ export const availableLanguages: AvailableLanguageObject = {
   },
   'zh-TW': {
     code: 'zh-TW',
-    display: '中文（臺灣）',
+    display: '‪繁體中文‬',
   },
 };
 
 export interface LanguageContextProps {
-  locale: AvailableLocales;
+  locale: AvailableLocale;
   children: (locale: string) => ReactNode;
-  setLocale?: React.Dispatch<React.SetStateAction<AvailableLocales>>;
+  setLocale?: React.Dispatch<React.SetStateAction<AvailableLocale>>;
 }
 
 export const LanguageContext = React.createContext<

src/pages/_app.tsx

@@ -14,19 +14,21 @@ import StatusChecker from '../components/StatusChacker';
 import Toast from '../components/Toast';
 import ToastContainer from '../components/ToastContainer';
 import { InteractionProvider } from '../context/InteractionContext';
-import { AvailableLocales, LanguageContext } from '../context/LanguageContext';
+import { AvailableLocale, LanguageContext } from '../context/LanguageContext';
 import { SettingsProvider } from '../context/SettingsContext';
 import { UserContext } from '../context/UserContext';
 import { User } from '../hooks/useUser';
 import '../styles/globals.css';
 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-const loadLocaleData = (locale: AvailableLocales): Promise<any> => {
+const loadLocaleData = (locale: AvailableLocale): Promise<any> => {
   switch (locale) {
     case 'ca':
       return import('../i18n/locale/ca.json');
     case 'de':
       return import('../i18n/locale/de.json');
+    case 'el':
+      return import('../i18n/locale/el.json');
     case 'es':
       return import('../i18n/locale/es.json');
     case 'fr':
@@ -67,7 +69,7 @@ type MessagesType = Record<string, any>;
 interface ExtendedAppProps extends AppProps {
   user: User;
   messages: MessagesType;
-  locale: AvailableLocales;
+  locale: AvailableLocale;
   currentSettings: PublicSettingsResponse;
 }
 
@@ -86,7 +88,7 @@ const CoreApp: Omit<NextAppComponentType, 'origGetInitialProps'> = ({
 }: ExtendedAppProps) => {
   let component: React.ReactNode;
   const [loadedMessages, setMessages] = useState<MessagesType>(messages);
-  const [currentLocale, setLocale] = useState<AvailableLocales>(locale);
+  const [currentLocale, setLocale] = useState<AvailableLocale>(locale);
 
   useEffect(() => {
     loadLocaleData(currentLocale).then(setMessages);
@@ -214,7 +216,7 @@ CoreApp.getInitialProps = async (initialProps) => {
     ? user.settings.locale
     : currentSettings.locale;
 
-  const messages = await loadLocaleData(locale as AvailableLocales);
+  const messages = await loadLocaleData(locale as AvailableLocale);
 
   return { ...appInitialProps, user, messages, locale, currentSettings };
 };