diff --git a/js/components/ascribe_accordion_list/accordion_list_item_table_editions.js b/js/components/ascribe_accordion_list/accordion_list_item_table_editions.js index 3648c36f..2bb3bd52 100644 --- a/js/components/ascribe_accordion_list/accordion_list_item_table_editions.js +++ b/js/components/ascribe_accordion_list/accordion_list_item_table_editions.js @@ -16,6 +16,7 @@ import TableItemCheckbox from '../ascribe_table/table_item_checkbox'; import TableItemAclFiltered from '../ascribe_table/table_item_acl_filtered'; import { getLangText } from '../../utils/lang_utils'; +import { mergeOptions } from '../../utils/general_utils'; let AccordionListItemTableEditions = React.createClass({ @@ -25,7 +26,12 @@ let AccordionListItemTableEditions = React.createClass({ }, getInitialState() { - return EditionListStore.getState(); + return mergeOptions( + EditionListStore.getState(), + { + showMoreLoading: false + } + ); }, componentDidMount() { @@ -37,6 +43,12 @@ let AccordionListItemTableEditions = React.createClass({ }, onChange(state) { + if(this.state.showMoreLoading) { + this.setState({ + showMoreLoading: false + }); + } + this.setState(state); }, @@ -68,6 +80,11 @@ let AccordionListItemTableEditions = React.createClass({ }, loadFurtherEditions() { + // trigger loading animation + this.setState({ + showMoreLoading: true + }); + let editionList = this.state.editionList[this.props.parentId]; EditionListActions.fetchEditionList(this.props.parentId, editionList.page + 1, editionList.pageSize); }, @@ -81,7 +98,7 @@ let AccordionListItemTableEditions = React.createClass({ let allEditionsCount = 0; let orderBy; let orderAsc; - let show; + let show = false; let showExpandOption = false; let editionsForPiece = this.state.editionList[this.props.parentId]; @@ -169,12 +186,14 @@ let AccordionListItemTableEditions = React.createClass({ ) ]; + let loadingSpinner = ; + return (