report model language

package.json

@@ -9,7 +9,7 @@
   },
   "scripts": {
     "build-fakeyou": "lerna exec --scope @storyteller/fakeyou.com -- yarn build",
-    "start-fakeyou": "PORT=7000 BROWSER=none lerna exec --scope @storyteller/fakeyou.com -- yarn start",
+    "start-fakeyou": "PORT=80 BROWSER=none lerna exec --scope @storyteller/fakeyou.com -- yarn start",
     "start-fakeyou-w": "set PORT=7000 && lerna exec --scope @storyteller/fakeyou.com -- yarn start-w",
     "build-storyteller": "lerna exec --scope @storyteller/storyteller.io -- yarn build",
     "start-storyteller": "PORT=7008 BROWSER=none lerna exec --scope @storyteller/storyteller.io -- yarn start",

packages/components/src/api/ApiConfig.ts

@@ -83,6 +83,7 @@ class ApiConfig {
           (domain === Domain.Localhost || domain === Domain.JungleHorse)
         ) {
           v2ApiHost = "api.dev.fakeyou.com";
+          useSsl = false;
         } else if (domain === Domain.JungleHorse) {
           // TODO: Clean up these branches
           v2ApiHost = "api.jungle.horse";
@@ -90,7 +91,7 @@ class ApiConfig {
     }
 
     this.domain = domain;
-    this.useSsl = useSsl;
+    this.useSsl = false;
     this.v2ApiHost = v2ApiHost;
   }
 

packages/components/src/api/tts/ListTtsModels.ts

@@ -12,6 +12,8 @@ export interface TtsModelListItem {
   creator_username: string,
   creator_display_name: string,
   creator_gravatar_hash: string,
+  ietf_language_tag: string,
+  ietf_primary_language_subtag: string,
   updatable_slug: string,
   title: string,
   is_front_page_featured: boolean,

packages/fakeyou.com/src/_i18n/AvailableLanguageMap.ts

@@ -3,6 +3,7 @@ import { Language } from "@storyteller/components/src/i18n/Language";
 export interface AvailableLanguage {
   language: Language;
   languageCode: string;
+  languageName: string;
   showPleaseFollowNotice: boolean;
   showBootstrapLanguageNotice: boolean;
 }
@@ -10,6 +11,7 @@ export interface AvailableLanguage {
 export const ENGLISH_LANGUAGE: AvailableLanguage = {
   language: Language.English,
   languageCode: "en",
+  languageName: "English",
   showPleaseFollowNotice: false,
   showBootstrapLanguageNotice: false,
 };
@@ -19,72 +21,84 @@ export const AVAILABLE_LANGUAGE_MAP: Record<string, AvailableLanguage> = {
   es: {
     language: Language.Spanish,
     languageCode: "es",
+    languageName: "Spanish",
     showPleaseFollowNotice: true,
     showBootstrapLanguageNotice: false,
   },
   de: {
     language: Language.German,
     languageCode: "de",
+    languageName: "German",
     showPleaseFollowNotice: false,
     showBootstrapLanguageNotice: true,
   },
   fr: {
     language: Language.French,
     languageCode: "fr",
+    languageName: "French",
     showPleaseFollowNotice: false,
     showBootstrapLanguageNotice: true,
   },
   hi: {
     language: Language.Hindi,
     languageCode: "hi",
+    languageName: "Hindi",
     showPleaseFollowNotice: false,
     showBootstrapLanguageNotice: true,
   },
   id: {
     language: Language.Indonesian,
     languageCode: "id",
+    languageName: "Indonesian",
     showPleaseFollowNotice: false,
     showBootstrapLanguageNotice: true,
   },
   it: {
     language: Language.Italian,
     languageCode: "it",
+    languageName: "Italian",
     showPleaseFollowNotice: false,
     showBootstrapLanguageNotice: false,
   },
   ja: {
     language: Language.Japanese,
     languageCode: "ja",
+    languageName: "Japanese",
     showPleaseFollowNotice: false,
     showBootstrapLanguageNotice: true,
   },
   ko: {
     language: Language.Korean,
     languageCode: "ko",
+    languageName: "Korean",
     showPleaseFollowNotice: false,
     showBootstrapLanguageNotice: true,
   },
   pt: {
     language: Language.Portuguese,
     languageCode: "pt",
+    languageName: "Portuguese",
     showPleaseFollowNotice: true,
     showBootstrapLanguageNotice: false,
   },
   tr: {
     language: Language.Turkish,
     languageCode: "tr",
+    languageName: "Turkish",
     showPleaseFollowNotice: false,
     showBootstrapLanguageNotice: true,
   },
   vi: {
     language: Language.Vietnamese,
     languageCode: "vi",
+    languageName: "Vietnamese",
     showPleaseFollowNotice: false,
     showBootstrapLanguageNotice: true,
   },
   zh: {
     language: Language.ChineseSimplified,
     languageCode: "zh",
+    languageName: "Chinese Simplified",
     showPleaseFollowNotice: false,
     showBootstrapLanguageNotice: true,
   },

packages/fakeyou.com/src/v2/view/tts/tts_model_list/TtsModelListPage.tsx

@@ -72,6 +72,7 @@ import {
 import Select from "react-select";
 import AsyncSelect from "react-select/async";
 import { SearchFieldClass } from "./SearchFieldClass";
+import { AVAILABLE_LANGUAGE_MAP, ENGLISH_LANGUAGE } from "../../../../_i18n/AvailableLanguageMap";
 
 export interface EnqueueJobResponsePayload {
   success: boolean;
@@ -283,9 +284,10 @@ function TtsModelListPage(props: Props) {
   let directViewLink = <span />;
 
   if (props.maybeSelectedTtsModel) {
-    let modelLink = `/tts/${props.maybeSelectedTtsModel.model_token}`;
-    // let modelName = props.maybeSelectedTtsModel.title;
-    let userName = props.maybeSelectedTtsModel.creator_display_name;
+    const modelLink = `/tts/${props.maybeSelectedTtsModel.model_token}`;
+    const userName = props.maybeSelectedTtsModel.creator_display_name;
+    const modelLanguage = AVAILABLE_LANGUAGE_MAP[props.maybeSelectedTtsModel.ietf_primary_language_subtag] || ENGLISH_LANGUAGE;
+
     directViewLink = (
       <Link
         to={modelLink}
@@ -306,8 +308,8 @@ function TtsModelListPage(props: Props) {
               />
             </Link>{" "}
             | <FontAwesomeIcon icon={faGlobe} className="me-2" />
-            Language: <span className="fw-semibold">English</span> | Use count:{" "}
-            <span className="fw-semibold">616400</span>
+            Language: <span className="fw-semibold">{modelLanguage.languageName}</span> {/*| Use count:{" "}
+            <span className="fw-semibold">616400</span>*/}
           </p>
         </div>
         {/* <Trans i18nKey="tts.TtsModelListPage.form.modelSeeMoreLink">