From d1aa1f3d5e1475aca53d2e4ccfb8cdcb40b6d7da Mon Sep 17 00:00:00 2001
From: Rising Odegua <risingodegua@gmail.com>
Date: Wed, 28 Apr 2021 13:47:38 +0100
Subject: [PATCH] [Table][m]: Add simple table component for first test

---
 .../src/components/explorer/Table/index.js    | 28 +++++++++++++++++++
 packages/portal/src/components/page/index.js  |  0
 packages/portal/src/components/ui/index.js    |  0
 packages/portal/src/index.js                  |  3 ++
 4 files changed, 31 insertions(+)
 create mode 100644 packages/portal/src/components/explorer/Table/index.js
 create mode 100644 packages/portal/src/components/page/index.js
 create mode 100644 packages/portal/src/components/ui/index.js
 create mode 100644 packages/portal/src/index.js

diff --git a/packages/portal/src/components/explorer/Table/index.js b/packages/portal/src/components/explorer/Table/index.js
new file mode 100644
index 00000000..408d76fc
--- /dev/null
+++ b/packages/portal/src/components/explorer/Table/index.js
@@ -0,0 +1,28 @@
+/* eslint-disable max-len */
+import React from 'react';
+import { DataGrid } from '@material-ui/data-grid';
+
+/*
+ * @param schema: Frictionless Table Schmea
+ * @param data: an array of data objects e.g. [ {a: 1, b: 2}, {a: 5, b: 7} ]
+ */
+export const Table = ({ schema, data }) => {
+  const columns = schema.fields.map((field) => (
+    {
+      field: field.title || field.name,
+      headerName: field.name,
+      width: 300
+    }
+  ))
+  data = data.map((item, index)=>{
+    item.id = index //Datagrid requires every row to have an ID
+    return item
+  })
+  
+  return (
+    <div data-testid="tableGrid" style={{ height: 400, width: '100%' }}>
+      <DataGrid rows={data} columns={columns} pageSize={5} />
+    </div>
+  );
+}
+
diff --git a/packages/portal/src/components/page/index.js b/packages/portal/src/components/page/index.js
new file mode 100644
index 00000000..e69de29b
diff --git a/packages/portal/src/components/ui/index.js b/packages/portal/src/components/ui/index.js
new file mode 100644
index 00000000..e69de29b
diff --git a/packages/portal/src/index.js b/packages/portal/src/index.js
new file mode 100644
index 00000000..448e711f
--- /dev/null
+++ b/packages/portal/src/index.js
@@ -0,0 +1,3 @@
+import { Table } from './components/explorer/Table/index'
+
+export { Table }
\ No newline at end of file