From 8963677360df7458ce9543a3873016e307eb46d6 Mon Sep 17 00:00:00 2001
From: Barry Gitarts <bgitarts@gmail.com>
Date: Sun, 2 Dec 2018 09:46:20 -0500
Subject: [PATCH] add append fund profile

---
 app/components/AddFunder.jsx           |  6 +++---
 app/components/FunderProfilesTable.jsx |  2 +-
 app/dapp.js                            | 16 ++++++++++++++--
 app/utils/events.js                    |  2 +-
 4 files changed, 19 insertions(+), 7 deletions(-)

diff --git a/app/components/AddFunder.jsx b/app/components/AddFunder.jsx
index 9e5cc96..cfe3aa5 100644
--- a/app/components/AddFunder.jsx
+++ b/app/components/AddFunder.jsx
@@ -5,7 +5,7 @@ import Button from '@material-ui/core/Button';
 import TextField from '@material-ui/core/TextField';
 import Snackbar from '@material-ui/core/Snackbar';
 import web3 from "Embark/web3";
-import { MySnackbarContentWrapper } from './base/SnackBars';
+import { MySnackbarContentWrapper } from './base/SnackBars'
 
 const { addGiver } = LiquidPledgingMock.methods
 const hoursToSeconds = hours => hours * 60 * 60
@@ -14,7 +14,7 @@ const addFunderSucessMsg = response => {
   return `Funder created with ID of ${idGiver}`
 }
 
-const AddFunder = () => (
+const AddFunder = ({ appendFundProfile }) => (
   <Formik
     initialValues={{ funderName: '', funderDescription: '', commitTime : '' }}
     onSubmit={async (values, { setSubmitting, resetForm, setStatus }) => {
@@ -27,7 +27,7 @@ const AddFunder = () => (
           addGiver(...args)
             .send({ from: account, gas: gas + 100 })
             .then(res => {
-              console.log({res})
+              appendFundProfile(res.events.GiverAdded)
               setStatus({
                 snackbar: { variant: 'success', message: addFunderSucessMsg(res) }
               })
diff --git a/app/components/FunderProfilesTable.jsx b/app/components/FunderProfilesTable.jsx
index 6e4e5c9..61e3e10 100644
--- a/app/components/FunderProfilesTable.jsx
+++ b/app/components/FunderProfilesTable.jsx
@@ -16,7 +16,7 @@ const FunderProfilesTable = ({ data }) => (
         { title: 'Name', field: 'name' },
         { title: 'Url', field: 'url' },
         { title: 'Commit Time', field: 'commitTime', type: 'numeric' },
-        { title: 'cancel', field: 'canceled' }
+        { title: 'Canceled', field: 'canceled' }
       ]}
       data={data.map(formatField)}
       title="Funding Profiles"
diff --git a/app/dapp.js b/app/dapp.js
index ef7af9b..d6c845c 100644
--- a/app/dapp.js
+++ b/app/dapp.js
@@ -9,7 +9,7 @@ import AddFunder from './components/AddFunder';
 import CreateFunding from './components/CreateFunding';
 import FunderProfilesTable from './components/FunderProfilesTable.jsx'
 import { initVaultAndLP, vaultPledgingNeedsInit, standardTokenApproval, getLpAllowance } from './utils/initialize'
-import { getUserFundProfiles } from './utils/events';
+import { getUserFundProfiles, formatFundProfileEvent } from './utils/events';
 
 const { getNetworkType } = web3.eth.net;
 
@@ -37,12 +37,24 @@ class App extends React.Component {
     });
   }
 
+  appendFundProfile = async event => {
+    const formattedEvent = await formatFundProfileEvent(event)
+    this.setState((state) => {
+      const { fundProfiles } = state;
+      return {
+        ...state,
+        fundProfiles: [ ...fundProfiles, formattedEvent ]
+      }
+    })
+  }
+
   render() {
     const { needsInit, lpAllowance, fundProfiles } = this.state;
+    const { appendFundProfile } = this;
     return (
       <div>
         {fundProfiles && <FunderProfilesTable data={fundProfiles} />}
-        <AddFunder />
+        <AddFunder appendFundProfile={appendFundProfile} />
         <Divider variant="middle" />
         <CreateFunding />
         {needsInit && <Button variant="outlined" color="secondary" onClick={initVaultAndLP}>
diff --git a/app/utils/events.js b/app/utils/events.js
index bbb3e47..3b74aa8 100644
--- a/app/utils/events.js
+++ b/app/utils/events.js
@@ -2,7 +2,7 @@ import LiquidPledgingMock from 'Embark/contracts/LiquidPledgingMock'
 import web3 from 'Embark/web3'
 
 const { getPledgeAdmin } = LiquidPledgingMock.methods
-const formatFundProfileEvent = async event => {
+export const formatFundProfileEvent = async event => {
   const { returnValues: { idGiver, url } } = event
   const { commitTime, name, canceled } = await getPledgeAdmin(idGiver).call()
   return {