export const TABLE_ROW_HEIGHT = 80;

export const BASE_TABLE_CONFIG = {
  muiTableRowProps: {
    sx: { height: "5rem" },
  },
  enableExpanding: true,
  enableStickyHeader: true,
  enableColumnPinning: true,
  enableEditing: true,
  editDisplayMode: "cell",
  renderTopToolbar: false,
  renderBottomToolbar: false,
  layoutMode: "grid-no-grow",
  enablePagination: false,
  memoMode: "cells",
  autoResetHiddenColumns: false,
  autoResetSortBy: false,
  autoResetAll: false,
  enableGrouping: true,
  enableColumnResizing: true,
  enableGlobalFilter: true,
  enableColumnFilter: true,
  globalFilterFn: "contains",
  filterFromLeafRows: true,
  positionGlobalFilter: "left",
  positionPinning: { left: 0, right: 0 },
  defaultColumn: { filterFn: "contains" },
  columnResizeMode: "onChange",
  localization: {
    noRecordsToDisplay: <span>Нет данных для отображения</span>,
  },
};

export const getTableHeadCellStyles = () => ({
  sx: {
    whiteSpace: "auto",
    wordBreak: "normal",
    boxSizing: "border-box",
    minHeight: "3rem",
    maxHeight: "3rem",
    border: "1px solid #E6E6E6",
    fontSize: "11px",
    fontFamily: "Calibri, Arial, sans-serif",
  },
});

export const getTableBodyCellProps = ({ column, table }) => {
  const isPinned = (table.getState().columnPinning?.left || []).includes(column.id);

  return {
    'data-col-id': column.id,
    sx: {
      ...getTableHeadCellStyles().sx,
      ...(isPinned && { zIndex: 5 }),
    },
  };
};

export const getTablePaperStyles = () => ({
  sx: {
    boxShadow: "none",
    border: "1px solid #d1d1d1",
    height: "100%",
    display: "flex",
    flexDirection: "column",
  },
});

