73 lines
1.9 KiB
JavaScript
73 lines
1.9 KiB
JavaScript
// @flow
|
|
import * as PAGES from 'constants/pages';
|
|
import type { Node } from 'react';
|
|
import React, { useEffect } from 'react';
|
|
import Button from 'component/button';
|
|
import { FormField } from 'component/common/form';
|
|
import UserSignOutButton from 'component/userSignOutButton';
|
|
import Card from 'component/common/card';
|
|
|
|
type Props = {
|
|
cancelButton: Node,
|
|
email: string,
|
|
resendVerificationEmail: string => void,
|
|
checkEmailVerified: () => void,
|
|
user: {
|
|
has_verified_email: boolean,
|
|
},
|
|
fetchAccessToken: () => void,
|
|
accessToken: string,
|
|
};
|
|
|
|
function UserEmail(props: Props) {
|
|
const { email, user, accessToken, fetchAccessToken } = props;
|
|
|
|
let isVerified = false;
|
|
if (user) {
|
|
isVerified = user.has_verified_email;
|
|
}
|
|
|
|
useEffect(() => {
|
|
if (!accessToken) {
|
|
fetchAccessToken();
|
|
}
|
|
}, [accessToken, fetchAccessToken]);
|
|
|
|
return (
|
|
<Card
|
|
title={__('lbry.tv Account')}
|
|
subtitle={
|
|
isVerified
|
|
? undefined
|
|
: __(
|
|
'Creating a lbry.tv account will allow you to earn rewards, receive content and security updates, and optionally backup your data.'
|
|
)
|
|
}
|
|
actions={
|
|
isVerified ? (
|
|
<FormField
|
|
type="text"
|
|
className="form-field--copyable"
|
|
readOnly
|
|
label={
|
|
<React.Fragment>
|
|
{__('Your Email')}{' '}
|
|
<Button
|
|
button="link"
|
|
label={__('Update mailing preferences')}
|
|
href={`http://lbry.io/list/edit/${accessToken}`}
|
|
/>
|
|
</React.Fragment>
|
|
}
|
|
inputButton={<UserSignOutButton button="inverse" />}
|
|
value={email || ''}
|
|
/>
|
|
) : (
|
|
<Button button="primary" label={__('Sign In')} navigate={`/$/${PAGES.AUTH}`} />
|
|
)
|
|
}
|
|
/>
|
|
);
|
|
}
|
|
|
|
export default UserEmail;
|