diff --git a/app/components/table/TransferCard.jsx b/app/components/table/TransferCard.jsx
index 0565f93..c278b81 100644
--- a/app/components/table/TransferCard.jsx
+++ b/app/components/table/TransferCard.jsx
@@ -1,4 +1,5 @@
-import React, { useState, useEffect } from 'react'
+import React from 'react'
+import PropTypes from 'prop-types'
import { withStyles } from '@material-ui/core/styles'
import { Formik } from 'formik'
import LiquidPledging from 'Embark/contracts/LiquidPledging'
@@ -12,21 +13,12 @@ import Collapse from '@material-ui/core/Collapse'
import { getTokenLabel } from '../../utils/currencies'
import { toWei } from '../../utils/conversions'
import styles from './CardStyles'
+import { useRowData } from './hooks'
const { transfer } = LiquidPledging.methods
function TransferCard({ row, handleClose, classes }) {
- const [show, setShow] = useState(null)
-
- useEffect(() => {
- setShow(true)
- }, [])
-
- const close = () => {
- setShow(false)
- setTimeout(() => { handleClose() }, 500)
- }
-
+ const { show, close } = useRowData(row, handleClose)
return (
-
@@ -140,4 +132,10 @@ function TransferCard({ row, handleClose, classes }) {
)
}
+TransferCard.propTypes = {
+ classes: PropTypes.object.isRequired,
+ row: PropTypes.object.isRequired,
+ handleClose: PropTypes.func.isRequired,
+}
+
export default withStyles(styles)(TransferCard)
diff --git a/app/components/table/WithdrawCard.jsx b/app/components/table/WithdrawCard.jsx
index d1fd9cb..625674d 100644
--- a/app/components/table/WithdrawCard.jsx
+++ b/app/components/table/WithdrawCard.jsx
@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react'
+import React from 'react'
import withObservables from '@nozbe/with-observables'
import { Q } from '@nozbe/watermelondb'
import { withDatabase } from '@nozbe/watermelondb/DatabaseProvider'
@@ -17,30 +17,13 @@ import LPVault from 'Embark/contracts/LPVault'
import { getTokenLabel } from '../../utils/currencies'
import { toWei } from '../../utils/conversions'
import styles from './CardStyles'
+import { useRowData } from './hooks'
const { withdraw } = LiquidPledging.methods
const { confirmPayment } = LPVault.methods
function Withdraw({ handleClose, classes, rowData, authorizedPayment }) {
- const [show, setShow] = useState(null)
- const [rowId, setRowId] = useState(rowData.pledgeId)
-
- useEffect(() => {
- setShow(true)
- }, [])
-
- useEffect(() => {
- const { pledgeId } = rowData
- const samePledge = rowId === pledgeId
- if (show && samePledge) close()
- else setRowId(pledgeId)
- }, [rowData.timeStamp])
-
- const close = () => {
- setShow(false)
- setTimeout(() => { handleClose() }, 500)
- }
-
+ const { show, close } = useRowData(rowData, handleClose)
const isPaying = rowData.pledgeState === 'Paying'
return (
{
+ setShow(true)
+ }, [])
+
+ useEffect(() => {
+ const { pledgeId } = rowData
+ const samePledge = rowId === pledgeId
+ if (show && samePledge) close()
+ else setRowId(pledgeId)
+ }, [rowData.timeStamp])
+
+ const close = () => {
+ setShow(false)
+ setTimeout(() => { handleClose() }, 500)
+ }
+
+ return { show, close }
+}