update STT/TTS option dropdowns

Mintplex-Labs · May 14, 2024 · 275be6a · 275be6a
1 parent e9e4ffb
commit 275be6a
Show file tree

Hide file tree

Showing 3 changed files with 9 additions and 11 deletions.
diff --git a/frontend/src/components/TextToSpeech/ElevenLabsOptions/index.jsx b/frontend/src/components/TextToSpeech/ElevenLabsOptions/index.jsx
@@ -84,18 +84,15 @@ function ElevenLabsModelSelection({ apiKey, settings }) {
       <select
         name="TTSElevenLabsVoiceModel"
         required={true}
+        defaultValue={settings?.TTSElevenLabsVoiceModel}
         className="bg-zinc-900 border-gray-500 text-white text-sm rounded-lg block w-full p-2.5"
       >
         {Object.keys(groupedModels)
           .sort()
           .map((organization) => (
             <optgroup key={organization} label={organization}>
               {groupedModels[organization].map((model) => (
-                <option
-                  key={model.id}
-                  value={model.id}
-                  selected={settings?.OpenAiModelPref === model.id}
-                >
+                <option key={model.id} value={model.id}>
                   {model.name}
                 </option>
               ))}

diff --git a/frontend/src/components/TextToSpeech/OpenAiOptions/index.jsx b/frontend/src/components/TextToSpeech/OpenAiOptions/index.jsx
@@ -35,7 +35,11 @@ export default function OpenAiTextToSpeechOptions({ settings }) {
         >
           {["alloy", "echo", "fable", "onyx", "nova", "shimmer"].map(
             (voice) => {
-              return <option value={voice}>{toProperCase(voice)}</option>;
+              return (
+                <option key={voice} value={voice}>
+                  {toProperCase(voice)}
+                </option>
+              );
             }
           )}
         </select>

diff --git a/frontend/src/pages/GeneralSettings/AudioPreference/tts.jsx b/frontend/src/pages/GeneralSettings/AudioPreference/tts.jsx
@@ -47,7 +47,7 @@ export default function TextToSpeechProvider({ settings }) {
   const searchInputRef = useRef(null);
 
   const handleSubmit = async (e) => {
-    e.preventDefault();
+    e?.preventDefault();
     const form = e.target;
     const data = { TextToSpeechProvider: selectedProvider };
     const formData = new FormData(form);
@@ -110,10 +110,7 @@ export default function TextToSpeechProvider({ settings }) {
         </div>
         <div className="w-full justify-end flex">
           {hasChanges && (
-            <CTAButton
-              onClick={() => handleSubmit()}
-              className="mt-3 mr-0 -mb-14 z-10"
-            >
+            <CTAButton className="mt-3 mr-0 -mb-14 z-10">
               {saving ? "Saving..." : "Save changes"}
             </CTAButton>
           )}