cmd/web/js/poloniex.jsx

   1 import Api from './api.js';
   2 import React from 'react';
   3 import {PFBalance, Assets} from './balance.js';
   4
   5 class PoloniexController extends React.Component {
   6   constructor(props) {
   7     super(props);
   8     this.state = {'flag': 'loading', 'periodStart': null, 'variationP': null, 'balance': null, 'balances': null};
   9   }
  10
  11   testCredentials = () => {
  12     Api.Call('MARKET_TEST_CREDENTIALS', {'name': 'poloniex'}, function(err, status, data) {
  13       if (err) {
  14         console.error(err, data);
  15         if (err.code === 'invalid_market_credentials') {
  16           this.setState({'flag': 'invalidCredentials', 'variationP': null, 'balance': null, 'balances': null, 'periodStart': null});
  17         } else if (err.code === 'ip_restricted_api_key') {
  18           this.setState({'flag': 'ipRestricted', 'variationP': null, 'balance': null, 'balances': null, 'periodStart': null});
  19         }
  20         return;
  21       }
  22
  23       this.loadPortfolio();
  24     }.bind(this));
  25   }
  26
  27   loadPortfolio = () => {
  28     Api.Call('MARKET_GET_PORTFOLIO', {'name': 'poloniex'}, function(err, status, data) {
  29       if (err) {
  30         console.error(err, data);
  31         if (err.code === 'not_found') {
  32           this.setState({'flag': 'noReport', 'variationP': null, 'balance': null, 'balances': null, 'periodStart': null});
  33         }
  34         return;
  35       }
  36
  37       this.setState({'flag': 'ok', 'variationP': data.performance.variationP, 'balance': data.value, 'balances': data.balances, 'periodStart': data.periodStart});
  38     }.bind(this));
  39   }
  40
  41   componentDidMount = () => {
  42     this.testCredentials();
  43   }
  44
  45   render = () => {
  46     var displayText = null;
  47     switch (this.state.flag) {
  48       case 'loading':
  49         displayText = 'Loading data from poloniex...';
  50         break;
  51       case 'noReport':
  52         displayText = 'Your account is setup ! Reporting will start next Monday !';
  53         break;
  54       case 'invalidCredentials':
  55       case 'ipRestricted':
  56       case 'emptyCredentials':
  57         displayText = <div>Please provide poloniex credentials in <a href="/account"><u>Account</u></a> page.</div>;
  58         break;
  59       default:
  60         displayText = null;
  61     }
  62     return (
  63       <div>
  64         <PoloniexBalance  balanceCurrency={this.state.valueCurrency}
  65                           variationP={this.state.variationP}
  66                           periodStart={this.state.periodStart}
  67                           balance={this.state.balance}
  68                           balances={this.state.balances}
  69                           displayText={displayText}/>
  70       </div>
  71     );
  72   }
  73 }
  74
  75 class Panel extends React.Component {
  76   render = () => {
  77     if (this.props.component === null) {
  78       return <div></div>;
  79     }
  80
  81     return (
  82       <div className="row">
  83         <div className="box col-12">
  84           <div className="row">
  85             <div className="col-4">{this.props.title}</div>
  86           </div>
  87           <hr/>
  88           {this.props.component}
  89         </div>
  90       </div>);
  91   }
  92 }
  93
  94 class PoloniexBalance extends React.Component {
  95
  96   render = () => {
  97     var balancePanel = null;
  98     var assetsPanel  = null;
  99     var messagePanel = null;
 100
 101     if (this.props.variationP !== null) {
 102       balancePanel =
 103         <div className="row">
 104           <div className="col-12 offset-md-1 col-md-10 align-self-center h-100 balances">
 105             <PFBalance variationP={this.props.variationP} balance={this.props.balance} periodStart={this.props.periodStart}/>
 106           </div>
 107         </div>;
 108
 109       assetsPanel =
 110         <Assets balances={this.props.balances} />;
 111
 112     } else {
 113       messagePanel =
 114         <div className="row">
 115           <div className="col-12 text-center">
 116            <span>{this.props.displayText}</span>
 117           </div>
 118         </div>;
 119     }
 120
 121     return (
 122       <React.Fragment>
 123         <Panel title="Balance" component={balancePanel}/>
 124         <Panel title="Assets"  component={assetsPanel}/>
 125         <Panel title="Balance" component={messagePanel}/>
 126       </React.Fragment>
 127     );
 128   }
 129 }
 130
 131 export default PoloniexController;