refs #14186 Merge branch 'origin/14186-progress-indicator-store'

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

diff --git a/src/components/data-table/data-table.tsx b/src/components/data-table/data-table.tsx
index 0b3819ac8072698058185a8c67c82264921eda96..25d81c62fa7dc89a8135c8a718c5dc02800d22a6 100644 (file)
--- a/src/components/data-table/data-table.tsx
+++ b/src/components/data-table/data-table.tsx
@@ -19,6 +19,7 @@ export interface DataTableDataProps<T> {
     onSortToggle: (column: DataColumn<T>) => void;
     onFiltersChange: (filters: DataTableFilterItem[], column: DataColumn<T>) => void;
     extractKey?: (item: T) => React.Key;
+    working?: boolean;
     defaultView?: React.ReactNode;
 }
 
@@ -31,6 +32,7 @@ const styles: StyleRulesCallback<CssRules> = (theme: Theme) => ({
     },
     content: {
         display: 'inline-block',
+        width: '100%'
     },
     tableBody: {
         background: theme.palette.background.paper
@@ -62,7 +64,7 @@ export const DataTable = withStyles(styles)(
                             {items.map(this.renderBodyRow)}
                         </TableBody>
                     </Table>
-                    {items.length === 0 && this.renderNoItemsPlaceholder()}
+                    {items.length === 0 && this.props.working !== undefined && !this.props.working && this.renderNoItemsPlaceholder()}
                 </div>
             </div>;
         }
@@ -70,7 +72,7 @@ export const DataTable = withStyles(styles)(
         renderNoItemsPlaceholder = () => {
             return this.props.defaultView
                 ? this.props.defaultView
-                : <DataTableDefaultView />;
+                : <DataTableDefaultView/>;
         }
 
         renderHeadCell = (column: DataColumn<T>, index: number) => {