mirror of
https://github.com/ascribe/onion.git
synced 2025-01-03 18:35:09 +01:00
Remove route from context and use setRouteLeaveHooks in top level route components
This commit is contained in:
parent
71dbad2a18
commit
0f57137c52
@ -86,20 +86,7 @@ export function ProxyHandler(...redirectFunctions) {
|
|||||||
isLoggedIn: bool.isRequired,
|
isLoggedIn: bool.isRequired,
|
||||||
location: locationShape.isRequired,
|
location: locationShape.isRequired,
|
||||||
router: routerShape.isRequired,
|
router: routerShape.isRequired,
|
||||||
whitelabel: whitelabelShape.isRequired,
|
whitelabel: whitelabelShape.isRequired
|
||||||
|
|
||||||
// Provided from router
|
|
||||||
route: object
|
|
||||||
},
|
|
||||||
|
|
||||||
childContextTypes: {
|
|
||||||
route: object
|
|
||||||
},
|
|
||||||
|
|
||||||
getChildContext() {
|
|
||||||
return {
|
|
||||||
route: this.props.route
|
|
||||||
};
|
|
||||||
},
|
},
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
|
@ -19,21 +19,15 @@ const SlidesContainer = React.createClass({
|
|||||||
pending: string,
|
pending: string,
|
||||||
complete: string
|
complete: string
|
||||||
}),
|
}),
|
||||||
pageExitWarning: string,
|
|
||||||
|
|
||||||
// Injected through HOCs
|
// Injected through HOCs
|
||||||
location: locationShape.isRequired, // eslint-disable-line react/sort-prop-types
|
location: locationShape.isRequired, // eslint-disable-line react/sort-prop-types
|
||||||
router: routerShape.isRequired // eslint-disable-line react/sort-prop-types
|
router: routerShape.isRequired // eslint-disable-line react/sort-prop-types
|
||||||
},
|
},
|
||||||
|
|
||||||
contextTypes: {
|
|
||||||
route: object.isRequired
|
|
||||||
},
|
|
||||||
|
|
||||||
getInitialState() {
|
getInitialState() {
|
||||||
return {
|
return {
|
||||||
containerWidth: 0,
|
containerWidth: 0
|
||||||
pageExitWarning: null
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
@ -45,19 +39,12 @@ const SlidesContainer = React.createClass({
|
|||||||
// Initially, we need to dispatch 'resize' once to render correctly
|
// Initially, we need to dispatch 'resize' once to render correctly
|
||||||
window.dispatchEvent(new Event('resize'));
|
window.dispatchEvent(new Event('resize'));
|
||||||
|
|
||||||
// Since react-router 2.0.0, we need to define the `routerWillLeave`
|
|
||||||
// method ourselves.
|
|
||||||
this.props.router.setRouteLeaveHook(this.context.route, this.routerWillLeave);
|
|
||||||
},
|
},
|
||||||
|
|
||||||
componentWillUnmount() {
|
componentWillUnmount() {
|
||||||
window.removeEventListener('resize', this.handleContainerResize);
|
window.removeEventListener('resize', this.handleContainerResize);
|
||||||
},
|
},
|
||||||
|
|
||||||
routerWillLeave() {
|
|
||||||
return this.props.pageExitWarning;
|
|
||||||
},
|
|
||||||
|
|
||||||
handleContainerResize() {
|
handleContainerResize() {
|
||||||
this.setState({
|
this.setState({
|
||||||
// +30 to get rid of the padding of the container which is 15px + 15px left and right
|
// +30 to get rid of the padding of the container which is 15px + 15px left and right
|
||||||
|
@ -39,6 +39,9 @@ const IkonotvRegisterPiece = React.createClass({
|
|||||||
location: locationShape.isRequired, // eslint-disable-line react/sort-prop-types
|
location: locationShape.isRequired, // eslint-disable-line react/sort-prop-types
|
||||||
router: routerShape.isRequired, // eslint-disable-line react/sort-prop-types
|
router: routerShape.isRequired, // eslint-disable-line react/sort-prop-types
|
||||||
whitelabel: whitelabelShape.isRequired, // eslint-disable-line react/sort-prop-types
|
whitelabel: whitelabelShape.isRequired, // eslint-disable-line react/sort-prop-types
|
||||||
|
|
||||||
|
// Provided from router
|
||||||
|
route: React.PropTypes.object.isRequired // eslint-disable-line react/sort-prop-types
|
||||||
},
|
},
|
||||||
|
|
||||||
getInitialState() {
|
getInitialState() {
|
||||||
@ -47,17 +50,17 @@ const IkonotvRegisterPiece = React.createClass({
|
|||||||
PieceStore.getInitialState(),
|
PieceStore.getInitialState(),
|
||||||
{
|
{
|
||||||
step: 0,
|
step: 0,
|
||||||
pageExitWarning: getLangText("If you leave this form now, your work will not be loaned to Ikono TV.")
|
pageExitWarning: getLangText('If you leave this form now, your work will not be loaned to Ikono TV.')
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
|
||||||
componentDidMount() {
|
componentDidMount() {
|
||||||
|
const { location: { query }, route, router } = this.props;
|
||||||
|
|
||||||
PieceListStore.listen(this.onChange);
|
PieceListStore.listen(this.onChange);
|
||||||
PieceStore.listen(this.onChange);
|
PieceStore.listen(this.onChange);
|
||||||
|
|
||||||
const queryParams = this.props.location.query;
|
|
||||||
|
|
||||||
// Since every step of this register process is atomic,
|
// Since every step of this register process is atomic,
|
||||||
// we may need to enter the process at step 1 or 2.
|
// we may need to enter the process at step 1 or 2.
|
||||||
// If this is the case, we'll need the piece number to complete submission.
|
// If this is the case, we'll need the piece number to complete submission.
|
||||||
@ -65,9 +68,12 @@ const IkonotvRegisterPiece = React.createClass({
|
|||||||
//
|
//
|
||||||
// We're using 'in' here as we want to know if 'piece_id' is present in the url,
|
// We're using 'in' here as we want to know if 'piece_id' is present in the url,
|
||||||
// we don't care about the value.
|
// we don't care about the value.
|
||||||
if ('piece_id' in queryParams) {
|
if ('piece_id' in query) {
|
||||||
PieceActions.fetchPiece(queryParams.piece_id);
|
PieceActions.fetchPiece(query.piece_id);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Warn the user if they try to leave before completing registration
|
||||||
|
router.setRouteLeaveHook(route, () => this.state.pageExitWarning);
|
||||||
},
|
},
|
||||||
|
|
||||||
componentWillUnmount() {
|
componentWillUnmount() {
|
||||||
|
Loading…
Reference in New Issue
Block a user