Implementation:FlowiseAI Flowise LoadAssistantDialog

Knowledge Sources	FlowiseAI Flowise
Domains	Assistants, Dialogs
Last Updated	2026-02-12 07:00 GMT

Overview

LoadAssistantDialog is a React dialog component rendered via portal that allows users to select an OpenAI credential and load an existing OpenAI assistant from the API.

Description

This component presents a two-step selection process within a MUI Dialog. First, the user selects an OpenAI API credential via the CredentialInputHandler component. Once a credential is selected, the component fetches all available assistants from OpenAI using that credential and populates a Dropdown with their names and instructions. After selecting an assistant and clicking "Load", the onAssistantSelected callback is invoked with the assistant ID and credential ID. The dialog resets its state whenever dialogProps changes.

Usage

Use this dialog from the OpenAI Assistant layout page when the user clicks the "Load" button to import an existing OpenAI assistant. It is typically paired with the AssistantDialog for the full add/edit workflow.

Code Reference

Source Location

• Repository: FlowiseAI Flowise
• File: packages/ui/src/views/assistants/openai/LoadAssistantDialog.jsx
• Lines: 1-122

Signature

const LoadAssistantDialog = ({ show, dialogProps, onCancel, onAssistantSelected, setError }) => { ... }

export default LoadAssistantDialog

Import

import LoadAssistantDialog from '@/views/assistants/openai/LoadAssistantDialog'

I/O Contract

Inputs

Name	Type	Required	Description
show	bool	No	Controls visibility of the dialog
dialogProps	object	No	Contains title string for the dialog header
onCancel	func	No	Callback invoked when the dialog is closed without selection
onAssistantSelected	func	No	Callback invoked with (selectedOpenAIAssistantId, credentialId) when the user clicks Load
setError	func	No	Callback to propagate API errors to the parent component

Outputs

Name	Type	Description
JSX.Element	React portal	A MUI Dialog with credential selection, assistant dropdown, and a Load action button

Usage Examples

Basic Usage

import LoadAssistantDialog from '@/views/assistants/openai/LoadAssistantDialog'

const OpenAIPage = () => {
    const [showLoad, setShowLoad] = useState(false)

    return (
        <>
            <Button onClick={() => setShowLoad(true)}>Load Existing</Button>
            <LoadAssistantDialog
                show={showLoad}
                dialogProps={{ title: 'Load Existing Assistant' }}
                onCancel={() => setShowLoad(false)}
                onAssistantSelected={(assistantId, credentialId) => {
                    setShowLoad(false)
                    openEditDialog(assistantId, credentialId)
                }}
                setError={setError}
            />
        </>
    )
}

Related Pages

• Principle:FlowiseAI_Flowise_Assistant_Configuration