add RewardAuthIntro on the invites page

This commit is contained in:
Sean Yesmunt 2020-01-22 12:46:18 -05:00
parent f5b719b966
commit bebf8295d5
4 changed files with 26 additions and 11 deletions

View file

@ -9,15 +9,16 @@ import I18nMessage from 'component/i18nMessage';
type Props = { type Props = {
balance: number, balance: number,
totalRewardValue: number, totalRewardValue: number,
title?: string,
}; };
function RewardAuthIntro(props: Props) { function RewardAuthIntro(props: Props) {
const { totalRewardValue } = props; const { totalRewardValue, title } = props;
const totalRewardRounded = Math.floor(totalRewardValue / 10) * 10; const totalRewardRounded = Math.floor(totalRewardValue / 10) * 10;
return ( return (
<Card <Card
title={__('Sign In to lbry.tv to Earn Rewards')} title={title || __('Sign In to lbry.tv to Earn Rewards')}
subtitle={ subtitle={
<I18nMessage <I18nMessage
tokens={{ tokens={{

View file

@ -1,6 +1,11 @@
import * as SETTINGS from 'constants/settings'; import * as SETTINGS from 'constants/settings';
import { connect } from 'react-redux'; import { connect } from 'react-redux';
import { doFetchInviteStatus, selectUserInviteStatusFailed, selectUserInviteStatusIsPending } from 'lbryinc'; import {
doFetchInviteStatus,
selectUserInviteStatusFailed,
selectUserInviteStatusIsPending,
selectUserVerifiedEmail,
} from 'lbryinc';
import { makeSelectClientSetting } from 'redux/selectors/settings'; import { makeSelectClientSetting } from 'redux/selectors/settings';
import { doSetClientSetting } from 'redux/actions/settings'; import { doSetClientSetting } from 'redux/actions/settings';
import InvitePage from './view'; import InvitePage from './view';
@ -9,6 +14,7 @@ const select = state => ({
isFailed: selectUserInviteStatusFailed(state), isFailed: selectUserInviteStatusFailed(state),
isPending: selectUserInviteStatusIsPending(state), isPending: selectUserInviteStatusIsPending(state),
inviteAcknowledged: makeSelectClientSetting(state)(SETTINGS.INVITE_ACKNOWLEDGED), inviteAcknowledged: makeSelectClientSetting(state)(SETTINGS.INVITE_ACKNOWLEDGED),
authenticated: selectUserVerifiedEmail(state),
}); });
const perform = dispatch => ({ const perform = dispatch => ({

View file

@ -4,11 +4,13 @@ import BusyIndicator from 'component/common/busy-indicator';
import InviteNew from 'component/inviteNew'; import InviteNew from 'component/inviteNew';
import InviteList from 'component/inviteList'; import InviteList from 'component/inviteList';
import Page from 'component/page'; import Page from 'component/page';
import RewardAuthIntro from 'component/rewardAuthIntro';
type Props = { type Props = {
isPending: boolean, isPending: boolean,
isFailed: boolean, isFailed: boolean,
inviteAcknowledged: boolean, inviteAcknowledged: boolean,
authenticated: boolean,
acknowledgeInivte: () => void, acknowledgeInivte: () => void,
fetchInviteStatus: () => void, fetchInviteStatus: () => void,
}; };
@ -24,10 +26,14 @@ class InvitePage extends React.PureComponent<Props> {
} }
render() { render() {
const { isPending, isFailed } = this.props; const { isPending, isFailed, authenticated } = this.props;
return ( return (
<Page> <Page>
{!authenticated ? (
<RewardAuthIntro title={__('Sign In to lbry.tv to Earn Rewards From Inviting Your Friends')} />
) : (
<React.Fragment>
{isPending && <BusyIndicator message={__('Checking your invite status')} />} {isPending && <BusyIndicator message={__('Checking your invite status')} />}
{!isPending && isFailed && <span className="empty">{__('Failed to retrieve invite status.')}</span>} {!isPending && isFailed && <span className="empty">{__('Failed to retrieve invite status.')}</span>}
{!isPending && !isFailed && ( {!isPending && !isFailed && (
@ -37,6 +43,8 @@ class InvitePage extends React.PureComponent<Props> {
<InviteList /> <InviteList />
</React.Fragment> </React.Fragment>
)} )}
</React.Fragment>
)}
</Page> </Page>
); );
} }