import React from 'react';
import { CRUDProps, CRUDState } from '../../types';
import { SecondFilterDrawer } from '../../../../components/table/SecondFilter/SecondFilterDrawer';
import { ITableStore } from '../../../../store/table';
import { getColumnShowLabel } from '../../../../store/utils/commonTableFunction';
import { createObject } from '../../../../utils/helper';


export interface SecondFilterDrawerProps {
  props: CRUDProps;
  tableStore: ITableStore | null;
  filterDrawerVisible: CRUDState['filterDrawerVisible'];
  showColumnsFilter: CRUDState['showColumnsFilter'];
  setCrudState: (...res: any) => any;
  setTotal: (...res: any) => any;
  handleAction: (...res: any) => any;
}

const SecondFilterDrawerRender: React.FC<SecondFilterDrawerProps> = (SecondFilterDrawerprops) => {
  const { props, filterDrawerVisible, showColumnsFilter, tableStore, setCrudState, setTotal, handleAction } = SecondFilterDrawerprops;
  const { store, classnames: cx, classPrefix, translate, env, name, loadDataOnce, itemAction } = props;


  return <SecondFilterDrawer
    visible={filterDrawerVisible}
    showColumnsFilter={showColumnsFilter}
    columns={tableStore?.filteredColumns.map((column: any) => ({ type: column.type, name: column.name, label: getColumnShowLabel(column), map: column.map, format: column.pristine.valueFormat })) ?? []}
    filterMap={tableStore?.filterColumns ?? new Map()}
    getContainer={env.getModalContainer}
    crudName={name}
    onClose={() => setCrudState({ filterDrawerVisible: false })}
    onCheckedChange={(checked, filterMap, caseSensitive) => {
      setCrudState({ showColumnsFilter: checked })
      checked ? tableStore?.update({ filterColumns: filterMap }) : tableStore?.filterColumns.clear()
      const items = tableStore?.handleMutilSort(loadDataOnce, caseSensitive)
      if (loadDataOnce && Array.isArray(items)) setTotal(items.length)
      if (itemAction) {
        const ctx = createObject(store.query, items[0], {}, true)
        handleAction(undefined, itemAction, ctx)
      }
    }}
    onConfirm={(filterMap, caseSensitive) => {
      tableStore?.update({ filterColumns: filterMap })
      setCrudState({ filterDrawerVisible: false })
      const items = tableStore?.handleMutilSort(loadDataOnce, caseSensitive)
      if (loadDataOnce && Array.isArray(items)) setTotal(items.length)
      if (itemAction) {
        const ctx = createObject(store.query, items[0], {}, true)
        handleAction(undefined, itemAction, ctx)
      }
    }}
    translate={translate}
    classPrefix={classPrefix}
    classnames={cx}
  />
};

export default SecondFilterDrawerRender;