fix for resizable tables

gregnb · Jul 24, 2020 · 021a617 · 021a617
1 parent 92d0dd7
commit 021a617
Show file tree

Hide file tree

Showing 3 changed files with 23 additions and 5 deletions.
diff --git a/examples/resizable-columns/index.js b/examples/resizable-columns/index.js
@@ -4,10 +4,14 @@ import MUIDataTable from "../../src/";
 
 import FormControl from '@material-ui/core/FormControl';
 import TextField from '@material-ui/core/TextField';
+import Switch from '@material-ui/core/Switch';
+import FormGroup from '@material-ui/core/FormGroup';
+import FormControlLabel from '@material-ui/core/FormControlLabel';
 
 function Example(props) {
 
   const [marginLeft, setMarginLeft] = useState(10);
+  const [selectableRows, setSelectableRows] = useState("multiple");
 
   const [counter, setCounter] = useState(1);
   const incrCount = () => { // We update an arbitrary value here to test table resizing on state updates
@@ -78,16 +82,30 @@ function Example(props) {
     filter: true,
     filterType: 'dropdown',
     resizableColumns: true,
+    selectableRows: selectableRows,
     draggableColumns: {
       enabled: true,
     }
   };
 
   return (
     <>
-      <FormControl>
-        <TextField label="Left Margin" type="number" value={marginLeft} onChange={(e) => setMarginLeft(e.target.value)} />
-      </FormControl>
+      <FormGroup row>
+        <FormControl>
+          <TextField label="Left Margin" type="number" value={marginLeft} onChange={(e) => setMarginLeft(e.target.value)} />
+        </FormControl>
+        <FormControlLabel
+          control={
+            <Switch
+              checked={selectableRows === "multiple"}
+              onChange={(e) => setSelectableRows(event.target.checked ? "multiple" : "none")}
+              value="true"
+              color="primary"
+            />
+          }
+          label="Selectable Rows"
+        />
+      </FormGroup>
       <div style={{marginLeft: marginLeft + 'px'}}>
         <MUIDataTable title={"ACME Employee list" + " [" + counter + "]"} data={data} columns={columns} options={options} />
         <div>

diff --git a/src/components/TableResize.js b/src/components/TableResize.js
@@ -179,7 +179,8 @@ class TableResize extends React.Component {
       };
 
       const isLastColumn = (id, finalCells) => {
-        return id === finalCells.length - 2;
+        let len = (selectableRows === 'none') ? 1 : 2;
+        return id === finalCells.length - len;
       };
 
       if (isFirstColumn(selectableRows, idNumber) && isLastColumn(idNumber, finalCells)) {

diff --git a/test/MUIDataTable.test.js b/test/MUIDataTable.test.js
@@ -238,7 +238,6 @@ describe('<MUIDataTable />', function() {
         viewColumns: true,
         sortCompare: null,
         sortThirdClickReset: false,
-
       },
       {
         display: 'true',