add append fund profile

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

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"

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}>

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 {