Merge pull request github#16 from reels-automation/voces-fix

added microsoft voices

Author: darthpedroo

src/fetchs/data-frontend/data_frontend.ts

@@ -37,4 +37,29 @@ export const getVoiceModels = async () => {
     console.error("Error al obtener los models:", err);
     return [];
   }
-}
+}
+
+export async function getMicrosoftVoices(): Promise<string[]> {
+  const response = await fetch(
+    "https://speech.platform.bing.com/consumer/speech/synthesize/readaloud/voices/list?trustedclienttoken=6A5AA1D4EAFF4E9FB37E23D68491D6F4"
+  );
+
+  if (!response.ok) {
+    throw new Error("Failed to fetch Microsoft TTS voices");
+  }
+
+  const voices = await response.json();
+
+  const languagePrefixes = ["es", "es-", "ca", "en", "en-"];
+
+  // Solo devolver el ShortName (string)
+  const filteredVoices = voices
+    .filter((voice: any) =>
+      languagePrefixes.some((prefix) => voice.Locale?.startsWith(prefix))
+    )
+    .map((voice: any) => voice.ShortName);
+
+  return filteredVoices;
+}
+
+

src/pages/home/components/create_video_popup.tsx

@@ -24,6 +24,7 @@ import {
 import { getOllamaModels } from "@/fetchs/data-frontend/data_frontend";
 import { getGameplays } from "@/fetchs/data-frontend/data_frontend";
 import { getVoiceModels } from "@/fetchs/data-frontend/data_frontend";
+import { getMicrosoftVoices } from "@/fetchs/data-frontend/data_frontend";
 
 interface CreateVideoPopUpProps {
   isOpen: boolean;
@@ -49,6 +50,7 @@ const CreateVideoPopUp: React.FC<CreateVideoPopUpProps> = ({ isOpen, closePopup,
   const [gptModels, setGptModels] = useState<string[]>([]);
   const [gameplays, setGameplays] = useState<Gameplay[]>([])
   const [voiceModels, setVoiceModels] = useState<VoiceModel[]>([])
+  const [ttsVoices, setTtsVoices] = useState<string[]>([]);
   const [formData, setFormData] = useState({
     tema: "",
     usuario: "5e00feba-5118-4289-b465-878a4bb2ed58",
@@ -160,6 +162,32 @@ const CreateVideoPopUp: React.FC<CreateVideoPopUpProps> = ({ isOpen, closePopup,
   fetchVoiceModels();
 }, []);
 
+useEffect(() => {
+  const fetchTtsVoices = async () => {
+    try {
+      const data = await getMicrosoftVoices();
+      setTtsVoices(data);
+
+      // Opcional: Setear voz por defecto si no hay una definida
+      if (data.length > 0 && !formData.audio_item[0].tts_voice) {
+        setFormData((prev) => ({
+          ...prev,
+          audio_item: [
+            {
+              ...prev.audio_item[0],
+              tts_voice: data[0],
+            },
+          ],
+        }));
+      }
+    } catch (error) {
+      console.error("Error al cargar las voces TTS de Microsoft", error);
+    }
+  };
+
+  fetchTtsVoices();
+}, []);
+
 
   function getSubFromToken(): string  {
     try {
@@ -488,8 +516,47 @@ const CreateVideoPopUp: React.FC<CreateVideoPopUpProps> = ({ isOpen, closePopup,
                       </Select>
                     </div>
                   </div>
+                                <div className="space-y-2">
+  <Label
+    htmlFor="tts_voice"
+    className="text-sm font-medium text-gray-700 flex items-center"
+  >
+    Voz TTS
+  </Label>
+  <Select
+    value={formData.audio_item[0].tts_voice}
+    onValueChange={(value) =>
+      setFormData((prev) => ({
+        ...prev,
+        audio_item: [
+          {
+            ...prev.audio_item[0],
+            tts_voice: value,
+          },
+        ],
+      }))
+    }
+  >
+    <SelectTrigger className="h-12 border-gray-300 focus:border-purple-500 focus:ring-purple-500 cursor-pointer">
+      <SelectValue placeholder="Selecciona voz TTS" />
+    </SelectTrigger>
+    <SelectContent>
+  {ttsVoices.map((voiceShortName) => (
+        <SelectItem key={voiceShortName} value={voiceShortName} className="cursor-pointer">
+          {voiceShortName}
+        </SelectItem>
+      ))}
+
+    </SelectContent>
+  </Select>
+</div>
+
                 </div>
 
+
+
+
+
                 {/* Additional Configuration */}
                 <div className="bg-white rounded-xl p-6 border border-gray-200 shadow-sm">
                   <h3 className="text-lg font-semibold text-gray-800 mb-4 flex items-center">