diff --git a/web/app/components/base/form/form-scenarios/input-field/field.tsx b/web/app/components/base/form/form-scenarios/input-field/field.tsx
index ab16b9a482..8a9de3fc0c 100644
--- a/web/app/components/base/form/form-scenarios/input-field/field.tsx
+++ b/web/app/components/base/form/form-scenarios/input-field/field.tsx
@@ -50,6 +50,7 @@ const InputField = ({
return (
(
{
}
export const useConfigurations = (props: {
+ getFieldValue: (fieldName: DeepKeys) => any,
setFieldValue: (fieldName: DeepKeys, value: any) => void,
supportFile: boolean
}) => {
const { t } = useTranslation()
- const { setFieldValue, supportFile } = props
+ const { getFieldValue, setFieldValue, supportFile } = props
const handleTypeChange = useCallback((type: PipelineInputVarType) => {
if ([PipelineInputVarType.singleFile, PipelineInputVarType.multiFiles].includes(type)) {
@@ -84,6 +85,17 @@ export const useConfigurations = (props: {
setFieldValue('maxLength', DEFAULT_VALUE_MAX_LEN)
}, [setFieldValue])
+ const handleVariableNameBlur = useCallback((value: string) => {
+ if (!value)
+ return
+ setFieldValue('label', value)
+ }, [setFieldValue])
+
+ const handleDisplayNameBlur = useCallback((value: string) => {
+ if (!value)
+ setFieldValue('label', getFieldValue('variable'))
+ }, [getFieldValue, setFieldValue])
+
const initialConfigurations = useMemo((): InputFieldConfiguration[] => {
return [{
type: InputFieldType.inputTypeSelect,
@@ -101,13 +113,19 @@ export const useConfigurations = (props: {
variable: 'variable',
placeholder: t('appDebug.variableConfig.inputPlaceholder'),
required: true,
+ listeners: {
+ onBlur: ({ value }) => handleVariableNameBlur(value),
+ },
showConditions: [],
}, {
type: InputFieldType.textInput,
- label: t('appDebug.variableConfig.labelName'),
+ label: t('appDebug.variableConfig.displayName'),
variable: 'label',
placeholder: t('appDebug.variableConfig.inputPlaceholder'),
- required: true,
+ required: false,
+ listeners: {
+ onBlur: ({ value }) => handleDisplayNameBlur(value),
+ },
showConditions: [],
}, {
type: InputFieldType.numberInput,
@@ -155,7 +173,7 @@ export const useConfigurations = (props: {
required: true,
showConditions: [],
}]
- }, [handleTypeChange, supportFile, t])
+ }, [t, supportFile, handleTypeChange, handleVariableNameBlur, handleDisplayNameBlur])
return initialConfigurations
}
diff --git a/web/app/components/rag-pipeline/components/input-field/editor/form/initial-fields.tsx b/web/app/components/rag-pipeline/components/input-field/editor/form/initial-fields.tsx
index c00708ed6e..9c6a053509 100644
--- a/web/app/components/rag-pipeline/components/input-field/editor/form/initial-fields.tsx
+++ b/web/app/components/rag-pipeline/components/input-field/editor/form/initial-fields.tsx
@@ -16,11 +16,16 @@ const InitialFields = ({
render: function Render({
form,
}) {
+ const getFieldValue = useCallback((fieldName: string) => {
+ return form.getFieldValue(fieldName)
+ }, [form])
+
const setFieldValue = useCallback((fieldName: string, value: any) => {
form.setFieldValue(fieldName, value)
}, [form])
const initialConfigurations = useConfigurations({
+ getFieldValue,
setFieldValue,
supportFile,
})
diff --git a/web/app/components/rag-pipeline/components/panel/test-run/data-source/website-crawl/base/crawled-result.tsx b/web/app/components/rag-pipeline/components/panel/test-run/data-source/website-crawl/base/crawled-result.tsx
index 29737b0cdd..9d5019f31e 100644
--- a/web/app/components/rag-pipeline/components/panel/test-run/data-source/website-crawl/base/crawled-result.tsx
+++ b/web/app/components/rag-pipeline/components/panel/test-run/data-source/website-crawl/base/crawled-result.tsx
@@ -69,7 +69,7 @@ const CrawledResult = ({
onChange={handleCheckedAll} label={isCheckAll ? t(`${I18N_PREFIX}.resetAll`) : t(`${I18N_PREFIX}.selectAll`)}
/>
-
+
{list.map((item, index) => (