From 0f57137c52b8b3f9b7b15dceceaf6282d2bf61ca Mon Sep 17 00:00:00 2001
From: Brett Sun <brett@ascribe.io>
Date: Wed, 8 Jun 2016 15:10:58 +0200
Subject: [PATCH] Remove route from context and use setRouteLeaveHooks in top
 level route components

---
 js/components/ascribe_routes/proxy_handler.js    | 15 +--------------
 .../ascribe_slides_container/slides_container.js | 15 +--------------
 .../components/ikonotv/ikonotv_register_piece.js | 16 +++++++++++-----
 3 files changed, 13 insertions(+), 33 deletions(-)

diff --git a/js/components/ascribe_routes/proxy_handler.js b/js/components/ascribe_routes/proxy_handler.js
index 92556863..e8d9bf6d 100644
--- a/js/components/ascribe_routes/proxy_handler.js
+++ b/js/components/ascribe_routes/proxy_handler.js
@@ -86,20 +86,7 @@ export function ProxyHandler(...redirectFunctions) {
                 isLoggedIn: bool.isRequired,
                 location: locationShape.isRequired,
                 router: routerShape.isRequired,
-                whitelabel: whitelabelShape.isRequired,
-
-                // Provided from router
-                route: object
-            },
-
-            childContextTypes: {
-                route: object
-            },
-
-            getChildContext() {
-                return {
-                    route: this.props.route
-                };
+                whitelabel: whitelabelShape.isRequired
             },
 
             componentDidMount() {
diff --git a/js/components/ascribe_slides_container/slides_container.js b/js/components/ascribe_slides_container/slides_container.js
index c3c0d819..7a47fcfd 100644
--- a/js/components/ascribe_slides_container/slides_container.js
+++ b/js/components/ascribe_slides_container/slides_container.js
@@ -19,21 +19,15 @@ const SlidesContainer = React.createClass({
             pending: string,
             complete: string
         }),
-        pageExitWarning: string,
 
         // Injected through HOCs
         location: locationShape.isRequired, // eslint-disable-line react/sort-prop-types
         router: routerShape.isRequired // eslint-disable-line react/sort-prop-types
     },
 
-    contextTypes: {
-        route: object.isRequired
-    },
-
     getInitialState() {
         return {
-            containerWidth: 0,
-            pageExitWarning: null
+            containerWidth: 0
         };
     },
 
@@ -45,19 +39,12 @@ const SlidesContainer = React.createClass({
         // Initially, we need to dispatch 'resize' once to render correctly
         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() {
         window.removeEventListener('resize', this.handleContainerResize);
     },
 
-    routerWillLeave() {
-        return this.props.pageExitWarning;
-    },
-
     handleContainerResize() {
         this.setState({
             // +30 to get rid of the padding of the container which is 15px + 15px left and right
diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js
index b9b21454..5bf80658 100644
--- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js
+++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js
@@ -39,6 +39,9 @@ const IkonotvRegisterPiece = React.createClass({
         location: locationShape.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
+
+        // Provided from router
+        route: React.PropTypes.object.isRequired // eslint-disable-line react/sort-prop-types
     },
 
     getInitialState() {
@@ -47,17 +50,17 @@ const IkonotvRegisterPiece = React.createClass({
             PieceStore.getInitialState(),
             {
                 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() {
+        const { location: { query }, route, router } = this.props;
+
         PieceListStore.listen(this.onChange);
         PieceStore.listen(this.onChange);
 
-        const queryParams = this.props.location.query;
-
         // Since every step of this register process is atomic,
         // 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.
@@ -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 don't care about the value.
-        if ('piece_id' in queryParams) {
-            PieceActions.fetchPiece(queryParams.piece_id);
+        if ('piece_id' in query) {
+            PieceActions.fetchPiece(query.piece_id);
         }
+
+        // Warn the user if they try to leave before completing registration
+        router.setRouteLeaveHook(route, () => this.state.pageExitWarning);
     },
 
     componentWillUnmount() {