add temperature setting to v2

sutigit · sutigit · commit d268f955f472 · 2025-06-10T15:41:25.000+03:00
diff --git a/src/client/components/ChatV2/ChatV2.tsx b/src/client/components/ChatV2/ChatV2.tsx
@@ -37,35 +37,40 @@ export const ChatV2 = () => {
   const { infoTexts, isLoading: infoTextsLoading } = useInfoTexts()
 
   const { userStatus, isLoading: statusLoading, refetch: refetchStatus } = useUserStatus(courseId)
+
+  // local storage states
+  const localStoragePrefix = 'general'
   const [model, setModel] = useLocalStorageState<{ name: string }>('model-v2', {
     name: DEFAULT_MODEL,
   })
-
-  // local storage
-  const localStoragePrefix = 'general'
   // TODO: Do translation
   const defaultInstructions = 'Olet avulias avustaja'
   const [assistantInstructions, setAssistantInstructions] = useLocalStorageState<{ content: string }>(`${localStoragePrefix}-chat-instructions`, {
     content: defaultInstructions,
   })
+  const [modelTemperature, setModelTemperature] = useLocalStorageState<{ value: number }>(`${localStoragePrefix}-chat-model-temperature`, {
+    value: 0.5,
+  })
   const [message, setMessage] = useLocalStorageState<{ content: string }>(`${localStoragePrefix}-chat-current`, { content: '' })
   const [messages, setMessages] = useLocalStorageState<Message[]>(`${localStoragePrefix}-chat-messages`, [])
   const [prevResponse, setPrevResponse] = useLocalStorageState<{ id: string }>(`${localStoragePrefix}-prev-response`, { id: '' })
+  const [fileSearchResult, setFileSearchResult] = useLocalStorageState<FileSearchResult>('last-file-search', null)
 
-  // States
+  // UI States
   const [settingsModalOpen, setSettingsModalOpen] = useState(true)
-  const [activePromptId, setActivePromptId] = useState('')
   const [fileName, setFileName] = useState<string>('')
-  const [completion, setCompletion] = useState<string>('')
-  const [isCompletionDone, setIsCompletionDone] = useState<boolean>(true)
-  const [fileSearchResult, setFileSearchResult] = useLocalStorageState<FileSearchResult>('last-file-search', null)
-  const [streamController, setStreamController] = useState<AbortController>()
   const [alertOpen, setAlertOpen] = useState(false)
   const [disallowedFileType, setDisallowedFileType] = useState('')
   const [tokenUsageWarning, setTokenUsageWarning] = useState('')
   const [tokenWarningVisible, setTokenWarningVisible] = useState(false)
-  const [modelTemperature, setModelTemperature] = useState(0.5)
   const [saveConsent, setSaveConsent] = useState(true)
+
+  // Chat Streaming states
+  const [completion, setCompletion] = useState<string>('')
+  const [isCompletionDone, setIsCompletionDone] = useState<boolean>(true)
+  const [streamController, setStreamController] = useState<AbortController>()
+
+  // RAG states
   const [ragIndexId, setRagIndexId] = useState<number | null>(null)
   const ragIndex = ragIndices?.find((index) => index.id === ragIndexId) ?? null
 
@@ -176,7 +181,7 @@ export const ChatV2 = () => {
         model: model.name,
         formData: new FormData(),
         userConsent: true,
-        modelTemperature,
+        modelTemperature: modelTemperature.value,
         courseId,
         abortController: streamController,
         saveConsent,
@@ -414,6 +419,8 @@ export const ChatV2 = () => {
         setOpen={setSettingsModalOpen}
         assistantInstructions={assistantInstructions.content}
         setAssistantInstructions={(updatedInstructions) => setAssistantInstructions({ content: updatedInstructions })}
+        modelTemperature={modelTemperature.value}
+        setModelTemperature={(updatedTemperature) => setModelTemperature({ value: updatedTemperature })}
         model={model.name}
         setModel={(name) => setModel({ name })}
         setRagIndex={setRagIndexId}
diff --git a/src/client/components/ChatV2/SettingsModal.tsx b/src/client/components/ChatV2/SettingsModal.tsx
@@ -1,16 +1,19 @@
 import { Close } from '@mui/icons-material'
-import { Box, IconButton, Modal, TextField, Typography } from '@mui/material'
+import { Box, IconButton, Modal, Slider, TextField, Typography } from '@mui/material'
 import ModelSelector from './ModelSelector'
 import { validModels } from '../../../config'
 import React from 'react'
 import RagSelector from './RagSelector'
 import { RagIndexAttributes } from '../../../shared/types'
+import SettingsButton from './generics/SettingsButton'
 
 interface SettingsModalProps {
   open: boolean
   setOpen: (open: boolean) => void
   assistantInstructions: string
   setAssistantInstructions: (instructions: string) => void
+  modelTemperature: number
+  setModelTemperature: (value: number) => void
   model: string
   setModel: (model: string) => void
   setRagIndex: (ragIndex: number) => void
@@ -23,12 +26,18 @@ export const SettingsModal: React.FC<SettingsModalProps> = ({
   setOpen,
   assistantInstructions,
   setAssistantInstructions,
+  modelTemperature,
+  setModelTemperature,
   model,
   setModel,
   setRagIndex,
   ragIndices,
   currentRagIndex,
 }) => {
+  const resetSettings = () => {
+    alert('resetting')
+  }
+
   return (
     <Modal open={open} onClose={() => setOpen(false)}>
       <Box
@@ -39,38 +48,78 @@ export const SettingsModal: React.FC<SettingsModalProps> = ({
           transform: 'translate(-50%, -50%)',
           display: 'flex',
           flexDirection: 'column',
-          gap: '1.2rem',
+          justifyContent: 'space-between',
           minWidth: 600,
           width: '85vw',
           maxWidth: 1000,
-          minHeight: '70vh',
+          minHeight: '80vh',
+          maxHeight: '80vh',
           bgcolor: 'background.paper',
           boxShadow: 24,
-          p: '2.5rem',
           borderRadius: '0.3rem',
+          overflow: 'hidden',
         }}
       >
-        <IconButton onClick={() => setOpen(false)} sx={{ position: 'absolute', top: 8, right: 8, color: 'grey.500' }}>
+        <IconButton onClick={() => setOpen(false)} sx={{ position: 'absolute', top: 10, right: 20, color: 'grey.500' }}>
           <Close />
         </IconButton>
-        <Typography variant="h6" fontWeight={600}>
-          Alustus
-        </Typography>
-        <Typography variant="body1">
-          Alustuksella tarkoitetaan yleistason ohjeistusta keskustelulle. Kielimallia voi esimerkiksi pyytää käyttämään akateemista kieltä tai esittämään puutarhuria jota
-          haastatellaan kaktusten hoidosta.
-        </Typography>
-        {/* <ModelSelector currentModel={model} setModel={setModel} models={validModels.map((m) => m.name)} /> */}
-        {/* Disabled for now due to RAG not functioning cirreclty */}
-        {/* <RagSelector currentRagIndex={currentRagIndex} setRagIndex={setRagIndex} ragIndices={ragIndices} /> */}
-        <TextField
-          multiline
-          minRows={6}
-          maxRows={10}
-          label="Alustuksen sisältö"
-          value={assistantInstructions}
-          onChange={(e) => setAssistantInstructions(e.target.value)}
-        />
+
+        <Box
+          sx={{
+            flex: 1,
+            display: 'flex',
+            flexDirection: 'column',
+            gap: '1.2rem',
+            overflowY: 'auto',
+            p: '3rem',
+          }}
+        >
+          <Typography variant="h6" fontWeight={600}>
+            Keskustelun alustus
+          </Typography>
+          <Typography variant="body1">
+            Alustuksella tarkoitetaan yleistason ohjeistusta keskustelulle. Kielimallia voi esimerkiksi pyytää käyttämään akateemista kieltä tai esittämään puutarhuria
+            jota haastatellaan kaktusten hoidosta.
+          </Typography>
+          <TextField
+            multiline
+            minRows={6}
+            maxRows={10}
+            label="Alustuksen sisältö"
+            value={assistantInstructions}
+            onChange={(e) => setAssistantInstructions(e.target.value)}
+          />
+
+          <Typography variant="h6" fontWeight={600} mt="2rem">
+            Säädä kielimallin tarkkuutta
+          </Typography>
+          <Typography variant="body1">
+            Suuremmat arvot, kuten 0.8, tekevät tulosteesta satunnaisemman, kun taas pienemmät arvot, kuten 0.2, tekevät siitä tarkemman ja deterministisemmän.
+          </Typography>
+          <Box sx={{ border: '1px solid rgba(0,0,0,0.25)', borderRadius: '6px', maxWidth: 500, padding: '2rem' }}>
+            <Slider
+              min={0.0}
+              max={1.0}
+              step={0.1}
+              value={modelTemperature}
+              marks
+              valueLabelDisplay="auto"
+              onChange={(_event, value) => setModelTemperature(typeof value === 'number' ? value : modelTemperature)}
+            />
+            <Box sx={{ display: 'flex', justifyContent: 'space-between' }}>
+              <Typography>Tarkempi</Typography>
+              <Typography>Satunnainen</Typography>
+            </Box>
+          </Box>
+
+          {/* <ModelSelector currentModel={model} setModel={setModel} models={validModels.map((m) => m.name)} /> */}
+          {/* Disabled for now due to RAG not functioning cirreclty */}
+          {/* <RagSelector currentRagIndex={currentRagIndex} setRagIndex={setRagIndex} ragIndices={ragIndices} /> */}
+        </Box>
+
+        <Box sx={{ padding: '2rem 3rem', display: 'flex', borderTop: '1px solid rgba(0,0,0,0.25)', justifyContent: 'flex-end' }}>
+          <SettingsButton onClick={resetSettings}>Palauta oletusasetukset</SettingsButton>
+        </Box>
       </Box>
     </Modal>
   )
diff --git a/src/server/routes/openai.ts b/src/server/routes/openai.ts
@@ -53,7 +53,7 @@ const PostStreamSchemaV2 = z.object({
     assistantInstructions: z.string().optional(),
     messages: z.array(z.any()),
     userConsent: z.boolean().optional(),
-    modelTemperature: z.number().optional(),
+    modelTemperature: z.number().min(0).max(2).optional(),
     saveConsent: z.boolean().optional(),
     prevResponseId: z.string().optional(),
     courseId: z.string().optional(),
@@ -184,6 +184,7 @@ openaiRouter.post('/stream/v2', upload.single('file'), async (r, res) => {
     courseId,
     vectorStoreId,
     instructions,
+    temperature: options.modelTemperature,
   })
 
   const latestMessage = options.messages[options.messages.length - 1]
@@ -404,8 +405,10 @@ openaiRouter.post('/stream/:courseId/:version?', upload.single('file'), async (r
   }
 
   const responsesClient = new ResponsesClient({
-    model,
+    model: options.model,
     courseId,
+    instructions: options.assistantInstructions,
+    temperature: options.modelTemperature,
   })
 
   let events
diff --git a/src/server/util/azure/ResponsesAPI.ts b/src/server/util/azure/ResponsesAPI.ts
@@ -31,9 +31,22 @@ const client = getAzureOpenAIClient(process.env.GPT_4O_MINI)
 export class ResponsesClient {
   model: string
   instructions: string
+  temperature: number
   tools: FileSearchTool[]
 
-  constructor({ model, courseId, vectorStoreId, instructions }: { model: string; courseId?: string; vectorStoreId?: string; instructions?: string }) {
+  constructor({
+    model,
+    temperature,
+    courseId,
+    vectorStoreId,
+    instructions,
+  }: {
+    model: string
+    temperature: number
+    courseId?: string
+    vectorStoreId?: string
+    instructions?: string
+  }) {
     const deploymentId = validModels.find((m) => m.name === model)?.deployment
 
     if (!deploymentId) throw new Error(`Invalid model: ${model}, not one of ${validModels.map((m) => m.name).join(', ')}`)
@@ -47,6 +60,7 @@ export class ResponsesClient {
       : [] // needs to retrun empty array for null
 
     this.model = deploymentId
+    this.temperature = temperature
     this.instructions = instructions
     this.tools = fileSearchTool
   }
@@ -65,6 +79,7 @@ export class ResponsesClient {
         model: this.model,
         previous_response_id: prevResponseId || undefined,
         instructions: this.instructions,
+        temperature: this.temperature,
         input,
         stream: true,
         tools: this.tools,
@@ -143,6 +158,8 @@ export class ResponsesClient {
           break
 
         case 'response.completed':
+          console.log(`Response completed with temp: ${event.response.temperature}, model: ${event.response.model}`)
+
           await this.write(
             {
               type: 'complete',
