Chart Configuration

enum ChartKind {
  LINE = 'line',
  HORIZONTAL_BAR = 'horizontal_bar',
  VERTICAL_BAR = 'vertical_bar',
  SCATTER = 'scatter',
  AREA = 'area',
  MIXED = 'mixed',
  PIE = 'pie',
  TABLE = 'table',
  BIG_NUMBER = 'big_number',
  FUNNEL = 'funnel',
  TREEMAP = 'treemap',
  GAUGE = 'gauge',
  MAP = 'map'
}

enum ChartType {
  CARTESIAN = 'cartesian',
  PIE = 'pie',
  TABLE = 'table',
  BIG_NUMBER = 'big_number',
  FUNNEL = 'funnel',
  TREEMAP = 'treemap',
  GAUGE = 'gauge',
  MAP = 'map'
}

interface SavedChart {
  uuid: string;
  projectUuid: string;
  name: string;
  tableName: string;
  metricQuery: MetricQuery;
  chartConfig: ChartConfig;
  tableConfig: TableChart;
  pivotConfig?: PivotConfig;
  spaceUuid: string;
}

type ChartConfig =
  | CartesianChartConfig
  | PieChartConfig
  | BigNumberConfig
  | TableChartConfig
  | FunnelChartConfig;

type CartesianChartConfig = {
  type: ChartType.CARTESIAN;
  config?: CartesianChart;
};

type CartesianChart = {
  layout: CartesianChartLayout;
  eChartsConfig: EChartsConfig;
};

interface CartesianChartLayout {
  xField: string;
  yField: string[];
  flipAxes?: boolean;
}

enum CartesianSeriesType { BAR = 'bar', LINE = 'line', SCATTER = 'scatter', AREA = 'area' }

interface Series {
  encode: { xRef: PivotReference; yRef: PivotReference };
  type: CartesianSeriesType;
  stack?: string;
  label?: { show?: boolean; position?: string };
  color?: string;
  yAxisIndex?: number;
  hidden?: boolean;
}

type PieChartConfig = { type: ChartType.PIE; config?: PieChart };

type PieChart = {
  groupFieldIds?: string[];
  metricId?: string;
  isDonut?: boolean;
  showLegend?: boolean;
  legendPosition?: PieChartLegendPosition;
};

enum PieChartLegendPosition { HORIZONTAL = 'horizontal', VERTICAL = 'vertical' }

interface TableChart {
  showColumnCalculation?: boolean;
  showRowCalculation?: boolean;
  showTableNames?: boolean;
  hideRowNumbers?: boolean;
  metricsAsRows?: boolean;
  columns?: Record<string, ColumnProperties>;
}

interface ColumnProperties {
  visible?: boolean;
  name?: string;
  frozen?: boolean;
  displayStyle?: 'text' | 'bar';
}

type BigNumber = {
  label?: string;
  selectedField?: string;
  showBigNumberLabel?: boolean;
  showComparison?: boolean;
  comparisonFormat?: ComparisonFormatTypes;
};

enum ComparisonFormatTypes { RAW = 'raw', PERCENTAGE = 'percentage' }

function isCartesianChartConfig(config: ChartConfig): config is CartesianChartConfig;
function isPieChartConfig(config: ChartConfig): config is PieChartConfig;
function isTableChartConfig(config: ChartConfig): config is TableChartConfig;
function getChartType(savedChart: SavedChart): ChartType;
function getChartKind(chartConfig: ChartConfig): ChartKind;
function getDefaultSeriesColor(index: number): string;

import { type SavedChart, ChartType, CartesianSeriesType } from '@lightdash/common';

const chart: SavedChart = {
  uuid: '...',
  projectUuid: '...',
  name: 'Revenue Trend',
  tableName: 'orders',
  metricQuery: { /* ... */ },
  chartConfig: {
    type: ChartType.CARTESIAN,
    config: {
      layout: {
        xField: 'orders.created_at',
        yField: ['orders.revenue'],
      },
      eChartsConfig: {
        series: [{ type: CartesianSeriesType.LINE }],
      },
    },
  },
  tableConfig: {},
  spaceUuid: '...',
};