import { FiltersMap } from '@wix/bex-core';
import { TableState } from '../../state';
import { action, makeObservable } from 'mobx';
import { CollectionDragAndDropState } from './CollectionDragAndDropState';
import { DragAndDropCancel } from './DragAndDrop';

export interface TableDragAndDropStateParams<T, F extends FiltersMap> {
  readonly tableState: TableState<T, F>;
  readonly modalsContainerRef: {
    current: HTMLElement | null | undefined;
  };
  readonly dragAndDropCancel?: DragAndDropCancel<T, F>;
}

export class TableDragAndDropState<T, F extends FiltersMap> {
  readonly tableState;
  readonly dragAndDrop;

  constructor(params: TableDragAndDropStateParams<T, F>) {
    this.tableState = params.tableState;
    this.dragAndDrop = new CollectionDragAndDropState({
      state: params.tableState.toolbar,
      container: params.tableState.toolbar.container,
      a11yContainer: params.modalsContainerRef,
    });

    makeObservable(this, {
      init: action,
    });
  }

  get dnd() {
    return this.dragAndDrop.dnd;
  }

  getStickyColumnsCount({
    stickyColumns,
    horizontalScroll,
  }: {
    stickyColumns: number;
    showSelection?: boolean;
    horizontalScroll?: boolean;
  }) {
    const { dragAndDrop } = this;
    return horizontalScroll && !dragAndDrop.dnd.isDisabled
      ? stickyColumns + 1
      : stickyColumns;
  }

  init() {
    const { dragAndDrop } = this;

    return dragAndDrop.init();
  }
}