import { Header } from "@tanstack/react-table";
import { ColumnResizeHandle } from "./table-head.styles";

interface Props<T> {
  header: Header<T, unknown>;
}

function TableColumnResizeHandle<T>({ header }: Props<T>) {
  return (
    <ColumnResizeHandle
      isResizing={header.column.getIsResizing()}
      onDoubleClick={() => header.column.resetSize()}
      onMouseDown={header.getResizeHandler()}
      onTouchStart={header.getResizeHandler()}
      className={`column__resize ${
        header.column.getIsResizing() ? "is__resizing" : ""
      }`}
    />
  );
}

export default TableColumnResizeHandle;