feat(variables): auto replace spaces with underscores in variable name inputs (#21843)

web/app/components/workflow/nodes/variable-assigner/components/var-group-item.tsx

@@ -15,7 +15,7 @@ import { VarType } from '@/app/components/workflow/types'
 import type { NodeOutPutVar, ValueSelector, Var } from '@/app/components/workflow/types'
 import { VarType as VarKindType } from '@/app/components/workflow/nodes/tool/types'
 import { Folder } from '@/app/components/base/icons/src/vender/line/files'
-import { checkKeys } from '@/utils/var'
+import { checkKeys, replaceSpaceWithUnderscreInVarNameInput } from '@/utils/var'
 import Toast from '@/app/components/base/toast'
 
 const i18nPrefix = 'workflow.nodes.variableAssigner'
@@ -89,6 +89,7 @@ const VarGroupItem: FC<Props> = ({
   }] = useBoolean(false)
 
   const handleGroupNameChange = useCallback((e: ChangeEvent<any>) => {
+    replaceSpaceWithUnderscreInVarNameInput(e.target)
     const value = e.target.value
     const { isValid, errorKey, errorMessageKey } = checkKeys([value], false)
     if (!isValid) {