Get rewards page working
This commit is contained in:
6ea86b96
Jeremy Kauffman
parent
b97703dc3c
commit
001d5e21f1
4 changed files with 92 additions and 139 deletions
82
ui/js/component/reward-link.js
Normal file
82
ui/js/component/reward-link.js
Normal file
|
|
@ -0,0 +1,82 @@
|
|||
import React from 'react';
|
||||
import lbry from 'lbry'
|
||||
import {Icon} from 'component/common';
|
||||
import Modal from 'component/modal';
|
||||
import rewards from 'rewards';
|
||||
import Link from 'component/link'
|
||||
|
||||
export let RewardLink = React.createClass({
|
||||
propTypes: {
|
||||
type: React.PropTypes.string.isRequired,
|
||||
claimed: React.PropTypes.bool,
|
||||
onRewardClaim: React.PropTypes.func,
|
||||
onRewardFailure: React.PropTypes.func
|
||||
},
|
||||
refreshClaimable: function() {
|
||||
switch(this.props.type) {
|
||||
case 'new_user':
|
||||
this.setState({ claimable: true });
|
||||
return;
|
||||
|
||||
case 'first_publish':
|
||||
lbry.claim_list_mine().then(function(list) {
|
||||
this.setState({
|
||||
claimable: list.length > 0
|
||||
})
|
||||
}.bind(this));
|
||||
return;
|
||||
}
|
||||
},
|
||||
componentWillMount: function() {
|
||||
this.refreshClaimable();
|
||||
},
|
||||
getInitialState: function() {
|
||||
return {
|
||||
claimable: true,
|
||||
pending: false,
|
||||
errorMessage: null
|
||||
}
|
||||
},
|
||||
claimReward: function() {
|
||||
this.setState({
|
||||
pending: true
|
||||
})
|
||||
rewards.claimReward(this.props.type).then((reward) => {
|
||||
this.setState({
|
||||
pending: false,
|
||||
errorMessage: null
|
||||
})
|
||||
if (this.props.onRewardClaim) {
|
||||
this.props.onRewardClaim(reward);
|
||||
}
|
||||
}).catch((error) => {
|
||||
this.setState({
|
||||
errorMessage: error.message,
|
||||
pending: false
|
||||
})
|
||||
})
|
||||
},
|
||||
clearError: function() {
|
||||
if (this.props.onRewardFailure) {
|
||||
this.props.onRewardFailure()
|
||||
}
|
||||
this.setState({
|
||||
errorMessage: null
|
||||
})
|
||||
},
|
||||
render: function() {
|
||||
return (
|
||||
<div className="reward-link">
|
||||
{this.props.claimed
|
||||
? <span><Icon icon="icon-check" /> Reward claimed.</span>
|
||||
: <Link button={this.props.button ? this.props.button : 'alt'} disabled={this.state.pending || !this.state.claimable }
|
||||
label={ this.state.pending ? "Claiming..." : "Claim Reward"} onClick={this.claimReward} />}
|
||||
{this.state.errorMessage ?
|
||||
<Modal isOpen={true} contentLabel="Reward Claim Error" className="error-modal" onConfirmed={this.clearError}>
|
||||
{this.state.errorMessage}
|
||||
</Modal>
|
||||
: ''}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
});
|
||||
|
|
@ -1,126 +0,0 @@
|
|||
import React from 'react';
|
||||
import lbryio from '../lbryio.js';
|
||||
import {Link} from '../component/link';
|
||||
import Notice from '../component/notice.js';
|
||||
import {CreditAmount} from '../component/common.js';
|
||||
//
|
||||
// const {shell} = require('electron');
|
||||
// const querystring = require('querystring');
|
||||
//
|
||||
// const GITHUB_CLIENT_ID = '6baf581d32bad60519';
|
||||
//
|
||||
// const LinkGithubReward = React.createClass({
|
||||
// propTypes: {
|
||||
// onClaimed: React.PropTypes.func,
|
||||
// },
|
||||
// _launchLinkPage: function() {
|
||||
// /* const githubAuthParams = {
|
||||
// client_id: GITHUB_CLIENT_ID,
|
||||
// redirect_uri: 'https://lbry.io/',
|
||||
// scope: 'user:email,public_repo',
|
||||
// allow_signup: false,
|
||||
// }
|
||||
// shell.openExternal('https://github.com/login/oauth/authorize?' + querystring.stringify(githubAuthParams)); */
|
||||
// shell.openExternal('https://lbry.io');
|
||||
// },
|
||||
// handleConfirmClicked: function() {
|
||||
// this.setState({
|
||||
// confirming: true,
|
||||
// });
|
||||
//
|
||||
// lbry.get_new_address().then((address) => {
|
||||
// lbryio.call('reward', 'new', {
|
||||
// reward_type: 'new_developer',
|
||||
// access_token: '**access token here**',
|
||||
// wallet_address: address,
|
||||
// }, 'post').then((response) => {
|
||||
// console.log('response:', response);
|
||||
//
|
||||
// this.props.onClaimed(); // This will trigger another API call to show that we succeeded
|
||||
//
|
||||
// this.setState({
|
||||
// confirming: false,
|
||||
// error: null,
|
||||
// });
|
||||
// }, (error) => {
|
||||
// console.log('failed with error:', error);
|
||||
// this.setState({
|
||||
// confirming: false,
|
||||
// error: error,
|
||||
// });
|
||||
// });
|
||||
// });
|
||||
// },
|
||||
// getInitialState: function() {
|
||||
// return {
|
||||
// confirming: false,
|
||||
// error: null,
|
||||
// };
|
||||
// },
|
||||
// render: function() {
|
||||
// return (
|
||||
// <section>
|
||||
// <p><Link button="alt" label="Link with GitHub" onClick={this._launchLinkPage} /></p>
|
||||
// <section className="reward-page__details">
|
||||
// <p>This will open a browser window where you can authorize GitHub to link your account to LBRY. This will record your email (no spam) and star the LBRY repo.</p>
|
||||
// <p>Once you're finished, you may confirm you've linked the account to receive your reward.</p>
|
||||
// </section>
|
||||
// {this.state.error
|
||||
// ? <Notice isError>
|
||||
// {this.state.error.message}
|
||||
// </Notice>
|
||||
// : null}
|
||||
//
|
||||
// <Link button="primary" label={this.state.confirming ? 'Confirming...' : 'Confirm'}
|
||||
// onClick={this.handleConfirmClicked} />
|
||||
// </section>
|
||||
// );
|
||||
// }
|
||||
// });
|
||||
//
|
||||
// const RewardPage = React.createClass({
|
||||
// propTypes: {
|
||||
// name: React.PropTypes.string.isRequired,
|
||||
// },
|
||||
// _getRewardType: function() {
|
||||
// lbryio.call('reward_type', 'get', this.props.name).then((rewardType) => {
|
||||
// this.setState({
|
||||
// rewardType: rewardType,
|
||||
// });
|
||||
// });
|
||||
// },
|
||||
// getInitialState: function() {
|
||||
// return {
|
||||
// rewardType: null,
|
||||
// };
|
||||
// },
|
||||
// componentWillMount: function() {
|
||||
// this._getRewardType();
|
||||
// },
|
||||
// render: function() {
|
||||
// if (!this.state.rewardType) {
|
||||
// return null;
|
||||
// }
|
||||
//
|
||||
// let Reward;
|
||||
// if (this.props.name == 'link_github') {
|
||||
// Reward = LinkGithubReward;
|
||||
// }
|
||||
//
|
||||
// const {title, description, value} = this.state.rewardType;
|
||||
// return (
|
||||
// <main>
|
||||
// <section className="card">
|
||||
// <h2>{title}</h2>
|
||||
// <CreditAmount amount={value} />
|
||||
// <p>{this.state.rewardType.claimed
|
||||
// ? <span class="empty">This reward has been claimed.</span>
|
||||
// : description}</p>
|
||||
// <Reward onClaimed={this._getRewardType} />
|
||||
// </section>
|
||||
// </main>
|
||||
// );
|
||||
// }
|
||||
// });
|
||||
//
|
||||
// export default RewardPage;
|
||||
|
|
@ -1,11 +1,11 @@
|
|||
import React from 'react';
|
||||
import lbry from '../lbry.js';
|
||||
import lbryio from '../lbryio.js';
|
||||
import {CreditAmount, Icon} from '../component/common.js';
|
||||
import rewards from '../rewards.js';
|
||||
import Modal from '../component/modal.js';
|
||||
import {WalletNav} from './wallet.js';
|
||||
import {RewardLink} from '../component/link';
|
||||
import lbry from 'lbry';
|
||||
import lbryio from 'lbryio';
|
||||
import {CreditAmount, Icon} from 'component/common.js';
|
||||
import rewards from 'rewards';
|
||||
import Modal from 'component/modal';
|
||||
import {WalletNav} from 'component/wallet-nav ewar';
|
||||
import {RewardLink} from 'component/reward-link';
|
||||
|
||||
const RewardTile = React.createClass({
|
||||
propTypes: {
|
||||
|
|
|
|||
|
|
@ -39,8 +39,7 @@ export const selectPageTitle = createSelector(
|
|||
case 'wallet':
|
||||
case 'send':
|
||||
case 'receive':
|
||||
case 'claim':
|
||||
case 'referral':
|
||||
case 'rewards':
|
||||
return 'Wallet'
|
||||
case 'downloaded':
|
||||
return 'My Files'
|
||||
|
|
@ -129,14 +128,12 @@ export const selectHeaderLinks = createSelector(
|
|||
case 'wallet':
|
||||
case 'send':
|
||||
case 'receive':
|
||||
case 'claim':
|
||||
case 'referral':
|
||||
case 'rewards':
|
||||
return {
|
||||
'wallet' : 'Overview',
|
||||
'send' : 'Send',
|
||||
'receive' : 'Receive',
|
||||
'claim' : 'Claim Beta Code',
|
||||
'referral' : 'Check Referral Credit',
|
||||
'rewards': 'Rewards',
|
||||
};
|
||||
case 'downloaded':
|
||||
case 'published':
|
||||
|
|
|
|||
Loading…
Reference in a new issue