Refactor add owner modal window

This commit is contained in:
Germán Martínez 2019-05-27 14:46:31 +02:00
parent f619905b11
commit fcbb02e56f
5 changed files with 11 additions and 25 deletions

View File

@ -65,14 +65,14 @@ const AddOwner = ({
} }
} }
const ownerSubmited = (newValues: Object) => { const ownerSubmitted = (newValues: Object) => {
values.ownerName = newValues.ownerName values.ownerName = newValues.ownerName
values.ownerAddress = newValues.ownerAddress values.ownerAddress = newValues.ownerAddress
setValues(values) setValues(values)
setActiveScreen('selectThreshold') setActiveScreen('selectThreshold')
} }
const thresholdSubmited = (newValues: Object) => { const thresholdSubmitted = (newValues: Object) => {
values.threshold = newValues.threshold values.threshold = newValues.threshold
setValues(values) setValues(values)
setActiveScreen('reviewAddOwner') setActiveScreen('reviewAddOwner')
@ -95,8 +95,8 @@ const AddOwner = ({
return ( return (
<Modal <Modal
title="Send Tokens" title="Add owner to Safe"
description="Send Tokens Form" description="Add owner to Safe"
handleClose={onClose} handleClose={onClose}
open={isOpen} open={isOpen}
paperClassName={classes.biggerModalWindow} paperClassName={classes.biggerModalWindow}
@ -105,22 +105,16 @@ const AddOwner = ({
{activeScreen === 'selectOwner' && ( {activeScreen === 'selectOwner' && (
<OwnerForm <OwnerForm
onClose={onClose} onClose={onClose}
setActiveScreen={setActiveScreen} onSubmit={ownerSubmitted}
safeAddress={safeAddress}
safeName={safeName}
onSubmit={ownerSubmited}
/> />
)} )}
{activeScreen === 'selectThreshold' && ( {activeScreen === 'selectThreshold' && (
<ThresholdForm <ThresholdForm
onClose={onClose} onClose={onClose}
setActiveScreen={setActiveScreen}
safeAddress={safeAddress}
safeName={safeName}
owners={owners} owners={owners}
threshold={threshold} threshold={threshold}
onClickBack={onClickBack} onClickBack={onClickBack}
onSubmit={thresholdSubmited} onSubmit={thresholdSubmitted}
/> />
)} )}
{activeScreen === 'reviewAddOwner' && ( {activeScreen === 'reviewAddOwner' && (

View File

@ -24,16 +24,12 @@ import { styles } from './style'
type Props = { type Props = {
onClose: () => void, onClose: () => void,
classes: Object, classes: Object,
safeAddress: string,
safeName: string,
onSubmit: Function, onSubmit: Function,
} }
const OwnerForm = ({ const OwnerForm = ({
classes, classes,
onClose, onClose,
safeAddress,
safeName,
onSubmit, onSubmit,
}: Props) => { }: Props) => {
const handleSubmit = (values) => { const handleSubmit = (values) => {

View File

@ -93,7 +93,7 @@ const ReviewAddOwner = ({
<Col xs={8} layout="column" className={classes.owners}> <Col xs={8} layout="column" className={classes.owners}>
<Row className={classes.ownersTitle}> <Row className={classes.ownersTitle}>
<Paragraph size="lg" color="primary" noMargin> <Paragraph size="lg" color="primary" noMargin>
{owners.size + 1} Safe owners {owners.size + 1} Safe owner(s)
</Paragraph> </Paragraph>
</Row> </Row>
<Hairline /> <Hairline />
@ -128,7 +128,7 @@ const ReviewAddOwner = ({
</Paragraph> </Paragraph>
</Row> </Row>
<Hairline /> <Hairline />
<Row className={classes.newOwner}> <Row className={classes.selectedOwner}>
<Col xs={1} align="center"> <Col xs={1} align="center">
<Identicon address={values.ownerAddress} diameter={32} /> <Identicon address={values.ownerAddress} diameter={32} />
</Col> </Col>
@ -166,7 +166,7 @@ const ReviewAddOwner = ({
color="primary" color="primary"
data-testid="review-tx-btn" data-testid="review-tx-btn"
> >
Next Submit
</Button> </Button>
</Row> </Row>
</React.Fragment> </React.Fragment>

View File

@ -60,7 +60,7 @@ export const styles = () => ({
userName: { userName: {
whiteSpace: 'nowrap', whiteSpace: 'nowrap',
}, },
newOwner: { selectedOwner: {
padding: sm, padding: sm,
alignItems: 'center', alignItems: 'center',
backgroundColor: '#fff3e2', backgroundColor: '#fff3e2',

View File

@ -28,8 +28,6 @@ import { styles } from './style'
type Props = { type Props = {
onClose: () => void, onClose: () => void,
classes: Object, classes: Object,
safeAddress: string,
safeName: string,
owners: List<Owner>, owners: List<Owner>,
threshold: number, threshold: number,
onClickBack: Function, onClickBack: Function,
@ -39,8 +37,6 @@ type Props = {
const ThresholdForm = ({ const ThresholdForm = ({
classes, classes,
onClose, onClose,
safeAddress,
safeName,
owners, owners,
threshold, threshold,
onClickBack, onClickBack,
@ -127,7 +123,7 @@ const ThresholdForm = ({
color="primary" color="primary"
data-testid="review-tx-btn" data-testid="review-tx-btn"
> >
Next Review
</Button> </Button>
</Row> </Row>
</React.Fragment> </React.Fragment>