add credentials

packages/ui/src/views/canvas/NodeInputHandler.js

@@ -21,9 +21,14 @@ import { JsonEditorInput } from 'ui-component/json/JsonEditor'
 import { TooltipWithParser } from 'ui-component/tooltip/TooltipWithParser'
 import ToolDialog from 'views/tools/ToolDialog'
 import FormatPromptValuesDialog from 'ui-component/dialog/FormatPromptValuesDialog'
+import CredentialInputHandler from './CredentialInputHandler'
 
+// utils
 import { getInputVariables } from 'utils/genericHelper'
 
+// const
+import { FLOWISE_CREDENTIAL_ID } from 'store/constant'
+
 const EDITABLE_TOOLS = ['selectedTool']
 
 const CustomWidthTooltip = styled(({ className, ...props }) => <Tooltip {...props} classes={{ popper: className }} />)({
@@ -226,6 +231,17 @@ const NodeInputHandler = ({ inputAnchor, inputParam, data, disabled = false, isA
                                 <span style={{ color: 'rgb(116,66,16)', marginLeft: 10 }}>{inputParam.warning}</span>
                             </div>
                         )}
+                        {inputParam.type === 'credential' && (
+                            <CredentialInputHandler
+                                disabled={disabled}
+                                data={data}
+                                inputParam={inputParam}
+                                onSelect={(newValue) => {
+                                    data.credential = newValue
+                                    data.inputs[FLOWISE_CREDENTIAL_ID] = newValue // in case data.credential is not updated
+                                }}
+                            />
+                        )}
                         {inputParam.type === 'file' && (
                             <File
                                 disabled={disabled}