Implementation:FlowiseAI Flowise AssistantVectorStoreDialog

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

Overview

AssistantVectorStoreDialog is a React dialog component that allows users to create, edit, select, and delete OpenAI Assistant vector stores within the Flowise UI.

Description

This component renders a Material UI Dialog that is portaled to the DOM element with id "portal". It provides a dropdown to select from existing vector stores or create a new one, input fields for the vector store name and optional expiration settings, and action buttons for saving or deleting. The component communicates with the OpenAI Assistants API through the Flowise backend to manage vector store lifecycle operations.

Usage

Use this component when you need to present a dialog for managing OpenAI Assistant vector stores, such as from the assistant configuration views. It supports both ADD and EDIT modes via the dialogProps property.

Code Reference

Source Location

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

Signature

const AssistantVectorStoreDialog = ({ show, dialogProps, onCancel, onConfirm, onDelete, setError }) => {
    // ...
}

Import

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

I/O Contract

Inputs

Name	Type	Required	Description
show	bool	Yes	Controls the visibility of the dialog
dialogProps	object	Yes	Configuration object containing type ('ADD' or 'EDIT'), data, credential, title, and confirmButtonName
onCancel	func	Yes	Callback invoked when the dialog is cancelled or closed
onConfirm	func	Yes	Callback invoked on successful create/save with the vector store data and optionally files
onDelete	func	No	Callback invoked on successful deletion with the deleted vector store ID
setError	func	No	Callback to propagate errors to the parent component

Outputs

Name	Type	Description
Portal-rendered Dialog	ReactPortal	A Material UI Dialog rendered into the #portal DOM element

Usage Examples

Basic Usage

<AssistantVectorStoreDialog
    show={showDialog}
    dialogProps={{
        type: 'ADD',
        title: 'Add Vector Store',
        confirmButtonName: 'Add',
        credential: selectedCredential
    }}
    onCancel={() => setShowDialog(false)}
    onConfirm={(vectorStoreData) => handleVectorStoreAdded(vectorStoreData)}
    onDelete={(vsId) => handleVectorStoreDeleted(vsId)}
    setError={setError}
/>

Related Pages

• Principle:FlowiseAI_Flowise_Vector_Store_Provider_Configuration