WA-521 Adapt components to new API model refactor
This commit is contained in:
parent
0f035acb64
commit
84df0d7b01
|
@ -77,7 +77,7 @@ class GnoSafe extends React.PureComponent<SafeProps, State> {
|
|||
onListTransactions = () => {
|
||||
const { safe } = this.props
|
||||
|
||||
this.setState({ component: <Transactions safeName={safe.get('name')} safeAddress={safe.get('address')} /> })
|
||||
this.setState({ component: <Transactions threshold={safe.get('threshold')} safeName={safe.get('name')} safeAddress={safe.get('address')} /> })
|
||||
}
|
||||
|
||||
onEditThreshold = () => {
|
||||
|
|
|
@ -27,10 +27,11 @@ type Props = Open & WithStyles & {
|
|||
threshold: number,
|
||||
}
|
||||
|
||||
const GnoConfirmation = ({ owner, status, hash }: ConfirmationProps) => {
|
||||
const GnoConfirmation = ({ owner, type, hash }: ConfirmationProps) => {
|
||||
const address = owner.get('address')
|
||||
const text = status ? 'Confirmed' : 'Not confirmed'
|
||||
const hashText = status ? `Confirmation hash: ${hash}` : undefined
|
||||
const confirmed = type === 'confirmed'
|
||||
const text = confirmed ? 'Confirmed' : 'Not confirmed'
|
||||
const hashText = confirmed ? `Confirmation hash: ${hash}` : undefined
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
|
@ -70,7 +71,7 @@ const Confirmaitons = openHoc(({
|
|||
<GnoConfirmation
|
||||
key={confirmation.get('owner').get('address')}
|
||||
owner={confirmation.get('owner')}
|
||||
status={confirmation.get('status')}
|
||||
type={confirmation.get('type')}
|
||||
hash={confirmation.get('hash')}
|
||||
/>
|
||||
))}
|
||||
|
|
|
@ -26,6 +26,7 @@ import selector, { type SelectorProps } from './selector'
|
|||
type Props = Open & SelectorProps & {
|
||||
transaction: Transaction,
|
||||
safeName: string,
|
||||
threshold: number,
|
||||
onProcessTx: (tx: Transaction, alreadyConfirmed: number) => void,
|
||||
}
|
||||
|
||||
|
@ -35,15 +36,14 @@ class GnoTransaction extends React.PureComponent<Props, {}> {
|
|||
onProccesClick = () => this.props.onProcessTx(this.props.transaction, this.props.confirmed)
|
||||
|
||||
hasConfirmed = (userAddress: string, confirmations: List<Confirmation>): boolean =>
|
||||
confirmations.filter((conf: Confirmation) => sameAddress(userAddress, conf.get('owner').get('address')) && conf.get('status')).count() > 0
|
||||
confirmations.filter((conf: Confirmation) => sameAddress(userAddress, conf.get('owner').get('address')) && conf.get('type') === 'confirmation').count() > 0
|
||||
|
||||
render() {
|
||||
const {
|
||||
open, toggle, transaction, confirmed, safeName, userAddress,
|
||||
open, toggle, transaction, confirmed, safeName, userAddress, executionHash, threshold,
|
||||
} = this.props
|
||||
|
||||
const txHash = transaction.get('tx')
|
||||
const confirmationText = txHash ? 'Already executed' : `${confirmed} of the ${transaction.get('threshold')} confirmations needed`
|
||||
const confirmationText = executionHash ? 'Already executed' : `${confirmed} of the ${threshold} confirmations needed`
|
||||
const userConfirmed = this.hasConfirmed(userAddress, transaction.get('confirmations'))
|
||||
|
||||
return (
|
||||
|
@ -72,19 +72,19 @@ class GnoTransaction extends React.PureComponent<Props, {}> {
|
|||
</Row>
|
||||
<Row>
|
||||
<ListItem>
|
||||
{ txHash &&
|
||||
{ executionHash &&
|
||||
<React.Fragment>
|
||||
<Avatar><CompareArrows /></Avatar>
|
||||
<ListItemText cut primary="Transaction Hash" secondary={txHash} />
|
||||
<ListItemText cut primary="Transaction Hash" secondary={executionHash} />
|
||||
</React.Fragment>
|
||||
}
|
||||
{ !txHash && userConfirmed &&
|
||||
{ !executionHash && userConfirmed &&
|
||||
<React.Fragment>
|
||||
<Avatar><CompareArrows /></Avatar>
|
||||
<ListItemText cut primary="Confirmed" secondary="Waiting for the rest of confirmations" />
|
||||
</React.Fragment>
|
||||
}
|
||||
{ !txHash && !userConfirmed &&
|
||||
{ !executionHash && !userConfirmed &&
|
||||
<Button
|
||||
variant="raised"
|
||||
color="primary"
|
||||
|
@ -100,7 +100,7 @@ class GnoTransaction extends React.PureComponent<Props, {}> {
|
|||
safeName={safeName}
|
||||
confirmations={transaction.get('confirmations')}
|
||||
destination={transaction.get('destination')}
|
||||
threshold={transaction.get('threshold')}
|
||||
threshold={threshold}
|
||||
/> }
|
||||
<Hairline />
|
||||
</React.Fragment>
|
||||
|
|
|
@ -1,14 +1,34 @@
|
|||
// @flow
|
||||
import { createStructuredSelector } from 'reselect'
|
||||
import { confirmationsTransactionSelector } from '~/routes/safe/store/selectors/index'
|
||||
import { userAccountSelector } from '~/wallets/store/selectors/index'
|
||||
import { userAccountSelector } from '~/wallets/store/selectors'
|
||||
import { type Transaction } from '~/routes/safe/store/model/transaction'
|
||||
import { type GlobalState } from '~/store'
|
||||
import { type Confirmation } from '~/routes/safe/store/model/confirmation'
|
||||
|
||||
export type SelectorProps = {
|
||||
confirmed: confirmationsTransactionSelector,
|
||||
userAddress: userAccountSelector,
|
||||
executionHash: string,
|
||||
}
|
||||
|
||||
type TxProps = {
|
||||
transaction: Transaction,
|
||||
}
|
||||
|
||||
const transactionHashSector = (state: GlobalState, props: TxProps) => {
|
||||
if (!props.transaction) {
|
||||
return undefined
|
||||
}
|
||||
|
||||
const confirmations = props.transaction.get('confirmations')
|
||||
const executedConf = confirmations.find((conf: Confirmation) => conf.get('type') === 'executed')
|
||||
|
||||
return executedConf.get('hash')
|
||||
}
|
||||
|
||||
export default createStructuredSelector({
|
||||
executionHash: transactionHashSector,
|
||||
confirmed: confirmationsTransactionSelector,
|
||||
userAddress: userAccountSelector,
|
||||
})
|
||||
|
|
|
@ -11,6 +11,7 @@ import actions, { type Actions } from './actions'
|
|||
type Props = SelectorProps & Actions & {
|
||||
safeName: string,
|
||||
safeAddress: string,
|
||||
threshold: number,
|
||||
|
||||
}
|
||||
class Transactions extends React.Component<Props, {}> {
|
||||
|
@ -24,13 +25,13 @@ class Transactions extends React.Component<Props, {}> {
|
|||
}
|
||||
|
||||
render() {
|
||||
const { transactions, safeName } = this.props
|
||||
const { transactions, safeName, threshold } = this.props
|
||||
const hasTransactions = transactions.count() > 0
|
||||
|
||||
return (
|
||||
<React.Fragment>
|
||||
{ hasTransactions
|
||||
? transactions.map((tx: Transaction) => <GnoTransaction key={tx.get('nonce')} safeName={safeName} onProcessTx={this.onProcessTx} transaction={tx} />)
|
||||
? transactions.map((tx: Transaction) => <GnoTransaction key={tx.get('nonce')} safeName={safeName} onProcessTx={this.onProcessTx} transaction={tx} threshold={threshold} />)
|
||||
: <NoTransactions />
|
||||
}
|
||||
</React.Fragment>
|
||||
|
|
|
@ -5,7 +5,7 @@ import { safeSelector, type RouterProps, type SafeSelectorProps } from '~/routes
|
|||
import { providerNameSelector, userAccountSelector } from '~/wallets/store/selectors/index'
|
||||
import { type Safe } from '~/routes/safe/store/model/safe'
|
||||
import { type Owner } from '~/routes/safe/store/model/owner'
|
||||
import { type GlobalState } from '~/store/index'
|
||||
import { type GlobalState } from '~/store'
|
||||
import { sameAddress } from '~/wallets/ethAddresses'
|
||||
import { activeTokensSelector } from '~/routes/tokens/store/selectors'
|
||||
import { type Token } from '~/routes/tokens/store/model/token'
|
||||
|
|
|
@ -58,7 +58,7 @@ export const confirmationsTransactionSelector: Selector<GlobalState, Transaction
|
|||
return 0
|
||||
}
|
||||
|
||||
return confirmations.filter(((confirmation: Confirmation) => confirmation.get('status'))).count()
|
||||
return confirmations.filter(((confirmation: Confirmation) => confirmation.get('type') === 'confirmation')).count()
|
||||
},
|
||||
)
|
||||
|
||||
|
|
Loading…
Reference in New Issue