From 1a2614b4e4bb4b97045144cffb01ccc69e31c689 Mon Sep 17 00:00:00 2001 From: BinHong Lee Date: Sun, 29 Jul 2018 00:16:08 -0700 Subject: [PATCH] Aesthetic fix --- public/index.html | 30 ++++++++++++++++-------------- src/App.css | 1 - src/App.js | 13 ++++++++++--- src/Components/Message.js | 15 +++++++++++++++ src/Components/PaymentChain.js | 3 +-- 5 files changed, 42 insertions(+), 20 deletions(-) create mode 100644 src/Components/Message.js diff --git a/public/index.html b/public/index.html index cf3e28d..e27dfa6 100644 --- a/public/index.html +++ b/public/index.html @@ -1,5 +1,5 @@ - + @@ -9,18 +9,20 @@ Breakups -
-

Breakups

-

Split bills among multiple people.

-
- - -
+ +
+

Breakups

+

Split bills among multiple people.

+
+
+ +
+
+ - diff --git a/src/App.css b/src/App.css index 6120d2d..a3343ba 100644 --- a/src/App.css +++ b/src/App.css @@ -21,7 +21,6 @@ } .PaymentChain { - margin-bottom: 80px; } .personInput { diff --git a/src/App.js b/src/App.js index 0dd377a..dacade2 100644 --- a/src/App.js +++ b/src/App.js @@ -1,6 +1,7 @@ import React, { Component } from 'react'; import People from './Components/People'; import PaymentChain from './Components/PaymentChain'; +import Message from './Components/Message'; import './App.css'; var https = require('https'); class App extends Component { @@ -10,7 +11,8 @@ class App extends Component { peoples: [], info: [], paymentChain: [], - actionButtons:[] + actionButtons:[], + showResults:false } } @@ -27,7 +29,8 @@ class App extends Component {
{this.state.actionButtons} - + {this.state.showResults ? : } +
); } @@ -47,10 +50,14 @@ class App extends Component { users.push(user); } request.users = users; + let existingState = this.state; + existingState.showResults = true; + this.setState(existingState); this.httpsPost(request, result => { let existingState = this.state; existingState.paymentChain = JSON.parse("[" + result + "]")[0]; + existingState.showResults = false; this.setState(existingState); }) } @@ -84,7 +91,7 @@ class App extends Component { httpsPost(data, callback) { var post_options = { - host: 'breakups.herokuapp.com', + host: 'api.breakups.life', path: '/paymentChain', method: 'POST', headers: { diff --git a/src/Components/Message.js b/src/Components/Message.js new file mode 100644 index 0000000..8c9bb27 --- /dev/null +++ b/src/Components/Message.js @@ -0,0 +1,15 @@ +import React, { Component } from 'react'; + +class Message extends Component { + render() { + return ( +
+
+ Calculating... +
+
+ ) + } +} + +export default Message; diff --git a/src/Components/PaymentChain.js b/src/Components/PaymentChain.js index 1f143f0..3e337fe 100644 --- a/src/Components/PaymentChain.js +++ b/src/Components/PaymentChain.js @@ -14,7 +14,6 @@ class PaymentChain extends Component { return (
-
{payments}
@@ -22,4 +21,4 @@ class PaymentChain extends Component { } } -export default PaymentChain; \ No newline at end of file +export default PaymentChain;