2018-04-12 16:50:32 -04:00
|
|
|
// @flow
|
2017-12-21 18:08:54 -03:00
|
|
|
import React from 'react';
|
2018-03-26 14:32:43 -07:00
|
|
|
import Button from 'component/button';
|
2017-05-26 12:53:32 +04:00
|
|
|
|
2018-04-12 16:50:32 -04:00
|
|
|
type Reward = {
|
|
|
|
reward_amount: number,
|
2019-09-04 17:37:28 -04:00
|
|
|
reward_range: string,
|
2018-04-12 16:50:32 -04:00
|
|
|
};
|
|
|
|
|
|
|
|
type Props = {
|
|
|
|
isPending: boolean,
|
|
|
|
label: ?string,
|
|
|
|
reward: Reward,
|
2018-04-23 01:17:54 -04:00
|
|
|
button: ?boolean,
|
2018-04-12 16:50:32 -04:00
|
|
|
claimReward: Reward => void,
|
|
|
|
};
|
|
|
|
|
|
|
|
const RewardLink = (props: Props) => {
|
2019-01-17 01:34:31 -05:00
|
|
|
const { reward, claimReward, label, isPending, button } = props;
|
2019-09-10 12:15:25 -04:00
|
|
|
let displayLabel = label;
|
|
|
|
if (isPending) {
|
|
|
|
displayLabel = __('Claiming...');
|
|
|
|
} else if (label) {
|
|
|
|
displayLabel = label;
|
|
|
|
} else if (reward && reward.reward_range && reward.reward_range.includes('-')) {
|
2020-01-03 16:52:36 -05:00
|
|
|
displayLabel = __('Get %range% LBC', { range: reward.reward_range });
|
2019-09-10 12:15:25 -04:00
|
|
|
} else if (reward && reward.reward_amount > 0) {
|
2020-01-03 16:52:36 -05:00
|
|
|
displayLabel = __('Get %amount% LBC', { amount: reward.reward_amount });
|
2019-09-10 12:15:25 -04:00
|
|
|
} else {
|
|
|
|
displayLabel = __('Get ??? LBC');
|
|
|
|
}
|
|
|
|
|
2018-03-26 14:32:43 -07:00
|
|
|
return !reward ? null : (
|
2019-02-04 12:45:30 -05:00
|
|
|
<Button
|
2019-09-26 12:07:11 -04:00
|
|
|
button={button ? 'primary' : 'link'}
|
2019-02-04 12:45:30 -05:00
|
|
|
disabled={isPending}
|
2019-09-10 12:15:25 -04:00
|
|
|
label={displayLabel}
|
2019-02-04 12:45:30 -05:00
|
|
|
onClick={() => {
|
|
|
|
claimReward(reward);
|
|
|
|
}}
|
|
|
|
/>
|
2017-06-07 20:56:52 -04:00
|
|
|
);
|
|
|
|
};
|
2018-04-12 16:50:32 -04:00
|
|
|
|
2017-06-07 20:56:52 -04:00
|
|
|
export default RewardLink;
|