improve email collection experience (slightly)

This commit is contained in:
Sean Yesmunt 2019-07-08 12:51:53 -04:00
parent 1fcbe96ba6
commit ace67b6ac1
8 changed files with 25 additions and 22 deletions

View file

@ -1,5 +1,4 @@
// @flow
import * as ICONS from 'constants/icons';
import React from 'react';
import Button from 'component/button';
@ -10,6 +9,7 @@ let scriptDidError = false;
type Props = {
disabled: boolean,
label: ?string,
email: string,
// =====================================================
// Required by stripe
@ -72,14 +72,14 @@ class CardVerify extends React.Component<Props, State> {
this.onScriptError(event);
};
});
const wrappedPromise = new Promise((accept, cancel) => {
promise.then(() => (canceled ? cancel({ isCanceled: true }) : accept()));
promise.catch(error => (canceled ? cancel({ isCanceled: true }) : cancel(error)));
const wrappedPromise = new Promise((resolve, reject) => {
promise.then(() => (canceled ? reject({ isCanceled: true }) : resolve()));
promise.catch(error => (canceled ? reject({ isCanceled: true }) : reject(error)));
});
return {
promise: wrappedPromise,
cancel() {
reject() {
canceled = true;
},
};
@ -161,9 +161,8 @@ class CardVerify extends React.Component<Props, State> {
render() {
return (
<Button
button="primary"
button="inverse"
label={this.props.label}
icon={ICONS.SECURE}
disabled={this.props.disabled || this.state.open || this.hasPendingClick}
onClick={this.onClick.bind(this)}
/>

View file

@ -1,6 +1,7 @@
// @flow
import * as React from 'react';
import { FormField, Form, Submit } from 'component/common/form';
import { FormField, Form } from 'component/common/form';
import Button from 'component/button';
import { Lbryio } from 'lbryinc';
type Props = {
@ -48,7 +49,7 @@ class UserEmailNew extends React.PureComponent<Props, State> {
return (
<React.Fragment>
<header className="card__header">
<h2 className="card__title">{__("Don't Miss Out")}</h2>
<h2 className="card__title">{__('Verify Your Email')}</h2>
<p className="card__subtitle">
{/* @if TARGET='app' */}
{__("We'll let you know about LBRY updates, security issues, and great new content.")}
@ -68,7 +69,9 @@ class UserEmailNew extends React.PureComponent<Props, State> {
value={this.state.email}
error={errorMessage}
onChange={this.handleEmailChanged}
inputButton={<Submit label="Submit" disabled={isPending || !this.state.email} />}
inputButton={
<Button type="submit" button="inverse" label="Submit" disabled={isPending || !this.state.email} />
}
/>
</Form>
<div className="card__actions">{cancelButton}</div>

View file

@ -1,5 +1,4 @@
// @flow
import * as icons from 'constants/icons';
import * as React from 'react';
import Button from 'component/button';
import CardVerify from 'component/cardVerify';
@ -84,8 +83,7 @@ class UserVerify extends React.PureComponent<Props> {
onClick={() => {
verifyPhone();
}}
button="primary"
icon={icons.PHONE}
button="inverse"
label={__('Submit Phone Number')}
/>
</div>
@ -112,7 +110,7 @@ class UserVerify extends React.PureComponent<Props> {
<div className="card__content">
<div className="card__actions">
<Button href="https://chat.lbry.com" button="primary" icon={icons.CHAT} label={__('Join LBRY Chat')} />
<Button href="https://chat.lbry.com" button="inverse" label={__('Join LBRY Chat')} />
</div>
</div>
</section>

View file

@ -38,7 +38,7 @@ class AuthPage extends React.PureComponent<Props> {
render() {
const { user, email } = this.props;
return <Page>{user && email && !user.is_identity_verified ? <UserVerify /> : <UserEmail />}</Page>;
return <Page>{user && email && user.has_verified_email ? <UserVerify /> : <UserEmail />}</Page>;
}
}

View file

@ -35,10 +35,11 @@ class RewardsPage extends PureComponent<Props> {
!IS_WEB && (
<section className="card card--section">
<header className="card__header">
<h2 className="card__title">{__('Humans Only')}</h2>
<h2 className="card__title">{__('Verification For Rewards')}</h2>
<p className="card__subtitle">
{__('Rewards are for human beings only.')}{' '}
{__("You'll have to prove you're one of us before you can claim any rewards.")}
{__("You'll have to prove you're one of us before you can claim any rewards.")}{' '}
{__('This is optional.')}
</p>
</header>

View file

@ -8,6 +8,7 @@
font-family: sans-serif;
display: block;
position: absolute;
z-index: 2;
}
[data-reach-menu-list] {

View file

@ -482,8 +482,6 @@
"Rendering document.": "Rendering document.",
"Sorry, looks like we can't load the document.": "Sorry, looks like we can't load the document.",
"Tag Search": "Tag Search",
"Rewards are currently disabled for your account. Turn on diagnostic data sharing, in": "Rewards are currently disabled for your account. Turn on diagnostic data sharing, in",
", in order to re-enable them.": ", in order to re-enable them.",
"Humans Only": "Humans Only",
"Rewards are for human beings only.": "Rewards are for human beings only.",
"You'll have to prove you're one of us before you can claim any rewards.": "You'll have to prove you're one of us before you can claim any rewards.",

View file

@ -280,5 +280,8 @@
"Delete this file": "Hapus file ini",
"Delete": "Hapus",
"Downloaded to": "Diunduh ke",
"Open file": "Buka file"
"Open file": "Buka file",
"Wallet": "Wallet",
"Multi-language support is brand new and incomplete. Switching your language may have unintended consequences.": "Multi-language support is brand new and incomplete. Switching your language may have unintended consequences.",
"Home": "Home"
}