21364: stopped itemsAvailable count from resetting on load more click

Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa.knox@curii.com>

diff --git a/services/workbench2/src/components/data-explorer/data-explorer.tsx b/services/workbench2/src/components/data-explorer/data-explorer.tsx
index 91ece48c3a34d18cea25e6c3e74181f133bf0123..063e34cda7cd61c57a70c18b0aa4f74d645bfc4d 100644 (file)
--- a/services/workbench2/src/components/data-explorer/data-explorer.tsx
+++ b/services/workbench2/src/components/data-explorer/data-explorer.tsx
@@ -107,6 +107,7 @@ interface DataExplorerDataProps<T> {
     isMSToolbarVisible: boolean;
     checkedList: TCheckedList;
     isNotFound: boolean;
+    searchBarValue: string;
 }
 
 interface DataExplorerActionProps<T> {
@@ -132,6 +133,7 @@ export const DataExplorer = withStyles(styles)(
     class DataExplorerGeneric<T> extends React.Component<DataExplorerProps<T>> {
 
         multiSelectToolbarInTitle = !this.props.title && !this.props.progressBar;
+        maxItemsAvailable = 0;
 
         componentDidMount() {
             if (this.props.onSetColumns) {
@@ -139,6 +141,15 @@ export const DataExplorer = withStyles(styles)(
             }
         }
 
+        componentDidUpdate( prevProps: Readonly<DataExplorerProps<T>>, prevState: Readonly<{}>, snapshot?: any ): void {
+            if (this.props.itemsAvailable !== prevProps.itemsAvailable) {
+                this.maxItemsAvailable = Math.max(this.maxItemsAvailable, this.props.itemsAvailable);
+            }
+            if (this.props.searchBarValue !== prevProps.searchBarValue) {
+                this.maxItemsAvailable = 0;
+            }
+        }
+
         render() {
             const {
                 columns,
@@ -326,7 +337,7 @@ export const DataExplorer = withStyles(styles)(
                                     ) : (
                                         <Grid className={classes.loadMoreContainer}>
                                             <Typography  className={classes.numResults}>
-                                                Showing {items.length} / {itemsAvailable} results
+                                                Showing {items.length} / {this.maxItemsAvailable} results
                                             </Typography>
                                             <Button
                                                 size="small"

diff --git a/services/workbench2/src/views-components/data-explorer/data-explorer.tsx b/services/workbench2/src/views-components/data-explorer/data-explorer.tsx
index c2cea62a8b21819b3a85c505dd3d69893a8e969b..21818fac30363f2342fe08b5611ba608bc941ee9 100644 (file)
--- a/services/workbench2/src/views-components/data-explorer/data-explorer.tsx
+++ b/services/workbench2/src/views-components/data-explorer/data-explorer.tsx
@@ -22,7 +22,7 @@ interface Props {
     working?: boolean;
 }
 
-const mapStateToProps = ({ progressIndicator, dataExplorer, router, multiselect, detailsPanel, properties}: RootState, { id }: Props) => {
+const mapStateToProps = ({ progressIndicator, dataExplorer, router, multiselect, detailsPanel, properties, searchBar}: RootState, { id }: Props) => {
     const working = !!progressIndicator.some(p => p.working);
     const dataExplorerState = getDataExplorer(dataExplorer, id);
     const currentRoute = router.location ? router.location.pathname : "";
@@ -39,6 +39,7 @@ const mapStateToProps = ({ progressIndicator, dataExplorer, router, multiselect,
         isMSToolbarVisible,
         checkedList: multiselect.checkedList,
         working,
+        searchBarValue: searchBar.searchValue,
     };
 };