1 import Api from './api.js';
2 import React from 'react';
4 class PoloniexConfiguration extends React.Component {
7 this.state = {'apiKey': '', 'apiSecret': '', 'apiRequested': false, 'status': 'loading', 'editMode': false};
10 checkCredentials = () => {
11 Api.Call('MARKET_TEST_CREDENTIALS', {'name': 'poloniex'}, function(err, status, data) {
12 this.setState({'apiRequested': true});
14 console.error(err, data);
15 if (err.code === 'invalid_market_credentials') {
16 this.setState({'status': 'invalidCredentials'});
17 } else if (err.code === 'ip_restricted_api_key') {
18 this.setState({'status': 'ipRestricted'});
19 } else if (err.code === 'market_credentials_not_configured') {
20 this.setState({'status': 'emptyCredentials'});
25 this.setState({'status': 'ok'});
29 handleCredentialsChange = (key, secret) => {
30 this.setState({'apiKey': key, 'apiSecret': secret});
33 handleCredentialsSubmit = () => {
34 this.setState({'status': 'loading', 'editMode': false});
35 Api.Call('UPDATE_MARKET', {'key': this.state.apiKey, 'secret': this.state.apiSecret, 'name': 'poloniex'}, function(err, status, data) {
37 console.error(err, data);
38 if (err.code === 'invalid_market_credentials') {
39 this.setState({'status': 'invalidCredentials'});
40 } else if (err.code === 'ip_restricted_api_key') {
41 this.setState({'status': 'ipRestricted'});
46 this.checkCredentials();
50 componentDidMount = () => {
51 this.checkCredentials();
55 Api.Call('MARKET', {'name': 'poloniex'}, function(err, status, data) {
56 this.setState({'apiRequested': true, 'editMode': true});
58 console.error(err, data);
62 var newStatus = this.state.status;
63 if (!data.key || !data.secret) {
64 newStatus = 'emptyCredentials';
67 this.setState({'apiKey': data.key, 'apiSecret': data.secret, 'status': newStatus});
72 var displayText = null;
73 switch (this.state.status) {
75 displayText = 'Checking Poloniex credentials...';
77 case 'invalidCredentials':
78 displayText = 'Invalid poloniex credentials';
81 displayText = 'Your API key is IP restricted.';
83 case 'emptyCredentials':
84 displayText = 'Please provide poloniex credentials';
87 displayText = 'You are all set !';
90 console.error('unknown status', this.state.status);
93 if (this.state.apiRequested === false) {
98 <PoloniexCredentialsForm onLoadCredentials={this.onLoadCredentials}
99 onCredentialsSubmit={this.handleCredentialsSubmit}
100 onCredentialsChange={this.handleCredentialsChange}
101 apiSecret={this.state.apiSecret}
102 apiKey={this.state.apiKey}
103 status={this.state.status}
104 statusMessage={displayText}
105 editMode={this.state.editMode}
106 onEditClick={this.onEditClick}/>
112 class PoloniexCredentialsForm extends React.Component {
113 handleSubmit = (e) => {
114 this.props.onCredentialsSubmit();
118 handleApiKeyChange = (event) => {
119 this.props.onCredentialsChange(event.target.value, this.props.apiSecret);
122 handleApiSecretChange = (event) => {
123 this.props.onCredentialsChange(this.props.apiKey, event.target.value);
127 var submitType = this.props.editMode === true ? 'submit' : 'hidden';
128 var buttonDisplay = this.props.editMode === true ? 'none' : 'inline';
129 var secretDisplayed = this.props.editMode === true ? this.props.apiSecret : 'XXXXXXX';
130 var keyDisplayed = this.props.editMode === true ? this.props.apiKey : 'XXXXXXX';
132 var iconName = 'icon-cancel-circled';
133 switch (this.props.status) {
135 iconName = 'icon-hourglass-2';
138 iconName = 'icon-ok-circled';
143 <div className="row api-credentials-form">
144 <div className="offset-2 col-8 box">
145 <span className="text-center">Poloniex credentials</span>
147 <div className="row config-status">
148 <div className="col-12">
149 <span><i className={iconName}></i>{this.props.statusMessage}</span>
152 <div className="row">
153 <div className="col-12">
154 <form role="form" onSubmit={this.handleSubmit}>
155 <label className="w-100">Key:
156 <input className="form-control" type="text" placeholder="key" value={keyDisplayed} onChange={this.handleApiKeyChange} disabled={!this.props.editMode}/>
158 <label className="w-100">Secret:
159 <input className="form-control" type="text" placeholder="secret" value={secretDisplayed} onChange={this.handleApiSecretChange} disabled={!this.props.editMode}/>
161 <input className="form-control submit" type={submitType} value="Save" />
162 <button className="form-control submit" style={{display: buttonDisplay}} onSubmit={null} onClick={this.props.onEditClick} type="button">Show/Edit</button>
172 export default PoloniexConfiguration;