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