| | |
| | | const { t } = useTranslation() |
| | | return ( |
| | | <Tooltip popupContent={!isValid && t('workflow.errorMsg.invalidVariable')}> |
| | | <div className={cn('border-[rgba(16, 2440,0.08)] inline-flex h-6 max-w-full items-center rounded-md border-[0.5px] border-divider-subtle bg-components-badge-white-to-dark px-1.5 text-xs shadow-xs', |
| | | <div className={cn('inline-flex items-center px-1.5 max-w-full h-6 text-xs rounded-md border-[0.5px] border-[rgba(16, 2440,0.08)] bg-white shadow-xs', |
| | | !isValid && 'border-red-400 !bg-[#FEF3F2]', |
| | | )}> |
| | | {(!isEnv && !isChatVar && <> |
| | | {node && ( |
| | | <> |
| | | <VarBlockIcon |
| | | type={node.data.type || BlockEnum.Start} |
| | | className='mr-0.5 !text-text-primary' |
| | | type={BlockEnum.Start} |
| | | /> |
| | | <div |
| | | className='max-w-[60px] truncate font-medium text-text-secondary' |
| | | className='max-w-[60px] truncate text-text-secondary font-medium' |
| | | title={node?.data.title} |
| | | > |
| | | {node?.data.title} |
| | | </div> |
| | | </> |
| | | )} |
| | | <Line3 className='mx-0.5 shrink-0' /> |
| | | <Variable02 className={cn('mr-0.5 h-3.5 w-3.5 shrink-0 text-text-accent', isException && 'text-text-warning')} /> |
| | | <Line3 className='shrink-0 mx-0.5' /> |
| | | <Variable02 className={cn('shrink-0 mr-0.5 w-3.5 h-3.5 text-text-accent', isException && 'text-text-warning')} /> |
| | | </>)} |
| | | {isEnv && <Env className='mr-0.5 h-3.5 w-3.5 shrink-0 text-util-colors-violet-violet-600' />} |
| | | {isChatVar && <BubbleX className='h-3.5 w-3.5 text-util-colors-teal-teal-700' />} |
| | | {isEnv && <Env className='shrink-0 mr-0.5 w-3.5 h-3.5 text-util-colors-violet-violet-600' />} |
| | | {isChatVar && <BubbleX className='w-3.5 h-3.5 text-util-colors-teal-teal-700' />} |
| | | <div |
| | | className={cn('ml-0.5 truncate font-medium text-text-accent', (isEnv || isChatVar) && 'text-text-secondary', isException && 'text-text-warning')} |
| | | className={cn('truncate ml-0.5 text-text-accent font-medium', (isEnv || isChatVar) && 'text-text-secondary', isException && 'text-text-warning')} |
| | | title={variableName} |
| | | > |
| | | {variableName} |
| | | </div> |
| | | { |
| | | !isShort && varType && ( |
| | | <div className='ml-0.5 shrink-0 text-text-tertiary'>{capitalize(varType)}</div> |
| | | <div className='shrink-0 ml-0.5 text-text-tertiary'>{capitalize(varType)}</div> |
| | | ) |
| | | } |
| | | {!isValid && <RiErrorWarningFill className='ml-0.5 h-3 w-3 text-[#D92D20]' />} |
| | | {!isValid && <RiErrorWarningFill className='ml-0.5 w-3 h-3 text-[#D92D20]' />} |
| | | </div> |
| | | </Tooltip> |
| | | ) |