UserWallet.jsx 31.7 KB
Newer Older
James Calfee's avatar
James Calfee committed
1 2
/* eslint react/prop-types: 0 */
import React from 'react';
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
3 4
import { connect } from 'react-redux';
import { Link } from 'react-router';
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
5
import tt from 'counterpart';
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
6
import { List } from 'immutable';
James Calfee's avatar
James Calfee committed
7
import SavingsWithdrawHistory from 'app/components/elements/SavingsWithdrawHistory';
James Calfee's avatar
James Calfee committed
8 9
import TransferHistoryRow from 'app/components/cards/TransferHistoryRow';
import TimeAgoWrapper from 'app/components/elements/TimeAgoWrapper';
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
10 11 12 13
import {
    numberWithCommas,
    vestingSteem,
    delegatedSteem,
Seungwon Eugene Jeong's avatar
Seungwon Eugene Jeong committed
14
    powerdownSteem,
15
    pricePerSteem,
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
16 17
} from 'app/utils/StateFunctions';
import WalletSubMenu from 'app/components/elements/WalletSubMenu';
18
import shouldComponentUpdate from 'app/utils/shouldComponentUpdate';
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
19 20 21 22 23 24 25 26
import Tooltip from 'app/components/elements/Tooltip';
import { FormattedHTMLMessage } from 'app/Translator';
import {
    LIQUID_TOKEN,
    LIQUID_TICKER,
    DEBT_TOKENS,
    VESTING_TOKEN,
} from 'app/client_config';
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
27 28
import * as transactionActions from 'app/redux/TransactionReducer';
import * as globalActions from 'app/redux/GlobalReducer';
29
import DropdownMenu from 'app/components/elements/DropdownMenu';
30 31

const assetPrecision = 1000;
James Calfee's avatar
James Calfee committed
32 33 34

class UserWallet extends React.Component {
    constructor() {
35
        super();
36 37 38
        this.state = {
            claimInProgress: false,
        };
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
39
        this.onShowDepositSteem = e => {
valzav's avatar
valzav committed
40
            if (e && e.preventDefault) e.preventDefault();
Roger Jungemann's avatar
Roger Jungemann committed
41
            const name = this.props.currentUser.get('username');
42 43
            const new_window = window.open();
            new_window.opener = null;
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
44
            new_window.location =
45
                'https://blocktrades.us/?input_coin_type=eth&output_coin_type=steem&receive_address=' +
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
46
                name;
47
        };
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
48
        this.onShowWithdrawSteem = e => {
49 50 51
            e.preventDefault();
            const new_window = window.open();
            new_window.opener = null;
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
52
            new_window.location =
53
                'https://blocktrades.us/unregistered_trade/steem/eth';
54
        };
Roger Jungemann's avatar
Roger Jungemann committed
55
        this.onShowDepositPower = (currentUserName, e) => {
Mike's avatar
Mike committed
56
            e.preventDefault();
57 58
            const new_window = window.open();
            new_window.opener = null;
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
59
            new_window.location =
60
                'https://blocktrades.us/?input_coin_type=eth&output_coin_type=steem_power&receive_address=' +
Roger Jungemann's avatar
Roger Jungemann committed
61
                currentUserName;
62
        };
Roger Jungemann's avatar
Roger Jungemann committed
63
        this.onShowDepositSBD = (currentUserName, e) => {
64 65 66
            e.preventDefault();
            const new_window = window.open();
            new_window.opener = null;
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
67
            new_window.location =
68
                'https://blocktrades.us/?input_coin_type=eth&output_coin_type=sbd&receive_address=' +
Roger Jungemann's avatar
Roger Jungemann committed
69
                currentUserName;
70
        };
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
71
        this.onShowWithdrawSBD = e => {
72 73 74
            e.preventDefault();
            const new_window = window.open();
            new_window.opener = null;
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
75
            new_window.location =
76
                'https://blocktrades.us/unregistered_trade/sbd/eth';
77
        };
78
        this.shouldComponentUpdate = shouldComponentUpdate(this, 'UserWallet');
James Calfee's avatar
James Calfee committed
79
    }
80

Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
81
    handleClaimRewards = account => {
82 83
        this.setState({ claimInProgress: true }); // disable the claim button
        this.props.claimRewards(account);
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
84
    };
85

86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110
    getCurrentApr = gprops => {
        // The inflation was set to 9.5% at block 7m
        const initialInflationRate = 9.5;
        const initialBlock = 7000000;

        // It decreases by 0.01% every 250k blocks
        const decreaseRate = 250000;
        const decreasePercentPerIncrement = 0.01;

        // How many increments have happened since block 7m?
        const headBlock = gprops.head_block_number;
        const deltaBlocks = headBlock - initialBlock;
        const decreaseIncrements = deltaBlocks / decreaseRate;

        // Current inflation rate
        let currentInflationRate =
            initialInflationRate -
            decreaseIncrements * decreasePercentPerIncrement;

        // Cannot go lower than 0.95%
        if (currentInflationRate < 0.95) {
            currentInflationRate = 0.95;
        }

        // Now lets calculate the "APR"
111
        const vestingRewardPercent = gprops.vesting_reward_percent / 10000;
112 113 114 115
        const virtualSupply = gprops.virtual_supply.split(' ').shift();
        const totalVestingFunds = gprops.total_vesting_fund_steem
            .split(' ')
            .shift();
116
        return (
roadscape's avatar
roadscape committed
117
            (virtualSupply * currentInflationRate * vestingRewardPercent) /
118 119
            totalVestingFunds
        );
120 121
    };

James Calfee's avatar
James Calfee committed
122
    render() {
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
123 124 125 126 127 128 129 130 131 132 133 134
        const {
            onShowDepositSteem,
            onShowWithdrawSteem,
            onShowDepositSBD,
            onShowWithdrawSBD,
            onShowDepositPower,
        } = this;
        const {
            convertToSteem,
            price_per_steem,
            savings_withdraws,
            account,
Roger Jungemann's avatar
Roger Jungemann committed
135
            currentUser,
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
136 137
            open_orders,
        } = this.props;
138
        const gprops = this.props.gprops.toJS();
139

140
        // do not render if account is not loaded or available
141
        if (!account) return null;
142 143 144 145

        // do not render if state appears to contain only lite account info
        if (!account.has('vesting_shares')) return null;

146 147
        let vesting_steem = vestingSteem(account.toJS(), gprops);
        let delegated_steem = delegatedSteem(account.toJS(), gprops);
Seungwon Eugene Jeong's avatar
Seungwon Eugene Jeong committed
148
        let powerdown_steem = powerdownSteem(account.toJS(), gprops);
James Calfee's avatar
James Calfee committed
149

Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
150
        let isMyAccount =
Roger Jungemann's avatar
Roger Jungemann committed
151
            currentUser && currentUser.get('username') === account.get('name');
James Calfee's avatar
James Calfee committed
152 153 154 155

        const disabledWarning = false;
        // isMyAccount = false; // false to hide wallet transactions

James Calfee's avatar
James Calfee committed
156
        const showTransfer = (asset, transferType, e) => {
James Calfee's avatar
James Calfee committed
157
            e.preventDefault();
James Calfee's avatar
James Calfee committed
158
            this.props.showTransfer({
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
159 160 161
                to: isMyAccount ? null : account.get('name'),
                asset,
                transferType,
James Calfee's avatar
James Calfee committed
162
            });
James Calfee's avatar
James Calfee committed
163 164
        };

165 166
        const savings_balance = account.get('savings_balance');
        const savings_sbd_balance = account.get('savings_sbd_balance');
James Calfee's avatar
James Calfee committed
167

James Calfee's avatar
James Calfee committed
168
        const powerDown = (cancel, e) => {
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
169
            e.preventDefault();
170
            const name = account.get('name');
171
            if (cancel) {
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187
                const vesting_shares = cancel
                    ? '0.000000 VESTS'
                    : account.get('vesting_shares');
                this.setState({ toggleDivestError: null });
                const errorCallback = e2 => {
                    this.setState({ toggleDivestError: e2.toString() });
                };
                const successCallback = () => {
                    this.setState({ toggleDivestError: null });
                };
                this.props.withdrawVesting({
                    account: name,
                    vesting_shares,
                    errorCallback,
                    successCallback,
                });
188
            } else {
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
189 190 191 192 193 194
                const to_withdraw = account.get('to_withdraw');
                const withdrawn = account.get('withdrawn');
                const vesting_shares = account.get('vesting_shares');
                const delegated_vesting_shares = account.get(
                    'delegated_vesting_shares'
                );
195 196
                this.props.showPowerdown({
                    account: name,
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
197 198 199 200
                    to_withdraw,
                    withdrawn,
                    vesting_shares,
                    delegated_vesting_shares,
201 202
                });
            }
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
203
        };
James Calfee's avatar
James Calfee committed
204

205
        // Sum savings withrawals
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
206 207 208
        let savings_pending = 0,
            savings_sbd_pending = 0;
        if (savings_withdraws) {
James Calfee's avatar
James Calfee committed
209
            savings_withdraws.forEach(withdraw => {
210
                const [amount, asset] = withdraw.get('amount').split(' ');
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
211
                if (asset === 'STEEM') savings_pending += parseFloat(amount);
James Calfee's avatar
James Calfee committed
212
                else {
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
213 214
                    if (asset === 'SBD')
                        savings_sbd_pending += parseFloat(amount);
James Calfee's avatar
James Calfee committed
215
                }
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
216
            });
James Calfee's avatar
James Calfee committed
217
        }
James Calfee's avatar
James Calfee committed
218

219 220
        // Sum conversions
        let conversionValue = 0;
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
221 222 223 224 225 226 227 228 229 230 231 232 233 234 235 236 237 238 239 240
        const currentTime = new Date().getTime();
        const conversions = account
            .get('other_history', List())
            .reduce((out, item) => {
                if (item.getIn([1, 'op', 0], '') !== 'convert') return out;

                const timestamp = new Date(
                    item.getIn([1, 'timestamp'])
                ).getTime();
                const finishTime = timestamp + 86400000 * 3.5; // add 3.5day conversion delay
                if (finishTime < currentTime) return out;

                const amount = parseFloat(
                    item.getIn([1, 'op', 1, 'amount']).replace(' SBD', '')
                );
                conversionValue += amount;

                return out.concat([
                    <div key={item.get(0)}>
                        <Tooltip
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
241 242 243
                            t={tt('userwallet_jsx.conversion_complete_tip', {
                                date: new Date(finishTime).toLocaleString(),
                            })}
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
244 245 246 247 248 249 250 251 252 253 254 255
                        >
                            <span>
                                (+{tt('userwallet_jsx.in_conversion', {
                                    amount: numberWithCommas(
                                        '$' + amount.toFixed(3)
                                    ),
                                })})
                            </span>
                        </Tooltip>
                    </div>,
                ]);
            }, []);
256

257
        const balance_steem = parseFloat(account.get('balance').split(' ')[0]);
James Calfee's avatar
James Calfee committed
258
        const saving_balance_steem = parseFloat(savings_balance.split(' ')[0]);
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
259 260 261 262 263 264 265 266 267 268 269 270 271 272 273 274 275 276 277 278 279 280 281 282 283 284
        const divesting =
            parseFloat(account.get('vesting_withdraw_rate').split(' ')[0]) >
            0.0;
        const sbd_balance = parseFloat(account.get('sbd_balance'));
        const sbd_balance_savings = parseFloat(
            savings_sbd_balance.split(' ')[0]
        );
        const sbdOrders =
            !open_orders || !isMyAccount
                ? 0
                : open_orders.reduce((o, order) => {
                      if (order.sell_price.base.indexOf('SBD') !== -1) {
                          o += order.for_sale;
                      }
                      return o;
                  }, 0) / assetPrecision;

        const steemOrders =
            !open_orders || !isMyAccount
                ? 0
                : open_orders.reduce((o, order) => {
                      if (order.sell_price.base.indexOf('STEEM') !== -1) {
                          o += order.for_sale;
                      }
                      return o;
                  }, 0) / assetPrecision;
James Calfee's avatar
James Calfee committed
285

286
        // set displayed estimated value
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
287 288 289 290 291 292 293 294 295 296 297 298 299 300 301 302 303
        const total_sbd =
            sbd_balance +
            sbd_balance_savings +
            savings_sbd_pending +
            sbdOrders +
            conversionValue;
        const total_steem =
            vesting_steem +
            balance_steem +
            saving_balance_steem +
            savings_pending +
            steemOrders;
        let total_value =
            '$' +
            numberWithCommas(
                (total_steem * price_per_steem + total_sbd).toFixed(2)
            );
James Calfee's avatar
James Calfee committed
304

305 306 307 308 309 310
        // format spacing on estimated value based on account state
        let estimate_output = <p>{total_value}</p>;
        if (isMyAccount) {
            estimate_output = <p>{total_value}&nbsp; &nbsp; &nbsp;</p>;
        }

James Calfee's avatar
James Calfee committed
311
        /// transfer log
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
312 313 314 315 316 317 318 319 320 321 322 323 324 325 326
        let idx = 0;
        const transfer_log = account
            .get('transfer_history')
            .map(item => {
                const data = item.getIn([1, 'op', 1]);
                const type = item.getIn([1, 'op', 0]);

                // Filter out rewards
                if (
                    type === 'curation_reward' ||
                    type === 'author_reward' ||
                    type === 'comment_benefactor_reward'
                ) {
                    return null;
                }
James Calfee's avatar
James Calfee committed
327

Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
328 329 330 331 332 333 334 335 336 337 338 339 340 341 342
                if (
                    data.sbd_payout === '0.000 SBD' &&
                    data.vesting_payout === '0.000000 VESTS'
                )
                    return null;
                return (
                    <TransferHistoryRow
                        key={idx++}
                        op={item.toJS()}
                        context={account.get('name')}
                    />
                );
            })
            .filter(el => !!el)
            .reverse();
James Calfee's avatar
James Calfee committed
343 344

        let steem_menu = [
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
345
            {
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
346
                value: tt('userwallet_jsx.transfer'),
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
347 348 349 350 351 352 353 354 355 356 357 358 359 360 361 362 363 364 365 366 367 368 369 370 371 372
                link: '#',
                onClick: showTransfer.bind(
                    this,
                    'STEEM',
                    'Transfer to Account'
                ),
            },
            {
                value: tt('userwallet_jsx.transfer_to_savings'),
                link: '#',
                onClick: showTransfer.bind(
                    this,
                    'STEEM',
                    'Transfer to Savings'
                ),
            },
            {
                value: tt('userwallet_jsx.power_up'),
                link: '#',
                onClick: showTransfer.bind(
                    this,
                    'VESTS',
                    'Transfer to Account'
                ),
            },
        ];
James Calfee's avatar
James Calfee committed
373
        let power_menu = [
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
374 375 376 377 378 379
            {
                value: tt('userwallet_jsx.power_down'),
                link: '#',
                onClick: powerDown.bind(this, false),
            },
        ];
380
        let dollar_menu = [
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
381 382 383 384 385 386 387 388 389 390
            {
                value: tt('g.transfer'),
                link: '#',
                onClick: showTransfer.bind(this, 'SBD', 'Transfer to Account'),
            },
            {
                value: tt('userwallet_jsx.transfer_to_savings'),
                link: '#',
                onClick: showTransfer.bind(this, 'SBD', 'Transfer to Savings'),
            },
valzav's avatar
valzav committed
391
            { value: tt('userwallet_jsx.market'), link: '/market' },
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
392 393 394 395 396 397 398
        ];
        if (isMyAccount) {
            steem_menu.push({
                value: tt('g.buy'),
                link: '#',
                onClick: onShowDepositSteem.bind(
                    this,
Roger Jungemann's avatar
Roger Jungemann committed
399
                    currentUser.get('username')
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
400 401 402 403 404 405 406 407 408 409 410 411 412 413 414 415
                ),
            });
            steem_menu.push({
                value: tt('g.sell'),
                link: '#',
                onClick: onShowWithdrawSteem,
            });
            steem_menu.push({
                value: tt('userwallet_jsx.market'),
                link: '/market',
            });
            power_menu.push({
                value: tt('g.buy'),
                link: '#',
                onClick: onShowDepositPower.bind(
                    this,
Roger Jungemann's avatar
Roger Jungemann committed
416
                    currentUser.get('username')
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
417 418 419 420 421 422 423
                ),
            });
            dollar_menu.push({
                value: tt('g.buy'),
                link: '#',
                onClick: onShowDepositSBD.bind(
                    this,
Roger Jungemann's avatar
Roger Jungemann committed
424
                    currentUser.get('username')
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
425 426 427 428 429 430 431
                ),
            });
            dollar_menu.push({
                value: tt('g.sell'),
                link: '#',
                onClick: onShowWithdrawSBD,
            });
James Calfee's avatar
James Calfee committed
432
        }
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
433 434 435 436 437 438
        if (divesting) {
            power_menu.push({
                value: 'Cancel Power Down',
                link: '#',
                onClick: powerDown.bind(this, true),
            });
James Calfee's avatar
James Calfee committed
439 440
        }

Mike's avatar
Mike committed
441
        const steem_balance_str = numberWithCommas(balance_steem.toFixed(3));
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
442 443 444
        const steem_orders_balance_str = numberWithCommas(
            steemOrders.toFixed(3)
        );
Mike's avatar
Mike committed
445
        const power_balance_str = numberWithCommas(vesting_steem.toFixed(3));
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
446 447 448
        const received_power_balance_str =
            (delegated_steem < 0 ? '+' : '') +
            numberWithCommas((-delegated_steem).toFixed(3));
Seungwon Eugene Jeong's avatar
Seungwon Eugene Jeong committed
449 450 451
        const powerdown_balance_str = numberWithCommas(
            powerdown_steem.toFixed(3)
        );
Mike's avatar
Mike committed
452
        const sbd_balance_str = numberWithCommas('$' + sbd_balance.toFixed(3)); // formatDecimal(account.sbd_balance, 3)
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
453 454 455 456 457 458 459 460 461
        const sbd_orders_balance_str = numberWithCommas(
            '$' + sbdOrders.toFixed(3)
        );
        const savings_balance_str = numberWithCommas(
            saving_balance_steem.toFixed(3) + ' STEEM'
        );
        const savings_sbd_balance_str = numberWithCommas(
            '$' + sbd_balance_savings.toFixed(3)
        );
James Calfee's avatar
James Calfee committed
462 463

        const savings_menu = [
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
464 465 466 467 468 469 470
            {
                value: tt('userwallet_jsx.withdraw_LIQUID_TOKEN', {
                    LIQUID_TOKEN,
                }),
                link: '#',
                onClick: showTransfer.bind(this, 'STEEM', 'Savings Withdraw'),
            },
Mike's avatar
Mike committed
471
        ];
James Calfee's avatar
James Calfee committed
472
        const savings_sbd_menu = [
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
473 474 475 476 477 478 479
            {
                value: tt('userwallet_jsx.withdraw_DEBT_TOKENS', {
                    DEBT_TOKENS,
                }),
                link: '#',
                onClick: showTransfer.bind(this, 'SBD', 'Savings Withdraw'),
            },
Mike's avatar
Mike committed
480
        ];
481
        // set dynamic secondary wallet values
Mike's avatar
Mike committed
482
        const sbdInterest = this.props.sbd_interest / 100;
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
483
        const sbdMessage = (
484
            <span>{tt('userwallet_jsx.tradeable_tokens_transferred')}</span>
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
485 486 487 488 489 490 491 492 493 494 495 496 497 498
        );

        const reward_steem =
            parseFloat(account.get('reward_steem_balance').split(' ')[0]) > 0
                ? account.get('reward_steem_balance')
                : null;
        const reward_sbd =
            parseFloat(account.get('reward_sbd_balance').split(' ')[0]) > 0
                ? account.get('reward_sbd_balance')
                : null;
        const reward_sp =
            parseFloat(account.get('reward_vesting_steem').split(' ')[0]) > 0
                ? account.get('reward_vesting_steem').replace('STEEM', 'SP')
                : null;
Tim Fesenko's avatar
Tim Fesenko committed
499 500

        let rewards = [];
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
501 502 503
        if (reward_steem) rewards.push(reward_steem);
        if (reward_sbd) rewards.push(reward_sbd);
        if (reward_sp) rewards.push(reward_sp);
Tim Fesenko's avatar
Tim Fesenko committed
504 505

        let rewards_str;
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
506 507 508 509 510 511 512 513 514 515
        switch (rewards.length) {
            case 3:
                rewards_str = `${rewards[0]}, ${rewards[1]} and ${rewards[2]}`;
                break;
            case 2:
                rewards_str = `${rewards[0]} and ${rewards[1]}`;
                break;
            case 1:
                rewards_str = `${rewards[0]}`;
                break;
Tim Fesenko's avatar
Tim Fesenko committed
516 517 518
        }

        let claimbox;
Roger Jungemann's avatar
Roger Jungemann committed
519
        if (currentUser && rewards_str && isMyAccount) {
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
520 521
            claimbox = (
                <div className="row">
Tim Fesenko's avatar
Tim Fesenko committed
522 523
                    <div className="columns small-12">
                        <div className="UserWallet__claimbox">
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
524 525 526 527 528 529 530 531 532 533 534 535
                            <span className="UserWallet__claimbox-text">
                                Your current rewards: {rewards_str}
                            </span>
                            <button
                                disabled={this.state.claimInProgress}
                                className="button"
                                onClick={e => {
                                    this.handleClaimRewards(account);
                                }}
                            >
                                {tt('userwallet_jsx.redeem_rewards')}
                            </button>
Tim Fesenko's avatar
Tim Fesenko committed
536 537 538
                        </div>
                    </div>
                </div>
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
539
            );
Tim Fesenko's avatar
Tim Fesenko committed
540 541
        }

roadscape's avatar
roadscape committed
542 543 544 545 546
        let spApr;
        try {
            // TODO: occasionally fails. grops not loaded yet?
            spApr = this.getCurrentApr(gprops);
        } catch (e) {}
547

Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
548 549 550 551 552
        return (
            <div className="UserWallet">
                {claimbox}
                <div className="row">
                    <div className="columns small-10 medium-12 medium-expand">
Roger Jungemann's avatar
Roger Jungemann committed
553 554 555 556
                        <WalletSubMenu
                            accountname={account.get('name')}
                            isMyAccount={isMyAccount}
                        />
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
557 558 559 560 561 562 563 564 565 566 567 568 569 570 571
                    </div>
                    {
                        <div className="columns shrink">
                            {isMyAccount && (
                                <button
                                    className="UserWallet__buysp button hollow"
                                    onClick={onShowDepositSteem}
                                >
                                    {tt(
                                        'userwallet_jsx.buy_steem_or_steem_power'
                                    )}
                                </button>
                            )}
                        </div>
                    }
James Calfee's avatar
James Calfee committed
572
                </div>
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
573 574 575 576 577 578 579 580 581 582 583
                <div className="UserWallet__balance row">
                    <div className="column small-12 medium-8">
                        STEEM
                        <FormattedHTMLMessage
                            className="secondary"
                            id="tips_js.liquid_token"
                            params={{ LIQUID_TOKEN, VESTING_TOKEN }}
                        />
                    </div>
                    <div className="column small-12 medium-4">
                        {isMyAccount ? (
584
                            <DropdownMenu
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
585
                                className="Wallet_dropdown"
586 587 588
                                items={steem_menu}
                                el="li"
                                selected={steem_balance_str + ' STEEM'}
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
589 590 591 592 593 594 595 596 597 598 599 600 601 602 603 604 605 606 607
                            />
                        ) : (
                            steem_balance_str + ' STEEM'
                        )}
                        {steemOrders ? (
                            <div
                                style={{
                                    paddingRight: isMyAccount
                                        ? '0.85rem'
                                        : null,
                                }}
                            >
                                <Link to="/market">
                                    <Tooltip t={tt('market_jsx.open_orders')}>
                                        (+{steem_orders_balance_str} STEEM)
                                    </Tooltip>
                                </Link>
                            </div>
                        ) : null}
608
                    </div>
James Calfee's avatar
James Calfee committed
609
                </div>
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
610 611 612 613 614 615 616 617 618 619
                <div className="UserWallet__balance row zebra">
                    <div className="column small-12 medium-8">
                        STEEM POWER
                        <FormattedHTMLMessage
                            className="secondary"
                            id="tips_js.influence_token"
                        />
                        {delegated_steem != 0 ? (
                            <span className="secondary">
                                {tt(
620 621
                                    'tips_js.part_of_your_steem_power_is_currently_delegated',
                                    { user_name: account.get('name') }
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
622 623 624
                                )}
                            </span>
                        ) : null}
roadscape's avatar
roadscape committed
625 626 627 628 629 630 631
                        {spApr && (
                            <FormattedHTMLMessage
                                className="secondary"
                                id="tips_js.steem_power_apr"
                                params={{ value: spApr.toFixed(2) }}
                            />
                        )}{' '}
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
632 633 634
                    </div>
                    <div className="column small-12 medium-4">
                        {isMyAccount ? (
635
                            <DropdownMenu
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
636
                                className="Wallet_dropdown"
637 638 639
                                items={power_menu}
                                el="li"
                                selected={power_balance_str + ' STEEM'}
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
640 641 642 643 644 645 646 647 648 649 650 651
                            />
                        ) : (
                            power_balance_str + ' STEEM'
                        )}
                        {delegated_steem != 0 ? (
                            <div
                                style={{
                                    paddingRight: isMyAccount
                                        ? '0.85rem'
                                        : null,
                                }}
                            >
652
                                <Tooltip t="STEEM POWER delegated to/from this account">
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
653 654 655 656 657
                                    ({received_power_balance_str} STEEM)
                                </Tooltip>
                            </div>
                        ) : null}
                    </div>
James Calfee's avatar
James Calfee committed
658
                </div>
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
659 660 661 662 663 664 665
                <div className="UserWallet__balance row">
                    <div className="column small-12 medium-8">
                        STEEM DOLLARS
                        <div className="secondary">{sbdMessage}</div>
                    </div>
                    <div className="column small-12 medium-4">
                        {isMyAccount ? (
666
                            <DropdownMenu
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
667
                                className="Wallet_dropdown"
668 669
                                items={dollar_menu}
                                el="li"
670
                                selected={sbd_balance_str}
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
671 672 673 674 675 676 677 678 679 680 681 682 683 684 685 686 687 688 689 690 691
                            />
                        ) : (
                            sbd_balance_str
                        )}
                        {sbdOrders ? (
                            <div
                                style={{
                                    paddingRight: isMyAccount
                                        ? '0.85rem'
                                        : null,
                                }}
                            >
                                <Link to="/market">
                                    <Tooltip t={tt('market_jsx.open_orders')}>
                                        (+{sbd_orders_balance_str})
                                    </Tooltip>
                                </Link>
                            </div>
                        ) : null}
                        {conversions}
                    </div>
James Calfee's avatar
James Calfee committed
692
                </div>
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
693 694 695 696 697 698 699 700 701 702 703 704 705
                <div className="UserWallet__balance row zebra">
                    <div className="column small-12 medium-8">
                        {tt('userwallet_jsx.savings')}
                        <div className="secondary">
                            <span>
                                {tt(
                                    'transfer_jsx.balance_subject_to_3_day_withdraw_waiting_period'
                                )}
                            </span>
                        </div>
                    </div>
                    <div className="column small-12 medium-4">
                        {isMyAccount ? (
706
                            <DropdownMenu
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
707
                                className="Wallet_dropdown"
708 709 710
                                items={savings_menu}
                                el="li"
                                selected={savings_balance_str}
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
711 712 713 714 715 716
                            />
                        ) : (
                            savings_balance_str
                        )}
                        <br />
                        {isMyAccount ? (
717
                            <DropdownMenu
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
718
                                className="Wallet_dropdown"
719 720 721
                                items={savings_sbd_menu}
                                el="li"
                                selected={savings_sbd_balance_str}
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
722 723 724 725 726
                            />
                        ) : (
                            savings_sbd_balance_str
                        )}
                    </div>
James Calfee's avatar
James Calfee committed
727
                </div>
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
728 729 730 731 732 733 734 735 736 737
                <div className="UserWallet__balance row">
                    <div className="column small-12 medium-8">
                        {tt('userwallet_jsx.estimated_account_value')}
                        <div className="secondary">
                            {tt('tips_js.estimated_value', { LIQUID_TOKEN })}
                        </div>
                    </div>
                    <div className="column small-12 medium-4">
                        {estimate_output}
                    </div>
James Calfee's avatar
James Calfee committed
738
                </div>
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
739 740
                <div className="UserWallet__balance row">
                    <div className="column small-12">
Seungwon Eugene Jeong's avatar
Seungwon Eugene Jeong committed
741
                        {powerdown_steem != 0 && (
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
742 743 744
                            <span>
                                {tt(
                                    'userwallet_jsx.next_power_down_is_scheduled_to_happen'
745
                                )}{' '}
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
746 747 748 749
                                <TimeAgoWrapper
                                    date={account.get(
                                        'next_vesting_withdrawal'
                                    )}
Seungwon Eugene Jeong's avatar
Seungwon Eugene Jeong committed
750 751
                                />{' '}
                                {'(~' + powerdown_balance_str + ' STEEM)'}.
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
752 753
                            </span>
                        )}
James Calfee's avatar
James Calfee committed
754 755
                    </div>
                </div>
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
756 757 758 759 760 761 762 763 764 765 766 767 768 769 770
                {disabledWarning && (
                    <div className="row">
                        <div className="column small-12">
                            <div className="callout warning">
                                {tt(
                                    'userwallet_jsx.transfers_are_temporary_disabled'
                                )}
                            </div>
                        </div>
                    </div>
                )}
                <div className="row">
                    <div className="column small-12">
                        <hr />
                    </div>
James Calfee's avatar
James Calfee committed
771
                </div>
James Calfee's avatar
James Calfee committed
772

Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
773 774 775 776 777 778 779 780 781 782 783 784
                {isMyAccount && <SavingsWithdrawHistory />}

                <div className="row">
                    <div className="column small-12">
                        {/** history */}
                        <h4>{tt('userwallet_jsx.history')}</h4>
                        <div className="secondary">
                            <span>
                                {tt(
                                    'transfer_jsx.beware_of_spam_and_phishing_links'
                                )}
                            </span>
785 786 787 788 789 790
                            &nbsp;
                            <span>
                                {tt(
                                    'transfer_jsx.transactions_make_take_a_few_minutes'
                                )}
                            </span>
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
791 792 793 794
                        </div>
                        <table>
                            <tbody>{transfer_log}</tbody>
                        </table>
795
                    </div>
James Calfee's avatar
James Calfee committed
796 797
                </div>
            </div>
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
798
        );
James Calfee's avatar
James Calfee committed
799 800 801 802 803 804
    }
}

export default connect(
    // mapStateToProps
    (state, ownProps) => {
805
        const price_per_steem = pricePerSteem(state);
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
806
        const savings_withdraws = state.user.get('savings_withdraws');
807
        const gprops = state.global.get('props');
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
808
        const sbd_interest = gprops.get('sbd_interest_rate');
James Calfee's avatar
James Calfee committed
809 810
        return {
            ...ownProps,
811
            open_orders: state.market.get('open_orders'),
James Calfee's avatar
James Calfee committed
812 813
            price_per_steem,
            savings_withdraws,
814
            sbd_interest,
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
815 816
            gprops,
        };
James Calfee's avatar
James Calfee committed
817 818 819
    },
    // mapDispatchToProps
    dispatch => ({
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
820 821
        claimRewards: account => {
            const username = account.get('name');
Tim Fesenko's avatar
Tim Fesenko committed
822
            const successCallback = () => {
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
823 824 825
                dispatch(
                    globalActions.getState({ url: `@${username}/transfers` })
                );
Mike's avatar
Mike committed
826
            };
Tim Fesenko's avatar
Tim Fesenko committed
827 828 829 830 831

            const operation = {
                account: username,
                reward_steem: account.get('reward_steem_balance'),
                reward_sbd: account.get('reward_sbd_balance'),
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
832
                reward_vests: account.get('reward_vesting_balance'),
Mike's avatar
Mike committed
833
            };
Tim Fesenko's avatar
Tim Fesenko committed
834

Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
835 836 837 838 839 840 841
            dispatch(
                transactionActions.broadcastOperation({
                    type: 'claim_reward_balance',
                    operation,
                    successCallback,
                })
            );
Tim Fesenko's avatar
Tim Fesenko committed
842
        },
843 844
        convertToSteem: e => {
            //post 2018-01-31 if no calls to this function exist may be safe to remove. Investigate use of ConvertToSteem.jsx
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
845
            e.preventDefault();
Mike's avatar
Mike committed
846
            const name = 'convertToSteem';
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
847
            dispatch(globalActions.showDialog({ name }));
James Calfee's avatar
James Calfee committed
848 849
        },
    })
Benjamin Chodoroff's avatar
Benjamin Chodoroff committed
850
)(UserWallet);