From f7f78bd320354ccf5aa4deded26647b68f1f9816 Mon Sep 17 00:00:00 2001
From: Kedar Swami <kedar_swami@apprely.com>
Date: Sat, 25 Jul 2026 16:46:04 +0530
Subject: [PATCH 1/2] feat(ai): add responses api format support for custom
 chat models

---
 .../src/components/AiChatSidebar/index.js     | 17 +++++--
 .../Preferences/AI/CompatEndpointCard.js      | 15 +++++-
 .../src/components/Preferences/AI/index.js    |  3 +-
 .../src/providers/ReduxStore/slices/chat.js   |  2 +
 packages/bruno-electron/src/ipc/ai/chat.js    | 15 +++++-
 packages/bruno-electron/src/ipc/ai/index.js   |  5 +-
 .../bruno-electron/src/ipc/ai/providers.js    | 49 +++++++++++++------
 .../bruno-electron/src/store/preferences.js   | 20 +++++++-
 8 files changed, 99 insertions(+), 27 deletions(-)

diff --git a/packages/bruno-app/src/components/AiChatSidebar/index.js b/packages/bruno-app/src/components/AiChatSidebar/index.js
index e0120488c20..f64e12469a9 100644
--- a/packages/bruno-app/src/components/AiChatSidebar/index.js
+++ b/packages/bruno-app/src/components/AiChatSidebar/index.js
@@ -555,7 +555,8 @@ const AiChatSidebar = ({ collection, variant = 'sidebar' }) => {
     if (textareaRef.current) textareaRef.current.style.height = 'auto';
 
     try {
-      await dispatch(sendAiMessage(activeTabUid, text, allContent, requestContext, selectedModel, contentType, aiVariables, appEnabled, aiRequests));
+      const modelFormat = selectedModelEntry?.apiFormat || null;
+      await dispatch(sendAiMessage(activeTabUid, text, allContent, requestContext, selectedModel, modelFormat, contentType, aiVariables, appEnabled, aiRequests));
       setProcessingStage('applying');
       setTimeout(() => setProcessingStage(null), 500);
     } catch (err) {
@@ -667,11 +668,17 @@ const AiChatSidebar = ({ collection, variant = 'sidebar' }) => {
     try { localStorage.setItem(SELECTED_MODEL_LS_KEY, modelId); } catch {}
   };
 
-  const selectedModelLabel = useMemo(() => {
-    if (selectedModel === AUTO_MODEL_ID) return 'Auto';
-    return availableModels.find((m) => m.id === selectedModel)?.label || 'Auto';
+  const selectedModelEntry = useMemo(() => {
+    if (selectedModel === AUTO_MODEL_ID) return null;
+    return availableModels.find((m) => m.id === selectedModel) || null;
   }, [availableModels, selectedModel]);
 
+  const selectedModelLabel = useMemo(() => {
+    if (!selectedModelEntry) return 'Auto';
+    const suffix = selectedModelEntry.apiFormat === 'responses' ? ' · Responses API' : '';
+    return `${selectedModelEntry.label}${suffix}`;
+  }, [selectedModelEntry]);
+
   const ModelSelectorTrigger = forwardRef((props, ref) => (
     <div ref={ref} className="model-btn" {...props}>
       <IconSparkles size={14} strokeWidth={1.75} />
@@ -686,7 +693,7 @@ const AiChatSidebar = ({ collection, variant = 'sidebar' }) => {
       { id: AUTO_MODEL_ID, label: 'Auto', onClick: () => handleModelSelect(AUTO_MODEL_ID) },
       ...availableModels.map((model) => ({
         id: model.id,
-        label: model.label,
+        label: `${model.label}${model.apiFormat === 'responses' ? ' · Responses API' : ''}`,
         onClick: () => handleModelSelect(model.id)
       }))
     ],
diff --git a/packages/bruno-app/src/components/Preferences/AI/CompatEndpointCard.js b/packages/bruno-app/src/components/Preferences/AI/CompatEndpointCard.js
index 70fd64c4766..3bea07cb548 100644
--- a/packages/bruno-app/src/components/Preferences/AI/CompatEndpointCard.js
+++ b/packages/bruno-app/src/components/Preferences/AI/CompatEndpointCard.js
@@ -137,7 +137,8 @@ const CompatEndpointCard = ({
     onAddModel({
       id: uuid(),
       modelId: id,
-      label: newModelLabel.trim() || id
+      label: newModelLabel.trim() || id,
+      apiFormat: 'chat-completions'
     });
     setNewModelId('');
     setNewModelLabel('');
@@ -375,6 +376,7 @@ const CompatEndpointCard = ({
                   {models.map((model) => {
                     const enabled = isModelEnabled(model.id);
                     const disabled = !provider.configured || !providerEnabled;
+                    const apiFormat = model.apiFormat || 'chat-completions';
                     return (
                       <div
                         key={model.id}
@@ -401,9 +403,18 @@ const CompatEndpointCard = ({
                           placeholder="Model id"
                           onChange={(e) => onUpdateModel(model.id, { modelId: e.target.value })}
                         />
+                        <select
+                          className="compat-inline-input flex-[0.9] text-xs"
+                          value={apiFormat}
+                          onChange={(e) => onUpdateModel(model.id, { apiFormat: e.target.value })}
+                          disabled={disabled}
+                        >
+                          <option value="chat-completions">Chat Completions</option>
+                          <option value="responses">Responses API</option>
+                        </select>
                         <button
                           type="button"
-                          className="btn-icon danger w-6 h-6 box-border inline-flex items-center justify-center cursor-pointer"
+                          className="btn-icon danger w-7 h-7 box-border inline-flex items-center justify-center cursor-pointer"
                           onClick={() => onRemoveModel(model.id)}
                           title="Remove model"
                           aria-label="Remove model"
diff --git a/packages/bruno-app/src/components/Preferences/AI/index.js b/packages/bruno-app/src/components/Preferences/AI/index.js
index c699a0b24b3..fc186a31ce6 100644
--- a/packages/bruno-app/src/components/Preferences/AI/index.js
+++ b/packages/bruno-app/src/components/Preferences/AI/index.js
@@ -35,7 +35,8 @@ const aiPreferencesSchema = Yup.object().shape({
         Yup.object().shape({
           id: Yup.string().required(),
           label: Yup.string().max(120).nullable(),
-          modelId: Yup.string().max(200).nullable()
+          modelId: Yup.string().max(200).nullable(),
+          apiFormat: Yup.string().oneOf(['chat-completions', 'responses']).nullable()
         })
       )
     })
diff --git a/packages/bruno-app/src/providers/ReduxStore/slices/chat.js b/packages/bruno-app/src/providers/ReduxStore/slices/chat.js
index 1bb0712bee5..80b85550b28 100644
--- a/packages/bruno-app/src/providers/ReduxStore/slices/chat.js
+++ b/packages/bruno-app/src/providers/ReduxStore/slices/chat.js
@@ -251,6 +251,7 @@ export const sendAiMessage = (
   allContent,
   requestContext,
   model,
+  modelApiFormat,
   contentType = 'app',
   variables = [],
   appEnabled = true,
@@ -394,6 +395,7 @@ export const sendAiMessage = (
       requests,
       requestId,
       model,
+      modelApiFormat,
       appEnabled
     });
   });
diff --git a/packages/bruno-electron/src/ipc/ai/chat.js b/packages/bruno-electron/src/ipc/ai/chat.js
index 4f8dd2d32b0..9aeed84ea99 100644
--- a/packages/bruno-electron/src/ipc/ai/chat.js
+++ b/packages/bruno-electron/src/ipc/ai/chat.js
@@ -110,7 +110,18 @@ const registerChatIpc = ({ mainWindow, resolveModel, pickDefaultModelId, isAiEna
   });
 
   ipcMain.on('renderer:ai-chat-stream', async (_event, payload) => {
-    const { messages, allContent, contentType, requestContext, variables, requests, requestId, model: modelId, appEnabled } = payload || {};
+    const {
+      messages,
+      allContent,
+      contentType,
+      requestContext,
+      variables,
+      requests,
+      requestId,
+      model: modelId,
+      modelApiFormat,
+      appEnabled
+    } = payload || {};
 
     const send = (channel, data) => {
       if (mainWindow?.webContents && !mainWindow.webContents.isDestroyed()) {
@@ -149,7 +160,7 @@ const registerChatIpc = ({ mainWindow, resolveModel, pickDefaultModelId, isAiEna
 
     let model;
     try {
-      model = resolveModel(effectiveModelId);
+      model = resolveModel(effectiveModelId, { apiFormatOverride: modelApiFormat });
     } catch (err) {
       send('main:ai-chat-error', { requestId, error: err.message });
       return;
diff --git a/packages/bruno-electron/src/ipc/ai/index.js b/packages/bruno-electron/src/ipc/ai/index.js
index a7c2baf48bb..3dc841aaf22 100644
--- a/packages/bruno-electron/src/ipc/ai/index.js
+++ b/packages/bruno-electron/src/ipc/ai/index.js
@@ -72,13 +72,14 @@ const buildStatus = () => {
   };
 };
 
-const resolveModel = (modelId) => {
+const resolveModel = (modelId, { apiFormatOverride } = {}) => {
   if (!isEnabled()) {
     throw new Error('AI features are disabled. Enable them in Preferences > AI.');
   }
   return getModel(modelId, {
     aiPreferences: getAiPrefs(),
-    getApiKey: (providerId) => aiKeyStore.getKey(providerId)
+    getApiKey: (providerId) => aiKeyStore.getKey(providerId),
+    apiFormatOverride
   });
 };
 
diff --git a/packages/bruno-electron/src/ipc/ai/providers.js b/packages/bruno-electron/src/ipc/ai/providers.js
index daac3f8f851..0d5417e529f 100644
--- a/packages/bruno-electron/src/ipc/ai/providers.js
+++ b/packages/bruno-electron/src/ipc/ai/providers.js
@@ -46,14 +46,14 @@ const PROVIDERS = {
 // autocomplete drop those params for reasoning models to silence warnings.
 const MODEL_DEFINITIONS = {
   // OpenAI
-  'gpt-4o-mini': { provider: 'openai', modelId: 'gpt-4o-mini', label: 'GPT-4o Mini' },
-  'gpt-4o': { provider: 'openai', modelId: 'gpt-4o', label: 'GPT-4o' },
-  'gpt-5': { provider: 'openai', modelId: 'gpt-5', label: 'GPT-5', reasoning: true },
-  'gpt-5-mini': { provider: 'openai', modelId: 'gpt-5-mini', label: 'GPT-5 Mini', reasoning: true },
+  'gpt-4o-mini': { provider: 'openai', modelId: 'gpt-4o-mini', label: 'GPT-4o Mini', apiFormat: 'chat-completions' },
+  'gpt-4o': { provider: 'openai', modelId: 'gpt-4o', label: 'GPT-4o', apiFormat: 'chat-completions' },
+  'gpt-5': { provider: 'openai', modelId: 'gpt-5', label: 'GPT-5', reasoning: true, apiFormat: 'chat-completions' },
+  'gpt-5-mini': { provider: 'openai', modelId: 'gpt-5-mini', label: 'GPT-5 Mini', reasoning: true, apiFormat: 'chat-completions' },
   // Anthropic
-  'claude-opus-4-7': { provider: 'anthropic', modelId: 'claude-opus-4-7', label: 'Claude Opus 4.7', reasoning: true },
-  'claude-sonnet-4-6': { provider: 'anthropic', modelId: 'claude-sonnet-4-6', label: 'Claude Sonnet 4.6', reasoning: true },
-  'claude-haiku-4-5': { provider: 'anthropic', modelId: 'claude-haiku-4-5-20251001', label: 'Claude Haiku 4.5', reasoning: true }
+  'claude-opus-4-7': { provider: 'anthropic', modelId: 'claude-opus-4-7', label: 'Claude Opus 4.7', reasoning: true, apiFormat: 'chat-completions' },
+  'claude-sonnet-4-6': { provider: 'anthropic', modelId: 'claude-sonnet-4-6', label: 'Claude Sonnet 4.6', reasoning: true, apiFormat: 'chat-completions' },
+  'claude-haiku-4-5': { provider: 'anthropic', modelId: 'claude-haiku-4-5-20251001', label: 'Claude Haiku 4.5', reasoning: true, apiFormat: 'chat-completions' }
 };
 
 const isReasoningModel = (modelId) => Boolean(MODEL_DEFINITIONS[modelId]?.reasoning);
@@ -133,7 +133,8 @@ const listModels = (aiPreferences) => {
     id,
     label: def.label,
     provider: def.provider,
-    isCustom: false
+    isCustom: false,
+    apiFormat: def.apiFormat || 'chat-completions'
   }));
 
   const endpoints = Array.isArray(aiPreferences?.openaiCompatibleEndpoints)
@@ -149,7 +150,8 @@ const listModels = (aiPreferences) => {
         id: model.id,
         label: model.label || model.modelId,
         provider: providerIdFromEndpointId(endpoint.id),
-        isCustom: true
+        isCustom: true,
+        apiFormat: model.apiFormat || 'chat-completions'
       });
     }
   }
@@ -165,7 +167,8 @@ const resolveModelDefinition = (modelId, aiPreferences) => {
       providerId: def.provider,
       sdkModelId: def.modelId,
       label: def.label,
-      baseURL: null
+      baseURL: null,
+      apiFormat: def.apiFormat || 'chat-completions'
     };
   }
 
@@ -180,7 +183,8 @@ const resolveModelDefinition = (modelId, aiPreferences) => {
         providerId: providerIdFromEndpointId(endpoint.id),
         sdkModelId: match.modelId,
         label: match.label || match.modelId,
-        baseURL: endpoint.baseURL || ''
+        baseURL: endpoint.baseURL || '',
+        apiFormat: match.apiFormat || 'chat-completions'
       };
     }
   }
@@ -203,7 +207,7 @@ const providerLabel = (providerId, aiPreferences) => {
  * Resolve a Bruno model id to a vercel-ai SDK model instance.
  * Throws if the provider isn't configured (no key) or the model is unknown.
  */
-const getModel = (modelId, { aiPreferences, getApiKey }) => {
+const getModel = (modelId, { aiPreferences, getApiKey, apiFormatOverride }) => {
   const def = resolveModelDefinition(modelId, aiPreferences);
   if (!def) throw new Error(`Unknown model: ${modelId}`);
 
@@ -223,7 +227,19 @@ const getModel = (modelId, { aiPreferences, getApiKey }) => {
   }
 
   const sdk = getSdk({ providerId: def.providerId, apiKey, baseURL: def.baseURL });
-  if (isOpenAiCompatibleProviderId(def.providerId)) return sdk.chat(def.sdkModelId);
+
+  const format = apiFormatOverride || def.apiFormat || 'chat-completions';
+  if (format === 'responses') {
+    if (typeof sdk.responses === 'function') {
+      return sdk.responses(def.sdkModelId);
+    }
+    throw new Error(`${providerLabel(def.providerId, aiPreferences)} does not support the Responses API. Switch this model to Chat Completions in Preferences > AI.`);
+  }
+
+  if (typeof sdk.chat === 'function') {
+    return sdk.chat(def.sdkModelId);
+  }
+
   return sdk(def.sdkModelId);
 };
 
@@ -247,7 +263,12 @@ const getAvailableModels = ({ aiPreferences, hasApiKey }) => {
       if (!endpoint?.baseURL) continue;
     }
 
-    out.push({ id: model.id, label: model.label, provider: model.provider });
+    out.push({
+      id: model.id,
+      label: model.label,
+      provider: model.provider,
+      apiFormat: model.apiFormat || 'chat-completions'
+    });
   }
   return out;
 };
diff --git a/packages/bruno-electron/src/store/preferences.js b/packages/bruno-electron/src/store/preferences.js
index f809badf2cf..5d12ec3d2db 100644
--- a/packages/bruno-electron/src/store/preferences.js
+++ b/packages/bruno-electron/src/store/preferences.js
@@ -181,7 +181,8 @@ const preferencesSchema = Yup.object().shape({
           Yup.object({
             id: Yup.string().required(),
             label: Yup.string().max(120).nullable(),
-            modelId: Yup.string().max(200).nullable()
+            modelId: Yup.string().max(200).nullable(),
+            apiFormat: Yup.string().oneOf(['chat-completions', 'responses']).nullable()
           })
         )
       })
@@ -331,6 +332,23 @@ class PreferencesStore {
       this.store.set('preferences', preferences);
     }
 
+    const endpoints = get(preferences, 'ai.openaiCompatibleEndpoints');
+    if (Array.isArray(endpoints)) {
+      let mutated = false;
+      for (const endpoint of endpoints) {
+        if (!endpoint || !Array.isArray(endpoint.models)) continue;
+        for (const model of endpoint.models) {
+          if (model && !model.apiFormat) {
+            model.apiFormat = 'chat-completions';
+            mutated = true;
+          }
+        }
+      }
+      if (mutated) {
+        this.store.set('preferences', preferences);
+      }
+    }
+
     return merge({}, defaultPreferences, preferences);
   }
 

From a0731d6a25a5934565013f47faf4ddb54070d852 Mon Sep 17 00:00:00 2001
From: Kedar Swami <kedar_swami@apprely.com>
Date: Sat, 25 Jul 2026 17:03:23 +0530
Subject: [PATCH 2/2] fix(ai): validate model api format and add fallback aria
 labels

---
 .../src/components/Preferences/AI/CompatEndpointCard.js      | 2 ++
 packages/bruno-electron/src/ipc/ai/providers.js              | 5 ++++-
 2 files changed, 6 insertions(+), 1 deletion(-)

diff --git a/packages/bruno-app/src/components/Preferences/AI/CompatEndpointCard.js b/packages/bruno-app/src/components/Preferences/AI/CompatEndpointCard.js
index 3bea07cb548..6659cd447c1 100644
--- a/packages/bruno-app/src/components/Preferences/AI/CompatEndpointCard.js
+++ b/packages/bruno-app/src/components/Preferences/AI/CompatEndpointCard.js
@@ -377,6 +377,7 @@ const CompatEndpointCard = ({
                     const enabled = isModelEnabled(model.id);
                     const disabled = !provider.configured || !providerEnabled;
                     const apiFormat = model.apiFormat || 'chat-completions';
+                    const modelName = model.label || model.modelId || model.id;
                     return (
                       <div
                         key={model.id}
@@ -408,6 +409,7 @@ const CompatEndpointCard = ({
                           value={apiFormat}
                           onChange={(e) => onUpdateModel(model.id, { apiFormat: e.target.value })}
                           disabled={disabled}
+                          aria-label={`API format for ${modelName}`}
                         >
                           <option value="chat-completions">Chat Completions</option>
                           <option value="responses">Responses API</option>
diff --git a/packages/bruno-electron/src/ipc/ai/providers.js b/packages/bruno-electron/src/ipc/ai/providers.js
index 0d5417e529f..9fed1056213 100644
--- a/packages/bruno-electron/src/ipc/ai/providers.js
+++ b/packages/bruno-electron/src/ipc/ai/providers.js
@@ -228,7 +228,10 @@ const getModel = (modelId, { aiPreferences, getApiKey, apiFormatOverride }) => {
 
   const sdk = getSdk({ providerId: def.providerId, apiKey, baseURL: def.baseURL });
 
-  const format = apiFormatOverride || def.apiFormat || 'chat-completions';
+    const format = apiFormatOverride || def.apiFormat || 'chat-completions';
+    if (format && format !== 'chat-completions' && format !== 'responses') {
+      throw new Error(`Unsupported API format "${format}" for ${providerLabel(def.providerId, aiPreferences)}. Supported formats are Chat Completions and Responses.`);
+    }
   if (format === 'responses') {
     if (typeof sdk.responses === 'function') {
       return sdk.responses(def.sdkModelId);