From f2d6b304327efc8ff3a3f628eb3f33053a5601ee Mon Sep 17 00:00:00 2001
From: Brandon Thomas <echelon@gmail.com>
Date: Tue, 22 Mar 2022 16:54:27 -0400
Subject: [PATCH] fixes

---
 .../src/pages/index/IndexPage.tsx                |  1 -
 .../src/pages/index/TtsComponent.tsx             | 16 ++++++++--------
 .../src/pages/index/TtsResultsList.tsx           |  7 +++----
 3 files changed, 11 insertions(+), 13 deletions(-)

diff --git a/packages/storyteller-home/src/pages/index/IndexPage.tsx b/packages/storyteller-home/src/pages/index/IndexPage.tsx
index 1a7705d549..dcca673fd2 100644
--- a/packages/storyteller-home/src/pages/index/IndexPage.tsx
+++ b/packages/storyteller-home/src/pages/index/IndexPage.tsx
@@ -76,7 +76,6 @@ function IndexPage () {
         <div className="hero-body">
 
           <h1 className="title is-4">Want to hear more?</h1>
-          <h2 className="subtitle is-6"></h2>
 
           <br />
 
diff --git a/packages/storyteller-home/src/pages/index/TtsComponent.tsx b/packages/storyteller-home/src/pages/index/TtsComponent.tsx
index 1ee7f6a0ed..3d1d2f343a 100644
--- a/packages/storyteller-home/src/pages/index/TtsComponent.tsx
+++ b/packages/storyteller-home/src/pages/index/TtsComponent.tsx
@@ -1,6 +1,6 @@
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useCallback, useEffect, useRef, useState } from 'react';
 import { v4 as uuidv4 } from 'uuid';
-import { GenerateTtsAudio, GenerateTtsAudioErrorType, GenerateTtsAudioRequest, GenerateTtsAudioIsError, GenerateTtsAudioIsOk } from '@storyteller/components/src/api/tts/GenerateTtsAudio';
+import { GenerateTtsAudio, GenerateTtsAudioRequest, GenerateTtsAudioIsError, GenerateTtsAudioIsOk } from '@storyteller/components/src/api/tts/GenerateTtsAudio';
 import { jobStateCanChange } from "@storyteller/components/src/jobs/JobStates";
 import { TtsInferenceJob, TtsInferenceJobStateResponsePayload } from "@storyteller/components/src/jobs/TtsInferenceJobs";
 import { ApiConfig } from '@storyteller/components';
@@ -25,7 +25,7 @@ interface Props {
 function TtsComponent(props: Props) {
   const [selectedModelToken, setSelectedModelToken] = useState(DEFAULT_MODEL_TOKEN);
   const [inferenceText, setInferenceText] = useState('');
-  const [maybeTtsError, setMaybeTtsError] = useState<GenerateTtsAudioErrorType|undefined>(undefined);
+  //const [maybeTtsError, setMaybeTtsError] = useState<GenerateTtsAudioErrorType|undefined>(undefined);
   const [jobs, setJobs] = useState<TtsInferenceJob[]>([]);
 
   const ttsInferenceJobs = useRef<TtsInferenceJob[]>([]);
@@ -76,19 +76,19 @@ function TtsComponent(props: Props) {
     .catch(e => { /* Ignore. */ });
   }
 
-  const pollJobs = () => {
+  const pollJobs = useCallback(() => {
     console.log('pollJob')
     ttsInferenceJobs.current.forEach(job => {
       if (jobStateCanChange(job.jobState)) {
         checkTtsJob(job.jobToken);
       }
     });
-  }
+  }, []);
 
   useEffect(() => {
     console.log('useEffect')
     setInterval(() => { pollJobs() }, 2000);
-  }, [])
+  }, [pollJobs])
 
   const handleChangeText = (ev: React.FormEvent<HTMLTextAreaElement>) => { 
     const textValue = (ev.target as HTMLTextAreaElement).value;
@@ -121,10 +121,10 @@ function TtsComponent(props: Props) {
     const response = await GenerateTtsAudio(request)
 
     if (GenerateTtsAudioIsOk(response)) {
-      setMaybeTtsError(undefined);
+      //setMaybeTtsError(undefined);
       enqueueTtsJob(response.inference_job_token);
     } else if (GenerateTtsAudioIsError(response)) {
-      setMaybeTtsError(response.error);
+      //setMaybeTtsError(response.error);
     }
 
     return false;
diff --git a/packages/storyteller-home/src/pages/index/TtsResultsList.tsx b/packages/storyteller-home/src/pages/index/TtsResultsList.tsx
index 75a198c5ec..910a755d06 100644
--- a/packages/storyteller-home/src/pages/index/TtsResultsList.tsx
+++ b/packages/storyteller-home/src/pages/index/TtsResultsList.tsx
@@ -1,5 +1,4 @@
 import React from 'react';
-import { Link } from 'react-router-dom';
 import { BucketConfig } from '@storyteller/components/src/api/BucketConfig';
 import { JobState } from '@storyteller/components/src/jobs/JobStates';
 import { TtsInferenceJob } from '@storyteller/components/src/jobs/TtsInferenceJobs';
@@ -76,10 +75,10 @@ function TtsResultsList(props: Props) {
             </audio>
             &nbsp;
 
-            <Link 
-              to={ttsPermalink}
+            <a
+              href={ttsPermalink}
               className="button is-normal is-outlined is-dark"
-              >Permalink &amp; download</Link>
+              >Permalink &amp; download</a>
               </div>
           </article>
           &nbsp;