chore: model and params select

This commit is contained in:
Joel
2024-02-19 10:35:11 +08:00
parent 240e0dfa6f
commit e05bbec879
3 changed files with 50 additions and 39 deletions

View File

@ -6,20 +6,21 @@ import { mockLLMNodeData } from './mock'
import Field from '@/app/components/workflow/nodes/_base/components/field'
import AddButton from '@/app/components/base/button/add-button'
import Split from '@/app/components/workflow/nodes/_base/components/split'
import ModelSelector from '@/app/components/header/account-setting/model-provider-page/model-selector'
import ModelParameterModal from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal'
import Switch from '@/app/components/base/switch'
const i18nPrefix = 'workflow.nodes.llm'
const Panel: FC = () => {
const { t } = useTranslation()
const {
textGenerationModelList,
inputs,
handleModelChanged,
toggleContextEnabled,
handleCompletionParamsChange,
} = useInput(mockLLMNodeData)
const modelMode = inputs.model.mode
const model = inputs.model
const modelMode = inputs.model?.mode
const isChatMode = modelMode === 'chat'
const handleAddVariable = () => {
@ -32,15 +33,17 @@ const Panel: FC = () => {
<Field
title={t(`${i18nPrefix}.model`)}
>
<ModelSelector
defaultModel={(inputs.model?.provider && inputs.model?.name)
? {
provider: inputs.model.provider,
model: inputs.model.name,
}
: undefined}
modelList={textGenerationModelList}
onSelect={handleModelChanged}
<ModelParameterModal
popupClassName='!w-[387px]'
isAdvancedMode={true}
mode={model?.mode}
provider={model?.provider}
completionParams={model.completion_params}
modelId={model.name}
setModel={handleModelChanged}
onCompletionParamsChange={handleCompletionParamsChange}
hideDebugWithMultipleModel
debugWithMultipleModel={false}
/>
</Field>

View File

@ -1,25 +1,26 @@
/* eslint-disable react-hooks/exhaustive-deps */
import { useCallback, useState } from 'react'
import produce from 'immer'
import type { LLMNodeData } from '../../types'
import { useTextGenerationCurrentProviderAndModelAndModelList } from '@/app/components/header/account-setting/model-provider-page/hooks'
const useInput = (initInputs: LLMNodeData) => {
const {
textGenerationModelList,
} = useTextGenerationCurrentProviderAndModelAndModelList()
const [inputs, setInputs] = useState<LLMNodeData>(initInputs)
const handleModelChanged = useCallback((model: { provider: string; model: string }) => {
const targetProvider = textGenerationModelList.find(modelItem => modelItem.provider === model.provider)
const targetModelItem = targetProvider?.models.find(modelItem => modelItem.model === model.model)
const handleModelChanged = useCallback((model: { provider: string; modelId: string; mode?: string }) => {
const newInputs = produce(inputs, (draft) => {
draft.model.provider = model.provider
draft.model.name = model.model
draft.model.mode = targetModelItem?.model_properties.mode as string
draft.model.name = model.modelId
draft.model.mode = model.mode!
})
setInputs(newInputs)
}, [inputs.model, textGenerationModelList])
}, [inputs.model])
const handleCompletionParamsChange = useCallback((newParams: Record<string, any>) => {
const newInputs = produce(inputs, (draft) => {
draft.model.completion_params = newParams
})
setInputs(newInputs)
}, [inputs.model])
const toggleContextEnabled = useCallback(() => {
const newInputs = produce(inputs, (draft) => {
@ -29,7 +30,7 @@ const useInput = (initInputs: LLMNodeData) => {
}, [inputs.context.enabled])
return {
textGenerationModelList,
handleCompletionParamsChange,
inputs,
handleModelChanged,
toggleContextEnabled,