From 0f2a7e3ac9c30200c79aad7e2fd33c8357d886d9 Mon Sep 17 00:00:00 2001
From: Matt Oestreich <21092343+oze4@users.noreply.github.com>
Date: Tue, 13 Jul 2021 16:42:28 -0500
Subject: [PATCH] skip:build add demo

for issue we are having
---
 .../EditableRowDateColumnIssue/index.js       | 57 +++++++++++++++++++
 __tests__/demo/demo-components/index.js       |  2 +
 __tests__/demo/demo.js                        |  6 +-
 3 files changed, 64 insertions(+), 1 deletion(-)
 create mode 100644 __tests__/demo/demo-components/EditableRowDateColumnIssue/index.js

diff --git a/__tests__/demo/demo-components/EditableRowDateColumnIssue/index.js b/__tests__/demo/demo-components/EditableRowDateColumnIssue/index.js
new file mode 100644
index 00000000..9e8f707b
--- /dev/null
+++ b/__tests__/demo/demo-components/EditableRowDateColumnIssue/index.js
@@ -0,0 +1,57 @@
+import React from 'react';
+import MaterialTable from '../../../../src';
+
+export default function EditableTable() {
+  const { useState } = React;
+
+  const [columns, setColumns] = useState([
+    {
+      title: 'Date',
+      field: 'date',
+      type: 'date',
+      dateSetting: { locale: 'en-US', format: 'MM/dd/yyyy' }
+    }
+  ]);
+
+  const [data, setData] = useState([{ date: new Date() }]);
+
+  return (
+    <MaterialTable
+      title="Editable Preview"
+      columns={columns}
+      data={data}
+      editable={{
+        onRowAdd: (newData) =>
+          new Promise((resolve, reject) => {
+            setTimeout(() => {
+              setData([...data, newData]);
+
+              resolve();
+            }, 1000);
+          }),
+        onRowUpdate: (newData, oldData) =>
+          new Promise((resolve, reject) => {
+            setTimeout(() => {
+              const dataUpdate = [...data];
+              const index = oldData.tableData.id;
+              dataUpdate[index] = newData;
+              setData([...dataUpdate]);
+
+              resolve();
+            }, 1000);
+          }),
+        onRowDelete: (oldData) =>
+          new Promise((resolve, reject) => {
+            setTimeout(() => {
+              const dataDelete = [...data];
+              const index = oldData.tableData.id;
+              dataDelete.splice(index, 1);
+              setData([...dataDelete]);
+
+              resolve();
+            }, 1000);
+          })
+      }}
+    />
+  );
+}
diff --git a/__tests__/demo/demo-components/index.js b/__tests__/demo/demo-components/index.js
index b9f02e4a..b03a7e86 100644
--- a/__tests__/demo/demo-components/index.js
+++ b/__tests__/demo/demo-components/index.js
@@ -2,6 +2,8 @@ import React, { useState, useRef } from 'react';
 import MaterialTable, { MTableBodyRow, MTableEditRow } from '../../../src'; // root of this project
 // import { ExportCsv, ExportPdf } from '../../../exporters'; // root of this project
 
+export { default as EditableRowDateColumnIssue } from './EditableRowDateColumnIssue';
+
 const global_data = [
   { name: 'Mehmet', surname: 'Baran', birthYear: 1987, birthCity: 63 },
   { name: 'Zerya Betül', surname: 'Baran', birthYear: 2017, birthCity: 34 }
diff --git a/__tests__/demo/demo.js b/__tests__/demo/demo.js
index eb3a0b6f..9756f307 100644
--- a/__tests__/demo/demo.js
+++ b/__tests__/demo/demo.js
@@ -33,7 +33,8 @@ import {
   EditableCells,
   FrankensteinDemo,
   HidingColumns,
-  Resizable
+  Resizable,
+  EditableRowDateColumnIssue
 } from './demo-components';
 import { I1353, I1941, I122 } from './demo-components/RemoteData';
 
@@ -41,6 +42,9 @@ module.hot.accept();
 
 render(
   <div>
+    <h1>EditableRowDateColumnIssue</h1>
+    <EditableRowDateColumnIssue />
+
     <h1>Basic</h1>
     <Basic />