title: dates are not sorted correctly in mui-datatables
body: <p>I have dates made &amp; formatted by momentjs e.g. ("Sat, Feb 22, 2020 12:55 PM")
  I read them in from firestore, they appear to come in fine as I sort them first to be sorted descending.</p>
  
  <pre><code>forms.sort(function(left, right) {
    return moment.utc(left.timeIn).diff(moment.utc(right.timeIn));
  });
  </code></pre>
  
  <p>Then I do a console.log to check there are all there and sorted correctly.</p>
  
  <p>Next, I pass them into the Record Table component which contains a mui-datatable.
  At this point, problems start to happen.</p>
  
  <pre><code>{
    forms.length &gt; 0 ? (
      &lt;RecordTable forms={forms} /&gt;
    ) : (
      &lt;div&gt;
        &lt;h2&gt;No Records&lt;/h2&gt;
      &lt;/div&gt;
    )
  }
  </code></pre>
  
  <ol>
  <li><p>they do not display on screen sorted descending with most recent date at the top.</p>
  
  <pre><code>{
    name: "timeIn",
    label: "Time In",
    options: {
      sortDirection: "desc",
      searchable: false
    }
  },
  </code></pre></li>
  </ol>
  
  <p><a href="https://i.stack.imgur.com/hyPZY.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/hyPZY.png" alt="enter image description here"></a></p>
  
  <ol start="2">
  <li>for some reason likely my fault, the values passed into the mui-datatable come in 100's of times even though there are only 75 records. I can see this by doing first doing a console log in the child component then another console.log within mui-datatables on one of the columns which has a customBody Render.</li>
  </ol>
  
  <p>I am really not sure what I am doing wrong here, as the dates are sorted before they are passed to mui-datatables, and from console logs in the parent component, only 75 records are printed out as oppose to hundreds in mui-data table console.logs</p>