diff --git a/src/routes/safe/components/Settings/ManageOwners/ReplaceOwnerModal/screens/OwnerForm/index.jsx b/src/routes/safe/components/Settings/ManageOwners/ReplaceOwnerModal/screens/OwnerForm/index.jsx new file mode 100644 index 00000000..beefc586 --- /dev/null +++ b/src/routes/safe/components/Settings/ManageOwners/ReplaceOwnerModal/screens/OwnerForm/index.jsx @@ -0,0 +1,160 @@ +// @flow +import React from 'react' +import classNames from 'classnames/bind' +import { withStyles } from '@material-ui/core/styles' +import Close from '@material-ui/icons/Close' +import IconButton from '@material-ui/core/IconButton' +import Paragraph from '~/components/layout/Paragraph' +import Row from '~/components/layout/Row' +import GnoForm from '~/components/forms/GnoForm' +import Col from '~/components/layout/Col' +import Button from '~/components/layout/Button' +import Block from '~/components/layout/Block' +import Hairline from '~/components/layout/Hairline' +import Field from '~/components/forms/Field' +import TextField from '~/components/forms/TextField' +import Identicon from '~/components/Identicon' +import Link from '~/components/layout/Link' +import OpenInNew from '@material-ui/icons/OpenInNew' +import { getEtherScanLink } from '~/logic/wallets/getWeb3' +import { + composeValidators, + required, + mustBeEthereumAddress, + minMaxLength, +} from '~/components/forms/validator' +import { styles } from './style' +import { secondary } from '~/theme/variables' + +const openIconStyle = { + height: '16px', + color: secondary, +} + +type Props = { + onClose: () => void, + classes: Object, + ownerAddress: string, + ownerName: string, + network: string, + onSubmit: Function, +} + +const OwnerForm = ({ + classes, + onClose, + ownerAddress, + ownerName, + network, + onSubmit, +}: Props) => { + const handleSubmit = (values) => { + onSubmit(values) + } + + return ( + + + + Replace owner + + 1 of 2 + + + + + + + {(...args) => { + const formState = args[2] + + return ( + + + + + Review the owner you want to replace from the active Safe. Then specify the new owner you want to replace it with: + + + + + Current owner + + + + + + + + + + {ownerName} + + + + {ownerAddress} + + + + + + + + + + + New owner + + + + + + + + + + + + + + + + + + + + ) + }} + + + ) +} + +export default withStyles(styles)(OwnerForm) diff --git a/src/routes/safe/components/Settings/ManageOwners/ReplaceOwnerModal/screens/OwnerForm/style.js b/src/routes/safe/components/Settings/ManageOwners/ReplaceOwnerModal/screens/OwnerForm/style.js new file mode 100644 index 00000000..bb4c1c1f --- /dev/null +++ b/src/routes/safe/components/Settings/ManageOwners/ReplaceOwnerModal/screens/OwnerForm/style.js @@ -0,0 +1,38 @@ +// @flow +import { lg, md, sm } from '~/theme/variables' + +export const styles = () => ({ + heading: { + padding: `${sm} ${lg}`, + justifyContent: 'flex-start', + boxSizing: 'border-box', + maxHeight: '75px', + }, + annotation: { + letterSpacing: '-1px', + color: '#a2a8ba', + marginRight: 'auto', + marginLeft: '20px', + }, + manage: { + fontSize: '24px', + }, + closeIcon: { + height: '35px', + width: '35px', + }, + formContainer: { + padding: `${md} ${lg}`, + minHeight: '340px', + }, + buttonRow: { + height: '84px', + justifyContent: 'center', + }, + owner: { + alignItems: 'center', + }, + user: { + justifyContent: 'left', + }, +})