pbca26
8 years ago
45 changed files with 40 additions and 1637 deletions
@ -1,61 +0,0 @@ |
|||||
import { LOG_GUI_HTTP } from '../storeType'; |
|
||||
import { triggerToaster } from '../actionCreators'; |
|
||||
import Config from '../../config'; |
|
||||
|
|
||||
export function logGuiHttp(payload) { |
|
||||
return dispatch => { |
|
||||
dispatch(guiLogState(payload)); |
|
||||
|
|
||||
// disabled for now
|
|
||||
/*return fetch(`http://127.0.0.1:${Config.agamaPort}/shepherd/guilog`, {
|
|
||||
method: 'POST', |
|
||||
headers: { |
|
||||
'Content-Type': 'application/json', |
|
||||
}, |
|
||||
body: JSON.stringify(payload), |
|
||||
}) |
|
||||
.catch(function(error) { |
|
||||
console.log(error); |
|
||||
dispatch(triggerToaster('logGuiHttp', 'Error', 'error')); |
|
||||
}) |
|
||||
.then(response => response.json())*/ |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
export function getAgamaLog(type) { |
|
||||
return dispatch => { |
|
||||
return fetch(`http://127.0.0.1:${Config.agamaPort}/shepherd/getlog?type=${type}`, { |
|
||||
method: 'GET', |
|
||||
headers: { |
|
||||
'Content-Type': 'application/json', |
|
||||
}, |
|
||||
}) |
|
||||
.catch(function(error) { |
|
||||
console.log(error); |
|
||||
dispatch( |
|
||||
triggerToaster( |
|
||||
'getAgamaLog', |
|
||||
'Error', |
|
||||
'error' |
|
||||
) |
|
||||
); |
|
||||
}) |
|
||||
.then(response => response.json()) |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
export function guiLogState(logData) { |
|
||||
return { |
|
||||
type: LOG_GUI_HTTP, |
|
||||
timestamp: logData.timestamp, |
|
||||
log: { |
|
||||
timestamp: logData.timestamp, |
|
||||
function: logData.function, |
|
||||
httpMethod: logData.type, |
|
||||
url: logData.url, |
|
||||
payload: logData.payload, |
|
||||
status: logData.status, |
|
||||
response: logData.response, |
|
||||
} |
|
||||
} |
|
||||
} |
|
||||
@ -1,122 +0,0 @@ |
|||||
import React from 'react'; |
|
||||
import { connect } from 'react-redux'; |
|
||||
import { sortByDate } from '../../../util/sort'; |
|
||||
import Config from '../../../config'; |
|
||||
import { |
|
||||
NotificationsByTypeRender, |
|
||||
NotificationsModalRender, |
|
||||
NotificationsRender |
|
||||
} from './notifications.render'; |
|
||||
|
|
||||
class Notifications extends React.Component { |
|
||||
constructor() { |
|
||||
super(); |
|
||||
this.state = { |
|
||||
displayModal: false, |
|
||||
calls: { |
|
||||
total: 0, |
|
||||
error: 0, |
|
||||
success: 0, |
|
||||
pending: 0, |
|
||||
}, |
|
||||
activeTab: 2, |
|
||||
guiLog: null, |
|
||||
debug: Config.debug, |
|
||||
}; |
|
||||
this.toggleNotificationsModal = this.toggleNotificationsModal.bind(this); |
|
||||
} |
|
||||
|
|
||||
openTab(tab) { |
|
||||
this.setState(Object.assign({}, this.state, { |
|
||||
activeTab: tab, |
|
||||
})); |
|
||||
} |
|
||||
|
|
||||
componentWillReceiveProps(props) { |
|
||||
// get total number of calls per type
|
|
||||
if (this.props.Dashboard && |
|
||||
this.props.Dashboard.guiLog) { |
|
||||
const _guiLog = this.props.Dashboard.guiLog; |
|
||||
let _callsLength = { |
|
||||
total: Object.keys(_guiLog).length, |
|
||||
error: 0, |
|
||||
success: 0, |
|
||||
pending: 0, |
|
||||
} |
|
||||
let guiLogToArray = []; |
|
||||
|
|
||||
for (let timestamp in _guiLog) { |
|
||||
guiLogToArray.push(_guiLog[timestamp]); |
|
||||
_callsLength[_guiLog[timestamp].status]++; |
|
||||
} |
|
||||
|
|
||||
this.setState(Object.assign({}, this.state, { |
|
||||
calls: { |
|
||||
total: _callsLength.total, |
|
||||
error: _callsLength.error, |
|
||||
success: _callsLength.success, |
|
||||
pending: _callsLength.pending, |
|
||||
}, |
|
||||
guiLog: guiLogToArray, |
|
||||
})); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
renderNotificationsByType(type) { |
|
||||
// get total number of calls per type
|
|
||||
if (this.state.guiLog && |
|
||||
this.state.guiLog.length) { |
|
||||
let _guiLog = this.state.guiLog; |
|
||||
let items = []; |
|
||||
_guiLog = sortByDate(_guiLog); |
|
||||
|
|
||||
for (let i = 0; i < _guiLog.length; i++) { |
|
||||
if (_guiLog[i].status === type) { |
|
||||
const _logItem = _guiLog[i]; |
|
||||
|
|
||||
items.push( |
|
||||
NotificationsByTypeRender.call( |
|
||||
this, |
|
||||
_logItem, |
|
||||
type, |
|
||||
i |
|
||||
) |
|
||||
); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
return items; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
renderNotificationsModal() { |
|
||||
if (this.state.displayModal) { |
|
||||
return NotificationsModalRender.call(this); |
|
||||
} |
|
||||
|
|
||||
return null; |
|
||||
} |
|
||||
|
|
||||
toggleNotificationsModal() { |
|
||||
this.setState(Object.assign({}, this.state, { |
|
||||
displayModal: !this.state.displayModal, |
|
||||
})); |
|
||||
} |
|
||||
|
|
||||
render() { |
|
||||
return NotificationsRender.call(this); |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
const mapStateToProps = (state) => { |
|
||||
return { |
|
||||
Dashboard: { |
|
||||
guiLog: state.Dashboard.guiLog, |
|
||||
activeHandle: state.Dashboard.activeHandle, |
|
||||
} |
|
||||
}; |
|
||||
|
|
||||
}; |
|
||||
|
|
||||
export default connect(mapStateToProps)(Notifications); |
|
||||
|
|
||||
@ -1,116 +0,0 @@ |
|||||
import React from 'react'; |
|
||||
import { |
|
||||
secondsToString |
|
||||
} from '../../../util/time'; |
|
||||
import { translate } from '../../../translate/translate'; |
|
||||
|
|
||||
export const NotificationsByTypeRender = function(logItem, type, index) { |
|
||||
return ( |
|
||||
<div key={ logItem.timestamp }> |
|
||||
<div>{ index + 1 }.</div> |
|
||||
<div> |
|
||||
<strong>Time:</strong> { secondsToString(logItem.timestamp, true, true) } |
|
||||
</div> |
|
||||
<div> |
|
||||
<strong>GUI Function:</strong> { logItem.function } |
|
||||
</div> |
|
||||
<div> |
|
||||
<strong>HTTP:</strong> { logItem.httpMethod.toUpperCase() } |
|
||||
</div> |
|
||||
<div> |
|
||||
<strong>URL:</strong> { logItem.url } |
|
||||
</div> |
|
||||
<div> |
|
||||
<strong>Payload:</strong> { JSON.stringify(logItem.payload, null, '\t') } |
|
||||
</div> |
|
||||
<div className={ type !== 'pending' ? '' : 'hide' }> |
|
||||
<strong>Response:</strong> { JSON.stringify(logItem.response, null, '\t') } |
|
||||
</div> |
|
||||
<hr /> |
|
||||
</div> |
|
||||
); |
|
||||
} |
|
||||
|
|
||||
export const NotificationsModalRender = function() { |
|
||||
return ( |
|
||||
<div onKeyDown={ (event) => this.handleKeydown(event) }> |
|
||||
<div className="modal show notifications-modal"> |
|
||||
<div className="modal-dialog modal-center modal-lg"> |
|
||||
<div className="modal-content"> |
|
||||
<div className="modal-body modal-body-container"> |
|
||||
<div className="panel nav-tabs-horizontal"> |
|
||||
<ul className="nav nav-tabs nav-tabs-line"> |
|
||||
<li className={ this.state.activeTab === 0 ? 'active' : 'pointer' }> |
|
||||
<a onClick={ () => this.openTab(0) }> |
|
||||
<i className="icon fa fa-thumbs-o-up"></i> Success ({ this.state.calls.success }) |
|
||||
</a> |
|
||||
</li> |
|
||||
<li className={ this.state.activeTab === 1 ? 'active' : 'pointer' }> |
|
||||
<a onClick={ () => this.openTab(1) }> |
|
||||
<i className="icon fa fa-exclamation-triangle"></i> Error ({ this.state.calls.error }) |
|
||||
</a> |
|
||||
</li> |
|
||||
<li className={ this.state.activeTab === 2 ? 'active' : 'pointer' }> |
|
||||
<a onClick={ () => this.openTab(2) }> |
|
||||
<i className="icon fa fa-clock-o"></i> Pending ({ this.state.calls.pending }) |
|
||||
</a> |
|
||||
</li> |
|
||||
</ul> |
|
||||
<div className="panel-body panel-body-container"> |
|
||||
<div className="tab-content"> |
|
||||
<div className={ 'tab-pane' + (this.state.activeTab === 0 ? ' active' : '') }> |
|
||||
{ this.renderNotificationsByType('success') } |
|
||||
</div> |
|
||||
<div className={ 'tab-pane' + (this.state.activeTab === 1 ? ' active' : '') }> |
|
||||
{ this.renderNotificationsByType('error') } |
|
||||
</div> |
|
||||
<div className={ 'tab-pane' + (this.state.activeTab === 2 ? ' active' : '') }> |
|
||||
{ this.renderNotificationsByType('pending') } |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div className="modal-footer"> |
|
||||
<button |
|
||||
type="button" |
|
||||
className="btn btn-default" |
|
||||
onClick={ this.toggleNotificationsModal }> |
|
||||
{ translate('INDEX.CLOSE') } |
|
||||
</button> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
<div className="modal-backdrop show in"></div> |
|
||||
</div> |
|
||||
); |
|
||||
}; |
|
||||
|
|
||||
export const NotificationsRender = function() { |
|
||||
return ( |
|
||||
<div> |
|
||||
<div |
|
||||
className={ 'notifications-badge' + (this.props.Dashboard.activeHandle && this.props.Dashboard.activeHandle.status === 'unlocked' ? ' stick-to-top' : '') } |
|
||||
onClick={ this.state.debug ? this.toggleNotificationsModal : null }> |
|
||||
<span className={ this.state.debug ? 'badge success' : 'hide' }> |
|
||||
{ this.state.calls.success } |
|
||||
</span> |
|
||||
<span className={ this.state.debug ? 'badge error' : 'hide' }> |
|
||||
{ this.state.calls.error } |
|
||||
</span> |
|
||||
<span className={ this.state.debug ? 'badge pending' : 'hide' }> |
|
||||
{ this.state.calls.pending } |
|
||||
</span> |
|
||||
<div className={ 'spinner' + (this.state.calls.pending === 0 ? ' spinner-hide' : '') }> |
|
||||
<div className="rect1"></div> |
|
||||
<div className="rect2"></div> |
|
||||
<div className="rect3"></div> |
|
||||
<div className="rect4"></div> |
|
||||
<div className="rect5"></div> |
|
||||
</div> |
|
||||
</div> |
|
||||
{ this.renderNotificationsModal() } |
|
||||
</div> |
|
||||
); |
|
||||
}; |
|
||||
@ -1,26 +0,0 @@ |
|||||
import { |
|
||||
SERVICE_ERROR |
|
||||
} from '../actions/storeType'; |
|
||||
|
|
||||
export function Errors(state = { |
|
||||
errors: {}, |
|
||||
}, action) { |
|
||||
switch (action.type) { |
|
||||
case SERVICE_ERROR: |
|
||||
let _errors = Object.assign({}, state); |
|
||||
|
|
||||
if (_errors[action.apiMethod]) { |
|
||||
_errors[action.apiMethod]++; |
|
||||
} else { |
|
||||
_errors[action.apiMethod] = 1; |
|
||||
} |
|
||||
|
|
||||
return Object.assign({}, state, { |
|
||||
errors: _errors, |
|
||||
}); |
|
||||
default: |
|
||||
return state; |
|
||||
} |
|
||||
} |
|
||||
|
|
||||
export default Errors; |
|
||||
Loading…
Reference in new issue