feat(openai): add support for OpenAI reasoning API

Signed-off-by: Adrien Kara <[email protected]>

Author: IGLOU-EU

src/renderer/components/ReasoningEffortSelect.tsx

@@ -0,0 +1,45 @@
+import { useEffect } from 'react'
+import { Select, MenuItem, Typography, Box } from '@mui/material'
+import { useTranslation } from 'react-i18next'
+
+export interface Props {
+    value: string
+    onChange: (value: string) => void
+    className?: string
+}
+
+export default function ReasoningEffortSelect(props: Props) {
+    const { t } = useTranslation()
+
+    useEffect(() => {
+        if (!props.value) {
+            props.onChange('medium')
+        }
+    }, [])
+
+    const handleChange = (event: any) => {
+        props.onChange(event.target.value as string)
+    }
+
+    return (
+        <Box sx={{ margin: '10px' }} className={props.className}>
+            <Box>
+                <Typography id="reasoning-effort-select" gutterBottom>
+                    {t('Reasoning Effort')}
+                </Typography>
+            </Box>
+            <Box sx={{ display: 'flex', alignItems: 'center' }}>
+                <Select
+                    value={props.value || 'medium'}
+                    onChange={handleChange}
+                    fullWidth
+                    size="small"
+                >
+                    <MenuItem value="low">{t('Low')}</MenuItem>
+                    <MenuItem value="medium">{t('Medium')}</MenuItem>
+                    <MenuItem value="high">{t('High')}</MenuItem>
+                </Select>
+            </Box>
+        </Box>
+    )
+}

src/renderer/packages/models/openai.ts

@@ -8,6 +8,7 @@ interface Options {
     apiPath?: string
     model: Model | 'custom-model'
     openaiCustomModel?: string
+    openaiReasoningEffort: string
     temperature: number
     topP: number
 }
@@ -48,10 +49,25 @@ export default class OpenAI extends Base {
 
         rawMessages = injectModelSystemPrompt(model, rawMessages)
 
-        if (model.startsWith('o1')) {
-            const messages = await populateO1Message(rawMessages)
-            return this.requestChatCompletionsNotStream({ model, messages }, signal, onResultChange)
+        // o1-mini and o1-preview does not support reasoning unlike o1 relase
+        if (model.startsWith('o1-mini') || model.startsWith('o1-preview')) {
+            const messages = await populateReasoningMessage(rawMessages)
+            return this.requestChatCompletionsNotStream({
+                model, 
+                messages,
+            }, signal, onResultChange)
         }
+
+        // https://platform.openai.com/docs/guides/reasoning
+        if (model.startsWith('o')) {
+            const messages = await populateReasoningMessage(rawMessages)
+            return this.requestChatCompletionsNotStream({
+                model, 
+                messages,
+                reasoning_effort: this.options.openaiReasoningEffort,
+            }, signal, onResultChange)
+        }
+
         const messages = await populateGPTMessage(rawMessages)
         return this.requestChatCompletionsStream({
             messages,
@@ -286,7 +302,7 @@ export async function populateGPTMessage(rawMessages: Message[]): Promise<OpenAI
     return messages
 }
 
-export async function populateO1Message(rawMessages: Message[]): Promise<OpenAIMessage[]> {
+export async function populateReasoningMessage(rawMessages: Message[]): Promise<OpenAIMessage[]> {
     const messages: OpenAIMessage[] = rawMessages.map((m) => ({
         role: m.role === 'system' ? 'user' : m.role,
         content: m.content,

src/renderer/pages/SettingDialog/OpenAISetting.tsx

@@ -2,6 +2,7 @@ import { Typography, Box } from '@mui/material'
 import { ModelSettings } from '../../../shared/types'
 import { useTranslation } from 'react-i18next'
 import { Accordion, AccordionSummary, AccordionDetails } from '../../components/Accordion'
+import ReasoningEffortSelect from '../../components/ReasoningEffortSelect'
 import TemperatureSlider from '../../components/TemperatureSlider'
 import TopPSlider from '../../components/TopPSlider'
 import PasswordTextField from '../../components/PasswordTextField'
@@ -17,6 +18,11 @@ interface ModelConfigProps {
 export default function OpenAISetting(props: ModelConfigProps) {
     const { settingsEdit, setSettingsEdit } = props
     const { t } = useTranslation()
+    const model = settingsEdit.model;
+    const isReasoningModel = model?.startsWith('o') && 
+        !model?.startsWith('o1-preview') && 
+        !model?.startsWith('o1-mini');
+
     return (
         <Box>
             <PasswordTextField
@@ -61,14 +67,26 @@ export default function OpenAISetting(props: ModelConfigProps) {
                         }
                     />
 
-                    <TemperatureSlider
-                        value={settingsEdit.temperature}
-                        onChange={(value) => setSettingsEdit({ ...settingsEdit, temperature: value })}
-                    />
-                    <TopPSlider
-                        topP={settingsEdit.topP}
-                        setTopP={(v) => setSettingsEdit({ ...settingsEdit, topP: v })}
-                    />
+                    {isReasoningModel && (
+                        <ReasoningEffortSelect
+                            value={settingsEdit.openaiReasoningEffort}
+                            onChange={(value) => setSettingsEdit({ ...settingsEdit, openaiReasoningEffort: value })}
+                        />
+                    )}
+
+                    {!model?.startsWith('o') && (
+                        <>
+                            <TemperatureSlider
+                                value={settingsEdit.temperature}
+                                onChange={(value) => setSettingsEdit({ ...settingsEdit, temperature: value })}
+                            />
+                            <TopPSlider
+                                topP={settingsEdit.topP}
+                                setTopP={(v) => setSettingsEdit({ ...settingsEdit, topP: v })}
+                            />
+                        </>
+                    )}
+                    
                     <MaxContextMessageCountSlider
                         value={settingsEdit.openaiMaxContextMessageCount}
                         onChange={(v) => setSettingsEdit({ ...settingsEdit, openaiMaxContextMessageCount: v })}

src/shared/defaults.ts

@@ -53,6 +53,7 @@ export function settings(): Settings {
         siliconCloudModel: 'THUDM/glm-4-9b-chat',
 
         autoGenerateTitle: true,
+        openaiReasoningEffort: 'medium',
     }
 }
 

src/shared/types.ts

@@ -118,6 +118,7 @@ export interface ModelSettings {
     temperature: number
     topP: number
     openaiMaxContextMessageCount: number
+    openaiReasoningEffort: string
 }
 
 export interface Settings extends ModelSettings {