Don't redirect to register piece and then to contract notifications

Avoids new user getting asked if they want to cancel registration of a
piece before they even agree to the Ikono contract.

js/actions/notification_actions.js

@@ -9,10 +9,13 @@ class NotificationActions {
     constructor() {
         this.generateActions(
             'updatePieceListNotifications',
+            'flushPieceListNotifications',
             'updateEditionListNotifications',
+            'flushEditionListNotifications',
             'updateEditionNotifications',
             'updatePieceNotifications',
-            'updateContractAgreementListNotifications'
+            'updateContractAgreementListNotifications',
+            'flushContractAgreementListNotifications'
         );
     }
 

js/components/piece_list.js

@@ -37,6 +37,7 @@ let PieceList = React.createClass({
         bulkModalButtonListType: React.PropTypes.func,
         canLoadPieceList: React.PropTypes.bool,
         redirectTo: React.PropTypes.string,
+        shouldRedirect: React.PropTypes.func,
         customSubmitButton: React.PropTypes.element,
         customThumbnailPlaceholder: React.PropTypes.func,
         filterParams: React.PropTypes.array,
@@ -114,7 +115,11 @@ let PieceList = React.createClass({
     },
 
     componentDidUpdate() {
-        if (this.props.redirectTo && this.state.unfilteredPieceListCount === 0) {
+        const { 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);
         }

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

@@ -106,22 +106,27 @@ let IkonotvContractNotifications = React.createClass({
 
     handleConfirm() {
         let contractAgreement = this.state.contractAgreementListNotifications[0].contract_agreement;
-        OwnershipFetcher.confirmContractAgreement(contractAgreement).then(
+        OwnershipFetcher
-            () => this.handleConfirmSuccess()
+            .confirmContractAgreement(contractAgreement)
-        );
+            .then(this.handleConfirmSuccess);
     },
 
     handleConfirmSuccess() {
         let notification = new GlobalNotificationModel(getLangText('You have accepted the conditions'), 'success', 5000);
         GlobalNotificationActions.appendGlobalNotification(notification);
+
+        // Flush contract notifications and refetch
+        NotificationActions.flushContractAgreementListNotifications();
+        NotificationActions.fetchContractAgreementListNotifications();
+
         this.history.pushState(null, '/collection');
     },
 
     handleDeny() {
         let contractAgreement = this.state.contractAgreementListNotifications[0].contract_agreement;
-        OwnershipFetcher.denyContractAgreement(contractAgreement).then(
+        OwnershipFetcher
-            () => this.handleDenySuccess()
+            .denyContractAgreement(contractAgreement)
-        );
+            .then(this.handleDenySuccess);
     },
 
     handleDenySuccess() {

js/components/whitelabel/wallet/components/ikonotv/ikonotv_piece_list.js

@@ -1,15 +1,18 @@
 'use strict';
 
 import React from 'react';
+
 import PieceList from '../../../../piece_list';
 
 import UserActions from '../../../../../actions/user_actions';
 import UserStore from '../../../../../stores/user_store';
+import NotificationStore from '../../../../../stores/notification_store';
 
 import IkonotvAccordionListItem from './ikonotv_accordion_list/ikonotv_accordion_list_item';
 
-import { getLangText } from '../../../../../utils/lang_utils';
 import { setDocumentTitle } from '../../../../../utils/dom_utils';
+import { mergeOptions } from '../../../../../utils/general_utils';
+import { getLangText } from '../../../../../utils/lang_utils';
 
 
 let IkonotvPieceList = React.createClass({
@@ -18,20 +21,33 @@ let IkonotvPieceList = React.createClass({
     },
 
     getInitialState() {
-        return UserStore.getState();
+        return mergeOptions(
+            NotificationStore.getState(),
+            UserStore.getState()
+        );
     },
 
     componentDidMount() {
+        NotificationStore.listen(this.onChange);
         UserStore.listen(this.onChange);
+
         UserActions.fetchCurrentUser();
     },
 
     componentWillUnmount() {
+        NotificationStore.unlisten(this.onChange);
         UserStore.unlisten(this.onChange);
     },
 
     onChange(state) {
         this.setState(state);
+
+    },
+
+    redirectIfNoContractNotifications() {
+        const { contractAgreementListNotifications } = this.state;
+
+        return contractAgreementListNotifications && !contractAgreementListNotifications.length;
     },
 
     render() {
@@ -41,6 +57,7 @@ let IkonotvPieceList = React.createClass({
             <div>
                 <PieceList
                     redirectTo="/register_piece?slide_num=0"
+                    shouldRedirect={this.redirectIfNoContractNotifications}
                     accordionListItemType={IkonotvAccordionListItem}
                     filterParams={[{
                         label: getLangText('Show works I have'),

js/stores/notification_store.js

@@ -10,6 +10,8 @@ class NotificationStore {
     constructor() {
         this.pieceListNotifications = {};
         this.editionListNotifications = {};
+        // Need to determine if contract agreement notifications have been loaded or not,
+        // so we use null here instead of an empty array
         this.contractAgreementListNotifications = null;
         this.editionNotifications = null;
         this.pieceNotifications = null;
@@ -20,6 +22,10 @@ class NotificationStore {
         this.pieceListNotifications = res.notifications;
     }
 
+    onFlushPieceListNotifications() {
+        this.pieceListNotifications = [];
+    }
+
     onUpdatePieceNotifications(res) {
         this.pieceNotifications = res.notification;
     }
@@ -28,6 +34,10 @@ class NotificationStore {
         this.editionListNotifications = res.notifications;
     }
 
+    onFlushPieceListNotifications() {
+        this.editionListNotifications = [];
+    }
+
     onUpdateEditionNotifications(res) {
         this.editionNotifications = res.notification;
     }
@@ -36,6 +46,9 @@ class NotificationStore {
         this.contractAgreementListNotifications = res.notifications;
     }
 
+    onFlushContractAgreementListNotifications() {
+        this.contractAgreementListNotifications = null;
+    }
 }
 
 export default alt.createStore(NotificationStore, 'NotificationStore');