// UI component types

import type { TableColumnType } from 'antd';
import type { DocumentNode } from 'graphql';

// DataTable configuration
export interface DataTableColumn<T> extends Omit<TableColumnType<T>, 'render' | 'dataIndex'> {
  dataIndex: string | string[];
  title: string;
  sortable?: boolean;
  filterable?: boolean;
  render?: (value: unknown, record: T, index: number) => React.ReactNode;
  // Custom column types
  columnType?: 'text' | 'number' | 'currency' | 'date' | 'boolean' | 'actions';
  // Currency/number formatting
  decimalPlaces?: number;
  showSign?: boolean;
}

export interface DataTableProps<T extends { id: string }> {
  // Data source configuration
  queryKey: string[];
  query: DocumentNode;
  variables?: Record<string, unknown>;
  dataPath: string; // Path to items array in response
  totalPath: string; // Path to total count in response

  // Columns
  columns: DataTableColumn<T>[];

  // Pagination
  pageSize?: number;
  pageSizeOptions?: number[];

  // Features
  rowSelection?: 'single' | 'multiple' | false;
  onRowClick?: (record: T) => void;
  onSelectionChange?: (selectedRowKeys: string[], selectedRows: T[]) => void;
  exportable?: boolean;
  exportFilename?: string;

  // Row styling
  rowClassName?: (record: T, index: number) => string;

  // Actions
  toolbarActions?: React.ReactNode;

  // Empty state
  emptyText?: string;

  // Loading
  loading?: boolean;
}

export interface FilterFormConfig {
  fields: FilterFieldConfig[];
  onFilter: (values: Record<string, unknown>) => void;
  onReset: () => void;
}

export interface FilterFieldConfig {
  name: string;
  label: string;
  type: 'text' | 'number' | 'date' | 'dateRange' | 'select' | 'checkbox';
  placeholder?: string;
  options?: { label: string; value: string | number }[];
  defaultValue?: unknown;
}

// Navigation types
export interface MenuItem {
  key: string;
  label: string;
  icon?: React.ReactNode;
  path?: string;
  children?: MenuItem[];
}

// Form types
export interface FormFieldError {
  field: string;
  message: string;
}

// Modal types
export interface ModalState {
  visible: boolean;
  mode: 'create' | 'edit' | 'view';
  data?: unknown;
}

// Notification types
export interface NotificationConfig {
  type: 'success' | 'error' | 'info' | 'warning';
  message: string;
  description?: string;
  duration?: number;
}

// Reconciliation UI types
export interface ReconciliationViewState {
  selectedBankTransactions: string[];
  selectedLedgerTransactions: string[];
  matchSuggestions: MatchSuggestion[];
  viewMode: 'list' | 'side-by-side';
}

export interface MatchSuggestion {
  bankTransactionId: string;
  ledgerTransactionId: string;
  confidence: number;
  reason: string;
}

// Chart data types
export interface ChartDataPoint {
  label: string;
  value: number;
  color?: string;
}

export interface TimeSeriesDataPoint {
  date: string;
  value: number;
  category?: string;
}
