mirror of
https://gitee.com/dify_ai/dify.git
synced 2024-12-02 19:27:48 +08:00
fix the tooltip in tools node (#8055)
This commit is contained in:
parent
89aede80cc
commit
d72da2777c
@ -1,6 +1,5 @@
|
||||
import { Fragment, useState } from 'react'
|
||||
import { useState } from 'react'
|
||||
import type { FC } from 'react'
|
||||
import { RiQuestionLine } from '@remixicon/react'
|
||||
import { ValidatingTip } from '../../key-validator/ValidateStatus'
|
||||
import type {
|
||||
CredentialFormSchema,
|
||||
@ -68,28 +67,17 @@ const Form: FC<FormProps> = ({
|
||||
onChange({ ...value, [key]: val, ...shouldClearVariable })
|
||||
}
|
||||
|
||||
// convert tooltip '\n' to <br />
|
||||
const renderTooltipContent = (content: string) => {
|
||||
return content.split('\n').map((line, index, array) => (
|
||||
<Fragment key={index}>
|
||||
{line}
|
||||
{index < array.length - 1 && <br />}
|
||||
</Fragment>
|
||||
))
|
||||
}
|
||||
|
||||
const renderField = (formSchema: CredentialFormSchema) => {
|
||||
const tooltip = formSchema.tooltip
|
||||
const tooltipContent = (tooltip && (
|
||||
<span className='ml-1 pt-1.5'>
|
||||
<Tooltip popupContent={
|
||||
// w-[100px] caused problem
|
||||
<div className=''>
|
||||
{renderTooltipContent(tooltip[language] || tooltip.en_US)}
|
||||
</div>
|
||||
} >
|
||||
<RiQuestionLine className='w-3 h-3 text-gray-500' />
|
||||
</Tooltip>
|
||||
<span className='ml-1'>
|
||||
<Tooltip
|
||||
popupContent={
|
||||
<div className='w-[200px]'>
|
||||
{tooltip[language] || tooltip.en_US}
|
||||
</div>}
|
||||
triggerClassName='w-4 h-4'
|
||||
/>
|
||||
</span>))
|
||||
if (formSchema.type === FormTypeEnum.textInput || formSchema.type === FormTypeEnum.secretInput || formSchema.type === FormTypeEnum.textNumber) {
|
||||
const {
|
||||
@ -106,7 +94,7 @@ const Form: FC<FormProps> = ({
|
||||
const disabed = readonly || (isEditMode && (variable === '__model_type' || variable === '__model_name'))
|
||||
return (
|
||||
<div key={variable} className={cn(itemClassName, 'py-3')}>
|
||||
<div className={cn(fieldLabelClassName, 'py-2 text-sm text-gray-900')}>
|
||||
<div className={cn(fieldLabelClassName, 'flex items-center py-2 text-sm text-gray-900')}>
|
||||
{label[language] || label.en_US}
|
||||
{
|
||||
required && (
|
||||
@ -147,7 +135,7 @@ const Form: FC<FormProps> = ({
|
||||
|
||||
return (
|
||||
<div key={variable} className={cn(itemClassName, 'py-3')}>
|
||||
<div className={cn(fieldLabelClassName, 'py-2 text-sm text-gray-900')}>
|
||||
<div className={cn(fieldLabelClassName, 'flex items-center py-2 text-sm text-gray-900')}>
|
||||
{label[language] || label.en_US}
|
||||
{
|
||||
required && (
|
||||
@ -203,7 +191,7 @@ const Form: FC<FormProps> = ({
|
||||
|
||||
return (
|
||||
<div key={variable} className={cn(itemClassName, 'py-3')}>
|
||||
<div className={cn(fieldLabelClassName, 'py-2 text-sm text-gray-900')}>
|
||||
<div className={cn(fieldLabelClassName, 'flex items-center py-2 text-sm text-gray-900')}>
|
||||
{label[language] || label.en_US}
|
||||
|
||||
{
|
||||
@ -247,7 +235,7 @@ const Form: FC<FormProps> = ({
|
||||
<div key={variable} className={cn(itemClassName, 'py-3')}>
|
||||
<div className='flex items-center justify-between py-2 text-sm text-gray-900'>
|
||||
<div className='flex items-center space-x-2'>
|
||||
<span className={cn(fieldLabelClassName, 'py-2 text-sm text-gray-900')}>{label[language] || label.en_US}</span>
|
||||
<span className={cn(fieldLabelClassName, 'flex items-center py-2 text-sm text-gray-900')}>{label[language] || label.en_US}</span>
|
||||
{
|
||||
required && (
|
||||
<span className='ml-1 text-red-500'>*</span>
|
||||
|
Loading…
Reference in New Issue
Block a user