11import React , { FunctionComponent , useEffect , useState } from 'react'
22import Constants from '../../constants'
33import eventService from '../../events/eventService'
4-
5- const ModelOptions = [
6- { value : "gpt-4-32k-0314" } ,
7- { value : "gpt-4-32k" } ,
8- { value : "gpt-4-0314" } ,
9- { value : "gpt-4" } ,
10- { value : "gpt-3.5-turbo-0301" } ,
11- { value : "gpt-3.5-turbo" } ,
12- { value : "text-davinci-003" } ,
13- { value : "text-davinci-002" } ,
14- { value : "text-curie-001" } ,
15- { value : "text-babbage-001" } ,
16- { value : "text-ada-001" } ,
17- { value : "text-davinci-001" } ,
18- { value : "davinci-instruct-beta" } ,
19- { value : "davinci" } ,
20- { value : "curie-instruct-beta" } ,
21- { value : "curie" } ,
22- { value : "ada" } ,
23- { value : "babbage" } ,
24- ]
4+ import toast from 'react-hot-toast'
255
266const AdvancedSettings : FunctionComponent < { } > = ( ) => {
7+
278 const [ openAIKey , setOpenAIKey ] = useState < string > ( "" )
289 const [ openAIModel , setOpenAIModel ] = useState < string > ( "" )
10+ const [ modelOptions , setModelOptions ] = useState < { value : string } [ ] > ( [ ] )
2911
3012 useEffect ( ( ) => {
3113 ( async ( ) => {
32- let result = await eventService . getSingleSetting ( Constants . SETTING_KEYS . OPENAI_KEY )
14+ const result = await eventService . listSupportedAIModels ( )
15+ setModelOptions ( result . data . map ( model => ( { value : model } ) ) )
16+ } ) ( ) ;
17+ ( async ( ) => {
18+ const result = await eventService . getSingleSetting ( Constants . SETTING_KEYS . OPENAI_KEY )
3319 setOpenAIKey ( result . data )
34- } ) ( ) ,
35- ( async ( ) => {
36- let result = await eventService . getSingleSetting ( Constants . SETTING_KEYS . OPENAI_MODEL )
37- setOpenAIModel ( result . data )
38- } ) ( )
20+ } ) ( ) ;
21+ ( async ( ) => {
22+ const result = await eventService . getSingleSetting ( Constants . SETTING_KEYS . OPENAI_MODEL )
23+ setOpenAIModel ( result . data )
24+ } ) ( ) ;
3925 } , [ ] )
4026
4127
4228 const updateOpenAIKey = async ( ) => {
4329 const result = await eventService . updateSingleSetting ( Constants . SETTING_KEYS . OPENAI_KEY , openAIKey )
44- if ( result . success )
30+ if ( result . success ) {
4531 setOpenAIKey ( openAIKey )
32+ toast . success ( "saved" )
33+ }
4634 }
4735
4836 const updateOpenAIModel = async ( ) => {
4937 const result = await eventService . updateSingleSetting ( Constants . SETTING_KEYS . OPENAI_MODEL , openAIModel )
5038 if ( result . success )
5139 setOpenAIModel ( openAIModel )
40+ toast . success ( "saved" )
5241 }
5342
5443 const handleModelChange = ( e : React . ChangeEvent < HTMLInputElement | HTMLSelectElement > ) => {
55- const value = e . target . value ;
56- setOpenAIModel ( value ) ;
44+ const value = e . target . value
45+ setOpenAIModel ( value )
5746 }
47+
5848 return (
5949 < React . Fragment >
6050 < h1 > Advanced Settings</ h1 >
6151 < br />
6252 < h2 > OpenAI Key</ h2 >
6353 < p > Update OpenAI API key to enable Generate SQL tool.</ p >
6454 < div className = "buttons has-addons" >
65- < div className = "field has-addons" >
55+ < div className = "field has-addons" style = { { minWidth : 550 } } >
6656 < p className = "control is-expanded" >
6757 < input
6858 className = "input"
@@ -84,7 +74,7 @@ const AdvancedSettings: FunctionComponent<{}> = () => {
8474 < p className = "control" >
8575 < span className = "select" >
8676 < select value = { openAIModel } onChange = { e => handleModelChange ( e ) } >
87- { ModelOptions . map ( ( e , idx ) => {
77+ { modelOptions . map ( ( e , idx ) => {
8878 return < option value = { e . value } key = { idx } > { e . value } </ option >
8979 } ) }
9080 </ select >
0 commit comments