| | |
| | | import type { FC } from 'react' |
| | | import React, { useCallback } from 'react' |
| | | import { useTranslation } from 'react-i18next' |
| | | import { |
| | | RiDeleteBinLine, |
| | | } from '@remixicon/react' |
| | | import type { Topic } from '../types' |
| | | import Editor from '@/app/components/workflow/nodes/_base/components/prompt/editor' |
| | | import useAvailableVarList from '@/app/components/workflow/nodes/_base/hooks/use-available-var-list' |
| | | import type { ValueSelector, Var } from '@/app/components/workflow/types' |
| | | import TextEditor from '../../_base/components/editor/text-editor' |
| | | |
| | | const i18nPrefix = 'workflow.nodes.questionClassifiers' |
| | | |
| | | type Props = { |
| | | nodeId: string |
| | | payload: Topic |
| | | onChange: (payload: Topic) => void |
| | | onRemove: () => void |
| | | index: number |
| | | readonly?: boolean |
| | | filterVar: (payload: Var, valueSelector: ValueSelector) => boolean |
| | | } |
| | | |
| | | const ClassItem: FC<Props> = ({ |
| | | nodeId, |
| | | payload, |
| | | onChange, |
| | | onRemove, |
| | | index, |
| | | readonly, |
| | | filterVar, |
| | | }) => { |
| | | const { t } = useTranslation() |
| | | |
| | |
| | | onChange({ ...payload, name: value }) |
| | | }, [onChange, payload]) |
| | | |
| | | const { availableVars, availableNodesWithParent } = useAvailableVarList(nodeId, { |
| | | onlyLeafNodeVar: false, |
| | | hideChatVar: false, |
| | | hideEnv: false, |
| | | filterVar, |
| | | }) |
| | | |
| | | return ( |
| | | <Editor |
| | | title={`${t(`${i18nPrefix}.class`)} ${index}`} |
| | | placeholder={t(`${i18nPrefix}.topicPlaceholder`)!} |
| | | <TextEditor |
| | | isInNode |
| | | title={<div> |
| | | <div className='w-[200px]'> |
| | | <div |
| | | className='leading-4 text-xs font-semibold text-gray-700' |
| | | > |
| | | {`${t(`${i18nPrefix}.class`)} ${index}`} |
| | | </div> |
| | | </div> |
| | | </div>} |
| | | value={payload.name} |
| | | onChange={handleNameChange} |
| | | showRemove |
| | | onRemove={onRemove} |
| | | nodesOutputVars={availableVars} |
| | | availableNodes={availableNodesWithParent} |
| | | readOnly={readonly} // ? |
| | | justVar // ? |
| | | isSupportFileVar // ? |
| | | placeholder={t(`${i18nPrefix}.topicPlaceholder`)!} |
| | | headerRight={( |
| | | <div className='flex items-center h-full'> |
| | | <div className='text-xs font-medium text-gray-500'>{payload.name.length}</div> |
| | | <div className='mx-3 h-3 w-px bg-gray-200'></div> |
| | | {!readonly && ( |
| | | <RiDeleteBinLine |
| | | className='mr-1 w-3.5 h-3.5 text-gray-500 cursor-pointer' |
| | | onClick={onRemove} |
| | | /> |
| | | )} |
| | | </div> |
| | | )} |
| | | readonly={readonly} |
| | | minHeight={64} |
| | | /> |
| | | ) |
| | | } |