Post Transaction with Component

15Dkatz · Sep 29, 2022 · 295b5d5 · 295b5d5
1 parent d09fc26
commit 295b5d5
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 6 deletions.
diff --git a/client/dist/src.e31bb0bc.js b/client/dist/src.e31bb0bc.js
@@ -46892,13 +46892,32 @@ var ConductTransaction = /*#__PURE__*/function (_Component) {
       });
     });
 
+    _defineProperty(_assertThisInitialized(_this), "conductTransaction", function () {
+      var _this$state = _this.state,
+          recipient = _this$state.recipient,
+          amount = _this$state.amount;
+      fetch('http://localhost:3000/api/transact', {
+        method: 'POST',
+        headers: {
+          'Content-Type': 'application/json'
+        },
+        body: JSON.stringify({
+          recipient: recipient,
+          amount: amount
+        })
+      }).then(function (response) {
+        return response.json();
+      }).then(function (json) {
+        alert(json.message || json.type);
+      });
+    });
+
     return _this;
   }
 
   _createClass(ConductTransaction, [{
     key: "render",
     value: function render() {
-      console.log('this.state', this.state);
       return /*#__PURE__*/_react.default.createElement("div", {
         className: "ConductTransaction"
       }, /*#__PURE__*/_react.default.createElement(_reactRouterDom.Link, {
@@ -46913,7 +46932,10 @@ var ConductTransaction = /*#__PURE__*/function (_Component) {
         placeholder: "amount",
         value: this.state.amount,
         onChange: this.updateAmount
-      })));
+      })), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_reactBootstrap.Button, {
+        bsStyle: "danger",
+        onClick: this.conductTransaction
+      }, "Submit")));
     }
   }]);
 

diff --git a/client/dist/src.e31bb0bc.js.map b/client/dist/src.e31bb0bc.js.map
diff --git a/client/src/components/ConductTransaction.js b/client/src/components/ConductTransaction.js
@@ -1,5 +1,5 @@
 import React, { Component } from 'react';
-import { FormGroup, FormControl } from 'react-bootstrap';
+import { FormGroup, FormControl, Button } from 'react-bootstrap';
 import { Link } from 'react-router-dom';
 
 class ConductTransaction extends Component {
@@ -13,9 +13,20 @@ class ConductTransaction extends Component {
     this.setState({ amount: Number(event.target.value) });
   }
 
-  render() {
-    console.log('this.state', this.state);
+  conductTransaction = () => {
+    const { recipient, amount } = this.state;
+
+    fetch('http://localhost:3000/api/transact', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ recipient, amount })
+    }).then(response => response.json())
+      .then(json => {
+        alert(json.message || json.type);
+      });
+  }
 
+  render() {
     return (
       <div className='ConductTransaction'>
         <Link to='/'>Home</Link>
@@ -36,6 +47,14 @@ class ConductTransaction extends Component {
             onChange={this.updateAmount}
           />
         </FormGroup>
+        <div>
+          <Button
+            bsStyle="danger"
+            onClick={this.conductTransaction}
+          >
+            Submit
+          </Button>
+        </div>
       </div>
     )
   }