Update js/iaConfigModule.js

js/iaConfigModule.js

@@ -1,277 +1,225 @@
-// js/iaConfigModule.js
-const defaultConfig = {
-  llm: {
-    provider: "deepseek",
-    apiKeys: { deepseek: "", openai: "" },
-    model: "deepseek-chat"
-  },
-  transcription: {
-    provider: "openai",
-    apiKeys: { openai: "", deepgram: "" },
-    models: { openai: "whisper-1", deepgram: "nova-2" }
-  }
-};
-
-// Lista de modelos actualizada (2025)
-export const llmProviders = [
-  { 
-    name: "OpenAI", 
-    value: "openai", 
-    models: [
-      // GPT-5 (IDs habituales)
-      "gpt-5",
-      "gpt-5-mini",
-      "gpt-5-nano",
-      "gpt-5-chat-latest",
-      // Otros modelos de referencia
-      "gpt-4o-mini-2024-07-18",
-      "chatgpt-4o-latest",
-      "o1-mini-2024-09-12",
-      "o4-mini-2025-04-16"
-    ],
-    url: "https://api.openai.com"
-  },
-  { 
-    name: "DeepSeek", 
-    value: "deepseek", 
-    models: ["deepseek-chat", "deepseek-reasoner"], 
-    url: "https://api.deepseek.com" 
-  }
-];
+// js/llmClient.js
+import { getIaConfig, llmProviders } from "./iaConfigModule.js";
 
-export const transcriptionProviders = [
-  { name: "OpenAI Whisper", value: "openai", models: ["whisper-1"], url: "https://api.openai.com" },
-  { name: "Deepgram", value: "deepgram", models: ["nova-2", "whisper-large"], url: "https://api.deepgram.com" }
-];
-
-function saveConfig(config) {
-  localStorage.setItem("iaConfig", JSON.stringify(config));
+/** Detecta familia GPT-5 (incluye submodelos y alias) */
+function isGpt5(model = "") {
+  const m = String(model || "").toLowerCase();
+  return m.startsWith("gpt-5");
 }
 
-function loadConfig() {
-  const config = JSON.parse(localStorage.getItem("iaConfig")) || structuredClone(defaultConfig);
-
-  // Migrar configuración antigua de transcription
-  if (config.transcription.apiKey !== undefined) {
-    const oldKey = config.transcription.apiKey;
-    const oldModel = config.transcription.model;
-    config.transcription.apiKeys = { [config.transcription.provider]: oldKey, deepgram: "" };
-    config.transcription.models = { [config.transcription.provider]: oldModel, deepgram: "nova-2" };
-    delete config.transcription.apiKey;
-    delete config.transcription.model;
-    saveConfig(config);
+/** Borrado profundo de claves en cualquier nivel */
+function deepDeleteKeys(obj, keys = []) {
+  if (!obj || typeof obj !== "object") return;
+  for (const k of Object.keys(obj)) {
+    if (keys.includes(k)) {
+      delete obj[k];
+      continue;
+    }
+    const val = obj[k];
+    if (Array.isArray(val)) {
+      for (const item of val) deepDeleteKeys(item, keys);
+    } else if (val && typeof val === "object") {
+      deepDeleteKeys(val, keys);
+    }
   }
+}
 
-  // Migrar configuración antigua de LLM apiKey a apiKeys
-  if (config.llm.apiKey !== undefined) {
-    const old = config.llm.apiKey;
-    config.llm.apiKeys = { ...defaultConfig.llm.apiKeys, [config.llm.provider]: old };
-    delete config.llm.apiKey;
-    saveConfig(config);
-  }
+/** Sanea el payload para modelos GPT-5: elimina params no soportados */
+function sanitizeForGpt5(payload) {
+  // Claves creativas y afines que algunos SDKs/flows reinyectan
+  const toStrip = [
+    "temperature",
+    "top_p",
+    "frequency_penalty",
+    "presence_penalty",
+    "best_of",
+    "n",
+    "logit_bias",
+    // Algunas libs anidan config aquí:
+    "generation_config"
+  ];
+  deepDeleteKeys(payload, toStrip);
+
+  // Si existía generation_config, asegúrate de borrarlo entero
+  if (payload.generation_config) delete payload.generation_config;
+
+  return payload;
+}
 
-  // Migrar modelos obsoletos de DeepSeek a 'deepseek-chat'
-  if (config.llm.provider === "deepseek" && (config.llm.model === "deepseek-v3" || config.llm.model === "deepseek-llm")) {
-    config.llm.model = "deepseek-chat";
-    console.log("[iaConfigModule] Migrado modelo DeepSeek a deepseek-chat");
-    saveConfig(config);
-  }
+/** Construye body para Chat Completions (OpenAI) */
+function buildOpenAIChatBody(model, messages, options = {}) {
+  const body = { model, messages };
 
-  // Migrar IDs antiguos inventados a los oficiales de GPT-5
-  if (config.llm.provider === "openai") {
-    if (config.llm.model === "gpt-5-2025-05-01") config.llm.model = "gpt-5";
-    if (config.llm.model === "gpt-5-mini-2025-05-01") config.llm.model = "gpt-5-mini";
-    saveConfig(config);
+  if (!isGpt5(model)) {
+    if (typeof options.temperature === "number") body.temperature = options.temperature;
+    if (typeof options.top_p === "number") body.top_p = options.top_p;
+    if (typeof options.frequency_penalty === "number") body.frequency_penalty = options.frequency_penalty;
+    if (typeof options.presence_penalty === "number") body.presence_penalty = options.presence_penalty;
   }
 
-  return config;
-}
+  if (options.response_format) body.response_format = options.response_format;
+  if (options.tools) body.tools = options.tools;
+  if (options.tool_choice) body.tool_choice = options.tool_choice;
 
-export function getIaConfig() {
-  return loadConfig();
+  return isGpt5(model) ? sanitizeForGpt5(body) : body;
 }
 
-export function renderIaConfigForm(containerId) {
-  let config = loadConfig();
-  const container = document.getElementById(containerId);
-  if (!container) {
-    console.error(`[iaConfigModule] No se encontró el contenedor '${containerId}'`);
-    document.body.insertAdjacentHTML(
-      "beforeend",
-      `<div style='color:red'>[Error] No se encontró el contenedor '${containerId}' para la configuración IA.</div>`
-    );
-    return;
-  }
+/** Construye body para Responses API (por si la usas en otro flujo) */
+function buildOpenAIResponsesBody(model, input, options = {}) {
+  const body = { model, input };
 
-  function maskApiKey(key) {
-    if (!key) return "";
-    if (key.length <= 8) return "*".repeat(key.length);
-    return key.substring(0, 3) + "-****" + key.slice(-4);
+  if (!isGpt5(model)) {
+    if (typeof options.temperature === "number") body.temperature = options.temperature;
+    if (typeof options.top_p === "number") body.top_p = options.top_p;
+    if (typeof options.frequency_penalty === "number") body.frequency_penalty = options.frequency_penalty;
+    if (typeof options.presence_penalty === "number") body.presence_penalty = options.presence_penalty;
   }
 
-  container.innerHTML = `
-    <div class="flex justify-between items-center mb-6 border-b pb-2 border-blue-100">
-      <h2 class="text-xl font-bold text-blue-700 flex items-center">
-        <i class='fas fa-cogs mr-2'></i>Configurar Proveedores IA
-      </h2>
-      <button id="btnCloseConfig" type="button" class="text-gray-500 hover:text-blue-600 text-2xl focus:outline-none" aria-label="Cerrar">
-        <i class="fas fa-times"></i>
-      </button>
-    </div>
-    <form id="iaConfigForm" class="space-y-6">
-      <div class="bg-blue-50 p-4 rounded-lg border border-blue-100 mb-2">
-        <label class="block font-semibold text-blue-800 mb-2">Proveedor LLM</label>
-        <select id="llmProvider" class="w-full mb-3 p-2 rounded border border-gray-300 focus:ring-2 focus:ring-blue-300">
-          ${llmProviders.map(p => `<option value="${p.value}">${p.name}</option>`).join("")}
-        </select>
-        <div class="flex items-center mb-3">
-          <input type="password" id="llmApiKey" class="flex-1 p-2 rounded border border-gray-300 mr-2 bg-gray-100" placeholder="API Key LLM" autocomplete="off">
-          <button class="text-blue-700 hover:text-blue-900 px-3 py-2 rounded focus:outline-none border border-blue-200 bg-white" type="button" id="toggleLlmApiKey">
-            <i class="fas fa-eye"></i>
-          </button>
-        </div>
-        <select id="llmModel" class="w-full p-2 rounded border border-gray-300 focus:ring-2 focus:ring-blue-300"></select>
-      </div>
-      <div class="bg-purple-50 p-4 rounded-lg border border-purple-100 mb-2">
-        <label class="block font-semibold text-purple-800 mb-2">Proveedor Transcripción</label>
-        <select id="transProvider" class="w-full mb-3 p-2 rounded border border-gray-300 focus:ring-2 focus:ring-purple-300">
-          ${transcriptionProviders.map(p => `<option value="${p.value}">${p.name}</option>`).join("")}
-        </select>
-        <div class="flex items-center mb-3">
-          <input type="password" id="transApiKey" class="flex-1 p-2 rounded border border-gray-300 mr-2 bg-gray-100" placeholder="API Key Transcripción" autocomplete="off">
-          <button class="text-purple-700 hover:text-purple-900 px-3 py-2 rounded focus:outline-none border border-purple-200 bg-white" type="button" id="toggleTransApiKey">
-            <i class="fas fa-eye"></i>
-          </button>
-        </div>
-        <select id="transModel" class="w-full p-2 rounded border border-gray-300 focus:ring-2 focus:ring-purple-300"></select>
-      </div>
-      <button type="submit" class="w-full bg-blue-600 hover:bg-blue-700 text-white font-semibold py-3 rounded-lg shadow transition-colors flex items-center justify-center text-lg">
-        <i class="fas fa-save mr-2"></i>Guardar configuración
-      </button>
-    </form>
-  `;
-
-  // Botón de cerrar modal
-  const closeBtn = document.getElementById("btnCloseConfig");
-  if (closeBtn) {
-    closeBtn.addEventListener("click", () => {
-      const modal = document.getElementById("configModal");
-      if (modal) modal.classList.remove("active");
-    });
-  }
+  if (options.response_format) body.response_format = options.response_format;
+  if (options.tools) body.tools = options.tools;
+  if (options.tool_choice) body.tool_choice = options.tool_choice;
 
-  // Set initial values
-  document.getElementById("llmProvider").value = config.llm.provider;
-  document.getElementById("llmApiKey").value = maskApiKey(config.llm.apiKeys[config.llm.provider] || "");
-  document.getElementById("transProvider").value = config.transcription.provider;
-  document.getElementById("transApiKey").value = maskApiKey(config.transcription.apiKeys[config.transcription.provider] || "");
+  return isGpt5(model) ? sanitizeForGpt5(body) : body;
+}
 
-  // API Key toggle (ver/ocultar)
-  document.getElementById("toggleLlmApiKey").addEventListener("click", () => {
-    const input = document.getElementById("llmApiKey");
-    input.type = input.type === "password" ? "text" : "password";
-  });
-  document.getElementById("toggleTransApiKey").addEventListener("click", () => {
-    const input = document.getElementById("transApiKey");
-    input.type = input.type === "password" ? "text" : "password";
+/** POST con reintento si hay error de parámetros no soportados */
+async function hardenedPost(url, apiKey, body, model) {
+  // Sanea una vez más justo antes de enviar
+  if (isGpt5(model)) sanitizeForGpt5(body);
+
+  let res = await fetch(url, {
+    method: "POST",
+    headers: {
+      "Authorization": `Bearer ${apiKey}`,
+      "Content-Type": "application/json"
+    },
+    body: JSON.stringify(body)
   });
 
-  // Populate models
-  function updateLlmModels() {
-    const prov = document.getElementById("llmProvider").value;
-    const providerObj = llmProviders.find(p => p.value === prov);
-    const models = providerObj.models;
-    const sel = document.getElementById("llmModel");
-    sel.innerHTML = models.map(m => `<option value="${m}">${m}</option>`).join("");
-
-    // Si el modelo guardado no está en la lista del proveedor, usar el primero y persistir
-    if (!models.includes(config.llm.model)) {
-      config.llm.model = models[0];
-      saveConfig(config);
+  if (!res.ok) {
+    let errJson = null, txt = "";
+    try { errJson = await res.json(); } catch { txt = await res.text(); }
+
+    const msg = errJson?.error?.message || txt || "";
+    const code = errJson?.error?.code || "";
+    const unsupported =
+      msg.includes("Unsupported value") ||
+      msg.includes("does not support") ||
+      code === "unsupported_value";
+
+    if (unsupported) {
+      // Reintento: payload mínimo (sin ningún creativo), ultra-saneado
+      const minimal = isGpt5(model)
+        ? sanitizeForGpt5({ ...body, model })
+        : { ...body, model };
+      delete minimal.temperature;
+      delete minimal.top_p;
+      delete minimal.frequency_penalty;
+      delete minimal.presence_penalty;
+      delete minimal.best_of;
+      delete minimal.n;
+      delete minimal.logit_bias;
+      delete minimal.generation_config;
+
+      res = await fetch(url, {
+        method: "POST",
+        headers: {
+          "Authorization": `Bearer ${apiKey}`,
+          "Content-Type": "application/json"
+        },
+        body: JSON.stringify(minimal)
+      });
     }
-    sel.value = config.llm.model;
-  }
 
-  function updateTransModels() {
-    const prov = document.getElementById("transProvider").value;
-    const providerObj = transcriptionProviders.find(p => p.value === prov);
-    const models = providerObj.models;
-    const sel = document.getElementById("transModel");
-    sel.innerHTML = models.map(m => `<option value="${m}">${m}</option>`).join("");
-    sel.value = config.transcription.models[prov] || models[0];
-    // Actualizar API Key input al cambiar proveedor
-    document.getElementById("transApiKey").value = maskApiKey(config.transcription.apiKeys[prov] || "");
+    if (!res.ok) {
+      const finalTxt = await res.text();
+      throw new Error(`OpenAI error ${res.status}: ${finalTxt}`);
+    }
   }
 
-  document.getElementById("llmProvider").addEventListener("change", () => {
-    const p = document.getElementById("llmProvider").value;
-    updateLlmModels();
-    // Refrescar config con todas las llaves y mostrar la del proveedor seleccionado
-    const fresh = loadConfig();
-    const keyEl = document.getElementById("llmApiKey");
-    if (keyEl) keyEl.value = maskApiKey(fresh.llm.apiKeys[p] || "");
+  return res.json();
+}
+
+/** Chat Completions */
+async function callOpenAIChat({ apiKey, model, messages, options }) {
+  const providerInfo = llmProviders.find(p => p.value === "openai");
+  const base = providerInfo?.url || "https://api.openai.com";
+  const url = `${base}/v1/chat/completions`;
+
+  const body = buildOpenAIChatBody(model, messages, options);
+  const data = await hardenedPost(url, apiKey, body, model);
+  const text = data?.choices?.[0]?.message?.content ?? "";
+  return { text, raw: data };
+}
+
+/** Responses API (por si alguna parte de tu app la usa) */
+async function callOpenAIResponses({ apiKey, model, input, options }) {
+  const providerInfo = llmProviders.find(p => p.value === "openai");
+  const base = providerInfo?.url || "https://api.openai.com";
+  const url = `${base}/v1/responses`;
+
+  const body = buildOpenAIResponsesBody(model, input, options);
+  const data = await hardenedPost(url, apiKey, body, model);
+  // Normalizamos a "text"
+  const outMsg =
+    data?.output?.[0]?.content?.[0]?.text ??
+    data?.content?.[0]?.text ??
+    data?.choices?.[0]?.message?.content ??
+    "";
+  return { text: outMsg, raw: data };
+}
+
+/** DeepSeek */
+async function callDeepSeekChat({ apiKey, model, messages, options }) {
+  const providerInfo = llmProviders.find(p => p.value === "deepseek");
+  const base = providerInfo?.url || "https://api.deepseek.com";
+  const url = `${base}/chat/completions`;
+
+  const body = { model, messages };
+  if (typeof options?.temperature === "number") body.temperature = options.temperature;
+  if (typeof options?.top_p === "number") body.top_p = options.top_p;
+  if (typeof options?.frequency_penalty === "number") body.frequency_penalty = options.frequency_penalty;
+  if (typeof options?.presence_penalty === "number") body.presence_penalty = options.presence_penalty;
+
+  const res = await fetch(url, {
+    method: "POST",
+    headers: {
+      "Authorization": `Bearer ${apiKey}`,
+      "Content-Type": "application/json"
+    },
+    body: JSON.stringify(body)
   });
 
-  document.getElementById("transProvider").addEventListener("change", updateTransModels);
-
-  updateLlmModels();
-  updateTransModels();
-
-  // Save on submit
-  document.getElementById("iaConfigForm").addEventListener("submit", e => {
-    e.preventDefault();
-    // Persistir configuración por proveedor
-    const prev = config;
-    const newConfig = { ...prev };
-
-    // LLM: provider, apiKeys y model
-    const llProv = document.getElementById("llmProvider").value;
-    const rawKey = document.getElementById("llmApiKey").value;
-    const oldKey = prev.llm.apiKeys[llProv] || "";
-    const newKey = rawKey === maskApiKey(oldKey) ? oldKey : rawKey;
-
-    newConfig.llm = { ...prev.llm, provider: llProv, model: document.getElementById("llmModel").value };
-    newConfig.llm.apiKeys = { ...prev.llm.apiKeys, [llProv]: newKey };
-
-    // Transcription: provider, apiKeys y models por proveedor
-    const tp = document.getElementById("transProvider").value;
-    const rawKeyTrans = document.getElementById("transApiKey").value;
-    const existingKeyTrans = prev.transcription.apiKeys[tp] || "";
-    const actualKeyTrans = rawKeyTrans === maskApiKey(existingKeyTrans) ? existingKeyTrans : rawKeyTrans;
-
-    newConfig.transcription.provider = tp;
-    newConfig.transcription.apiKeys = { ...prev.transcription.apiKeys, [tp]: actualKeyTrans };
-    newConfig.transcription.models = { ...prev.transcription.models, [tp]: document.getElementById("transModel").value };
-
-    console.log("[iaConfigModule] Configuración guardada:", newConfig);
-    saveConfig(newConfig);
-    // Actualizar config local después de guardar
-    config = newConfig;
-
-    // Notificar cambio
-    document.dispatchEvent(new CustomEvent("iaConfigChanged"));
-
-    // Ofuscar de nuevo las API keys en UI
-    document.getElementById("llmApiKey").value = maskApiKey(newConfig.llm.apiKeys[newConfig.llm.provider] || "");
-    document.getElementById("transApiKey").value = maskApiKey(newConfig.transcription.apiKeys[tp] || "");
-    document.getElementById("llmApiKey").type = "password";
-    document.getElementById("transApiKey").type = "password";
-
-    // Mensaje de éxito discreto
-    let msg = document.getElementById("iaConfigSavedMsg");
-    if (!msg) {
-      msg = document.createElement("div");
-      msg.id = "iaConfigSavedMsg";
-      msg.className = "fixed left-1/2 top-6 -translate-x-1/2 bg-green-500 text-white px-6 py-3 rounded shadow text-lg z-50";
-      msg.innerHTML = '<i class="fas fa-check-circle mr-2"></i>¡Configuración guardada!';
-      document.body.appendChild(msg);
-    } else {
-      msg.style.display = "block";
+  if (!res.ok) {
+    const txt = await res.text();
+    throw new Error(`DeepSeek error ${res.status}: ${txt}`);
+  }
+
+  const data = await res.json();
+  const text = data?.choices?.[0]?.message?.content ?? "";
+  return { text, raw: data };
+}
+
+/** Punto único */
+export async function callLLM(messages, options = {}) {
+  const cfg = getIaConfig();
+  const provider = cfg.llm.provider;
+  const model = cfg.llm.model;
+  if (!provider) throw new Error("Proveedor LLM no configurado.");
+  const apiKey = cfg.llm.apiKeys?.[provider];
+  if (!apiKey) throw new Error(`API Key no configurada para proveedor '${provider}'.`);
+
+  if (provider === "openai") {
+    // Si en algún lugar pasan "input" en vez de "messages", usa Responses API
+    if (options && Object.prototype.hasOwnProperty.call(options, "input")) {
+      return await callOpenAIResponses({ apiKey, model, input: options.input, options });
     }
-    setTimeout(() => { msg.style.display = "none"; }, 2000);
+    return await callOpenAIChat({ apiKey, model, messages, options });
+  }
 
-    // Cierra el modal
-    const modal = document.getElementById("configModal");
-    if (modal) modal.classList.remove("active");
-  });
+  if (provider === "deepseek") {
+    return await callDeepSeekChat({ apiKey, model, messages, options });
+  }
+
+  throw new Error(`Proveedor no soportado: ${provider}`);
 }