From ae11dbdc97b9eefc7a74f74995544c1ca59b54f9 Mon Sep 17 00:00:00 2001 From: SleepWalker Date: Fri, 29 Jul 2016 22:29:27 +0300 Subject: [PATCH] #149: show bsod for 500 errors --- src/components/ui/bsod/dispatchBsod.js | 23 +++++++++++++++++++++++ src/components/ui/bsod/factory.js | 18 ++++++++++++++++++ src/index.js | 6 +++--- src/pages/root/RootPage.jsx | 7 ------- src/polyfills.js | 3 +++ src/services/request.js | 6 +++--- 6 files changed, 50 insertions(+), 13 deletions(-) create mode 100644 src/components/ui/bsod/dispatchBsod.js create mode 100644 src/components/ui/bsod/factory.js diff --git a/src/components/ui/bsod/dispatchBsod.js b/src/components/ui/bsod/dispatchBsod.js new file mode 100644 index 0000000..0954035 --- /dev/null +++ b/src/components/ui/bsod/dispatchBsod.js @@ -0,0 +1,23 @@ +import React from 'react'; +import ReactDOM from 'react-dom'; + +import { bsod } from './actions'; +import BSoD from 'components/ui/bsod/BSoD'; + +let injectedStore; +let onBsod; + +export default function dispatchBsod(store = injectedStore) { + store.dispatch(bsod()); + onBsod && onBsod(); + + ReactDOM.render( + , + document.getElementById('app') + ); +} + +export function inject(store, stopLoading) { + injectedStore = store; + onBsod = stopLoading; +} diff --git a/src/components/ui/bsod/factory.js b/src/components/ui/bsod/factory.js new file mode 100644 index 0000000..df0955e --- /dev/null +++ b/src/components/ui/bsod/factory.js @@ -0,0 +1,18 @@ +import request from 'services/request'; + +import dispatchBsod, { inject } from './dispatchBsod'; + +export default function factory(store, stopLoading) { + inject(store, stopLoading); + + // do bsod for 500 errors + request.addMiddleware({ + catch(resp) { + if (resp && resp.originalResponse.status === 500) { + dispatchBsod(); + } + + return Promise.reject(resp); + } + }); +} diff --git a/src/index.js b/src/index.js index a7b665f..a6da188 100644 --- a/src/index.js +++ b/src/index.js @@ -10,14 +10,14 @@ import { factory as userFactory } from 'components/user/factory'; import { IntlProvider } from 'components/i18n'; import routesFactory from 'routes'; import storeFactory from 'storeFactory'; +import bsodFactory from 'components/ui/bsod/factory'; const store = storeFactory(); +bsodFactory(store, stopLoading); + userFactory(store) .then(() => { - // allow :active styles in mobile Safary - document.addEventListener('touchstart', () => {}, true); - ReactDOM.render( diff --git a/src/pages/root/RootPage.jsx b/src/pages/root/RootPage.jsx index bf56467..afef0f4 100644 --- a/src/pages/root/RootPage.jsx +++ b/src/pages/root/RootPage.jsx @@ -6,7 +6,6 @@ import classNames from 'classnames'; import Userbar from 'components/userbar/Userbar'; import PopupStack from 'components/ui/popup/PopupStack'; -import BSoD from 'components/ui/bsod/BSoD'; import styles from './root.scss'; @@ -23,10 +22,6 @@ if (process.env.NODE_ENV === 'production') { function RootPage(props) { const isRegisterPage = props.location.pathname === '/register'; - if (props.bsod) { - return ; - } - return (
({ - bsod: state.bsod, user: state.user, isPopupActive: state.popup.popups.length > 0 }), { diff --git a/src/polyfills.js b/src/polyfills.js index e4d74c1..1e0d2a6 100644 --- a/src/polyfills.js +++ b/src/polyfills.js @@ -1,2 +1,5 @@ import 'babel-polyfill'; import 'promise.prototype.finally'; + +// allow :active styles in mobile Safary +document.addEventListener('touchstart', () => {}, true); diff --git a/src/services/request.js b/src/services/request.js index d261814..944b64d 100644 --- a/src/services/request.js +++ b/src/services/request.js @@ -54,7 +54,7 @@ export default { * return a Promise that resolves to the new response. */ addMiddleware(middleware) { - if (!middlewares.find((mdware) => mdware === middleware)) { + if (!middlewares.some((mdware) => mdware === middleware)) { middlewares.push(middleware); } } @@ -62,7 +62,7 @@ export default { const checkStatus = (resp) => Promise[resp.status >= 200 && resp.status < 300 ? 'resolve' : 'reject'](resp); -const toJSON = (resp) => resp.json(); +const toJSON = (resp) => resp.json().then((json) => ({...json, originalResponse: resp})); const rejectWithJSON = (resp) => toJSON(resp).then((resp) => {throw resp;}); const handleResponseSuccess = (resp) => Promise[resp.success || typeof resp.success === 'undefined' ? 'resolve' : 'reject'](resp); @@ -94,7 +94,7 @@ function runMiddlewares(action, data, restart) { return middlewares .filter((middleware) => middleware[action]) .reduce( - (promise, middleware) => promise.then((resp) => middleware[action](resp, restart)), + (promise, middleware) => promise[/^catch|then$/.test(action) ? action : 'then']((resp) => middleware[action](resp, restart)), Promise[action === 'catch' ? 'reject' : 'resolve'](data) ); }