Implementation:FlowiseAI Flowise ShareExecutionDialog

Knowledge Sources	FlowiseAI Flowise
Domains	Agent Executions, Sharing
Last Updated	2026-02-12 07:00 GMT

Overview

ShareExecutionDialog is a React dialog component that displays a shareable public link for an execution trace and provides copy-to-clipboard and unshare functionality.

Description

This component renders a MUI Dialog via a React portal, showing the generated public execution URL based on the current origin and execution ID. It provides a copy button that writes the link to the clipboard and shows a snackbar confirmation, plus an unshare button that calls the execution update API to set isPublic to false. The dialog adapts its styling for dark/light mode using the Redux customization store.

Usage

Use this dialog after an execution has been marked as public. It is typically opened from the execution details view to allow users to copy the public trace link or revoke public access.

Code Reference

Source Location

• Repository: FlowiseAI Flowise
• File: packages/ui/src/views/agentexecutions/ShareExecutionDialog.jsx
• Lines: 1-126

Signature

const ShareExecutionDialog = ({ show, executionId, onClose, onUnshare }) => { ... }

export default ShareExecutionDialog

Import

import ShareExecutionDialog from '@/views/agentexecutions/ShareExecutionDialog'

I/O Contract

Inputs

Name	Type	Required	Description
show	bool	No	Controls the visibility of the dialog
executionId	string	No	The ID of the execution to generate the shareable link for
onClose	func	No	Callback invoked when the dialog is closed
onUnshare	func	No	Callback invoked after the execution is unshared (set to non-public)

Outputs

Name	Type	Description
JSX.Element	React portal	A MUI Dialog rendered via portal containing the shareable link, copy button, and unshare action

Usage Examples

Basic Usage

import ShareExecutionDialog from '@/views/agentexecutions/ShareExecutionDialog'

const ExecutionView = () => {
    const [showShare, setShowShare] = useState(false)

    return (
        <>
            <Button onClick={() => setShowShare(true)}>Share</Button>
            <ShareExecutionDialog
                show={showShare}
                executionId="exec-abc-123"
                onClose={() => setShowShare(false)}
                onUnshare={() => {
                    setShowShare(false)
                    refreshData()
                }}
            />
        </>
    )
}

Related Pages

• Principle:FlowiseAI_Flowise_Execution_Monitoring