Merge remote-tracking branch 'origin/AD-419-decouple-piece-registration-from-' into AD-419-decouple-piece-registration-from-

Conflicts:
	js/components/ascribe_detail/edition.js

js/actions/edition_list_actions.js

@@ -8,6 +8,7 @@ class EditionListActions {
     constructor() {
         this.generateActions(
             'updateEditionList',
+            'refreshEditionList',
             'selectEdition',
             'clearAllEditionSelections',
             'closeAllEditionLists',
@@ -16,7 +17,7 @@ class EditionListActions {
     }
 
     fetchEditionList(pieceId, page, pageSize, orderBy, orderAsc) {
-        if(!orderBy && typeof orderAsc == 'undefined') {
+        if(!orderBy && typeof orderAsc === 'undefined') {
             orderBy = 'edition_number';
             orderAsc = true;
         }

js/components/ascribe_accordion_list/accordion_list_item.js

@@ -13,6 +13,9 @@ import CreateEditionsForm from '../ascribe_forms/create_editions_form';
 import PieceListActions from '../../actions/piece_list_actions';
 import EditionListActions from '../../actions/edition_list_actions';
 
+import GlobalNotificationModel from '../../models/global_notification_model';
+import GlobalNotificationActions from '../../actions/global_notification_actions';
+
 import { getLangText } from '../../utils/lang_utils';
 
 let Link = Router.Link;
@@ -63,6 +66,9 @@ let AccordionListItem = React.createClass({
         });
 
         EditionListActions.toggleEditionList(pieceId);
+
+        let notification = new GlobalNotificationModel('Editions successfully created', 'success', 10000);
+        GlobalNotificationActions.appendGlobalNotification(notification);
     },
 
     getCreateEditionsDialog() {

js/components/ascribe_buttons/acl_button_list.js

@@ -6,7 +6,6 @@ import UserActions from '../../actions/user_actions';
 import UserStore from '../../stores/user_store';
 
 import AclButton from '../ascribe_buttons/acl_button';
-import DeleteButton from '../ascribe_buttons/delete_button';
 
 let AclButtonList = React.createClass({
     propTypes: {
@@ -73,9 +72,6 @@ let AclButtonList = React.createClass({
                     pieceOrEditions={this.props.editions}
                     currentUser={this.state.currentUser}
                     handleSuccess={this.props.handleSuccess} />
-                <DeleteButton
-                    handleSuccess={this.props.handleSuccess}
-                    editions={this.props.editions}/>
                 {this.props.children}
             </div>
         );

js/components/ascribe_buttons/delete_button.js

@@ -6,66 +6,71 @@ import Router from 'react-router';
 import Button from 'react-bootstrap/lib/Button';
 
 import EditionDeleteForm from '../ascribe_forms/form_delete_edition';
-import EditionRemoveFromCollectionForm from '../ascribe_forms/form_remove_editions_from_collection';
+import PieceDeleteForm from '../ascribe_forms/form_delete_piece';
-import ModalWrapper from '../ascribe_modal/modal_wrapper';
 
-import GlobalNotificationModel from '../../models/global_notification_model';
+import EditionRemoveFromCollectionForm from '../ascribe_forms/form_remove_editions_from_collection';
-import GlobalNotificationActions from '../../actions/global_notification_actions';
+import PieceRemoveFromCollectionForm from '../ascribe_forms/form_remove_piece_from_collection';
+
+import ModalWrapper from '../ascribe_modal/modal_wrapper';
 
 import { getAvailableAcls } from '../../utils/acl_utils';
 import { getLangText } from '../../utils/lang_utils.js';
 
-import EditionListActions from '../../actions/edition_list_actions';
 
 let DeleteButton = React.createClass({
     propTypes: {
-        editions: React.PropTypes.array.isRequired,
+        editions: React.PropTypes.array,
+        piece: React.PropTypes.object,
         handleSuccess: React.PropTypes.func
     },
 
     mixins: [Router.Navigation],
 
-    showNotification(response) {
-        if (this.props.editions.constructor === Array){
-            this.props.editions
-                .forEach((edition) => {
-                    EditionListActions.fetchEditionList(edition.parent);
-                });
-        }
-        else {
-            EditionListActions.fetchEditionList(this.props.editions.id);
-        }
-        EditionListActions.clearAllEditionSelections();
-        EditionListActions.closeAllEditionLists();
-        this.props.handleSuccess();
-        this.transitionTo('pieces');
-        let notification = new GlobalNotificationModel(response.notification, 'success');
-        GlobalNotificationActions.appendGlobalNotification(notification);
-    },
-
     render: function () {
-        let availableAcls = getAvailableAcls(this.props.editions);
+        let availableAcls;
-        let btnDelete = null;
+        let btnDelete;
-        let content = null;
+        let content;
+        let title;
 
-        if (availableAcls.acl_delete) {
+        if(this.props.piece && !this.props.editions) {
-            content = <EditionDeleteForm editions={ this.props.editions }/>;
+            availableAcls = getAvailableAcls([this.props.piece]);
-            btnDelete = <Button bsStyle="danger" className="btn-delete" bsSize="small">{getLangText('DELETE')}</Button>;
+        } else {
+            availableAcls = getAvailableAcls(this.props.editions);
         }
-        else if (availableAcls.acl_unshare || (this.props.editions.constructor !== Array && this.props.editions.acl.acl_unshare)){
+
-            content = <EditionRemoveFromCollectionForm editions={ this.props.editions }/>;
+        if(availableAcls.acl_delete) {
+
+            if(this.props.piece && !this.props.editions) {
+                content = <PieceDeleteForm pieceId={this.props.piece.id}/>;
+                title = getLangText('Remove Piece');
+            } else {
+                content = <EditionDeleteForm editions={this.props.editions}/>;
+                title = getLangText('Remove Edition');
+            }
+
+            btnDelete = <Button bsStyle="danger" className="btn-delete" bsSize="small">{getLangText('DELETE')}</Button>;
+        
+        } else if(availableAcls.acl_unshare){
+            
+            if(this.props.editions && this.props.editions.constructor !== Array && this.props.editions.acl.acl_unshare) {
+                content = <EditionRemoveFromCollectionForm editions={this.props.editions}/>;
+                title = getLangText('Remove Edition from Collection');
+            } else {
+                content = <PieceRemoveFromCollectionForm pieceId={this.props.piece.id}/>;
+                title = getLangText('Remove Piece from Collection');
+            }
+
             btnDelete = <Button bsStyle="danger" className="btn-delete" bsSize="small">{getLangText('REMOVE FROM COLLECTION')}</Button>;
         }
-        else{
+        else {
             return null;
         }
         return (
             <ModalWrapper
-                button={ btnDelete }
+                button={btnDelete}
-                handleSuccess={ this.showNotification }
+                handleSuccess={this.props.handleSuccess}
-                title={getLangText('Remove Edition')}
+                title={title}>
-                tooltip={getLangText('Click to remove edition')}>
+                {content}
-                { content }
             </ModalWrapper>
         );
     }

js/components/ascribe_detail/edition.js

@@ -12,6 +12,10 @@ import UserActions from '../../actions/user_actions';
 import UserStore from '../../stores/user_store';
 import CoaActions from '../../actions/coa_actions';
 import CoaStore from '../../stores/coa_store';
+import PieceListActions from '../../actions/piece_list_actions';
+import PieceListStore from '../../stores/piece_list_store';
+import EditionListActions from '../../actions/edition_list_actions';
+
 
 import MediaContainer from './media_container';
 
@@ -24,13 +28,11 @@ import InputTextAreaToggable from './../ascribe_forms/input_textarea_toggable';
 
 import EditionFurtherDetails from './further_details';
 
-//import PieceExtraDataForm from './../ascribe_forms/form_piece_extradata';
 import RequestActionForm from './../ascribe_forms/form_request_action';
 import EditionActions from '../../actions/edition_actions';
 import AclButtonList from './../ascribe_buttons/acl_button_list';
 import UnConsignRequestButton from './../ascribe_buttons/unconsign_request_button';
-
+import DeleteButton from '../ascribe_buttons/delete_button';
-//import ReactS3FineUploader from './../ascribe_uploader/react_s3_fine_uploader';
 
 import GlobalNotificationModel from '../../models/global_notification_model';
 import GlobalNotificationActions from '../../actions/global_notification_actions';
@@ -39,6 +41,7 @@ import apiUrls from '../../constants/api_urls';
 import AppConstants from '../../constants/application_constants';
 
 import { getLangText } from '../../utils/lang_utils';
+import { mergeOptions } from '../../utils/general_utils';
 
 let Link = Router.Link;
 /**
@@ -50,23 +53,44 @@ let Edition = React.createClass({
         loadEdition: React.PropTypes.func
     },
 
+    mixins: [Router.Navigation],
+
     getInitialState() {
-        return UserStore.getState();
+        return mergeOptions(
+            UserStore.getState(),
+            PieceListStore.getState()
+        );
     },
 
     componentDidMount() {
         UserStore.listen(this.onChange);
+        PieceListStore.listen(this.onChange);
         UserActions.fetchCurrentUser();
     },
 
     componentWillUnmount() {
         UserStore.unlisten(this.onChange);
+        PieceListStore.unlisten(this.onChange);
     },
 
     onChange(state) {
         this.setState(state);
     },
 
+    handleDeleteSuccess(response) {
+        PieceListActions.fetchPieceList(this.state.page, this.state.pageSize, this.state.search, this.state.orderBy, this.state.orderAsc);
+
+        // we don't need to refresh the edition list for a piece here, since its reloaded from
+        // scatch once you click on show-editions anyway
+        EditionListActions.closeAllEditionLists();
+        EditionListActions.clearAllEditionSelections();
+
+        let notification = new GlobalNotificationModel(response.notification, 'success');
+        GlobalNotificationActions.appendGlobalNotification(notification);
+
+        this.transitionTo('pieces');
+    },
+
     render() {
         return (
             <Row>
@@ -84,7 +108,8 @@ let Edition = React.createClass({
                     <EditionSummary
                         handleSuccess={this.props.loadEdition}
                         currentUser={this.state.currentUser}
-                        edition={this.props.edition} />
+                        edition={this.props.edition}
+                        handleDeleteSuccess={this.handleDeleteSuccess}/>
 
                     <CollapsibleParagraph
                         title={getLangText('Certificate of Authenticity')}
@@ -157,6 +182,7 @@ let EditionSummary = React.createClass({
         edition: React.PropTypes.object,
         handleSuccess: React.PropTypes.func,
         currentUser: React.PropTypes.object
+        handleDeleteSuccess: React.PropTypes.func
     },
 
     getTransferWithdrawData(){
@@ -176,14 +202,13 @@ let EditionSummary = React.createClass({
             status = <EditionDetailProperty label="STATUS" value={ statusStr }/>;
             if (this.props.edition.pending_new_owner && this.props.edition.acl.acl_withdraw_transfer){
                 status = (
-
+                    <EditionDetailProperty label="STATUS" value={ statusStr } />
-                        <EditionDetailProperty label="STATUS" value={ statusStr } />
-
                 );
             }
         }
         return status;
     },
+
     getActions(){
         let actions = null;
         if (this.props.edition.request_action && this.props.edition.request_action.length > 0){
@@ -227,6 +252,9 @@ let EditionSummary = React.createClass({
                             editions={[this.props.edition]}
                             handleSuccess={this.props.handleSuccess}>
                             {withdrawButton}
+                            <DeleteButton
+                                handleSuccess={this.props.handleDeleteSuccess}
+                                editions={[this.props.edition]}/>
                             {unconsignRequestButton}
                         </AclButtonList>
                     </Col>

js/components/ascribe_detail/piece.js

@@ -1,6 +1,7 @@
 'use strict';
 
 import React from 'react';
+import Router from 'react-router';
 
 import Row from 'react-bootstrap/lib/Row';
 import Col from 'react-bootstrap/lib/Col';
@@ -14,6 +15,11 @@ import FurtherDetails from './further_details';
 import UserActions from '../../actions/user_actions';
 import UserStore from '../../stores/user_store';
 
+import PieceListActions from '../../actions/piece_list_actions';
+import PieceListStore from '../../stores/piece_list_store';
+
+import EditionListActions from '../../actions/edition_list_actions';
+
 import PieceActions from '../../actions/piece_actions';
 
 import MediaContainer from './media_container';
@@ -23,6 +29,10 @@ import EditionDetailProperty from './detail_property';
 import AclButtonList from './../ascribe_buttons/acl_button_list';
 import CreateEditionsForm from '../ascribe_forms/create_editions_form';
 import CreateEditionsButton from '../ascribe_buttons/create_editions_button';
+import DeleteButton from '../ascribe_buttons/delete_button';
+
+import GlobalNotificationModel from '../../models/global_notification_model';
+import GlobalNotificationActions from '../../actions/global_notification_actions';
 
 import { getLangText } from '../../utils/lang_utils';
 import { mergeOptions } from '../../utils/general_utils';
@@ -36,9 +46,12 @@ let Piece = React.createClass({
         loadPiece: React.PropTypes.func
     },
 
+    mixins: [Router.Navigation],
+
     getInitialState() {
         return mergeOptions(
             UserStore.getState(),
+            PieceListStore.getState(),
             {
                 showCreateEditionsDialog: false
             }
@@ -47,11 +60,13 @@ let Piece = React.createClass({
 
     componentDidMount() {
         UserStore.listen(this.onChange);
+        PieceListStore.listen(this.onChange);
         UserActions.fetchCurrentUser();
     },
 
     componentWillUnmount() {
         UserStore.unlisten(this.onChange);
+        PieceListStore.unlisten(this.onChange);
     },
 
     onChange(state) {
@@ -69,6 +84,20 @@ let Piece = React.createClass({
         this.toggleCreateEditionsDialog();
     },
 
+    handleDeleteSuccess(response) {
+        PieceListActions.fetchPieceList(this.state.page, this.state.pageSize, this.state.search, this.state.orderBy, this.state.orderAsc);
+
+        // since we're deleting a piece, we just need to close
+        // all editions dialogs and not reload them
+        EditionListActions.closeAllEditionLists();
+        EditionListActions.clearAllEditionSelections();
+
+        let notification = new GlobalNotificationModel(response.notification, 'success');
+        GlobalNotificationActions.appendGlobalNotification(notification);
+
+        this.transitionTo('pieces');
+    },
+
     getCreateEditionsDialog() {
         if(this.props.piece.num_editions < 1 && this.state.showCreateEditionsDialog) {
             return (
@@ -89,6 +118,9 @@ let Piece = React.createClass({
             key: 'num_editions',
             value: numEditions
         });
+
+        let notification = new GlobalNotificationModel('Editions successfully created', 'success', 10000);
+        GlobalNotificationActions.appendGlobalNotification(notification);
     },
 
     render() {
@@ -121,6 +153,9 @@ let Piece = React.createClass({
                                 piece={this.props.piece}
                                 toggleCreateEditionsDialog={this.toggleCreateEditionsDialog}
                                 onPollingSuccess={this.handlePollingSuccess}/>
+                            <DeleteButton
+                                handleSuccess={this.handleDeleteSuccess}
+                                piece={this.props.piece}/>
                     </AclButtonList>
 
                     {this.getCreateEditionsDialog()}

js/components/ascribe_forms/form.js

@@ -59,7 +59,6 @@ let Form = React.createClass({
         for (let ref in this.refs){
             data[this.refs[ref].props.name] = this.refs[ref].state.value;
         }
-        console.log(data);
         if ('getFormData' in this.props){
             data = mergeOptionsWithDuplicates(data, this.props.getFormData());
         }

js/components/ascribe_forms/form_delete_piece.js

@@ -0,0 +1,41 @@
+'use strict';
+
+import React from 'react';
+
+import requests from '../../utils/requests';
+import ApiUrls from '../../constants/api_urls';
+import FormMixin from '../../mixins/form_mixin';
+import { getLangText } from '../../utils/lang_utils';
+
+let PieceDeleteForm = React.createClass({
+    propTypes: {
+        pieceId: React.PropTypes.number
+    },
+
+    mixins: [FormMixin],
+
+    url() {
+        return requests.prepareUrl(ApiUrls.piece, {piece_id: this.props.pieceId});
+    },
+
+    httpVerb() {
+        return 'delete';
+    },
+
+    renderForm () {
+        return (
+            <div className="modal-body">
+                <p>{getLangText('Are you sure you would like to permanently delete this piece')}&#63;</p>
+                <p>{getLangText('This is an irrevocable action%s', '.')}</p>
+                <div className="modal-footer">
+                    <button type="submit" className="btn btn-danger btn-delete btn-sm ascribe-margin-1px" onClick={this.submit}>{getLangText('YES, DELETE')}</button>
+                    <button className="btn btn-default btn-sm ascribe-margin-1px" style={{marginLeft: '0'}}
+                            onClick={this.props.onRequestHide}>{getLangText('CLOSE')}</button>
+                </div>
+            </div>
+        );
+    }
+});
+
+
+export default PieceDeleteForm;

js/components/ascribe_forms/form_remove_editions_from_collection.js

@@ -12,13 +12,9 @@ let EditionRemoveFromCollectionForm = React.createClass({
     mixins: [FormMixin],
 
     url() {
-        if (this.props.editions.constructor === Array) {
+        return requests.prepareUrl(apiUrls.edition_remove_from_collection, {edition_id: this.getBitcoinIds().join()});
-            return requests.prepareUrl(apiUrls.edition_remove_from_collection, {edition_id: this.getBitcoinIds().join()});
-        }
-        else {
-            return requests.prepareUrl(apiUrls.piece_remove_from_collection, {piece_id: this.props.editions.id});
-        }
     },
+    
     httpVerb(){
         return 'delete';
     },

js/components/ascribe_forms/form_remove_piece_from_collection.js

@@ -0,0 +1,42 @@
+'use strict';
+
+import React from 'react';
+
+import { getLangText } from '../../utils/lang_utils.js';
+import requests from '../../utils/requests';
+import apiUrls from '../../constants/api_urls';
+import FormMixin from '../../mixins/form_mixin';
+
+let PieceRemoveFromCollectionForm = React.createClass({
+
+    propTypes: {
+        pieceId: React.PropTypes.number
+    },
+
+    mixins: [FormMixin],
+
+    url() {
+        return requests.prepareUrl(apiUrls.piece_remove_from_collection, {piece_id: this.props.pieceId});
+    },
+    
+    httpVerb(){
+        return 'delete';
+    },
+
+    renderForm () {
+        return (
+            <div className="modal-body">
+                <p>{getLangText('Are you sure you would like to remove this piece from your collection')}&#63;</p>
+                <p>{getLangText('This is an irrevocable action%s', '.')}</p>
+                <div className="modal-footer">
+                    <button type="submit" className="btn btn-danger btn-delete btn-sm ascribe-margin-1px" onClick={this.submit}>{getLangText('YES, REMOVE')}</button>
+                    <button className="btn btn-default btn-sm ascribe-margin-1px" style={{marginLeft: '0'}}
+                            onClick={this.props.onRequestHide}>{getLangText('CLOSE')}</button>
+                </div>
+            </div>
+        );
+    }
+});
+
+
+export default PieceRemoveFromCollectionForm;

js/components/ascribe_modal/modal_wrapper.js

@@ -17,24 +17,41 @@ let ModalWrapper = React.createClass({
         handleSuccess: React.PropTypes.func.isRequired,
         button: React.PropTypes.object.isRequired,
         children: React.PropTypes.object,
-        tooltip: React.PropTypes.string.isRequired
+        tooltip: React.PropTypes.string
+    },
+
+    getModalTrigger() {
+        return (
+            <ModalTrigger modal={
+                <ModalBody
+                    title={this.props.title}
+                    handleSuccess={this.props.handleSuccess}>
+                    {this.props.children}
+                </ModalBody>
+            }>
+            {this.props.button}
+            </ModalTrigger>
+        );
     },
 
     render() {
-        return (
+        if(this.props.tooltip) {
-            <OverlayTrigger delay={500} placement="left"
+            return (
-                            overlay={<Tooltip>{this.props.tooltip}</Tooltip>}>
+                <OverlayTrigger
-                <ModalTrigger modal={
+                    delay={500}
-                    <ModalBody
+                    placement="left"
-                        title={this.props.title}
+                    overlay={<Tooltip>{this.props.tooltip}</Tooltip>}>
-                        handleSuccess={this.props.handleSuccess}>
+                    {this.getModalTrigger()}
-                    {this.props.children}
+                </OverlayTrigger>
-                    </ModalBody>
+            );
-                }>
+        } else {
-                {this.props.button}
+             return (
-                </ModalTrigger>
+                <span>
-            </OverlayTrigger>
+                    {/* This needs to be some kind of inline-block */}
-        );
+                    {this.getModalTrigger()}
+                </span>
+            );
+        }
     }
 });
 

js/components/ascribe_piece_list_bulk_modal/piece_list_bulk_modal.js

@@ -10,9 +10,12 @@ import EditionListActions from '../../actions/edition_list_actions';
 import UserStore from '../../stores/user_store';
 import UserActions from '../../actions/user_actions';
 
+import PieceListStore from '../../stores/piece_list_store';
+import PieceListActions from '../../actions/piece_list_actions';
+
 import PieceListBulkModalSelectedEditionsWidget from './piece_list_bulk_modal_selected_editions_widget';
 import AclButtonList from '../ascribe_buttons/acl_button_list';
-
+import DeleteButton from '../ascribe_buttons/delete_button';
 
 import { getAvailableAcls } from '../../utils/acl_utils';
 import { getLangText } from '../../utils/lang_utils.js';
@@ -23,7 +26,11 @@ let PieceListBulkModal = React.createClass({
     },
 
     getInitialState() {
-        return mergeOptions(EditionListStore.getState(), UserStore.getState());
+        return mergeOptions(
+            EditionListStore.getState(),
+            UserStore.getState(),
+            PieceListStore.getState()
+        );
     },
 
     onChange(state) {
@@ -69,13 +76,11 @@ let PieceListBulkModal = React.createClass({
     },
 
     handleSuccess() {
+        PieceListActions.fetchPieceList(this.state.page, this.state.pageSize, this.state.search, this.state.orderBy, this.state.orderAsc);
+
         this.fetchSelectedPieceEditionList()
             .forEach((pieceId) => {
-                let editionsForPiece = this.state.editionList[pieceId];
+                EditionListActions.refreshEditionList(pieceId);
-                for(let i = 1; i <= editionsForPiece.page; i++) {
-                    EditionListActions.fetchEditionList(pieceId, i, editionsForPiece.pageSize, editionsForPiece.orderBy, editionsForPiece.orderAsc);
-                }
-                
             });
         EditionListActions.clearAllEditionSelections();
     },
@@ -106,7 +111,11 @@ let PieceListBulkModal = React.createClass({
                                     availableAcls={availableAcls}
                                     editions={selectedEditions}
                                     handleSuccess={this.handleSuccess}
-                                    className="text-center ascribe-button-list collapse-group"/>
+                                    className="text-center ascribe-button-list collapse-group">
+                                    <DeleteButton
+                                        handleSuccess={this.handleSuccess}
+                                        editions={selectedEditions}/>
+                                </AclButtonList>
                             </div>
                         </div>
                     </div>

js/components/ascribe_table/table_item_acl_filtered.js

@@ -10,6 +10,7 @@ let TableItemAclFiltered = React.createClass({
     },
 
     render() {
+        var availableAcls = ['acl_consign', 'acl_loan', 'acl_transfer', 'acl_view', 'acl_share', 'acl_unshare', 'acl_delete'];
         if (this.props.requestAction){
             return (
                 <span>
@@ -17,7 +18,6 @@ let TableItemAclFiltered = React.createClass({
                 </span>
             );
         }
-        var availableAcls = ['acl_consign', 'acl_loan', 'acl_transfer', 'acl_view', 'acl_share', 'acl_unshare'];
 
         let filteredAcls = Object.keys(this.props.content).filter((key) => {
             return availableAcls.indexOf(key) > -1 && this.props.content[key];

js/stores/edition_list_store.js

@@ -56,6 +56,31 @@ class EditionListStore {
         this.editionList[pieceId].count = count;
     }
 
+    /**
+     * We often just have to refresh the edition list for a certain pieceId,
+     * this method provides exactly that functionality without any side effects
+     */
+    onRefreshEditionList(pieceId) {
+        const prevEditionListLength = this.editionList[pieceId].length;
+        const prevEditionListPage = this.editionList[pieceId].page;
+        const prevEditionListPageSize = this.editionList[pieceId].pageSize;
+
+        // to clear an array, david walsh recommends to just set it's length to zero
+        // http://davidwalsh.name/empty-array
+        this.editionList[pieceId].length = 0;
+
+        // refetch editions with adjusted page size
+        EditionsListActions.fetchEditionList(pieceId, 1, prevEditionListLength, this.editionList[pieceId].orderBy, this.editionList[pieceId].orderAsc)
+            .then(() => {
+                // reset back to the normal pageSize and page
+                this.editionList[pieceId].page = prevEditionListPage;
+                this.editionList[pieceId].pageSize = prevEditionListPageSize;
+            })
+            .catch((err) => {
+                console.error(err);
+            });
+    }
+
     onSelectEdition({pieceId, editionId, toValue}) {
         this.editionList[pieceId].forEach((edition) => {
 

js/utils/acl_utils.js

@@ -8,7 +8,7 @@ function intersectAcls(a, b) {
 
 export function getAvailableAcls(editions, filterFn) {
     let availableAcls = [];
-    if (editions.constructor !== Array){
+    if (!editions || editions.constructor !== Array){
         return [];
     }
     // if you copy a javascript array of objects using slice, then

js/utils/requests.js

@@ -54,6 +54,11 @@ class Requests {
     }
 
     getUrl(url) {
+        // Handle case, that the url string is not defined at all
+        if (!url) {
+            throw new Error('Url was not defined and could therefore not be mapped.');
+        }
+
         let name = url;
         if (!url.match(/^http/)) {
             url = this.urlMap[url];
@@ -66,9 +71,16 @@ class Requests {
     }
 
     prepareUrl(url, params, attachParamsToQuery) {
-        let newUrl = this.getUrl(url);
+        let newUrl;
         let re = /\${(\w+)}/g;
 
+        // catch errors and throw them to react
+        try {
+            newUrl = this.getUrl(url);
+        } catch(err) {
+            throw err;
+        }
+        
         newUrl = newUrl.replace(re, (match, key) => {
             let val = params[key];
             if (!val) {