Better status messages

This commit is contained in:
Gregory Schier 2017-06-12 10:33:29 -07:00
parent 441a9afd68
commit 5597d331ed
2 changed files with 57 additions and 11 deletions

View File

@ -184,6 +184,49 @@ export function getContentTypeFromHeaders (headers) {
return header ? header.value : null;
}
export const RESPONSE_CODE_REASONS = {
100: 'Continue',
101: 'Switching Protocols',
200: 'OK',
201: 'Created',
202: 'Accepted',
203: 'Non-Authoritative Information',
204: 'No Content',
205: 'Reset Content',
206: 'Partial Content',
300: 'Multiple Choices',
301: 'Moved Permanently',
302: 'Found',
303: 'See Other',
304: 'Not Modified',
305: 'Use Proxy',
307: 'Temporary Redirect',
400: 'Bad Request',
401: 'Unauthorized',
402: 'Payment Required',
403: 'Forbidden',
404: 'Not Found',
405: 'Method Not Allowed',
406: 'Not Acceptable',
407: 'Proxy Authentication Required',
408: 'Request Time-out',
409: 'Conflict',
410: 'Gone',
411: 'Length Required',
412: 'Precondition Failed',
413: 'Request Entity Too Large',
414: 'Request-URI Too Large',
415: 'Unsupported Media Type',
416: 'Requested range not satisfiable',
417: 'Expectation Failed',
500: 'Internal Server Error',
501: 'Not Implemented',
502: 'Bad Gateway',
503: 'Service Unavailable',
504: 'Gateway Time-out',
505: 'HTTP Version not supported'
};
// Sourced from https://developer.mozilla.org/en-US/docs/Web/HTTP/Status
export const RESPONSE_CODE_DESCRIPTIONS = {

View File

@ -1,43 +1,46 @@
import classnames from 'classnames';
import React, {PropTypes} from 'react';
import {RESPONSE_CODE_DESCRIPTIONS, STATUS_CODE_RENDER_FAILED} from '../../../common/constants';
import {RESPONSE_CODE_DESCRIPTIONS, RESPONSE_CODE_REASONS, STATUS_CODE_RENDER_FAILED} from '../../../common/constants';
const StatusTag = ({statusMessage, statusCode, small}) => {
statusCode = String(statusCode);
let colorClass;
let backupStatusMessage;
let genericStatusMessage;
if (statusCode.startsWith('1')) {
colorClass = 'bg-info';
backupStatusMessage = 'INFORMATIONAL';
genericStatusMessage = 'INFORMATIONAL';
} else if (statusCode.startsWith('2')) {
colorClass = 'bg-success';
backupStatusMessage = 'SUCCESS';
genericStatusMessage = 'SUCCESS';
} else if (statusCode.startsWith('3')) {
colorClass = 'bg-surprise';
backupStatusMessage = 'REDIRECTION';
genericStatusMessage = 'REDIRECTION';
} else if (statusCode.startsWith('4')) {
colorClass = 'bg-warning';
backupStatusMessage = 'CLIENT ERROR';
genericStatusMessage = 'CLIENT ERROR';
} else if (statusCode.startsWith('5')) {
colorClass = 'bg-danger';
backupStatusMessage = 'SERVER ERROR';
genericStatusMessage = 'SERVER ERROR';
} else if (statusCode.startsWith('0')) {
colorClass = 'bg-danger';
backupStatusMessage = 'ERROR';
genericStatusMessage = 'ERROR';
statusCode = ''; // Don't print a 0 status code
} else if (statusCode === STATUS_CODE_RENDER_FAILED.toString()) {
colorClass = 'bg-danger';
backupStatusMessage = 'Uh Oh!\xa0\xa0٩◔̯◔۶';
genericStatusMessage = 'Uh Oh!\xa0\xa0٩◔̯◔۶';
statusCode = ''; // Don't print status code
} else {
colorClass = 'bg-danger';
backupStatusMessage = 'UNKNOWN';
genericStatusMessage = 'UNKNOWN';
}
const description = RESPONSE_CODE_DESCRIPTIONS[statusCode] || 'Unknown Response Code';
const message = typeof statusMessage === 'string' ? statusMessage : backupStatusMessage;
let message = statusMessage;
if (!message) {
message = RESPONSE_CODE_REASONS[statusCode] || genericStatusMessage;
}
return (
<div className={classnames('tag', colorClass, {'tag--small': small})}