From a5354ddd6e774c862082cad94ceb6a2deab7afea Mon Sep 17 00:00:00 2001 From: Gregory Rudolph Date: Wed, 30 Dec 2020 19:24:37 -0500 Subject: [PATCH] Show list of verifications --- src/app.js | 25 ++++++++++++++++++++-- static/app.js | 58 ++++++++++++++++++++++++++++++++++++++++++++------- 2 files changed, 74 insertions(+), 9 deletions(-) diff --git a/src/app.js b/src/app.js index 442cd8c..8480732 100644 --- a/src/app.js +++ b/src/app.js @@ -1,4 +1,19 @@ +function Card(data) { + return ( +
+

{data.Username}

+
+

{data.Closed}

+

{data.UserID}

+
+
+ ) + } + 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 ( -

Verifications have loaded. See logs.

+
+ +
); } } diff --git a/static/app.js b/static/app.js index 209efe5..bf0492d 100644 --- a/static/app.js +++ b/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) + ); + }) ) ); }