Use the new history api and its LocationDescriptors

js/components/ascribe_detail/edition_action_panel.js

@@ -72,10 +72,10 @@ let EditionActionPanel = React.createClass({
         EditionListActions.closeAllEditionLists();
         EditionListActions.clearAllEditionSelections();
 
-        let notification = new GlobalNotificationModel(response.notification, 'success');
+        const notification = new GlobalNotificationModel(response.notification, 'success');
         GlobalNotificationActions.appendGlobalNotification(notification);
 
-        this.history.pushState(null, '/collection');
+        this.history.push('/collection');
     },
 
     refreshCollection() {
@@ -84,7 +84,7 @@ let EditionActionPanel = React.createClass({
         EditionListActions.refreshEditionList({pieceId: this.props.edition.parent});
     },
 
-    handleSuccess(response){
+    handleSuccess(response) {
         this.refreshCollection();
         this.props.handleSuccess();
         if (response){
@@ -93,7 +93,7 @@ let EditionActionPanel = React.createClass({
         }
     },
 
-    render(){
+    render() {
         const {
             actionPanelButtonListType: ActionPanelButtonListType,
             edition,

js/components/ascribe_detail/piece_container.js

@@ -159,7 +159,7 @@ let PieceContainer = React.createClass({
         let notification = new GlobalNotificationModel(response.notification, 'success');
         GlobalNotificationActions.appendGlobalNotification(notification);
 
-        this.history.pushState(null, '/collection');
+        this.history.push('/collection');
     },
 
     getCreateEditionsDialog() {

js/components/ascribe_forms/form_send_contract_agreement.js

@@ -58,7 +58,7 @@ let SendContractAgreementForm = React.createClass({
         notification = new GlobalNotificationModel(notification, 'success', 10000);
         GlobalNotificationActions.appendGlobalNotification(notification);
 
-        this.history.pushState(null, '/collection');
+        this.history.push('/collection');
     },
 
     getFormData() {

js/components/ascribe_routes/proxy_handler.js

@@ -40,7 +40,7 @@ export function AuthRedirect({to, when}) {
 
         // and redirect if `true`.
         if(exprToValidate) {
-            window.setTimeout(() => history.replaceState(null, to, query));
+            window.setTimeout(() => history.replace({ query, pathname: to }));
             return true;
 
             // Otherwise there can also be the case that the backend
@@ -48,7 +48,7 @@ export function AuthRedirect({to, when}) {
         } else if(!exprToValidate && when === 'loggedIn' && redirect) {
 
             delete query.redirect;
-            window.setTimeout(() => history.replaceState(null, '/' + redirect, query));
+            window.setTimeout(() => history.replace({ query, pathname: '/' + redirect }));
             return true;
 
         } else if(!exprToValidate && when === 'loggedOut' && redirectAuthenticated) {

js/components/ascribe_slides_container/slides_container.js

@@ -57,21 +57,21 @@ const SlidesContainer = React.createClass({
     // When the start_from parameter is used, this.setSlideNum can not simply be used anymore.
     nextSlide(additionalQueryParams) {
         const slideNum = parseInt(this.props.location.query.slide_num, 10) || 0;
-        let nextSlide = slideNum + 1;
+        this.setSlideNum(slideNum + 1, additionalQueryParams);
-        this.setSlideNum(nextSlide, additionalQueryParams);
     },
 
     setSlideNum(nextSlideNum, additionalQueryParams = {}) {
-        let queryParams = Object.assign(this.props.location.query, additionalQueryParams);
+        const { location: { pathname } } = this.props;
-        queryParams.slide_num = nextSlideNum;
+        const query = Object.assign({}, this.props.location.query, additionalQueryParams, { slide_num: nextSlideNum });
-        this.history.pushState(null, this.props.location.pathname, queryParams);
+
+        this.history.push({ pathname, query });
     },
 
     // breadcrumbs are defined as attributes of the slides.
     // To extract them we have to read the DOM element's attributes
     extractBreadcrumbs() {
         const startFrom = parseInt(this.props.location.query.start_from, 10) || -1;
-        let breadcrumbs = [];
+        const breadcrumbs = [];
 
         React.Children.map(this.props.children, (child, i) => {
             if(child && i >= startFrom && child.props['data-slide-title']) {
@@ -179,4 +179,4 @@ const SlidesContainer = React.createClass({
     }
 });
 
-export default SlidesContainer;
+export default SlidesContainer;

js/components/password_reset_container.js

@@ -130,8 +130,9 @@ let PasswordResetForm = React.createClass({
     },
 
     handleSuccess() {
-        this.history.pushState(null, '/collection');
+        this.history.push('/collection');
-        let notification = new GlobalNotificationModel(getLangText('password successfully updated'), 'success', 10000);
+
+        const notification = new GlobalNotificationModel(getLangText('password successfully updated'), 'success', 10000);
         GlobalNotificationActions.appendGlobalNotification(notification);
     },
 

js/components/piece_list.js

@@ -115,13 +115,13 @@ let PieceList = React.createClass({
     },
 
     componentDidUpdate() {
-        const { redirectTo, shouldRedirect } = this.props;
+        const { location: { query }, redirectTo, shouldRedirect } = this.props;
         const { unfilteredPieceListCount } = this.state;
 
         if (redirectTo && unfilteredPieceListCount === 0 &&
             (typeof shouldRedirect === 'function' && shouldRedirect(unfilteredPieceListCount))) {
             // FIXME: hack to redirect out of the dispatch cycle
-            window.setTimeout(() => this.history.pushState(null, this.props.redirectTo, this.props.location.query), 0);
+            window.setTimeout(() => this.history.push({ query, pathname: redirectTo }), 0);
         }
     },
 
@@ -174,15 +174,16 @@ let PieceList = React.createClass({
         }
     },
 
-    searchFor(searchTerm) {
+    searchFor(search) {
-        this.loadPieceList({
+        const { location: { pathname } } = this.props;
-            page: 1,
+
-            search: searchTerm
+        this.loadPieceList({ search, page: 1 });
-        });
+        this.history.push({ pathname, query: { page: 1 } });
-        this.history.pushState(null, this.props.location.pathname, {page: 1});
     },
 
-    applyFilterBy(filterBy){
+    applyFilterBy(filterBy) {
+        const { location: { pathname } } = this.props;
+
         this.setState({
             isFilterDirty: true
         });
@@ -207,7 +208,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.history.pushState(null, this.props.location.pathname, {page: 1});
+        this.history.push({ pathname, query: { page: 1 } });
     },
 
     applyOrderBy(orderBy) {

js/components/register_piece.js

@@ -66,7 +66,7 @@ let RegisterPiece = React.createClass( {
     },
 
     handleSuccess(response){
-        let notification = new GlobalNotificationModel(response.notification, 'success', 10000);
+        const notification = new GlobalNotificationModel(response.notification, 'success', 10000);
         GlobalNotificationActions.appendGlobalNotification(notification);
 
         // once the user was able to register a piece successfully, we need to make sure to keep
@@ -80,7 +80,7 @@ let RegisterPiece = React.createClass( {
             this.state.filterBy
         );
 
-        this.history.pushState(null, `/pieces/${response.piece.id}`);
+        this.history.push(`/pieces/${response.piece.id}`);
     },
 
     getSpecifyEditions() {

js/components/whitelabel/prize/portfolioreview/components/pr_forms/pr_register_piece_form.js

@@ -106,7 +106,7 @@ const PRRegisterPieceForm = React.createClass({
                         GlobalNotificationActions.appendGlobalNotification(notificationMessage);
                     });
             })
-            .then(() => this.history.pushState(null, `/pieces/${this.state.piece.id}`))
+            .then(() => this.history.push(`/pieces/${this.state.piece.id}`))
             .catch((err) => {
                 const errMessage = (getErrorNotificationMessage(err) || getLangText("Oops! We weren't able to send your submission.")) +
                                         getLangText(' Please contact support@ascribe.io');

js/components/whitelabel/prize/portfolioreview/components/pr_landing.js

@@ -14,7 +14,7 @@ import LinkContainer from 'react-router-bootstrap/lib/LinkContainer';
 import UserStore from '../../../../../stores/user_store';
 import UserActions from '../../../../../actions/user_actions';
 
-import { mergeOptions } from '../../../../../utils/general_utils';
+import { mergeOptions, omitFromObject } from '../../../../../utils/general_utils';
 import { getLangText } from '../../../../../utils/lang_utils';
 
 
@@ -34,15 +34,18 @@ const PRLanding = React.createClass({
 
     componentDidMount() {
         const { location } = this.props;
+
         UserStore.listen(this.onChange);
-        UserActions.fetchCurrentUser();
         PrizeStore.listen(this.onChange);
+
+        UserActions.fetchCurrentUser();
         PrizeActions.fetchPrize();
 
-        if(location && location.query && location.query.redirect) {
+        if (location && location.query && location.query.redirect) {
-            let queryCopy = JSON.parse(JSON.stringify(location.query));
+            window.setTimeout(() => this.history.replace({
-            delete queryCopy.redirect;
+                pathname: `/${location.query.redirect}`,
-            window.setTimeout(() => this.history.replaceState(null, `/${location.query.redirect}`, queryCopy));
+                query: omitFromObject(location.query, ['redirect'])
+            }));
         }
     },
 
@@ -125,4 +128,4 @@ const PRLanding = React.createClass({
     }
 });
 
-export default PRLanding;
+export default PRLanding;

js/components/whitelabel/prize/portfolioreview/components/pr_register_piece.js

@@ -39,7 +39,7 @@ const PRRegisterPiece = React.createClass({
         if(currentUser && currentUser.email) {
             const submittedPieceId = getCookie(currentUser.email);
             if(submittedPieceId) {
-                this.history.pushState(null, `/pieces/${submittedPieceId}`);
+                this.history.push(`/pieces/${submittedPieceId}`);
             }
         }
     },

js/components/whitelabel/prize/portfolioreview/components/pr_routes/pr_proxy_handler.js

@@ -17,7 +17,7 @@ export function AuthPrizeRoleRedirect({ to, when }) {
             .reduce((a, b) => a || b);
 
         if (exprToValidate) {
-            window.setTimeout(() => history.replaceState(null, to, query));
+            window.setTimeout(() => history.replace({ query, pathname: to }));
             return true;
         } else {
             return false;

js/components/whitelabel/prize/simple_prize/components/prize_landing.js

@@ -46,7 +46,7 @@ let Landing = React.createClass({
         // if user is already logged in, redirect him to piece list
         if(this.state.currentUser && this.state.currentUser.email) {
             // FIXME: hack to redirect out of the dispatch cycle
-            window.setTimeout(() => this.history.replaceState(null, '/collection'), 0);
+            window.setTimeout(() => this.history.replace('/collection'), 0);
         }
     },
 

js/components/whitelabel/wallet/components/cyland/cyland_detail/cyland_piece_container.js

@@ -85,7 +85,7 @@ let CylandPieceContainer = React.createClass({
         let notification = new GlobalNotificationModel(response.notification, 'success');
         GlobalNotificationActions.appendGlobalNotification(notification);
 
-        this.history.pushState(null, '/collection');
+        this.history.push('/collection');
     },
 
     render() {

js/components/whitelabel/wallet/components/cyland/cyland_landing.js

@@ -49,7 +49,7 @@ let CylandLanding = React.createClass({
         // if user is already logged in, redirect him to piece list
         if(this.state.currentUser && this.state.currentUser.email) {
             // FIXME: hack to redirect out of the dispatch cycle
-            window.setTimeout(() => this.history.replaceState(null, '/collection'), 0);
+            window.setTimeout(() => this.history.replace('/collection'), 0);
         }
     },
 

js/components/whitelabel/wallet/components/cyland/cyland_register_piece.js

@@ -129,7 +129,7 @@ let CylandRegisterPiece = React.createClass({
 
         PieceActions.fetchOne(this.state.piece.id);
 
-        this.history.pushState(null, `/pieces/${this.state.piece.id}`);
+        this.history.push(`/pieces/${this.state.piece.id}`);
     },
 
     // We need to increase the step to lock the forms that are already filled out

js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js

@@ -119,7 +119,7 @@ let IkonotvContractNotifications = React.createClass({
         NotificationActions.flushContractAgreementListNotifications();
         NotificationActions.fetchContractAgreementListNotifications();
 
-        this.history.pushState(null, '/collection');
+        this.history.push('/collection');
     },
 
     handleDeny() {
@@ -132,7 +132,7 @@ let IkonotvContractNotifications = React.createClass({
     handleDenySuccess() {
         let notification = new GlobalNotificationModel(getLangText('You have denied the conditions'), 'success', 5000);
         GlobalNotificationActions.appendGlobalNotification(notification);
-        this.history.pushState(null, '/collection');
+        this.history.push('/collection');
     },
 
     getCopyrightAssociationForm(){

js/components/whitelabel/wallet/components/ikonotv/ikonotv_detail/ikonotv_piece_container.js

@@ -94,7 +94,7 @@ let IkonotvPieceContainer = React.createClass({
         let notification = new GlobalNotificationModel(response.notification, 'success');
         GlobalNotificationActions.appendGlobalNotification(notification);
 
-        this.history.pushState(null, '/collection');
+        this.history.push('/collection');
     },
 
     render() {

js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js

@@ -103,7 +103,7 @@ let IkonotvRegisterPiece = React.createClass({
             PieceActions.updatePiece(response.piece);
         }
         if (!this.canSubmit()) {
-            this.history.pushState(null, '/collection');
+            this.history.push('/collection');
         }
         else {
             this.incrementStep();
@@ -134,7 +134,7 @@ let IkonotvRegisterPiece = React.createClass({
         this.refreshPieceList();
 
         PieceActions.fetchOne(this.state.piece.id);
-        this.history.pushState(null, `/pieces/${this.state.piece.id}`);
+        this.history.push(`/pieces/${this.state.piece.id}`);
     },
 
     // We need to increase the step to lock the forms that are already filled out

js/components/whitelabel/wallet/components/market/market_register_piece.js

@@ -82,7 +82,7 @@ let MarketRegisterPiece = React.createClass({
     handleAdditionalDataSuccess() {
         this.refreshPieceList();
 
-        this.history.pushState(null, '/collection');
+        this.history.push('/collection');
     },
 
     // We need to increase the step to lock the forms that are already filled out

js/third_party/notifications.js

@@ -22,14 +22,14 @@ class NotificationsHandler {
             return;
         }
 
-        let subdomain = getSubdomain();
+        const subdomain = getSubdomain();
         if (subdomain === 'ikonotv') {
             NotificationActions.fetchContractAgreementListNotifications().then(
                 (res) => {
                     if (res.notifications && res.notifications.length > 0) {
                         this.loaded = true;
                         console.log('Contractagreement notifications loaded');
-                        history.pushState(null, '/contract_notifications');
+                        history.push('/contract_notifications');
                     }
                 }
             );