import { JsonObject, SerializedFunction } from '@win2win/shared';
import { FilterConfig, StateConfig } from 'src/layouts/w2w-toolbar/W2WToolbarConfig';
import { Tab } from '../components/common-ww/btns/tabs';
import { Gama } from './gama';

export type Layout = {
  [contextKey in LayoutContext]?: {
    [typeKey in LayoutType]?: LayoutGroup<typeKey>;
  };
};

export interface LayoutGroup<T extends LayoutType = any> {
  views: LayoutTypeMap[T][];
  popups?: Popup[];
  globalActions?: GlobalAction[];
  createdAt?: Date;
  idLayoutGroup: string;
  context: LayoutContext;
  type: LayoutType;
  layout?: LayoutGroupMainLayout;
}

export interface LayoutGroupMainLayout {
  title: SerializedFunction;
  backButton: SerializedFunction;
  allowNavigation?: boolean;
}

export const LAYOUT_CONTEXTS = ['captacion', 'producto', 'marketing', 'delegacion', 'cliente', 'proveedor', 'liquidacion', 'usuario', 'planificacion', 'operacion', 'llamada', 'partner'] as const;
export type LayoutContext = (typeof LAYOUT_CONTEXTS)[number];

export const LAYOUT_TYPES = ['detalle', 'tabla', 'mapa'] as const;
export type LayoutType = (typeof LAYOUT_TYPES)[number];

export const LAYOUT_FOOTER = ['general_request_buttons', 'immediate_request_acceptance_buttons'] as const;
export type LayoutFooterType = (typeof LAYOUT_FOOTER)[number];

export const LAYOUT_VIEWS = [
  'tabla',
  'general',
  'estado',
  'comunicacion',
  'contacto',
  'titulares',
  'producto',
  'tie',
  'respuestas_landing',
  'documentos',
  'documentacion',
  'incidencias',
  'contrato',
  'cuenta_bancaria',
  'titulares',
  'ingresos',
  'deudas',
  'garantias',
  'ubicacion',
  'gastos',
  'importaciones',
] as const;
export type LayoutViewLabel = (typeof LAYOUT_VIEWS)[number];
export interface LayoutTypeMap {
  tabla: TableLayoutView;
  detalle: DetailLayoutView;
  mapa: MapLayoutView;
}

export type LayoutFn<T> = (params?: LayoutParams) => T;
export interface LayoutActionButton {
  label?: string;
  icon?: string;
  code: string;
  params?: JsonObject;
  dialogProps?: JsonObject; // DEPRECADO
  visibility?: SerializedFunction;
  disabled?: SerializedFunction;
}

export interface LayoutActionsGroup {
  icon: string;
  label: string;
  code: string;
  actions: LayoutActionButton[];
}

export type LayoutActionsGroupEditable = Omit<LayoutActionsGroup, 'actions'> & { actions: LayoutActionButtonEditable[] };
export type LayoutActionButtonEditable = Omit<LayoutActionButton, 'params'> & { params?: JsonObject };

export interface LayoutView {
  idLayoutView: string;
  idLayoutGroup: string;
  position: number;
  view: LayoutViewLabel;
  widgets: Widget[];
  visibilityFn: string; // (params: LayoutParams) => boolean;
  rowClickFn: string;
  class?: string;
  style?: string;
  visible?: boolean;
  tab?: Tab;
  actionsGroups?: LayoutActionsGroup[];
  createdAt?: Date;
  states: Partial<StateConfig>;
  columns?: LayoutTableColumn[];
  rowActions?: LayoutActionButton[];
  idKey?: string;
  filters?: any[];
  title: string;
  redirect?: SerializedFunction;
  query: LayoutQueryConfig;
  showGrid?: boolean; // mostrar grid al inicio, por defecto
  batchActions?: LayoutActionButton[]; // acciones por lotes
  custom?: JsonObject | null;
  templates?: {
    grid: string;
    mobile: string;
  } | null;
}

export interface LayoutQueryConfig {
  url: string;
  baseQueryParams: Record<string, any> | SerializedFunction | null;
  initialPagination: Record<string, any> | SerializedFunction | null;
  keysToCompareTerms: string[] | SerializedFunction | null;
}
export interface TableLayoutView extends LayoutView {
  // states?: LayoutTableState[];
  // columns?: any[];
  // filters?: any[];
}
export interface DetailLayoutView extends LayoutView {
  // tab: LayoutFn<Tab> | Tab; // las funciones se graban como string
}
export interface MapLayoutView extends LayoutView {
  // tab: LayoutFn<Tab> | Tab; // las funciones se graban como string
}

export interface Popup {
  idLayoutPopup: string;
  idLayoutGroup: string;
  createdAt?: Date;
  condition: string; // (params: LayoutParams) => boolean;
  text: {
    title: string;
    body: string;
  };
  actions: PopupAction[];
  enabled: boolean;
  showOnce?: boolean;
}

export interface PopupAction {
  label: string;
  event: string;
  payload?: any;
}

export interface GlobalAction {
  idLayoutGlobalAction: string;
  idLayoutGroup: string;
  code: string;
  visibilityFn: string; // (params: LayoutParams) => boolean;
  enabled: boolean;
  label?: string;
  icon?: string;
  mobileIcon?: string; // DEPRECADO, usar icon
  params?: any; // en el caso de backroute, params es { path: string }
  createdAt?: Date;
  position?: number | null;
}

export interface LayoutTableFilter extends FilterConfig {}
export interface LayoutTableColumn {
  id?: string;
  name: string;
  field: string;
  label?: string;
  align?: string;
  icon?: string;
  visibilityFn?: string;
  sortable?: boolean;
  type?: ColumnType;
}

export const COLUMN_TYPES = ['normal', 'avatar', 'indicator', 'actions', 'image', 'link'] as const;
export type ColumnType = (typeof COLUMN_TYPES)[number];
export interface LayoutTableState {
  label: string;
  value: number;
  color: string;
  count: number;
}
export interface Widget {
  code: string;
  class?: string;
  style?: string;
  data?: any;
  enabled?: boolean;
  navigateTo?: string;
  condition?: string; // (params: LayoutParams) => boolean;
}
export interface LayoutParams {
  data?: any; // datos de la captacion, producto, cliente, etc
  rol?: string | null; // obtenido del usuario logueado
  estado?: string | number | null; // estado de la captacion, producto, cliente, etc
  gama?: Gama | null; // gama de la captacion, producto, cliente, etc
  perfil?: number | null; // id del perfil del usuario logueado
  id: string | number | null; // id de la captacion, producto, cliente, etc
}

export interface RawLayoutGroup {
  ID_LAYOUT_GROUP: string;
  ID_GAMA: number;
  CONTEXT: string;
  TYPE: string;
  CREATED_AT: Date;
  UPDATED_AT: Date;
  LAYOUT_VIEWS: RawLayoutView[];
  LAYOUT_POPUPS: any[];
  LAYOUT_GLOBAL_ACTIONS: any[];
}

export interface RawLayoutView {
  ID_LAYOUT_VIEW: string;
  ID_LAYOUT_GROUP: string;
  POSITION: number;
  VIEW: string;
  VISIBILITY_FN: string;
  CLASS: string;
  STYLE: string;
  ENABLED: boolean;
  TAB: null;
  FILTERS: any[];
  COLUMNS: any[];
  WIDGETS: any[];
  ACTIONS_GROUPS: any[];
  CREATED_AT: Date;
  UPDATED_AT: Date;
}

export type LayoutGroupModel = Omit<LayoutGroup, 'views'> & {
  idGama?: number | null;
  views: LayoutViewModel[];
};

export type LayoutViewModel = Omit<LayoutView, 'view' | 'widgets' | 'actionsGroups'> & {
  idLayoutGroup?: string;
  view: LayoutViewLabel | null;
  widgets: Widget[];
  columns?: LayoutTableColumn[];
  filters: LayoutTableFilter[];
  footer?: LayoutFooterType;
  actionsGroups?: LayoutActionsGroupEditable[];
  states: StateConfig;
};