add multiconfirm to pledges page

embarkConfig/contracts.js

@@ -183,6 +183,7 @@ module.exports = {
     afterDeploy: async (dependencies) => {
       await dependencies.contracts.LiquidPledging.methods.initialize(dependencies.contracts.LPVault.options.address).send({from: dependencies.web3.eth.defaultAccount, gas: 1000000});
       await dependencies.contracts.LPVault.methods.initialize(dependencies.contracts.LiquidPledging.options.address).send({from: dependencies.web3.eth.defaultAccount, gas: 1000000});
+      await dependencies.contracts.LPVault.methods.setAutopay(true).send({from: dependencies.web3.eth.defaultAccount, gas: 1000000});
     },
     dappConnection: ["$WEB3"]
   },

src/components/Pledges.jsx

@@ -10,7 +10,12 @@ import { getProfileWithPledges } from './projects/queries'
 import { getTokenLabel, getHumanAmountFormatter } from '../utils/currencies'
 import { toDecimal } from '../utils/conversions'
 import { getDateFromTimestamp } from '../utils/dates'
+import { encodePledges } from '../utils/pledges'
 import Loading from './base/Loading'
+import LiquidPledging from '../embarkArtifacts/contracts/LiquidPledging'
+import LPVault from '../embarkArtifacts/contracts/LPVault'
+const { mWithdraw } = LiquidPledging.methods
+const { multiConfirm } = LPVault.methods
 
 const PLEDGED = 'Pledged'
 const PAYING = 'Paying'
@@ -105,7 +110,7 @@ function TableHeader({ allSelected, selectAll }) {
       <Typography className={classnames(tableHeader, classes.headerId)}>Pledge ID</Typography>
       <Typography className={classnames(tableHeader, classes.headerFunded)}>Funded on</Typography>
       <Typography className={classnames(tableHeader, classes.headerSelect)}>Select all</Typography>
-      <Checkbox classes={{ root: classnames(classes.select, classes.checkBox), checked: classes.checked }} checked={allSelected} onChange={selectAll} color="primary" disableRipple labelPlacement="start" label="start"  />
+      <Checkbox classes={{ root: classnames(classes.select, classes.checkBox), checked: classes.checked }} checked={allSelected} onChange={selectAll} color="primary" disableRipple />
     </Fragment>
   )
 }
@@ -149,6 +154,25 @@ function Pledges({ match }) {
     setSelected(pledges.map(p => p.id))
   }
 
+  const withdrawPledges = () => {
+    const formattedPledges = selectedPledges.map(id => ({
+      id,
+      amount: pledges.find(p => p.id === id).amount
+    }))
+    const pledgeState = selectedPledges[0].pledgeState
+    const sendFn = pledgeTypes[pledgeState] === PAYING ? multiConfirm : mWithdraw
+    const withdrawArgs = encodePledges(formattedPledges)
+    console.log({formattedPledges, withdrawArgs})
+    sendFn(withdrawArgs)
+      .send()
+      .then(async res => {
+        console.log({res})
+      })
+      .catch(e => {
+        console.log({e})
+      })
+  }
+
   return (
     <div className={classes.main}>
       <TableHeader allSelected={allSelected} selectAll={selectAll} />
@@ -162,7 +186,7 @@ function Pledges({ match }) {
           setSelected={setSelected}
         />
       ))}
-      <Button  type="submit" variant="contained" className={classnames(classes.formButton)} classes={{ disabled: classes.disabledButton }}>
+      <Button onClick={withdrawPledges} type="submit" variant="contained" className={classnames(classes.formButton)} classes={{ disabled: classes.disabledButton }}>
         Submit for withdrawl
       </Button>
     </div>

src/components/projects/ProjectPledges.jsx

@@ -165,7 +165,7 @@ const getSendFn = (pledgeType, filteredPledges) => {
 }
 const getArgs = (pledgeType, filteredPledges) => {
   if (pledgeTypes[pledgeType] === PLEDGED) {
-    const formattedPledges = filteredPledges.map(pledge => ({ amount: pledge.amount, id: pledge.idPledge }))
+    const formattedPledges = filteredPledges.map(pledge => ({ amount: pledge.amount, id: pledge.id }))
     if (filteredPledges.length > 1) return [encodePledges(formattedPledges)]
     const withdrawArgs = [formattedPledges[0].id, formattedPledges[0].amount]
     return withdrawArgs

src/utils/pledges.js

@@ -3,6 +3,7 @@ import LiquidPledging from '../embarkArtifacts/contracts/LiquidPledging'
 import { getTokenLabel, getTokenByAddress } from './currencies'
 
 const { getPledgeDelegate, numberOfPledges, getPledge } = LiquidPledging.methods
+const { utils } = web3
 const getPledgeDelegates = (idPledge, numDelegates) => {
   const delegates = []
   const num = Number(numDelegates)
@@ -102,3 +103,12 @@ export function getAmountFromPledgesInfo(info){
 }
 
 export const getAmountFromWei = (token, lifetimeReceived) => getAmountFromPledgesInfo({token, lifetimeReceived})
+
+export const encodePledges = pledges => pledges.map(p => {
+  // .substring is to remove the 0x prefix on the toHex result
+  return (
+    '0x' +
+      utils.padLeft(utils.toHex(p.amount).substring(2), 48) +
+      utils.padLeft(utils.toHex(p.id).substring(2), 16)
+  );
+});