ngskcloud
/
gcgj-dify-1.7.0
17
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

code generator

Browse Source
pull/21208/head
jZonG 11 months ago
parent c3054c11e9
commit 21b4690920
2 changed files with 126 additions and 64 deletions
Show Stats Download Patch File Download Diff File

135
web/app/components/app/configuration/config/code-generator/get-code-generator-res.tsx
Unescape Escape View File

@ -1,5 +1,5 @@
import type { FC } from 'react' import type { FC } from 'react'
import React from 'react' import React, { useCallback, useEffect } from 'react'
import cn from 'classnames' import cn from 'classnames'
import useBoolean from 'ahooks/lib/useBoolean' import useBoolean from 'ahooks/lib/useBoolean'
import { useTranslation } from 'react-i18next' import { useTranslation } from 'react-i18next'
@ -7,8 +7,10 @@ import ConfigPrompt from '../../config-prompt'
import { languageMap } from '../../../../workflow/nodes/_base/components/editor/code-editor/index' import { languageMap } from '../../../../workflow/nodes/_base/components/editor/code-editor/index'
import { generateRuleCode } from '@/service/debug' import { generateRuleCode } from '@/service/debug'
import type { CodeGenRes } from '@/service/debug' import type { CodeGenRes } from '@/service/debug'
import { type AppType, type Model, ModelModeType } from '@/types/app' import type { ModelModeType } from '@/types/app'
import type { AppType, CompletionParams, Model } from '@/types/app'
import Modal from '@/app/components/base/modal' import Modal from '@/app/components/base/modal'
import Textarea from '@/app/components/base/textarea'
import Button from '@/app/components/base/button' import Button from '@/app/components/base/button'
import { Generator } from '@/app/components/base/icons/src/vender/other' import { Generator } from '@/app/components/base/icons/src/vender/other'
import Toast from '@/app/components/base/toast' import Toast from '@/app/components/base/toast'
@ -17,8 +19,9 @@ import Confirm from '@/app/components/base/confirm'
import type { CodeLanguage } from '@/app/components/workflow/nodes/code/types' import type { CodeLanguage } from '@/app/components/workflow/nodes/code/types'
import { useModelListAndDefaultModelAndCurrentProviderAndModel } from '@/app/components/header/account-setting/model-provider-page/hooks' import { useModelListAndDefaultModelAndCurrentProviderAndModel } from '@/app/components/header/account-setting/model-provider-page/hooks'
import { ModelTypeEnum } from '@/app/components/header/account-setting/model-provider-page/declarations' import { ModelTypeEnum } from '@/app/components/header/account-setting/model-provider-page/declarations'
import ModelIcon from '@/app/components/header/account-setting/model-provider-page/model-icon' import ModelParameterModal from '@/app/components/header/account-setting/model-provider-page/model-parameter-modal'
import ModelName from '@/app/components/header/account-setting/model-provider-page/model-name' import type { FormValue } from '@/app/components/header/account-setting/model-provider-page/declarations'
export type IGetCodeGeneratorResProps = { export type IGetCodeGeneratorResProps = {
mode: AppType mode: AppType
isShow: boolean isShow: boolean
@ -36,11 +39,28 @@ export const GetCodeGeneratorResModal: FC<IGetCodeGeneratorResProps> = (
onFinished, onFinished,
}, },
) => { ) => {
const { t } = useTranslation()
const defaultCompletionParams = {
temperature: 0.7,
max_tokens: 0,
top_p: 0,
echo: false,
stop: [],
presence_penalty: 0,
frequency_penalty: 0,
}
const localModel = localStorage.getItem('auto-gen-model')
? JSON.parse(localStorage.getItem('auto-gen-model') as string) as Model
: null
const [model, setModel] = React.useState<Model>(localModel || {
name: '',
provider: '',
mode: mode as unknown as ModelModeType.chat,
completion_params: defaultCompletionParams,
})
const { const {
currentProvider, defaultModel,
currentModel,
} = useModelListAndDefaultModelAndCurrentProviderAndModel(ModelTypeEnum.textGeneration) } = useModelListAndDefaultModelAndCurrentProviderAndModel(ModelTypeEnum.textGeneration)
const { t } = useTranslation()
const [instruction, setInstruction] = React.useState<string>('') const [instruction, setInstruction] = React.useState<string>('')
const [isLoading, { setTrue: setLoadingTrue, setFalse: setLoadingFalse }] = useBoolean(false) const [isLoading, { setTrue: setLoadingTrue, setFalse: setLoadingFalse }] = useBoolean(false)
const [res, setRes] = React.useState<CodeGenRes | null>(null) const [res, setRes] = React.useState<CodeGenRes | null>(null)
@ -56,21 +76,27 @@ export const GetCodeGeneratorResModal: FC<IGetCodeGeneratorResProps> = (
} }
return true return true
} }
const model: Model = {
provider: currentProvider?.provider || '', const handleModelChange = useCallback((newValue: { modelId: string; provider: string; mode?: string; features?: string[] }) => {
name: currentModel?.model || '', const newModel = {
mode: ModelModeType.chat, ...model,
// This is a fixed parameter provider: newValue.provider,
completion_params: { name: newValue.modelId,
temperature: 0.7, mode: newValue.mode as ModelModeType,
max_tokens: 0, }
top_p: 0, setModel(newModel)
echo: false, localStorage.setItem('auto-gen-model', JSON.stringify(newModel))
stop: [], }, [model, setModel])
presence_penalty: 0,
frequency_penalty: 0, const handleCompletionParamsChange = useCallback((newParams: FormValue) => {
}, const newModel = {
} ...model,
completion_params: newParams as CompletionParams,
}
setModel(newModel)
localStorage.setItem('auto-gen-model', JSON.stringify(newModel))
}, [model, setModel])
const isInLLMNode = true const isInLLMNode = true
const onGenerate = async () => { const onGenerate = async () => {
if (!isValid()) if (!isValid())
@ -99,6 +125,30 @@ export const GetCodeGeneratorResModal: FC<IGetCodeGeneratorResProps> = (
} }
const [showConfirmOverwrite, setShowConfirmOverwrite] = React.useState(false) const [showConfirmOverwrite, setShowConfirmOverwrite] = React.useState(false)
useEffect(() => {
if (defaultModel) {
const localModel = localStorage.getItem('auto-gen-model')
? JSON.parse(localStorage.getItem('auto-gen-model') || '')
: null
if (localModel) {
setModel({
...localModel,
completion_params: {
...defaultCompletionParams,
...localModel.completion_params,
},
})
}
else {
setModel(prev => ({
...prev,
name: defaultModel.model,
provider: defaultModel.provider.provider,
}))
}
}
}, [defaultModel])
const renderLoading = ( const renderLoading = (
<div className='flex h-full w-0 grow flex-col items-center justify-center space-y-3'> <div className='flex h-full w-0 grow flex-col items-center justify-center space-y-3'>
<Loading /> <Loading />
@ -123,29 +173,30 @@ export const GetCodeGeneratorResModal: FC<IGetCodeGeneratorResProps> = (
closable closable
> >
<div className='relative flex h-[680px] flex-wrap'> <div className='relative flex h-[680px] flex-wrap'>
<div className='h-full w-[570px] shrink-0 overflow-y-auto border-r border-gray-100 p-8'> <div className='h-full w-[570px] shrink-0 overflow-y-auto border-r border-divider-regular p-8'>
<div className='mb-8'> <div className='mb-8'>
<div className={'text-lg font-bold leading-[28px]'}>{t('appDebug.codegen.title')}</div> <div className={'text-lg font-bold leading-[28px]'}>{t('appDebug.codegen.title')}</div>
<div className='mt-1 text-[13px] font-normal text-gray-500'>{t('appDebug.codegen.description')}</div> <div className='mt-1 text-[13px] font-normal text-text-tertiary'>{t('appDebug.codegen.description')}</div>
</div> </div>
<div className='flex items-center'> <div className='mb-8'>
<ModelIcon <ModelParameterModal
className='mr-1.5 shrink-0' popupClassName='!w-[520px]'
provider={currentProvider} portalToFollowElemContentClassName='z-[1000]'
modelName={currentModel?.model} isAdvancedMode={true}
/> provider={model.provider}
<ModelName mode={model.mode}
className='grow' completionParams={model.completion_params}
modelItem={currentModel!} modelId={model.name}
showMode setModel={handleModelChange}
showFeatures onCompletionParamsChange={handleCompletionParamsChange}
hideDebugWithMultipleModel
/> />
</div> </div>
<div className='mt-6'> <div>
<div className='text-[0px]'> <div className='text-[0px]'>
<div className='mb-2 text-sm font-medium leading-5 text-gray-900'>{t('appDebug.codegen.instruction')}</div> <div className='mb-2 text-sm font-medium leading-5 text-text-primary'>{t('appDebug.codegen.instruction')}</div>
<textarea <Textarea
className="h-[200px] w-full overflow-y-auto rounded-lg bg-gray-50 px-3 py-2 text-sm" className="h-[200px] resize-none"
placeholder={t('appDebug.codegen.instructionPlaceholder') || ''} placeholder={t('appDebug.codegen.instructionPlaceholder') || ''}
value={instruction} value={instruction}
onChange={e => setInstruction(e.target.value)} onChange={e => setInstruction(e.target.value)}
@ -169,7 +220,7 @@ export const GetCodeGeneratorResModal: FC<IGetCodeGeneratorResProps> = (
{!isLoading && !res && renderNoData} {!isLoading && !res && renderNoData}
{(!isLoading && res) && ( {(!isLoading && res) && (
<div className='h-full w-0 grow p-6 pb-0'> <div className='h-full w-0 grow p-6 pb-0'>
<div className='mb-3 shrink-0 text-base font-semibold leading-[160%] text-gray-800'>{t('appDebug.codegen.resTitle')}</div> <div className='mb-3 shrink-0 text-base font-semibold leading-[160%] text-text-secondary'>{t('appDebug.codegen.resTitle')}</div>
<div className={cn('max-h-[555px] overflow-y-auto', !isInLLMNode && 'pb-2')}> <div className={cn('max-h-[555px] overflow-y-auto', !isInLLMNode && 'pb-2')}>
<ConfigPrompt <ConfigPrompt
mode={mode} mode={mode}
@ -185,7 +236,7 @@ export const GetCodeGeneratorResModal: FC<IGetCodeGeneratorResProps> = (
<> <>
{res?.code && ( {res?.code && (
<div className='mt-4'> <div className='mt-4'>
<h3 className='mb-2 text-sm font-medium text-gray-900'>{t('appDebug.codegen.generatedCode')}</h3> <h3 className='mb-2 text-sm font-medium text-text-primary'>{t('appDebug.codegen.generatedCode')}</h3>
<pre className='overflow-x-auto rounded-lg bg-gray-50 p-4'> <pre className='overflow-x-auto rounded-lg bg-gray-50 p-4'>
<code className={`language-${res.language}`}> <code className={`language-${res.language}`}>
{res.code} {res.code}
@ -202,7 +253,7 @@ export const GetCodeGeneratorResModal: FC<IGetCodeGeneratorResProps> = (
)} )}
</div> </div>
<div className='flex justify-end bg-white py-4'> <div className='flex justify-end bg-background-default py-4'>
<Button onClick={onClose}>{t('common.operation.cancel')}</Button> <Button onClick={onClose}>{t('common.operation.cancel')}</Button>
<Button variant='primary' className='ml-2' onClick={() => { <Button variant='primary' className='ml-2' onClick={() => {
setShowConfirmOverwrite(true) setShowConfirmOverwrite(true)

55
web/app/components/workflow/nodes/llm/components/json-schema-config-modal/json-schema-generator/index.tsx
Unescape Escape View File

@ -11,7 +11,6 @@ import { ModelModeType } from '@/types/app'
import { Theme } from '@/types/app' import { Theme } from '@/types/app'
import { SchemaGeneratorDark, SchemaGeneratorLight } from './assets' import { SchemaGeneratorDark, SchemaGeneratorLight } from './assets'
import cn from '@/utils/classnames' import cn from '@/utils/classnames'
import type { ModelInfo } from './prompt-editor'
import PromptEditor from './prompt-editor' import PromptEditor from './prompt-editor'
import GeneratedResult from './generated-result' import GeneratedResult from './generated-result'
import { useGenerateStructuredOutputRules } from '@/service/use-common' import { useGenerateStructuredOutputRules } from '@/service/use-common'
@ -19,7 +18,6 @@ import Toast from '@/app/components/base/toast'
import { type FormValue, ModelTypeEnum } from '@/app/components/header/account-setting/model-provider-page/declarations' import { type FormValue, ModelTypeEnum } from '@/app/components/header/account-setting/model-provider-page/declarations'
import { useModelListAndDefaultModelAndCurrentProviderAndModel } from '@/app/components/header/account-setting/model-provider-page/hooks' import { useModelListAndDefaultModelAndCurrentProviderAndModel } from '@/app/components/header/account-setting/model-provider-page/hooks'
import { useVisualEditorStore } from '../visual-editor/store' import { useVisualEditorStore } from '../visual-editor/store'
import { useTranslation } from 'react-i18next'
import { useMittContext } from '../visual-editor/context' import { useMittContext } from '../visual-editor/context'
type JsonSchemaGeneratorProps = { type JsonSchemaGeneratorProps = {
@ -36,10 +34,12 @@ export const JsonSchemaGenerator: FC<JsonSchemaGeneratorProps> = ({
onApply, onApply,
crossAxisOffset, crossAxisOffset,
}) => { }) => {
const { t } = useTranslation() const localModel = localStorage.getItem('auto-gen-model')
? JSON.parse(localStorage.getItem('auto-gen-model') as string) as Model
: null
const [open, setOpen] = useState(false) const [open, setOpen] = useState(false)
const [view, setView] = useState(GeneratorView.promptEditor) const [view, setView] = useState(GeneratorView.promptEditor)
const [model, setModel] = useState<Model>({ const [model, setModel] = useState<Model>(localModel || {
name: '', name: '',
provider: '', provider: '',
mode: ModelModeType.completion, mode: ModelModeType.completion,
@ -58,11 +58,19 @@ export const JsonSchemaGenerator: FC<JsonSchemaGeneratorProps> = ({
useEffect(() => { useEffect(() => {
if (defaultModel) { if (defaultModel) {
setModel(prev => ({ const localModel = localStorage.getItem('auto-gen-model')
...prev, ? JSON.parse(localStorage.getItem('auto-gen-model') || '')
name: defaultModel.model, : null
provider: defaultModel.provider.provider, if (localModel) {
})) setModel(localModel)
}
else {
setModel(prev => ({
...prev,
name: defaultModel.model,
provider: defaultModel.provider.provider,
}))
}
} }
}, [defaultModel]) }, [defaultModel])
@ -77,22 +85,25 @@ export const JsonSchemaGenerator: FC<JsonSchemaGeneratorProps> = ({
setOpen(false) setOpen(false)
}, []) }, [])
const handleModelChange = useCallback((model: ModelInfo) => { const handleModelChange = useCallback((newValue: { modelId: string; provider: string; mode?: string; features?: string[] }) => {
setModel(prev => ({ const newModel = {
...prev, ...model,
provider: model.provider, provider: newValue.provider,
name: model.modelId, name: newValue.modelId,
mode: model.mode as ModelModeType, mode: newValue.mode as ModelModeType,
})) }
}, []) setModel(newModel)
localStorage.setItem('auto-gen-model', JSON.stringify(newModel))
}, [model, setModel])
const handleCompletionParamsChange = useCallback((newParams: FormValue) => { const handleCompletionParamsChange = useCallback((newParams: FormValue) => {
setModel(prev => ({ const newModel = {
...prev, ...model,
completion_params: newParams as CompletionParams, completion_params: newParams as CompletionParams,
}), }
) setModel(newModel)
}, []) localStorage.setItem('auto-gen-model', JSON.stringify(newModel))
}, [model, setModel])
const { mutateAsync: generateStructuredOutputRules, isPending: isGenerating } = useGenerateStructuredOutputRules() const { mutateAsync: generateStructuredOutputRules, isPending: isGenerating } = useGenerateStructuredOutputRules()

Write Preview
Loading…
Cancel
Save