fix: var config content can not be saved (#841)

This commit is contained in:
Joel 2023-08-15 09:51:43 +08:00 committed by GitHub
parent 93b0813b73
commit 7cc81b4269
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 30 additions and 27 deletions

View File

@ -1,30 +1,32 @@
'use client'
import React, { FC, useState, useEffect } from 'react'
import type { FC } from 'react'
import React, { useEffect, useState } from 'react'
import { useTranslation } from 'react-i18next'
import Modal from '@/app/components/base/modal'
import ModalFoot from '../modal-foot'
import ConfigSelect, { Options } from '../config-select'
import type { Options } from '../config-select'
import ConfigSelect from '../config-select'
import ConfigString from '../config-string'
import SelectTypeItem from '../select-type-item'
import s from './style.module.css'
import Toast from '@/app/components/base/toast'
import type { PromptVariable } from '@/models/debug'
import SelectTypeItem from '../select-type-item'
import { getNewVar } from '@/utils/var'
import s from './style.module.css'
import Modal from '@/app/components/base/modal'
export interface IConfigModalProps {
export type IConfigModalProps = {
payload: PromptVariable
type?: string
isShow: boolean
onClose: () => void
onConfirm: (newValue: { type: string, value: any }) => void
onConfirm: (newValue: { type: string; value: any }) => void
}
const ConfigModal: FC<IConfigModalProps> = ({
payload,
isShow,
onClose,
onConfirm
onConfirm,
}) => {
const { t } = useTranslation()
const { type, name, key, options, max_length } = payload || getNewVar('')
@ -42,7 +44,7 @@ const ConfigModal: FC<IConfigModalProps> = ({
const isStringInput = tempType === 'string'
const title = isStringInput ? t('appDebug.variableConig.maxLength') : t('appDebug.variableConig.options')
// string type
// string type
const [tempMaxLength, setTempMaxValue] = useState(max_length)
useEffect(() => {
setTempMaxValue(max_length)
@ -57,14 +59,15 @@ const ConfigModal: FC<IConfigModalProps> = ({
const handleConfirm = () => {
if (isStringInput) {
onConfirm({ type: tempType, value: tempMaxLength })
} else {
}
else {
if (tempOptions.length === 0) {
Toast.notify({ type: 'error', message: 'At least one option requied' })
return
}
const obj: Record<string, boolean> = {}
let hasRepeatedItem = false
tempOptions.forEach(o => {
tempOptions.forEach((o) => {
if (obj[o]) {
hasRepeatedItem = true
return
@ -97,11 +100,13 @@ const ConfigModal: FC<IConfigModalProps> = ({
<div className='mt-6'>
<div className={s.title}>{title}</div>
{isStringInput ? (
<ConfigString value={tempMaxLength} onChange={setTempMaxValue} />
) : (
<ConfigSelect options={tempOptions} onChange={setTempOptions} />
)}
{isStringInput
? (
<ConfigString value={tempMaxLength} onChange={setTempMaxValue} />
)
: (
<ConfigSelect options={tempOptions} onChange={setTempOptions} />
)}
</div>
</div>

View File

@ -4,6 +4,7 @@ import React, { useState } from 'react'
import { useTranslation } from 'react-i18next'
import { Cog8ToothIcon, TrashIcon } from '@heroicons/react/24/outline'
import { useBoolean } from 'ahooks'
import type { Timeout } from 'ahooks/lib/useRequest/src/types'
import Panel from '../base/feature-panel'
import OperationBtn from '../base/operation-btn'
import VarIcon from '../base/icons/var-icon'
@ -16,7 +17,6 @@ import { DEFAULT_VALUE_MAX_LEN, getMaxVarNameLength } from '@/config'
import { checkKeys, getNewVar } from '@/utils/var'
import Switch from '@/app/components/base/switch'
import Toast from '@/app/components/base/toast'
import { Timeout } from 'ahooks/lib/useRequest/src/types'
export type IConfigVarProps = {
promptVariables: PromptVariable[]
@ -37,9 +37,9 @@ const ConfigVar: FC<IConfigVarProps> = ({ promptVariables, readonly, onPromptVar
return obj
})()
const updatePromptVariable = (index: number, updateKey: string, newValue: any) => {
const updatePromptVariable = (key: string, updateKey: string, newValue: any) => {
const newPromptVariables = promptVariables.map((item, i) => {
if (i === index) {
if (item.key === key) {
return {
...item,
[updateKey]: newValue,
@ -48,13 +48,12 @@ const ConfigVar: FC<IConfigVarProps> = ({ promptVariables, readonly, onPromptVar
return item
})
onPromptVariablesChange?.(newPromptVariables)
}
const batchUpdatePromptVariable = (index: number, updateKeys: string[], newValues: any[]) => {
const newPromptVariables = promptVariables.map((item, i) => {
if (i === index) {
const batchUpdatePromptVariable = (key: string, updateKeys: string[], newValues: any[]) => {
const newPromptVariables = promptVariables.map((item) => {
if (item.key === key) {
const newItem: any = { ...item }
updateKeys.forEach((updateKey, i) => {
newItem[updateKey] = newValues[i]
@ -93,11 +92,10 @@ const ConfigVar: FC<IConfigVarProps> = ({ promptVariables, readonly, onPromptVar
if (isKeyExists) {
Toast.notify({
type: 'error',
message: t(`appDebug.varKeyError.keyAlreadyExists`, { key: newKey }),
message: t('appDebug.varKeyError.keyAlreadyExists', { key: newKey }),
})
return
}
},1000)
}, 1000)
onPromptVariablesChange?.(newPromptVariables)
}
@ -206,7 +204,7 @@ const ConfigVar: FC<IConfigVarProps> = ({ promptVariables, readonly, onPromptVar
type="text"
placeholder={key}
value={name}
onChange={e => updatePromptVariable(index, 'name', e.target.value)}
onChange={e => updatePromptVariable(key, 'name', e.target.value)}
maxLength={getMaxVarNameLength(name)}
className="h-6 leading-6 block w-full rounded-md border-0 py-1.5 text-gray-900 placeholder:text-gray-400 focus:outline-none focus:ring-1 focus:ring-inset focus:ring-gray-200"
/>)