From 2826262b352f9d5e5133751aab356311f72f1442 Mon Sep 17 00:00:00 2001
From: frab1t <33671357+frab1t@users.noreply.github.com>
Date: Wed, 8 May 2019 16:18:01 +0200
Subject: [PATCH] add Table component

---
 src/components/Table.js | 71 +++++++++++++++++++++++++++++++++++++++++
 1 file changed, 71 insertions(+)
 create mode 100644 src/components/Table.js

diff --git a/src/components/Table.js b/src/components/Table.js
new file mode 100644
index 0000000..1ea23bb
--- /dev/null
+++ b/src/components/Table.js
@@ -0,0 +1,71 @@
+import React, { Component } from 'react';
+import {
+  Col,
+  Row,
+  Table as TableBootstrap
+} from 'reactstrap';
+
+import './Table.css'
+
+class Table extends Component {
+  constructor(props) {
+    super(props);
+
+    this.state = {};
+  }
+
+  render() {
+    let data = this.props.data;
+
+    return (
+        <Row>
+        <Col sm="12" md={{ size: 10, offset: 1 }}>
+        <TableBootstrap bordered id="table-ticket-info" className="bg-white">
+          <thead>
+            <tr>
+              <th colSpan={2}>Ticket Info</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr>
+              <td className="font-weight-bold text-right td-key">id</td>
+              <td className="td-value text-left">{data.id}</td>
+            </tr>
+            <tr>
+              <td className="font-weight-bold text-right td-key">status</td>
+              <td className="td-value text-left">{data.status}</td>
+            </tr>
+            <tr>
+              <td className="font-weight-bold text-right td-key">created</td>
+              <td className="td-value text-left">{data.createdAt}</td>
+            </tr>
+            
+            <tr>
+              <td className="font-weight-bold text-right td-key">updated</td>
+              <td className="td-value text-left">{data.updateAt}</td>
+            </tr>
+            <tr>
+              <td className="font-weight-bold text-right td-key">created by</td>
+              <td className="td-value text-left"><p>{`${data.firstName} ${data.lastName} (${data.email})`}</p></td>
+            </tr>
+            <tr>
+              <td className="font-weight-bold text-right td-key">type</td>
+              <td className="td-value text-left">{data.type}</td>
+            </tr>
+            <tr>
+              <td className="font-weight-bold text-right td-key">subject</td>
+              <td className="td-value text-left">{data.subject}</td>
+            </tr>
+            <tr>
+              <td className="font-weight-bold text-right td-key">message</td>
+              <td className="td-value text-left">{data.message}</td>
+            </tr>
+          </tbody>
+        </TableBootstrap>
+        </Col>
+      </Row>
+    );
+  }
+}
+
+export default Table;
\ No newline at end of file