include rs information in error
This commit is contained in:
parent
058ce19858
commit
2fc765066e
@ -1,6 +1,5 @@
|
||||
.error-notify {
|
||||
min-width: 250px;
|
||||
margin-left: -125px;
|
||||
width: 420px;
|
||||
border-bottom: 7px solid #7c0002;
|
||||
background-color: rgba(255,0,0,0.8);
|
||||
color: #fff;
|
||||
@ -8,19 +7,19 @@
|
||||
padding: 16px;
|
||||
position: fixed;
|
||||
display: table;
|
||||
z-index: 2;
|
||||
z-index: 999;
|
||||
right: 30px;
|
||||
top: 20px;
|
||||
|
||||
.error-icon {
|
||||
display: table-cell;
|
||||
width: 60px;
|
||||
padding: 10px 10px 0 10px;
|
||||
padding: 8px 10px 0 10px;
|
||||
text-align: center;
|
||||
vertical-align: top;
|
||||
|
||||
> i {
|
||||
font-size: 2em;
|
||||
font-size: 3em;
|
||||
border-radius: 100%;
|
||||
}
|
||||
}
|
||||
@ -33,4 +32,11 @@
|
||||
margin-top: 6px;
|
||||
}
|
||||
}
|
||||
|
||||
.error-dismiss {
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 0px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
@ -1,7 +1,10 @@
|
||||
import _ from 'underscore'
|
||||
|
||||
import React from 'react'
|
||||
import {connect} from 'react-redux'
|
||||
|
||||
import {resetApiError} from './actions'
|
||||
import {infoFromError} from './utils'
|
||||
|
||||
class ErrorsPage extends React.Component {
|
||||
|
||||
@ -15,7 +18,6 @@ class ErrorsPage extends React.Component {
|
||||
}
|
||||
|
||||
let status = null;
|
||||
|
||||
if (this.props.error.response) {
|
||||
status = this.props.error.response.status;
|
||||
}
|
||||
@ -26,6 +28,15 @@ class ErrorsPage extends React.Component {
|
||||
|
||||
let body = null;
|
||||
|
||||
|
||||
// Find affected routeserver
|
||||
const errorInfo = infoFromError(this.props.error);
|
||||
const rsId = errorInfo.routeserver_id;
|
||||
let rs = null;
|
||||
if (rsId !== null) {
|
||||
rs = _.findWhere(this.props.routeservers, { id: rsId });
|
||||
}
|
||||
|
||||
if (status == 429) {
|
||||
body = (
|
||||
<div className="error-message">
|
||||
@ -34,12 +45,21 @@ class ErrorsPage extends React.Component {
|
||||
</div>
|
||||
);
|
||||
} else {
|
||||
let errorStatus = "";
|
||||
if (this.props.error.response) {
|
||||
errorStatus = " (got HTTP " + this.props.error.response.status + ")";
|
||||
}
|
||||
if (errorInfo) {
|
||||
errorStatus = ` (got ${errorInfo.tag})`;
|
||||
}
|
||||
|
||||
body = (
|
||||
<div className="error-message">
|
||||
<p>
|
||||
Alice has trouble connecting to the API
|
||||
{this.props.error.response &&
|
||||
" (got HTTP " + this.props.error.response.status + ")"}
|
||||
Alice has trouble connecting to the API
|
||||
{rs &&
|
||||
<span> of <b>{rs.name}</b></span>}
|
||||
{errorStatus}
|
||||
.
|
||||
</p>
|
||||
<p>If this problem persist, we suggest you try again later.</p>
|
||||
@ -49,6 +69,10 @@ class ErrorsPage extends React.Component {
|
||||
|
||||
return (
|
||||
<div className="error-notify">
|
||||
<div className="error-dismiss">
|
||||
<i className="fa fa-times-circle" aria-hidden="true"
|
||||
onClick={() => this.resetApiError()}></i>
|
||||
</div>
|
||||
<div className="error-icon">
|
||||
<i className="fa fa-times-circle" aria-hidden="true"></i>
|
||||
</div>
|
||||
@ -60,6 +84,7 @@ class ErrorsPage extends React.Component {
|
||||
|
||||
export default connect(
|
||||
(state) => ({
|
||||
error: state.errors.error
|
||||
error: state.errors.error,
|
||||
routeservers: state.routeservers.all,
|
||||
})
|
||||
)(ErrorsPage);
|
||||
|
12
client/components/errors/utils.jsx
Normal file
12
client/components/errors/utils.jsx
Normal file
@ -0,0 +1,12 @@
|
||||
|
||||
/*
|
||||
* Helper: Get info from api error
|
||||
*/
|
||||
|
||||
export const infoFromError = function(error) {
|
||||
if (error.response && error.response.data && error.response.data.code) {
|
||||
return error.response.data;
|
||||
}
|
||||
return null;
|
||||
}
|
||||
|
@ -19,18 +19,9 @@ export const LOAD_ROUTESERVER_PROTOCOL_REQUEST = '@birdseye/LOAD_ROUTESERVER_PRO
|
||||
export const LOAD_ROUTESERVER_PROTOCOL_SUCCESS = '@birdseye/LOAD_ROUTESERVER_PROTOCOL_SUCCESS';
|
||||
export const LOAD_ROUTESERVER_PROTOCOL_ERROR = '@birdseye/LOAD_ROUTESERVER_PROTOCOL_ERROR';
|
||||
|
||||
export const LOAD_ROUTESERVER_ROUTES_REQUEST = '@birdseye/LOAD_ROUTESERVER_ROUTES_REQUEST';
|
||||
export const LOAD_ROUTESERVER_ROUTES_SUCCESS = '@birdseye/LOAD_ROUTESERVER_ROUTES_SUCCESS';
|
||||
export const LOAD_ROUTESERVER_ROUTES_ERROR = '@birdseye/LOAD_ROUTESERVER_ROUTES_ERROR';
|
||||
|
||||
export const LOAD_ROUTESERVER_ROUTES_FILTERED_SUCCESS = '@birdseye/LOAD_ROUTESERVER_ROUTES_FILTERED_SUCCESS';
|
||||
export const LOAD_ROUTESERVER_ROUTES_NOEXPORT_SUCCESS = '@birdseye/LOAD_ROUTESERVER_ROUTES_NOEXPORT_SUCCESS';
|
||||
|
||||
export const SET_PROTOCOLS_FILTER_VALUE = '@birdseye/SET_PROTOCOLS_FILTER_VALUE';
|
||||
export const SET_PROTOCOLS_FILTER = '@birdseye/SET_PROTOCOLS_FILTER';
|
||||
|
||||
export const SET_ROUTES_FILTER_VALUE = '@birdseye/SET_ROUTES_FILTER_VALUE';
|
||||
|
||||
|
||||
// Action Creators
|
||||
export function loadRouteserversRequest() {
|
||||
@ -112,7 +103,7 @@ export function loadRouteserverStatus(routeserverId) {
|
||||
})
|
||||
.catch((error) => {
|
||||
dispatch(apiError(error));
|
||||
dispatch(loadRouteserverStatusError(routeserverId, error.data));
|
||||
dispatch(loadRouteserverStatusError(routeserverId, error));
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -145,74 +136,7 @@ export function loadRouteserverProtocol(routeserverId) {
|
||||
dispatch(setProtocolsFilterValue(""));
|
||||
dispatch(loadRouteserverProtocolSuccess(routeserverId, data.neighbours));
|
||||
})
|
||||
.catch(error => dispatch(apiError(error)));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export function loadRouteserverRoutesRequest(routeserverId, protocolId) {
|
||||
return {
|
||||
type: LOAD_ROUTESERVER_ROUTES_REQUEST,
|
||||
payload: {
|
||||
routeserverId: routeserverId,
|
||||
protocolId: protocolId,
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export function loadRouteserverRoutesSuccess(routeserverId, protocolId, routes) {
|
||||
return {
|
||||
type: LOAD_ROUTESERVER_ROUTES_SUCCESS,
|
||||
payload: {
|
||||
routeserverId: routeserverId,
|
||||
protocolId: protocolId,
|
||||
routes: routes
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export function loadRouteserverRoutes(routeserverId, protocolId) {
|
||||
return (dispatch) => {
|
||||
dispatch(loadRouteserverRoutesRequest(routeserverId, protocolId))
|
||||
|
||||
axios.get(`/api/routeservers/${routeserverId}/neighbours/${protocolId}/routes`)
|
||||
.then(({data}) => {
|
||||
dispatch(
|
||||
loadRouteserverRoutesSuccess(routeserverId, protocolId, data.imported)
|
||||
);
|
||||
dispatch(
|
||||
loadRouteserverRoutesFilteredSuccess(routeserverId, protocolId, data.filtered)
|
||||
);
|
||||
dispatch(
|
||||
loadRouteserverRoutesNoexportSuccess(routeserverId, protocolId, data.not_exported)
|
||||
);
|
||||
dispatch(setRoutesFilterValue(""));
|
||||
})
|
||||
.catch(error => dispatch(apiError(error)));
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
export function loadRouteserverRoutesFilteredSuccess(routeserverId, protocolId, routes) {
|
||||
return {
|
||||
type: LOAD_ROUTESERVER_ROUTES_FILTERED_SUCCESS,
|
||||
payload: {
|
||||
routeserverId: routeserverId,
|
||||
protocolId: protocolId,
|
||||
routes: routes
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export function loadRouteserverRoutesNoexportSuccess(routeserverId, protocolId, routes) {
|
||||
return {
|
||||
type: LOAD_ROUTESERVER_ROUTES_NOEXPORT_SUCCESS,
|
||||
payload: {
|
||||
routeserverId: routeserverId,
|
||||
protocolId: protocolId,
|
||||
routes: routes
|
||||
}
|
||||
.catch((error) => dispatch(apiError(error)));
|
||||
}
|
||||
}
|
||||
|
||||
@ -238,12 +162,3 @@ export function setProtocolsFilter(value) {
|
||||
}
|
||||
|
||||
|
||||
export function setRoutesFilterValue(value) {
|
||||
return {
|
||||
type: SET_ROUTES_FILTER_VALUE,
|
||||
payload: {
|
||||
routesFilterValue: value
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -3,17 +3,13 @@
|
||||
|
||||
import {LOAD_ROUTESERVERS_REQUEST,
|
||||
LOAD_ROUTESERVERS_SUCCESS,
|
||||
|
||||
LOAD_ROUTESERVER_STATUS_SUCCESS,
|
||||
LOAD_ROUTESERVER_STATUS_ERROR,
|
||||
|
||||
LOAD_ROUTESERVER_PROTOCOL_REQUEST,
|
||||
LOAD_ROUTESERVER_PROTOCOL_SUCCESS,
|
||||
|
||||
LOAD_ROUTESERVER_ROUTES_REQUEST,
|
||||
LOAD_ROUTESERVER_ROUTES_SUCCESS,
|
||||
|
||||
LOAD_ROUTESERVER_ROUTES_FILTERED_SUCCESS,
|
||||
LOAD_ROUTESERVER_ROUTES_NOEXPORT_SUCCESS,
|
||||
|
||||
SET_PROTOCOLS_FILTER_VALUE,
|
||||
SET_PROTOCOLS_FILTER,
|
||||
|
||||
@ -26,12 +22,12 @@ import {LOAD_REJECT_REASONS_SUCCESS,
|
||||
|
||||
|
||||
const initialState = {
|
||||
|
||||
all: [],
|
||||
noexport: {},
|
||||
filtered: {},
|
||||
|
||||
errors: {},
|
||||
details: {},
|
||||
protocols: {},
|
||||
routes: {},
|
||||
|
||||
reject_reasons: {},
|
||||
reject_id: 0,
|
||||
@ -44,11 +40,8 @@ const initialState = {
|
||||
protocolsFilterValue: "",
|
||||
protocolsFilter: "",
|
||||
|
||||
routesFilterValue: "",
|
||||
|
||||
isLoading: false,
|
||||
|
||||
routesAreLoading: false,
|
||||
protocolsAreLoading: false
|
||||
};
|
||||
|
||||
@ -66,11 +59,6 @@ export default function reducer(state = initialState, action) {
|
||||
isLoading: false
|
||||
});
|
||||
|
||||
case LOAD_ROUTESERVER_ROUTES_REQUEST:
|
||||
return Object.assign({}, state, {
|
||||
routesAreLoading: true
|
||||
});
|
||||
|
||||
case LOAD_ROUTESERVER_PROTOCOL_REQUEST:
|
||||
return Object.assign({}, state, {
|
||||
protocolsAreLoading: true
|
||||
@ -85,31 +73,6 @@ export default function reducer(state = initialState, action) {
|
||||
protocolsAreLoading: false
|
||||
});
|
||||
|
||||
case LOAD_ROUTESERVER_ROUTES_SUCCESS:
|
||||
var routes = Object.assign({}, state.routes, {
|
||||
[action.payload.protocolId]: action.payload.routes
|
||||
});
|
||||
return Object.assign({}, state, {
|
||||
routes: routes,
|
||||
routesAreLoading: false
|
||||
});
|
||||
|
||||
case LOAD_ROUTESERVER_ROUTES_FILTERED_SUCCESS:
|
||||
var filtered = Object.assign({}, state.filtered, {
|
||||
[action.payload.protocolId]: action.payload.routes
|
||||
});
|
||||
return Object.assign({}, state, {
|
||||
filtered: filtered,
|
||||
});
|
||||
|
||||
case LOAD_ROUTESERVER_ROUTES_NOEXPORT_SUCCESS:
|
||||
var noexport = Object.assign({}, state.noexport, {
|
||||
[action.payload.protocolId]: action.payload.routes
|
||||
});
|
||||
return Object.assign({}, state, {
|
||||
noexport: noexport,
|
||||
});
|
||||
|
||||
case LOAD_NOEXPORT_REASONS_SUCCESS:
|
||||
case LOAD_REJECT_REASONS_SUCCESS:
|
||||
return Object.assign({}, state, action.payload);
|
||||
@ -123,6 +86,11 @@ export default function reducer(state = initialState, action) {
|
||||
details: details
|
||||
});
|
||||
|
||||
case LOAD_ROUTESERVER_STATUS_ERROR:
|
||||
console.log("ROUTESERVER STATUS ERROR:", action);
|
||||
|
||||
return state;
|
||||
|
||||
case SET_PROTOCOLS_FILTER_VALUE:
|
||||
return Object.assign({}, state, {
|
||||
protocolsFilterValue: action.payload.value
|
||||
@ -141,4 +109,3 @@ export default function reducer(state = initialState, action) {
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
Loading…
x
Reference in New Issue
Block a user