fix: handle inputs show the focus ui together in tools node (#3763)

This commit is contained in:
Joel 2024-04-24 15:53:07 +08:00 committed by GitHub
parent 3b537cbdeb
commit 89a7434565
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -100,8 +100,17 @@ const InputVarList: FC<Props> = ({
}
}, [value, onChange])
const [isFocus, setIsFocus] = useState(false)
const [inputsIsFocus, setInputsIsFocus] = useState<Record<string, boolean>>({})
const handleInputFocus = useCallback((variable: string) => {
return (value: boolean) => {
setInputsIsFocus((prev) => {
return {
...prev,
[variable]: value,
}
})
}
}, [])
const handleOpen = useCallback((index: number) => {
return () => onOpen(index)
}, [onOpen])
@ -126,13 +135,13 @@ const InputVarList: FC<Props> = ({
</div>
{isString
? (<Input
className={cn(isFocus ? 'shadow-xs bg-gray-50 border-gray-300' : 'bg-gray-100 border-gray-100', 'rounded-lg px-3 py-[6px] border')}
className={cn(inputsIsFocus[variable] ? 'shadow-xs bg-gray-50 border-gray-300' : 'bg-gray-100 border-gray-100', 'rounded-lg px-3 py-[6px] border')}
value={varInput?.value as string || ''}
onChange={handleMixedTypeChange(variable)}
readOnly={readOnly}
nodesOutputVars={availableVars}
availableNodes={availableNodes}
onFocusChange={setIsFocus}
onFocusChange={handleInputFocus(variable)}
placeholder={t('workflow.nodes.http.insertVarPlaceholder')!}
placeholderClassName='!leading-[21px]'
/>)