Merge branch 'main' into 21461-excessive-scrollbars-fix

[arvados.git] / services / workbench2 / src / components / data-table / data-table.tsx

diff --git a/services/workbench2/src/components/data-table/data-table.tsx b/services/workbench2/src/components/data-table/data-table.tsx
index c1b5167b467574cf4bbd2212b82f8a3414c165f1..7b787994577305ea5725b80fcfd942d42f34f360 100644 (file)
--- a/services/workbench2/src/components/data-table/data-table.tsx
+++ b/services/workbench2/src/components/data-table/data-table.tsx
@@ -29,6 +29,7 @@ import { SvgIconProps } from "@material-ui/core/SvgIcon";
 import ArrowDownwardIcon from "@material-ui/icons/ArrowDownward";
 import { createTree } from "models/tree";
 import { DataTableMultiselectOption } from "../data-table-multiselect-popover/data-table-multiselect-popover";
+import { PendingIcon } from "components/icon/icon";
 
 export type DataColumns<I, R> = Array<DataColumn<I, R>>;
 
@@ -168,7 +169,10 @@ export const DataTable = withStyles(styles)(
             if (prevProps.currentRoute !== this.props.currentRoute) {
                 this.initializeCheckedList([])
             }
-            if((prevProps.working === true && this.props.working === false || this.props.items.length > 0) && !this.state.isLoaded) {
+            if(prevProps.working === true && this.props.working === false) {
+                this.setState({ isLoaded: true });
+            }
+            if((this.props.items.length > 0) && !this.state.isLoaded) {
                 this.setState({ isLoaded: true });
             }
         }
@@ -295,7 +299,6 @@ export const DataTable = withStyles(styles)(
             const { isLoaded } = this.state;
             if (columns[0].name === this.checkBoxColumn.name) columns.shift();
             columns.unshift(this.checkBoxColumn);
-            console.log(items)
             return (
                 <div className={classes.root}>
                     <div className={classes.content}>
@@ -315,24 +318,23 @@ export const DataTable = withStyles(styles)(
             const { isLoaded } = this.state;
             const { working, isNotFound } = this.props;
             const dirty = columns.some(column => getTreeDirty("")(column.filters));
-            console.log('isNotFound', isNotFound, 'isLoaded', isLoaded, 'working', working, )
             if (isNotFound && isLoaded) {
                 return (
                     <DataTableDefaultView 
                         icon={this.props.defaultViewIcon} 
-                        messages={["Item not found"]} 
+                        messages={["No items found"]} 
                     />
                 );
             } else 
             if (isLoaded === false || working === true) {
                 return (
                     <DataTableDefaultView 
-                        icon={this.props.defaultViewIcon} 
+                        icon={PendingIcon} 
                         messages={["Loading data, please wait"]} 
                     />
                 );
             } else {
-                //if (isLoaded && !working && !isNotFound)
+                // isLoaded && !working && !isNotFound
                 return (
                     <DataTableDefaultView
                         icon={this.props.defaultViewIcon}
@@ -410,7 +412,6 @@ export const DataTable = withStyles(styles)(
         );
 
         renderBodyRow = (item: any, index: number) => {
-            console.log('item', item)
             const { onRowClick, onRowDoubleClick, extractKey, classes, currentItemUuid, currentRoute } = this.props;
             return (
                 <TableRow