Show list of verifications

src/app.js

@@ -1,4 +1,19 @@
+function Card(data) {
+    return (
+      <div class="card">
+      <h4><b>{data.Username}</b></h4>
+        <div class="container">
+          <p>{data.Closed}</p>
+          <p>{data.UserID}</p>
+        </div>
+      </div>
+    )
+  }
+
 class Verification extends React.Component {
+    state = {
+        verifications: []
+    }
     constructor(props) {
         super(props);
     }
@@ -6,11 +21,17 @@ class Verification extends React.Component {
         const apiUrl = 'https://thanos.nightmare.haus/api/verifications';
         fetch(apiUrl)
             .then((response) => response.json())
-            .then((data) => console.log('The data from the call: ', data));
+            .then((data) => this.setState({verifications: data}));
     }
     render() {
         return (
-            <div><h1>Verifications have loaded. See logs.</h1></div>
+           <div>
+               <ul>
+                   {this.state.verifications.map((data) => (
+                       <li key={data.UserID}> <Card {...data} /></li>
+                   ))}
+               </ul>
+           </div>
         );
     }
 }

static/app.js

@@ -6,35 +6,79 @@ function _possibleConstructorReturn(self, call) { if (!self) { throw new Referen
 
 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
 
+function Card(data) {
+    return React.createElement(
+        "div",
+        { "class": "card" },
+        React.createElement(
+            "h4",
+            null,
+            React.createElement(
+                "b",
+                null,
+                data.Username
+            )
+        ),
+        React.createElement(
+            "div",
+            { "class": "container" },
+            React.createElement(
+                "p",
+                null,
+                data.Closed
+            ),
+            React.createElement(
+                "p",
+                null,
+                data.UserID
+            )
+        )
+    );
+}
+
 var Verification = function (_React$Component) {
     _inherits(Verification, _React$Component);
 
     function Verification(props) {
         _classCallCheck(this, Verification);
 
-        return _possibleConstructorReturn(this, (Verification.__proto__ || Object.getPrototypeOf(Verification)).call(this, props));
+        var _this = _possibleConstructorReturn(this, (Verification.__proto__ || Object.getPrototypeOf(Verification)).call(this, props));
+
+        _this.state = {
+            verifications: []
+        };
+        return _this;
     }
 
     _createClass(Verification, [{
-        key: 'componentDidMount',
+        key: "componentDidMount",
         value: function componentDidMount() {
+            var _this2 = this;
+
             var apiUrl = 'https://thanos.nightmare.haus/api/verifications';
             fetch(apiUrl).then(function (response) {
                 return response.json();
             }).then(function (data) {
-                return console.log('The data from the call: ', data);
+                return _this2.setState({ verifications: data });
             });
         }
     }, {
-        key: 'render',
+        key: "render",
         value: function render() {
             return React.createElement(
-                'div',
+                "div",
                 null,
                 React.createElement(
-                    'h1',
+                    "ul",
                     null,
-                    'Verifications have loaded. See logs.'
+                    this.state.verifications.map(function (data) {
+                        return React.createElement(
+                            "li",
+                            { key: data.UserID },
+                            " ",
+                            React.createElement(Card, data)
+                        );
+                    })
                 )
             );
         }