import { Resizable } from 'react-resizable';

function ResizeableTitle(props) {
  const { onResize, width, ...restProps } = props;
  if (!width) {
    return <th {...restProps} />;
  }

  return (
    <Resizable
      width={width}
      height={0}
      onResize={onResize}
      draggableOpts={{ enableUserSelectHack: false }}
    >
      <th {...restProps} />
    </Resizable>
  );
}

const TableResizableCell = {
  header: {
    cell: ResizeableTitle,
  }
}

export default TableResizableCell