Superset UI Legacy Plugin Chart Event Flow

import EventFlowChartPlugin from "@superset-ui/legacy-plugin-chart-event-flow";

const EventFlowChartPlugin = require("@superset-ui/legacy-plugin-chart-event-flow");

import EventFlowChartPlugin from "@superset-ui/legacy-plugin-chart-event-flow";

// Register the plugin with Superset
new EventFlowChartPlugin().configure({ key: "event-flow" }).register();

import { SuperChart } from "@superset-ui/core";

<SuperChart
  chartType="event-flow"
  width={600}
  height={600}
  formData={{
    // Required properties
    allColumnsX: "event_name", 
    entity: "user_id",
    minLeafNodeEventCount: 1,
    // Optional properties (available through control panel)
    orderByEntity: true,
    rowLimit: 1000,
    adhocFilters: [],
    allColumns: ["metadata_field"],
  }}
  queriesData={[{
    data: [
      { user_id: "123", event_name: "login", __timestamp: 1640995200000 },
      { user_id: "123", event_name: "click", __timestamp: 1640995260000 },
      // ... more event data
    ],
  }]}
/>

/**
 * Event Flow Chart Plugin for Apache Superset
 * Extends ChartPlugin to provide Event Flow visualization capabilities
 */
export default class EventFlowChartPlugin extends ChartPlugin {
  constructor();
}

/**
 * Props interface for the EventFlow component
 */
interface EventFlowProps {
  /** Chart data as an array of time series records */
  data: TimeseriesDataRecord[];
  /** Chart height in pixels */
  height: number;
  /** Chart width in pixels */
  width: number;
  /** Initial minimum event count filter for leaf nodes */
  initialMinEventCount: number;
}

/**
 * Event Flow chart component that renders timeline visualization
 * @param data - Chart data as an array of time series records
 * @param initialMinEventCount - Initial minimum event count filter for leaf nodes
 * @param height - Chart height in pixels (default: 400)
 * @param width - Chart width in pixels (default: 400)
 * @returns React component rendering the event flow chart
 */
export default function EventFlow({
  data,
  initialMinEventCount,
  height = 400,
  width = 400,
}: EventFlowProps): JSX.Element;

/**
 * Form data interface for Event Flow chart configuration
 * Core properties used by transformProps: allColumnsX, entity, minLeafNodeEventCount
 * Additional properties available through Superset's control panel
 */
interface EventFlowFormData {
  /** Column name for event names (required) */
  allColumnsX: string;
  /** Column name for entity identifier (e.g., user ID) (required) */
  entity: string;
  /** Minimum event count for leaf nodes to be initially visible (required) */
  minLeafNodeEventCount: number;
  /** Whether to order results by entity ID (optional, available in control panel) */
  orderByEntity?: boolean;
  /** Maximum number of events to return (optional, standard Superset control) */
  rowLimit?: number;
  /** Adhoc filter configurations (optional, standard Superset control) */
  adhocFilters?: any[];
  /** Additional metadata columns (optional, available in control panel) */
  allColumns?: string[];
}

/**
 * Extended chart props interface including Event Flow specific form data
 */
interface EventFlowChartProps extends ChartProps {
  formData: EventFlowFormData;
  queriesData: {
    data: TimeseriesDataRecord[];
  }[];
}

/**
 * Transforms Superset chart properties into EventFlow component props
 * @param chartProps - Superset chart properties including form data and query results
 * @returns Props object for EventFlow component or null data object if no data
 */
export default function transformProps(chartProps: ChartProps): {
  data: TimeseriesDataRecord[] | null;
  height: number;
  width: number;
  initialMinEventCount?: number;
};

/**
 * Control panel configuration for Event Flow chart
 * Defines the form controls and sections available in Superset's chart builder
 */
declare const controlPanel: ControlPanelConfig;

/**
 * Time series data record structure expected by the chart
 */
interface TimeseriesDataRecord {
  /** Timestamp of the event (required for temporal positioning) */
  __timestamp: number;
  /** Additional data fields as key-value pairs */
  [key: string]: any;
}

/**
 * Chart metadata configuration
 */
interface ChartMetadata {
  category: string;
  credits: string[];
  description: string; 
  name: string;
  tags: string[];
  thumbnail: string;
  useLegacyApi: boolean;
}

/**
 * Superset chart properties base interface
 */
interface ChartProps {
  formData: any;
  queriesData: any[];
  width: number;
  height: number;
}

/**
 * Control panel configuration structure
 */
interface ControlPanelConfig {
  controlPanelSections: any[];
  controlOverrides: any;
}

/**
 * Props interface for the EventFlow component
 */
export interface EventFlowProps {
  data: TimeseriesDataRecord[];
  height: number;
  width: number;
  initialMinEventCount: number;
}

/**
 * Form data interface for Event Flow chart configuration
 * Core properties used by transformProps: allColumnsX, entity, minLeafNodeEventCount
 * Additional properties available through Superset's control panel
 */
export interface EventFlowFormData {
  allColumnsX: string;
  entity: string;
  minLeafNodeEventCount: number;
  orderByEntity?: boolean;
  rowLimit?: number;
  adhocFilters?: any[];
  allColumns?: string[];
}

/**
 * Extended chart props interface including Event Flow specific form data
 */
export interface EventFlowChartProps extends ChartProps {
  formData: EventFlowFormData;
  queriesData: {
    data: TimeseriesDataRecord[];
  }[];
}