diff --git a/src/features/AgentSetting/AgentMeta/AutoGenerateInput.tsx b/src/features/AgentSetting/AgentMeta/AutoGenerateInput.tsx index cca1f79bfe6e..ea02cdda84d7 100644 --- a/src/features/AgentSetting/AgentMeta/AutoGenerateInput.tsx +++ b/src/features/AgentSetting/AgentMeta/AutoGenerateInput.tsx @@ -2,20 +2,35 @@ import { ActionIcon } from '@lobehub/ui'; import { Input, InputProps } from 'antd'; import { useTheme } from 'antd-style'; import { Wand2 } from 'lucide-react'; -import { memo } from 'react'; +import { memo, useCallback, useEffect, useRef, useState } from 'react'; import { useTranslation } from 'react-i18next'; -export interface AutoGenerateInputProps extends InputProps { +export interface AutoGenerateInputProps extends Omit { canAutoGenerate?: boolean; loading?: boolean; + onChange?: (value: string) => void; onGenerate?: () => void; + value?: string | any; } const AutoGenerateInput = memo( - ({ loading, onGenerate, canAutoGenerate, ...props }) => { + ({ loading, value, onChange, onGenerate, canAutoGenerate, ...props }) => { const { t } = useTranslation('common'); const theme = useTheme(); + const [input, setInput] = useState(value || ''); + + const isChineseInput = useRef(false); + const isFocusing = useRef(false); + + const updateValue = useCallback(() => { + onChange?.(input); + }, [input]); + + useEffect(() => { + if (value !== undefined) setInput(value); + }, [value]); + return ( ( } type="block" {...props} + onBlur={() => { + isFocusing.current = false; + }} + onChange={(e) => { + setInput(e.target.value); + }} + onCompositionEnd={() => { + isChineseInput.current = false; + }} + onCompositionStart={() => { + isChineseInput.current = true; + }} + onFocus={() => { + isFocusing.current = true; + }} + onPressEnter={(e) => { + if (!e.shiftKey && !isChineseInput.current) { + e.preventDefault(); + updateValue(); + isFocusing.current = false; + } + }} + value={input} /> ); }, diff --git a/src/features/AgentSetting/AgentMeta/index.tsx b/src/features/AgentSetting/AgentMeta/index.tsx index 0f2da15cf062..44ed74b6b433 100644 --- a/src/features/AgentSetting/AgentMeta/index.tsx +++ b/src/features/AgentSetting/AgentMeta/index.tsx @@ -34,14 +34,14 @@ const AgentMeta = memo(() => { Render: AutoGenerateInput, key: 'title', label: t('settingAgent.name.title'), - onChange: (e: any) => updateMeta({ title: e.target.value }), + onChange: (value: string) => updateMeta({ title: value }), placeholder: t('settingAgent.name.placeholder'), }, { Render: AutoGenerateInput, key: 'description', label: t('settingAgent.description.title'), - onChange: (e: any) => updateMeta({ description: e.target.value }), + onChange: (value: string) => updateMeta({ description: value }), placeholder: t('settingAgent.description.placeholder'), }, {