add authorizePayment event to get paymentId

app/components/table/WithdrawCard.jsx

@@ -15,6 +15,7 @@ import LiquidPledgingMock from 'Embark/contracts/LiquidPledgingMock'
 import LPVault from 'Embark/contracts/LPVault'
 import { getTokenLabel } from '../../utils/currencies'
 import { toWei } from '../../utils/conversions'
+import { FundingContext } from '../../context'
 
 const { withdraw } = LiquidPledgingMock.methods
 const { confirmPayment } = LPVault.methods
@@ -58,27 +59,31 @@ class Withdraw extends PureComponent {
     const { show } = this.state
     const isPaying = rowData[7] === "1"
     return (
+      <FundingContext.Consumer>
+      {({ authorizedPayments }) =>
       <Formik
         initialValues={{}}
         onSubmit={async (values, { setSubmitting, resetForm, setStatus }) => {
           const { amount } = values
-          const args = isPaying ? [rowData.id] : [rowData.id, toWei(amount)]
+          const paymentId = authorizedPayments.find(r => r.ref === rowData.id)['idPayment']
+          const args = isPaying ? [paymentId] : [paymentId, toWei(amount)]
           const sendFn = isPaying ? confirmPayment : withdraw
-          
-          const toSend = sendFn(...args);
-
-          const estimateGas = await toSend.estimateGas();
-
-          toSend.send({gas: estimateGas + 1000})
-            .then(res => {
-              console.log({res})
-            })
-            .catch(e => {
-              console.log({e})
-            })
-            .finally(() => {
-              this.close()
-            })
+          try {
+            const toSend = sendFn(...args);
+            const estimateGas = await toSend.estimateGas();
+            toSend.send({ gas: estimateGas + 1000 })
+                  .then(res => {
+                    console.log({res})
+                  })
+                  .catch(e => {
+                    console.log({e})
+                  })
+                  .finally(() => {
+                    this.close()
+                  })
+          } catch (error) {
+            console.log(error)
+          }
         }}
       >
         {({
@@ -121,6 +126,8 @@ class Withdraw extends PureComponent {
           </Collapse>
         )}
       </Formik>
+      }
+      </FundingContext.Consumer>
     )
   }
 }

app/dapp.js

@@ -10,7 +10,7 @@ import CreateFunding from './components/CreateFunding';
 import FunderProfilesTable from './components/FunderProfilesTable'
 import PledgesTable from './components/PledgesTable'
 import { initVaultAndLP, vaultPledgingNeedsInit, standardTokenApproval, getLpAllowance } from './utils/initialize'
-import { getProfileEvents, formatFundProfileEvent } from './utils/events';
+import { getProfileEvents, formatFundProfileEvent, getAuthorizedPayments } from './utils/events';
 import { getAllPledges, appendToExistingPledges, transferBetweenPledges } from './utils/pledges';
 import { FundingContext } from './context'
 import { cancelProfile } from './utils/fundProfiles'
@@ -39,13 +39,15 @@ class App extends React.Component {
           const lpAllowance = await getLpAllowance()
           const fundProfiles = await getProfileEvents()
           const allPledges = await getAllPledges()
+          const authorizedPayments = await getAuthorizedPayments()
           this.setState({
             network,
             environment,
             needsInit: false,
             lpAllowance,
             fundProfiles,
-            allPledges
+            allPledges,
+            authorizedPayments
           })
         }
       });
@@ -77,9 +79,9 @@ class App extends React.Component {
   }
 
   render() {
-    const { needsInit, lpAllowance, fundProfiles, allPledges } = this.state;
+    const { needsInit, lpAllowance, fundProfiles, allPledges, authorizedPayments } = this.state;
     const { appendFundProfile, appendPledges, transferPledgeAmounts, cancelFundProfile } = this
-    const fundingContext = { transferPledgeAmounts }
+    const fundingContext = { transferPledgeAmounts, authorizedPayments }
     return (
       <FundingContext.Provider value={fundingContext}>
         <div>

app/utils/events.js

@@ -1,6 +1,8 @@
 import LiquidPledgingMock from 'Embark/contracts/LiquidPledgingMock'
+import LPVault from 'Embark/contracts/LPVault'
 import web3 from 'Embark/web3'
 
+const AUTHORIZE_PAYMENT = 'AuthorizePayment'
 const GIVER_ADDED = 'GiverAdded'
 const DELEGATE_ADDED = 'DelegateAdded'
 const PROJECT_ADDED = 'ProjectAdded'
@@ -19,6 +21,26 @@ const lookups = {
   }
 }
 
+const formatVaultEvent = async event => {
+  const { returnValues } = event
+  return {
+    ...returnValues,
+    ref: Number(returnValues.ref.slice(2))
+  }
+}
+
+const getPastVaultEvents = async event => {
+  const events = await LPVault.getPastEvents(event, {
+    addr: await web3.eth.getCoinbase(),
+    fromBlock: 0,
+    toBlock: 'latest'
+  })
+  const formattedEvents = await Promise.all(
+    events.map(formatVaultEvent)
+  )
+  return formattedEvents
+}
+
 const { getPledgeAdmin } = LiquidPledgingMock.methods
 export const formatFundProfileEvent = async event => {
   const lookup = lookups[event.event]
@@ -50,6 +72,7 @@ const getPastEvents = async event => {
 export const getFunderProfiles = async () => await getPastEvents(GIVER_ADDED)
 export const getDelegateProfiles = async () => await getPastEvents(DELEGATE_ADDED)
 export const getProjectProfiles = async () => await getPastEvents(PROJECT_ADDED)
+export const getAuthorizedPayments = async () => getPastVaultEvents(AUTHORIZE_PAYMENT)
 export const getProfileEvents = async () => {
   const [ funderProfiles, delegateProfiles, projectProfiles]
         = await Promise.all([getFunderProfiles(), getDelegateProfiles(), getProjectProfiles()])