|
@@ -1,11 +1,11 @@
|
|
|
'use client'
|
|
|
import type { FC } from 'react'
|
|
|
-import React, { useEffect, useState } from 'react'
|
|
|
+import React, { useEffect, useRef, useState } from 'react'
|
|
|
import { useTranslation } from 'react-i18next'
|
|
|
import { useContext } from 'use-context-selector'
|
|
|
import { usePathname } from 'next/navigation'
|
|
|
import produce from 'immer'
|
|
|
-import { useBoolean } from 'ahooks'
|
|
|
+import { useBoolean, useGetState } from 'ahooks'
|
|
|
import cn from 'classnames'
|
|
|
import { clone, isEqual } from 'lodash-es'
|
|
|
import Button from '../../base/button'
|
|
@@ -33,6 +33,7 @@ import { FlipBackward } from '@/app/components/base/icons/src/vender/line/arrows
|
|
|
import { PromptMode } from '@/models/debug'
|
|
|
import { DEFAULT_CHAT_PROMPT_CONFIG, DEFAULT_COMPLETION_PROMPT_CONFIG } from '@/config'
|
|
|
import SelectDataSet from '@/app/components/app/configuration/dataset-config/select-dataset'
|
|
|
+import I18n from '@/context/i18n'
|
|
|
|
|
|
type PublichConfig = {
|
|
|
modelConfig: ModelConfig
|
|
@@ -74,13 +75,26 @@ const Configuration: FC = () => {
|
|
|
const [formattingChanged, setFormattingChanged] = useState(false)
|
|
|
const [inputs, setInputs] = useState<Inputs>({})
|
|
|
const [query, setQuery] = useState('')
|
|
|
- const [completionParams, setCompletionParams] = useState<CompletionParams>({
|
|
|
+ const [completionParams, doSetCompletionParams] = useState<CompletionParams>({
|
|
|
max_tokens: 16,
|
|
|
temperature: 1, // 0-2
|
|
|
top_p: 1,
|
|
|
presence_penalty: 1, // -2-2
|
|
|
frequency_penalty: 1, // -2-2
|
|
|
+ stop: [],
|
|
|
})
|
|
|
+ const [tempStop, setTempStop, getTempStop] = useGetState<string[]>([])
|
|
|
+ const setCompletionParams = (value: CompletionParams) => {
|
|
|
+ const params = { ...value }
|
|
|
+
|
|
|
+ // eslint-disable-next-line @typescript-eslint/no-use-before-define
|
|
|
+ if ((!params.stop || params.stop.length === 0) && (modeModeTypeRef.current === ModelModeType.completion)) {
|
|
|
+ params.stop = getTempStop()
|
|
|
+ setTempStop([])
|
|
|
+ }
|
|
|
+ doSetCompletionParams(params)
|
|
|
+ }
|
|
|
+
|
|
|
const [modelConfig, doSetModelConfig] = useState<ModelConfig>({
|
|
|
provider: ProviderEnum.openai,
|
|
|
model_id: 'gpt-3.5-turbo',
|
|
@@ -110,6 +124,10 @@ const Configuration: FC = () => {
|
|
|
}
|
|
|
|
|
|
const modelModeType = modelConfig.mode
|
|
|
+ const modeModeTypeRef = useRef(modelModeType)
|
|
|
+ useEffect(() => {
|
|
|
+ modeModeTypeRef.current = modelModeType
|
|
|
+ }, [modelModeType])
|
|
|
|
|
|
const [dataSets, setDataSets] = useState<DataSet[]>([])
|
|
|
const contextVar = modelConfig.configs.prompt_variables.find(item => item.is_context_var)?.key
|
|
@@ -197,7 +215,7 @@ const Configuration: FC = () => {
|
|
|
const hasSetAPIKEY = hasSetCustomAPIKEY || !isTrailFinished
|
|
|
|
|
|
const [isShowSetAPIKey, { setTrue: showSetAPIKey, setFalse: hideSetAPIkey }] = useBoolean()
|
|
|
- const [promptMode, doSetPromptMode] = useState(PromptMode.advanced)
|
|
|
+ const [promptMode, doSetPromptMode] = useState(PromptMode.simple)
|
|
|
const isAdvancedMode = promptMode === PromptMode.advanced
|
|
|
const [canReturnToSimpleMode, setCanReturnToSimpleMode] = useState(true)
|
|
|
const setPromptMode = async (mode: PromptMode) => {
|
|
@@ -230,6 +248,9 @@ const Configuration: FC = () => {
|
|
|
onUserChangedPrompt: () => {
|
|
|
setCanReturnToSimpleMode(false)
|
|
|
},
|
|
|
+ completionParams,
|
|
|
+ setCompletionParams,
|
|
|
+ setStop: setTempStop,
|
|
|
})
|
|
|
|
|
|
const setModel = async ({
|
|
@@ -449,6 +470,7 @@ const Configuration: FC = () => {
|
|
|
|
|
|
const [showUseGPT4Confirm, setShowUseGPT4Confirm] = useState(false)
|
|
|
const [showSetAPIKeyModal, setShowSetAPIKeyModal] = useState(false)
|
|
|
+ const { locale } = useContext(I18n)
|
|
|
|
|
|
if (isLoading) {
|
|
|
return <div className='flex h-full items-center justify-center'>
|
|
@@ -513,10 +535,9 @@ const Configuration: FC = () => {
|
|
|
<>
|
|
|
<div className="flex flex-col h-full">
|
|
|
<div className='flex items-center justify-between px-6 shrink-0 h-14'>
|
|
|
- <div>
|
|
|
- <div className='italic text-base font-bold text-gray-900 leading-[18px]'>{t('appDebug.pageTitle.line1')}</div>
|
|
|
- <div className='flex items-center h-6 space-x-1 text-xs'>
|
|
|
- <div className='text-gray-500 font-medium italic'>{t('appDebug.pageTitle.line2')}</div>
|
|
|
+ <div className='flex items-end'>
|
|
|
+ <div className={s.promptTitle}></div>
|
|
|
+ <div className='flex items-center h-[14px] space-x-1 text-xs'>
|
|
|
{/* modelModeType missing can not load template */}
|
|
|
{(!isAdvancedMode && modelModeType) && (
|
|
|
<div
|
|
@@ -528,7 +549,7 @@ const Configuration: FC = () => {
|
|
|
)}
|
|
|
{isAdvancedMode && (
|
|
|
<div className='flex items-center space-x-2'>
|
|
|
- <div className={`${s.advancedPromptMode} italic text-indigo-600`}>{t('appDebug.promptMode.advanced')}</div>
|
|
|
+ <div className={cn(locale === 'en' && 'italic', `${s.advancedPromptMode} text-indigo-600`)}>{t('appDebug.promptMode.advanced')}</div>
|
|
|
{canReturnToSimpleMode && (
|
|
|
<div
|
|
|
onClick={() => setPromptMode(PromptMode.simple)}
|