diff --git a/js/actions/edition_actions.js b/js/actions/edition_actions.js index 4bdf093a..3f659524 100644 --- a/js/actions/edition_actions.js +++ b/js/actions/edition_actions.js @@ -7,7 +7,8 @@ import EditionFetcher from '../fetchers/edition_fetcher'; class EditionActions { constructor() { this.generateActions( - 'updateEdition' + 'updateEdition', + 'editionFailed' ); } @@ -18,6 +19,7 @@ class EditionActions { }) .catch((err) => { console.logGlobal(err); + this.actions.editionFailed(err.json); }); } } diff --git a/js/components/ascribe_detail/edition_container.js b/js/components/ascribe_detail/edition_container.js index fa24bcbf..030a7150 100644 --- a/js/components/ascribe_detail/edition_container.js +++ b/js/components/ascribe_detail/edition_container.js @@ -1,6 +1,7 @@ 'use strict'; import React from 'react'; +import { History } from 'react-router'; import EditionActions from '../../actions/edition_actions'; import EditionStore from '../../stores/edition_store'; @@ -15,26 +16,23 @@ import AppConstants from '../../constants/application_constants'; */ let EditionContainer = React.createClass({ propTypes: { - location: React.PropTypes.object + location: React.PropTypes.object, + params: React.PropTypes.object }, + mixins: [History], + getInitialState() { return EditionStore.getState(); }, - onChange(state) { - this.setState(state); - if (!state.edition.digital_work) { - return; - } - let isEncoding = state.edition.digital_work.isEncoding; - if (state.edition.digital_work.mime === 'video' && typeof isEncoding === 'number' && isEncoding !== 100 && !this.state.timerId) { - let timerId = window.setInterval(() => EditionActions.fetchOne(this.props.params.editionId), 10000); - this.setState({timerId: timerId}); - } - }, - componentDidMount() { + // Every time we're entering the edition detail page, + // just reset the edition that is saved in the edition store + // as it will otherwise display wrong/old data once the user loads + // the edition detail a second time + EditionActions.updateEdition({}); + EditionStore.listen(this.onChange); EditionActions.fetchOne(this.props.params.editionId); }, @@ -48,16 +46,32 @@ let EditionContainer = React.createClass({ } }, + componentDidUpdate() { + const { editionError } = this.state; + + if(editionError && editionError.status === 404) { + // Even though the /404 path doesn't really exist, + // we can still redirect there and the page will show up + this.history.pushState(null, '/404'); + } + }, + componentWillUnmount() { - // Every time we're leaving the edition detail page, - // just reset the edition that is saved in the edition store - // as it will otherwise display wrong/old data once the user loads - // the edition detail a second time - EditionActions.updateEdition({}); window.clearInterval(this.state.timerId); EditionStore.unlisten(this.onChange); }, + onChange(state) { + this.setState(state); + if (!state.edition.digital_work) { + return; + } + let isEncoding = state.edition.digital_work.isEncoding; + if (state.edition.digital_work.mime === 'video' && typeof isEncoding === 'number' && isEncoding !== 100 && !this.state.timerId) { + let timerId = window.setInterval(() => EditionActions.fetchOne(this.props.params.editionId), 10000); + this.setState({timerId: timerId}); + } + }, loadEdition() { EditionActions.fetchOne(this.props.params.editionId); diff --git a/js/stores/edition_store.js b/js/stores/edition_store.js index 14ee4fee..22e78d23 100644 --- a/js/stores/edition_store.js +++ b/js/stores/edition_store.js @@ -7,11 +7,17 @@ import EditionActions from '../actions/edition_actions'; class EditionStore { constructor() { this.edition = {}; + this.editionError = null; this.bindActions(EditionActions); } onUpdateEdition(edition) { this.edition = edition; + this.editionError = null; + } + + onEditionFailed(error) { + this.editionError = error; } } diff --git a/js/utils/requests.js b/js/utils/requests.js index 7e9c9a58..eeaa3513 100644 --- a/js/utils/requests.js +++ b/js/utils/requests.js @@ -40,6 +40,15 @@ class Requests { reject(error); } else if(body && body.detail) { reject(new Error(body.detail)); + } else if(!body.success) { + let error = new Error('Client Request Error'); + error.json = { + status: response.status, + statusText: response.status, + type: response.status, + url: response.url + }; + reject(error); } else { resolve(body); }