status-im
/
ens-usernames
mirror of https://github.com/status-im/ens-usernames.git
2
0
Fork 0
Code Issues Projects Releases Wiki Activity

breakout displaybox

This commit is contained in:
Barry Gitarts 2018-10-01 17:10:58 -04:00 committed by Barry G
parent e9a4f6c72b
commit 2db0c7171d
4 changed files with 34 additions and 18 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
app/components/ens/DisplayBox.js Normal file
View File

@ -0,0 +1,25 @@
import React from 'react';
import Typography from '@material-ui/core/Typography';
import { connect } from 'react-redux';
import { YOUR_CONTACT_CODE } from './constants';
import { checkAndDispatchStatusContactCode } from '../../actions/accounts';
const WrappedDisplayBox = ({ displayType, pubKey, getStatusContactCode }) => (
<div onClick={() => getStatusContactCode(displayType, pubKey)}>
<div style={{ fontSize: '14px', color: '#939BA1', margin: '0 1em' }}>{displayType}</div>
<div style={{ border: '1px solid #EEF2F5', borderRadius: '8px', margin: '0.5 1em 1em', display: 'flex', flexDirection: 'column', justifyContent: 'space-around', minHeight: '4em' }}>
<div style={{ margin: '3%', wordBreak: 'break-word' }}>
<Typography type="body1">{pubKey}</Typography>
</div>
</div>
</div>
);
const mapDispatchToDisplayBoxProps = dispatch => ({
getStatusContactCode(displayType, pubKey) {
if (displayType === YOUR_CONTACT_CODE && !pubKey) checkAndDispatchStatusContactCode(dispatch);
},
});
export default connect(null, mapDispatchToDisplayBoxProps)(WrappedDisplayBox);

1
app/components/ens/constants.js Normal file
View File

@ -0,0 +1 @@
export const YOUR_CONTACT_CODE = 'Your contact code';

4
app/components/ens/nameLookup.js
View File

@ -31,6 +31,8 @@ import Face from '@material-ui/icons/Face';
import Copy from './copy';
import IDNANormalizer from 'idna-normalize';
import { nullAddress, getResolver } from './utils/domain';
import { YOUR_CONTACT_CODE } from './constants';
import DisplayBox from './DisplayBox';
const normalizer = new IDNANormalizer();
const invalidSuffix = '0000000000000000000000000000000000000000'
@ -117,7 +119,7 @@ const MobileAddressDisplay = ({ domainName, address, statusAccount, expirationTi
preRegisteredCallback={onSubmit}
registeredCallbackFn={console.log} />}
{!edit && <DisplayBox displayType='Your wallet address' pubKey={address} />}
{!edit && validStatusAddress(statusAccount) && <DisplayBox displayType='Your contact code' pubKey={statusAccount} />}
{!edit && validStatusAddress(statusAccount) && <DisplayBox displayType={YOUR_CONTACT_CODE} pubKey={statusAccount} />}
</Fragment>
)

22
app/components/ens/registerSubDomain.js
View File

@ -1,38 +1,26 @@
import web3 from "Embark/web3"
import UsernameRegistrar from 'Embark/contracts/UsernameRegistrar';
import PublicResolver from 'Embark/contracts/PublicResolver';
import TestToken from 'Embark/contracts/TestToken';
import React from 'react';
import { connect } from 'react-redux';
import Hidden from '@material-ui/core/Hidden';
import CircularProgress from '@material-ui/core/CircularProgress';
import { Button, MobileSearch, MobileButton, Field } from '../../ui/components';
import { Button, MobileButton } from '../../ui/components';
import { withFormik } from 'formik';
import { hash } from 'eth-ens-namehash';
import { zeroAddress, zeroBytes32, formatPrice } from './utils';
import { getStatusContactCode, getSNTAllowance, getCurrentAccount } from '../../reducers/accounts';
import FieldGroup from '../standard/FieldGroup';
import LinearProgress from '@material-ui/core/LinearProgress';
import Typography from '@material-ui/core/Typography';
import TokenPermissions from '../standard/TokenPermissionConnect';
import Terms from './terms';
import { generateXY } from '../../utils/ecdsa';
import { getResolver } from './utils/domain';
import DisplayBox from './DisplayBox';
import { YOUR_CONTACT_CODE } from './constants';
const { soliditySha3, fromWei } = web3.utils;
const DisplayBox = ({ displayType, pubKey }) => (
<div>
<div style={{ fontSize: '14px', color: '#939BA1', margin: '0 1em' }}>{displayType}</div>
<div style={{ border: '1px solid #EEF2F5', borderRadius: '8px', margin: '0.5 1em 1em', display: 'flex', flexDirection: 'column', justifyContent: 'space-around', minHeight: '4em' }}>
<div style={{ margin: '3%', wordBreak: 'break-word' }}>
<Typography type='body1'>{pubKey}</Typography>
</div>
</div>
</div>
);
const formRef = React.createRef();
const displayTerms = status => status === 'terms';
const InnerForm = ({
@ -123,8 +111,8 @@ const InnerForm = ({
<Hidden mdUp>
<DisplayBox displayType='Your wallet address' pubKey={values.address} />
<DisplayBox displayType='Your contact code' pubKey={values.statusAddress} />
<DisplayBox displayType="Your wallet address" pubKey={values.address} />
<DisplayBox displayType={YOUR_CONTACT_CODE} pubKey={values.statusAddress} />
{/*<div style={{ fontSize: '14px', color: '#939BA1', margin: '0 1em' }}>Your contact code</div>*/}
{/*<div style={{ border: '1px solid #EEF2F5', borderRadius: '8px', margin: '0.5 1em 1em', display: 'flex', flexDirection: 'column', justifyContent: 'space-around', minHeight: '4em' }}>*/}