import React from 'react';
import { observer } from 'mobx-react-lite';
import { CollectionState, FiltersMap, KeyedItem } from '@wix/bex-core';
import { CollectionTableActionsColumn } from '../CollectionTableActionsColumn';
import { NestedTableLevelDescriptor } from '../../state/NestedTableState/NestedTableLevelDescriptor';

export interface NestedTableActionCellProps<
  C extends string,
  T,
  F extends FiltersMap,
> {
  rowNum: number;
  state: {
    readonly collection: CollectionState<T, F>;
    readonly levelDescriptor: NestedTableLevelDescriptor<C, T, F>;
  };
  item: KeyedItem<T>;
}

function _NestedTableActionCell<C extends string, T, F extends FiltersMap>(
  props: NestedTableActionCellProps<C, T, F>,
) {
  const { state, item, rowNum } = props;

  const { collection } = state;

  const { actionCell } = state.levelDescriptor;

  if (actionCell == null) {
    return null;
  }

  return (
    <CollectionTableActionsColumn
      index={rowNum}
      sticky
      collection={collection}
      keyedItem={item}
      actionCell={actionCell}
    />
  );
}

export const NestedTableActionCell = observer(_NestedTableActionCell);