mirror of
https://github.com/status-im/ens-usernames.git
synced 2025-03-01 18:40:34 +00:00
use render addresses after registration
This commit is contained in:
parent
89f84a4991
commit
e3511e397f
@ -37,6 +37,31 @@ const backButton = {
|
||||
cursor: 'pointer'
|
||||
}
|
||||
|
||||
class RenderAddresses extends PureComponent {
|
||||
state = { copied: false }
|
||||
|
||||
render() {
|
||||
const { domainName, address, statusAccount } = this.props
|
||||
const { copied } = this.state
|
||||
const markCopied = (v) => { this.setState({ copied: v }) }
|
||||
const isCopied = address => address == copied;
|
||||
const renderCopied = address => isCopied(address) && <span style={{ color: theme.positive }}><IconCheck/>Copied!</span>;
|
||||
return (
|
||||
<div style={{ display: 'flex', flexDirection: 'column' }}>
|
||||
<Info.Action title="Click to copy"><b>{formatName(domainName).toUpperCase()}</b> Resolves To:</Info.Action>
|
||||
{address && <Text style={{ marginTop: '1em' }}>Ethereum Address {renderCopied(address)}</Text>}
|
||||
<CopyToClipboard text={address} onCopy={markCopied}>
|
||||
<div style={addressStyle}>{address}</div>
|
||||
</CopyToClipboard>
|
||||
{validStatusAddress(statusAccount) && <Text style={{ marginTop: '1em' }}>Status Address {renderCopied(statusAccount)}</Text>}
|
||||
{validStatusAddress(statusAccount) && <CopyToClipboard text={statusAccount} onCopy={markCopied}>
|
||||
<div style={{ ...addressStyle, color: isCopied ? theme.primary : null }}>{statusAccount}</div>
|
||||
</CopyToClipboard>}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class Register extends PureComponent {
|
||||
state = { domainPrice: null };
|
||||
|
||||
@ -49,57 +74,40 @@ class Register extends PureComponent {
|
||||
|
||||
render() {
|
||||
const { domainName, setStatus } = this.props;
|
||||
const { domainPrice } = this.state;
|
||||
const { domainPrice, registered } = this.state;
|
||||
const formattedDomain = formatName(domainName);
|
||||
const formattedDomainArray = formattedDomain.split('.')
|
||||
return (
|
||||
<Fragment>
|
||||
<Info.Action title="No address is associated with this domain">
|
||||
{formattedDomain.toUpperCase()} can be registered for {domainPrice} SNT
|
||||
</Info.Action>
|
||||
<RegisterSubDomain
|
||||
subDomain={formattedDomainArray[0]}
|
||||
domainName={formattedDomainArray.slice(1).join('.')}
|
||||
domainPrice={domainPrice}
|
||||
registeredCallbackFn={(address, statusAccount) => this.setState({ registered: { address, statusAccount } })} />
|
||||
{!registered ?
|
||||
<Fragment>
|
||||
<Info.Action title="No address is associated with this domain">
|
||||
{formattedDomain.toUpperCase()} can be registered for {domainPrice} SNT
|
||||
</Info.Action>
|
||||
<RegisterSubDomain
|
||||
subDomain={formattedDomainArray[0]}
|
||||
domainName={formattedDomainArray.slice(1).join('.')}
|
||||
domainPrice={domainPrice}
|
||||
registeredCallbackFn={(address, statusAccount) => this.setState({ registered: { address, statusAccount } })} />
|
||||
</Fragment> :
|
||||
<RenderAddresses {...this.props} address={registered.address} statusAccount={registered.statusAccount} />}
|
||||
<div style={backButton} onClick={() => setStatus(null)}>←</div>
|
||||
</Fragment>
|
||||
)
|
||||
}
|
||||
}
|
||||
|
||||
class DisplayAddress extends PureComponent {
|
||||
state = { copied: false }
|
||||
|
||||
render() {
|
||||
const { copied } = this.state
|
||||
const { domainName, address, statusAccount, setStatus } = this.props
|
||||
const markCopied = (v) => { this.setState({ copied: v }) }
|
||||
const isCopied = address => address == copied;
|
||||
const renderCopied = address => isCopied(address) && <span style={{ color: theme.positive }}><IconCheck/>Copied!</span>;
|
||||
return (
|
||||
<Fragment>
|
||||
{validAddress(address) ?
|
||||
<div style={{ display: 'flex', flexDirection: 'column' }}>
|
||||
<Info.Action title="Click to copy"><b>{formatName(domainName).toUpperCase()}</b> Resolves To:</Info.Action>
|
||||
{address && <Text style={{ marginTop: '1em' }}>Ethereum Address {renderCopied(address)}</Text>}
|
||||
<CopyToClipboard text={address} onCopy={markCopied}>
|
||||
<div style={addressStyle}>{address}</div>
|
||||
</CopyToClipboard>
|
||||
{validStatusAddress(statusAccount) && <Text style={{ marginTop: '1em' }}>Status Address {renderCopied(statusAccount)}</Text>}
|
||||
{validStatusAddress(statusAccount) && <CopyToClipboard text={statusAccount} onCopy={markCopied}>
|
||||
<div style={{ ...addressStyle, color: isCopied ? theme.primary : null }}>{statusAccount}</div>
|
||||
</CopyToClipboard>}
|
||||
</div>
|
||||
:
|
||||
<Info.Action title="No address is associated with this domain">
|
||||
{domainName.toUpperCase()}
|
||||
</Info.Action>}
|
||||
<div style={backButton} onClick={() => setStatus(null)}>←</div>
|
||||
</Fragment>
|
||||
)
|
||||
}
|
||||
}
|
||||
const DisplayAddress = ({ domainName, address, statusAccount, setStatus }) => (
|
||||
<Fragment>
|
||||
{validAddress(address) ?
|
||||
<RenderAddresses {...this.props} />
|
||||
:
|
||||
<Info.Action title="No address is associated with this domain">
|
||||
{domainName.toUpperCase()}
|
||||
</Info.Action>}
|
||||
<div style={backButton} onClick={() => setStatus(null)}>←</div>
|
||||
</Fragment>
|
||||
)
|
||||
|
||||
const InnerForm = ({
|
||||
values,
|
||||
|
@ -128,7 +128,8 @@ const RegisterSubDomain = withFormik({
|
||||
console.log("Register send errored. :( Out of gas?")
|
||||
console.dir(err)
|
||||
}).finally(() => {
|
||||
registeredCallbackFn(resolveToAddr, resolveToStatusAddr);
|
||||
// REQUIRED UNTIL THIS ISSUES IS RESOLVED: https://github.com/jaredpalmer/formik/issues/597
|
||||
setTimeout(() => { registeredCallbackFn(resolveToAddr, resolveToStatusAddr); }, 200);
|
||||
setSubmitting(false);
|
||||
});
|
||||
}).catch(err => {
|
||||
|
Loading…
x
Reference in New Issue
Block a user