From 6b67a8462fafb1a40fcf734a396c451e0e600502 Mon Sep 17 00:00:00 2001 From: Brett Sun Date: Mon, 6 Jun 2016 16:54:38 +0200 Subject: [PATCH] Convert usage of router from context to using withRouter --- .../ascribe_detail/edition_action_panel.js | 12 ++++----- .../ascribe_detail/piece_container.js | 13 +++++----- .../form_send_contract_agreement.js | 11 +++----- js/components/ascribe_routes/proxy_handler.js | 15 ++++++----- .../slides_container.js | 16 ++++++------ js/components/password_reset_container.js | 13 +++++----- js/components/piece_list.js | 25 ++++++++----------- js/components/register_piece.js | 15 +++++------ js/components/signup_container.js | 2 -- .../cyland_detail/cyland_piece_container.js | 15 +++++------ .../cyland/cyland_register_piece.js | 15 +++++------ .../ikonotv/ikonotv_contract_notifications.js | 17 ++++++------- .../ikonotv_detail/ikonotv_piece_container.js | 15 +++++------ .../ikonotv/ikonotv_register_piece.js | 17 ++++++------- .../market/market_register_piece.js | 13 ++++------ js/components/whitelabel/wallet/wallet_app.js | 13 +++------- 16 files changed, 94 insertions(+), 133 deletions(-) diff --git a/js/components/ascribe_detail/edition_action_panel.js b/js/components/ascribe_detail/edition_action_panel.js index d50d89bd..d8832347 100644 --- a/js/components/ascribe_detail/edition_action_panel.js +++ b/js/components/ascribe_detail/edition_action_panel.js @@ -1,6 +1,7 @@ 'use strict'; import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import Row from 'react-bootstrap/lib/Row'; import Col from 'react-bootstrap/lib/Col'; @@ -33,20 +34,17 @@ import { getLangText } from '../../utils/lang_utils'; A component that handles all the actions inside of the edition detail handleSuccess requires a loadEdition action (could be refactored) */ -let EditionActionPanel = React.createClass({ +const EditionActionPanel = React.createClass({ propTypes: { currentUser: React.PropTypes.object.isRequired, edition: React.PropTypes.object.isRequired, + router: React.PropTypes.object.isRequired, whitelabel: React.PropTypes.object.isRequired, actionPanelButtonListType: React.PropTypes.func, handleSuccess: React.PropTypes.func }, - contextTypes: { - router: React.PropTypes.object.isRequired - }, - getDefaultProps() { return { actionPanelButtonListType: AclButtonList @@ -78,7 +76,7 @@ let EditionActionPanel = React.createClass({ const notification = new GlobalNotificationModel(response.notification, 'success'); GlobalNotificationActions.appendGlobalNotification(notification); - this.context.router.push('/collection'); + this.props.router.push('/collection'); }, refreshCollection() { @@ -190,4 +188,4 @@ let EditionActionPanel = React.createClass({ } }); -export default EditionActionPanel; +export default withRouter(EditionActionPanel); diff --git a/js/components/ascribe_detail/piece_container.js b/js/components/ascribe_detail/piece_container.js index a7611f03..9053cdc9 100644 --- a/js/components/ascribe_detail/piece_container.js +++ b/js/components/ascribe_detail/piece_container.js @@ -1,6 +1,7 @@ 'use strict'; import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import Moment from 'moment'; import ReactError from '../../mixins/react_error'; @@ -46,8 +47,10 @@ import { setDocumentTitle } from '../../utils/dom_utils'; /** * This is the component that implements resource/data specific functionality */ -let PieceContainer = React.createClass({ +const PieceContainer = React.createClass({ propTypes: { + router: React.PropTypes.object.isRequired, + furtherDetailsType: React.PropTypes.func, // Provided from AscribeApp @@ -59,10 +62,6 @@ let PieceContainer = React.createClass({ params: React.PropTypes.object }, - contextTypes: { - router: React.PropTypes.object.isRequired - }, - mixins: [ReactError], getDefaultProps() { @@ -167,7 +166,7 @@ let PieceContainer = React.createClass({ const notification = new GlobalNotificationModel(response.notification, 'success'); GlobalNotificationActions.appendGlobalNotification(notification); - this.context.router.push('/collection'); + this.props.router.push('/collection'); }, getCreateEditionsDialog() { @@ -347,4 +346,4 @@ let PieceContainer = React.createClass({ } }); -export default PieceContainer; +export default withRouter(PieceContainer); diff --git a/js/components/ascribe_forms/form_send_contract_agreement.js b/js/components/ascribe_forms/form_send_contract_agreement.js index bb6895f5..47d94abd 100644 --- a/js/components/ascribe_forms/form_send_contract_agreement.js +++ b/js/components/ascribe_forms/form_send_contract_agreement.js @@ -1,6 +1,7 @@ 'use strict'; import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import ContractListActions from '../../actions/contract_list_actions'; import ContractListStore from '../../stores/contract_list_store'; @@ -19,15 +20,11 @@ import { getLangText } from '../../utils/lang_utils'; import { mergeOptions } from '../../utils/general_utils'; -let SendContractAgreementForm = React.createClass({ +const SendContractAgreementForm = React.createClass({ propTypes: { handleSuccess: React.PropTypes.func }, - contextTypes: { - router: React.PropTypes.object - }, - getInitialState() { return mergeOptions( ContractListStore.getState(), @@ -58,7 +55,7 @@ let SendContractAgreementForm = React.createClass({ const notification = new GlobalNotificationModel(getLangText('Contract agreement sent'), 'success', 10000); GlobalNotificationActions.appendGlobalNotification(notification); - this.context.router.push('/collection'); + this.props.router.push('/collection'); }, getFormData() { @@ -152,4 +149,4 @@ let SendContractAgreementForm = React.createClass({ } }); -export default SendContractAgreementForm; +export default withRouter(SendContractAgreementForm); diff --git a/js/components/ascribe_routes/proxy_handler.js b/js/components/ascribe_routes/proxy_handler.js index 92e0e6da..793b1745 100644 --- a/js/components/ascribe_routes/proxy_handler.js +++ b/js/components/ascribe_routes/proxy_handler.js @@ -1,6 +1,7 @@ 'use strict'; import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import UserStore from '../../stores/user_store'; @@ -75,10 +76,12 @@ export function AuthRedirect({ to, when }) { */ export function ProxyHandler(...redirectFunctions) { return (Component) => ( - React.createClass({ + withRouter(React.createClass({ displayName: 'ProxyHandler', propTypes: { + router: React.PropTypes.object.isRequired, + // Provided from AscribeApp, after the routes have been initialized currentUser: React.PropTypes.object, whitelabel: React.PropTypes.object, @@ -88,10 +91,6 @@ export function ProxyHandler(...redirectFunctions) { route: object }, - contextTypes: { - router: object - }, - childContextTypes: { route: object }, @@ -111,7 +110,7 @@ export function ProxyHandler(...redirectFunctions) { }, evaluateRedirectFunctions(props = this.props) { - const { currentUser, location: { query } } = props; + const { currentUser, location: { query }, router } = props; if (UserStore.hasLoaded() && !UserStore.isLoading()) { for (let i = 0; i < redirectFunctions.length; i++) { @@ -119,7 +118,7 @@ export function ProxyHandler(...redirectFunctions) { // it should return `true` and therefore // stop/avoid the execution of all functions // that follow - if (redirectFunctions[i](this.context.router, currentUser, query)) { + if (redirectFunctions[i](router, currentUser, query)) { break; } } @@ -132,5 +131,5 @@ export function ProxyHandler(...redirectFunctions) { ); } }) - ); + )); } diff --git a/js/components/ascribe_slides_container/slides_container.js b/js/components/ascribe_slides_container/slides_container.js index f322b309..a6aad32d 100644 --- a/js/components/ascribe_slides_container/slides_container.js +++ b/js/components/ascribe_slides_container/slides_container.js @@ -1,6 +1,7 @@ 'use strict'; import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import SlidesContainerBreadcrumbs from './slides_container_breadcrumbs'; @@ -9,9 +10,10 @@ const { arrayOf, element, bool, shape, string, object } = React.PropTypes; const SlidesContainer = React.createClass({ propTypes: { - children: arrayOf(element), forwardProcess: bool.isRequired, + router: object.isRequired, + children: arrayOf(element), glyphiconClassNames: shape({ pending: string, complete: string @@ -21,8 +23,7 @@ const SlidesContainer = React.createClass({ }, contextTypes: { - route: object.isRequired, - router: object.isRequired + route: object.isRequired }, getInitialState() { @@ -42,8 +43,7 @@ const SlidesContainer = React.createClass({ // Since react-router 2.0.0, we need to define the `routerWillLeave` // method ourselves. - const { router, route } = this.context; - router.setRouteLeaveHook(route, this.routerWillLeave); + this.props.router.setRouteLeaveHook(this.context.route, this.routerWillLeave); }, componentWillUnmount() { @@ -68,10 +68,10 @@ const SlidesContainer = React.createClass({ }, setSlideNum(nextSlideNum, additionalQueryParams = {}) { - const { location: { pathname, query } } = this.props; + const { location: { pathname, query }, router } = this.props; const slideQuery = Object.assign({}, query, additionalQueryParams, { slide_num: nextSlideNum }); - this.context.router.push({ pathname, query: slideQuery }); + router.push({ pathname, query: slideQuery }); }, // breadcrumbs are defined as attributes of the slides. @@ -186,4 +186,4 @@ const SlidesContainer = React.createClass({ } }); -export default SlidesContainer; +export default withRouter(SlidesContainer); diff --git a/js/components/password_reset_container.js b/js/components/password_reset_container.js index 87d68249..838040e7 100644 --- a/js/components/password_reset_container.js +++ b/js/components/password_reset_container.js @@ -1,6 +1,7 @@ 'use strict'; import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import Form from './ascribe_forms/form'; import Property from './ascribe_forms/property'; @@ -107,16 +108,14 @@ let PasswordRequestResetForm = React.createClass({ } }); -let PasswordResetForm = React.createClass({ +let PasswordResetForm = withRouter(React.createClass({ propTypes: { + router: React.PropTypes.object.isRequired, + email: React.PropTypes.string, token: React.PropTypes.string }, - contextTypes: { - router: React.PropTypes.object.isRequired - }, - getFormData() { return { email: this.props.email, @@ -125,7 +124,7 @@ let PasswordResetForm = React.createClass({ }, handleSuccess() { - this.context.router.push('/collection'); + this.props.router.push('/collection'); const notification = new GlobalNotificationModel(getLangText('Password successfully updated'), 'success', 10000); GlobalNotificationActions.appendGlobalNotification(notification); @@ -176,6 +175,6 @@ let PasswordResetForm = React.createClass({ ); } -}); +})); export default PasswordResetContainer; diff --git a/js/components/piece_list.js b/js/components/piece_list.js index 7a82c61f..d18aeed7 100644 --- a/js/components/piece_list.js +++ b/js/components/piece_list.js @@ -1,6 +1,5 @@ -'use strict'; - import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import PieceListStore from '../stores/piece_list_store'; import PieceListActions from '../actions/piece_list_actions'; @@ -30,8 +29,10 @@ import { getLangText } from '../utils/lang_utils'; import { setDocumentTitle } from '../utils/dom_utils'; -let PieceList = React.createClass({ +const PieceList = React.createClass({ propTypes: { + router: React.PropTypes.object.isRequired, + accordionListItemType: React.PropTypes.func, bulkModalButtonListType: React.PropTypes.func, canLoadPieceList: React.PropTypes.bool, @@ -54,10 +55,6 @@ let PieceList = React.createClass({ location: React.PropTypes.object }, - contextTypes: { - router: React.PropTypes.object.isRequired - }, - getDefaultProps() { return { accordionListItemType: AccordionListItemWallet, @@ -130,13 +127,13 @@ let PieceList = React.createClass({ }, componentDidUpdate() { - const { location: { query }, redirectTo, shouldRedirect } = this.props; + const { location: { query }, redirectTo, router, shouldRedirect } = this.props; const { unfilteredPieceListCount } = this.state; if (redirectTo && redirectTo.pathname && (typeof shouldRedirect === 'function' && shouldRedirect(unfilteredPieceListCount))) { // FIXME: hack to redirect out of the dispatch cycle - window.setTimeout(() => this.context.router.push({ + window.setTimeout(() => router.push({ // Occasionally, the back end also sets query parameters for Onion. // We need to consider this by merging all passed query parameters, as we'll // otherwise end up in a 404 screen @@ -196,14 +193,14 @@ let PieceList = React.createClass({ }, searchFor(search) { - const { location: { pathname } } = this.props; + const { location: { pathname }, router } = this.props; this.loadPieceList({ search, page: 1 }); - this.context.router.push({ pathname, query: { page: 1 } }); + router.push({ pathname, query: { page: 1 } }); }, applyFilterBy(filterBy) { - const { pathname } = this.props.location; + const { location: { pathname }, router } = this.props; this.setState({ isFilterDirty: true @@ -229,7 +226,7 @@ let PieceList = React.createClass({ // we have to redirect the user always to page one as it could be that there is no page two // for filtered pieces - this.context.router.push({ pathname, query: { page: 1 } }); + router.push({ pathname, query: { page: 1 } }); }, applyOrderBy(orderBy) { @@ -361,4 +358,4 @@ let PieceList = React.createClass({ } }); -export default PieceList; +export default withRouter(PieceList); diff --git a/js/components/register_piece.js b/js/components/register_piece.js index d3f75e36..2c428aa1 100644 --- a/js/components/register_piece.js +++ b/js/components/register_piece.js @@ -1,6 +1,5 @@ -'use strict'; - import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import Col from 'react-bootstrap/lib/Col'; import Row from 'react-bootstrap/lib/Row'; @@ -18,8 +17,10 @@ import { getLangText } from '../utils/lang_utils'; import { setDocumentTitle } from '../utils/dom_utils'; -let RegisterPiece = React.createClass( { +const RegisterPiece = React.createClass( { propTypes: { + router: React.PropTypes.object.isRequired, + headerMessage: React.PropTypes.string, submitMessage: React.PropTypes.string, children: React.PropTypes.oneOfType([ @@ -36,10 +37,6 @@ let RegisterPiece = React.createClass( { location: React.PropTypes.object }, - contextTypes: { - router: React.PropTypes.object.isRequired - }, - getInitialState(){ return PieceListStore.getState(); }, @@ -66,7 +63,7 @@ let RegisterPiece = React.createClass( { // the piece list up to date PieceListActions.fetchPieceList({ page, pageSize, search, orderBy, orderAsc, filterBy }); - this.context.router.push(`/pieces/${response.piece.id}`); + this.props.router.push(`/pieces/${response.piece.id}`); }, getSpecifyEditions() { @@ -109,4 +106,4 @@ let RegisterPiece = React.createClass( { }); -export default RegisterPiece; +export default withRouter(RegisterPiece); diff --git a/js/components/signup_container.js b/js/components/signup_container.js index a974776d..3bb811fa 100644 --- a/js/components/signup_container.js +++ b/js/components/signup_container.js @@ -1,5 +1,3 @@ -'use strict'; - import React from 'react'; import Link from 'react-router/es6/Link'; diff --git a/js/components/whitelabel/wallet/components/cyland/cyland_detail/cyland_piece_container.js b/js/components/whitelabel/wallet/components/cyland/cyland_detail/cyland_piece_container.js index eace7322..b33c5d70 100644 --- a/js/components/whitelabel/wallet/components/cyland/cyland_detail/cyland_piece_container.js +++ b/js/components/whitelabel/wallet/components/cyland/cyland_detail/cyland_piece_container.js @@ -1,6 +1,5 @@ -'use strict'; - import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import EditionListActions from '../../../../../../actions/edition_list_actions'; @@ -28,8 +27,10 @@ import { setDocumentTitle } from '../../../../../../utils/dom_utils'; import { mergeOptions } from '../../../../../../utils/general_utils'; -let CylandPieceContainer = React.createClass({ +const CylandPieceContainer = React.createClass({ propTypes: { + router: React.PropTypes.object.isRequired, + // Provided from WalletApp currentUser: React.PropTypes.object.isRequired, whitelabel: React.PropTypes.object, @@ -39,10 +40,6 @@ let CylandPieceContainer = React.createClass({ params: React.PropTypes.object }, - contextTypes: { - router: React.PropTypes.object - }, - getInitialState() { return mergeOptions( PieceStore.getInitialState(), @@ -91,7 +88,7 @@ let CylandPieceContainer = React.createClass({ const notification = new GlobalNotificationModel(response.notification, 'success'); GlobalNotificationActions.appendGlobalNotification(notification); - this.context.router.push('/collection'); + this.props.router.push('/collection'); }, render() { @@ -130,4 +127,4 @@ let CylandPieceContainer = React.createClass({ } }); -export default CylandPieceContainer; +export default withRouter(CylandPieceContainer); diff --git a/js/components/whitelabel/wallet/components/cyland/cyland_register_piece.js b/js/components/whitelabel/wallet/components/cyland/cyland_register_piece.js index 56d068e8..1f513348 100644 --- a/js/components/whitelabel/wallet/components/cyland/cyland_register_piece.js +++ b/js/components/whitelabel/wallet/components/cyland/cyland_register_piece.js @@ -1,6 +1,5 @@ -'use strict'; - import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import Moment from 'moment'; @@ -33,8 +32,10 @@ import { mergeOptions } from '../../../../../utils/general_utils'; import { getAclFormMessage } from '../../../../../utils/form_utils'; -let CylandRegisterPiece = React.createClass({ +const CylandRegisterPiece = React.createClass({ propTypes: { + router: React.PropTypes.object.isRequired, + // Provided from WalletApp currentUser: React.PropTypes.object.isRequired, whitelabel: React.PropTypes.object.isRequired, @@ -43,10 +44,6 @@ let CylandRegisterPiece = React.createClass({ location: React.PropTypes.object }, - contextTypes: { - router: React.PropTypes.object.isRequired - }, - getInitialState(){ return mergeOptions( PieceListStore.getState(), @@ -111,7 +108,7 @@ let CylandRegisterPiece = React.createClass({ this.refreshPieceList(); - this.context.router.push(`/pieces/${this.state.piece.id}`); + this.props.router.push(`/pieces/${this.state.piece.id}`); }, nextSlide(queryParams) { @@ -221,4 +218,4 @@ let CylandRegisterPiece = React.createClass({ } }); -export default CylandRegisterPiece; +export default withRouter(CylandRegisterPiece); diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js index db98eb94..94b15997 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js @@ -1,6 +1,5 @@ -'use strict'; - import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import Glyphicon from 'react-bootstrap/lib/Glyphicon'; import Button from 'react-bootstrap/lib/Button'; @@ -22,8 +21,10 @@ import { getLangText } from '../../../../../utils/lang_utils'; import { setDocumentTitle } from '../../../../../utils/dom_utils'; -let IkonotvContractNotifications = React.createClass({ +const IkonotvContractNotifications = React.createClass({ propTypes: { + router: React.PropTypes.object.isRequired, + // Provided from WalletApp currentUser: React.PropTypes.object.isRequired, whitelabel: React.PropTypes.object.isRequired, @@ -32,10 +33,6 @@ let IkonotvContractNotifications = React.createClass({ location: React.PropTypes.object }, - contextTypes: { - router: React.PropTypes.object.isRequired - }, - getInitialState() { return NotificationStore.getState(); }, @@ -116,7 +113,7 @@ let IkonotvContractNotifications = React.createClass({ NotificationActions.flushContractAgreementListNotifications(); NotificationActions.fetchContractAgreementListNotifications(); - this.context.router.push('/collection'); + this.props.router.push('/collection'); }, handleDeny() { @@ -130,7 +127,7 @@ let IkonotvContractNotifications = React.createClass({ const notification = new GlobalNotificationModel(getLangText('You have denied the conditions'), 'success', 5000); GlobalNotificationActions.appendGlobalNotification(notification); - this.context.router.push('/collection'); + this.props.router.push('/collection'); }, getCopyrightAssociationForm(){ @@ -201,4 +198,4 @@ let IkonotvContractNotifications = React.createClass({ } }); -export default IkonotvContractNotifications; +export default withRouter(IkonotvContractNotifications); diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_detail/ikonotv_piece_container.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_detail/ikonotv_piece_container.js index 15c28260..3ec7198e 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_detail/ikonotv_piece_container.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_detail/ikonotv_piece_container.js @@ -1,6 +1,5 @@ -'use strict'; - import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import EditionListActions from '../../../../../../actions/edition_list_actions'; @@ -29,8 +28,10 @@ import { setDocumentTitle } from '../../../../../../utils/dom_utils'; import { mergeOptions } from '../../../../../../utils/general_utils'; -let IkonotvPieceContainer = React.createClass({ +const IkonotvPieceContainer = React.createClass({ propTypes: { + router: React.PropTypes.object.isRequired, + // Provided from WalletApp currentUser: React.PropTypes.object, whitelabel: React.PropTypes.object, @@ -40,10 +41,6 @@ let IkonotvPieceContainer = React.createClass({ params: React.PropTypes.object }, - contextTypes: { - router: React.PropTypes.object.isRequired - }, - getInitialState() { return mergeOptions( PieceListStore.getState(), @@ -92,7 +89,7 @@ let IkonotvPieceContainer = React.createClass({ const notification = new GlobalNotificationModel(response.notification, 'success'); GlobalNotificationActions.appendGlobalNotification(notification); - this.context.router.push('/collection'); + this.props.router.push('/collection'); }, render() { @@ -147,4 +144,4 @@ let IkonotvPieceContainer = React.createClass({ } }); -export default IkonotvPieceContainer; +export default withRouter(IkonotvPieceContainer); 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 5c8e8b37..a9d99ed1 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js @@ -1,6 +1,5 @@ -'use strict'; - import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import Moment from 'moment'; import Col from 'react-bootstrap/lib/Col'; @@ -29,8 +28,10 @@ import { mergeOptions } from '../../../../../utils/general_utils'; import { getLangText } from '../../../../../utils/lang_utils'; -let IkonotvRegisterPiece = React.createClass({ +const IkonotvRegisterPiece = React.createClass({ propTypes: { + router: React.PropTypes.object.isRequired, + handleSuccess: React.PropTypes.func, // Provided from WalletApp @@ -41,10 +42,6 @@ let IkonotvRegisterPiece = React.createClass({ location: React.PropTypes.object }, - contextTypes: { - router: React.PropTypes.object.isRequired - }, - getInitialState() { return mergeOptions( PieceListStore.getState(), @@ -93,7 +90,7 @@ let IkonotvRegisterPiece = React.createClass({ } if (!this.canSubmit()) { - this.context.router.push('/collection'); + this.props.router.push('/collection'); } else { this.nextSlide({ piece_id: response.piece.id }); } @@ -118,7 +115,7 @@ let IkonotvRegisterPiece = React.createClass({ this.refreshPieceList(); - this.context.router.push(`/pieces/${this.state.piece.id}`); + this.props.router.push(`/pieces/${this.state.piece.id}`); }, nextSlide(queryParams) { @@ -246,4 +243,4 @@ let IkonotvRegisterPiece = React.createClass({ } }); -export default IkonotvRegisterPiece; +export default withRouter(IkonotvRegisterPiece); diff --git a/js/components/whitelabel/wallet/components/market/market_register_piece.js b/js/components/whitelabel/wallet/components/market/market_register_piece.js index cfb22b19..76185c35 100644 --- a/js/components/whitelabel/wallet/components/market/market_register_piece.js +++ b/js/components/whitelabel/wallet/components/market/market_register_piece.js @@ -1,6 +1,5 @@ -'use strict'; - import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import Col from 'react-bootstrap/lib/Col'; import Row from 'react-bootstrap/lib/Row'; @@ -24,6 +23,8 @@ import { mergeOptions } from '../../../../../utils/general_utils'; let MarketRegisterPiece = React.createClass({ propTypes: { + router: React.PropTypes.object.isRequired, + // Provided from WalletApp currentUser: React.PropTypes.object, whitelabel: React.PropTypes.object.isRequired, @@ -32,10 +33,6 @@ let MarketRegisterPiece = React.createClass({ location: React.PropTypes.object }, - contextTypes: { - router: React.PropTypes.object.isRequired - }, - getInitialState(){ return mergeOptions( PieceListStore.getState(), @@ -83,7 +80,7 @@ let MarketRegisterPiece = React.createClass({ handleAdditionalDataSuccess() { this.refreshPieceList(); - this.context.router.push('/collection'); + this.props.router.push('/collection'); }, nextSlide(queryParams) { @@ -161,4 +158,4 @@ let MarketRegisterPiece = React.createClass({ } }); -export default MarketRegisterPiece; +export default withRouter(MarketRegisterPiece); diff --git a/js/components/whitelabel/wallet/wallet_app.js b/js/components/whitelabel/wallet/wallet_app.js index e5eada8f..944c47d4 100644 --- a/js/components/whitelabel/wallet/wallet_app.js +++ b/js/components/whitelabel/wallet/wallet_app.js @@ -1,6 +1,5 @@ -'use strict'; - import React from 'react'; +import withRouter from 'react-router/es6/withRouter'; import classNames from 'classnames'; import AppBase from '../../app_base'; @@ -14,6 +13,7 @@ let WalletApp = React.createClass({ propTypes: { activeRoute: React.PropTypes.object.isRequired, children: React.PropTypes.element.isRequired, + router: React.PropTypes.object.isRequired, routes: React.PropTypes.arrayOf(React.PropTypes.object).isRequired, // Provided from AppBase @@ -21,13 +21,8 @@ let WalletApp = React.createClass({ whitelabel: React.PropTypes.object }, - contextTypes: { - router: React.PropTypes.object - }, - render() { - const { activeRoute, children, currentUser, routes, whitelabel } = this.props; - const { router } = this.context; + const { activeRoute, children, currentUser, router, routes, whitelabel } = this.props; const subdomain = getSubdomain(); const path = activeRoute && activeRoute.path; const Footer = activeRoute && activeRoute.footer; @@ -63,4 +58,4 @@ let WalletApp = React.createClass({ } }); -export default AppBase(WalletApp); +export default AppBase(withRouter(WalletApp));