From: Daniel Kutyła <daniel.kutyla@contractors.roche.com>
Date: Fri, 17 Dec 2021 23:09:37 +0000 (+0100)
Subject: Merge remote-tracking branch 'origin/main' into 18207-Workbench2-is-not-clearing... 
X-Git-Tag: 2.4.0~17^2~4
X-Git-Url: https://git.arvados.org/arvados-workbench2.git/commitdiff_plain/394ebdfd13fe40a7096f484c46a353d2537f4c9a?hp=-c

Merge remote-tracking branch 'origin/main' into 18207-Workbench2-is-not-clearing-the-project-content-when-switching

Arvados-DCO-1.1-Signed-off-by: Daniel Kutyła <daniel.kutyla@contractors.roche.com>
---

394ebdfd13fe40a7096f484c46a353d2537f4c9a
diff --combined src/components/data-table/data-table.tsx
index 79a94599,de52d365..9a31cbfd
--- a/src/components/data-table/data-table.tsx
+++ b/src/components/data-table/data-table.tsx
@@@ -3,7 -3,7 +3,7 @@@
  // SPDX-License-Identifier: AGPL-3.0
  
  import React from 'react';
 -import { Table, TableBody, TableRow, TableCell, TableHead, TableSortLabel, StyleRulesCallback, Theme, WithStyles, withStyles, IconButton } from '@material-ui/core';
 +import { Table, TableBody, TableRow, TableCell, TableHead, TableSortLabel, StyleRulesCallback, Theme, WithStyles, withStyles, IconButton, CircularProgress } from '@material-ui/core';
  import classnames from 'classnames';
  import { DataColumn, SortDirection } from './data-column';
  import { DataTableDefaultView } from '../data-table-default-view/data-table-default-view';
@@@ -35,28 -35,19 +35,26 @@@ export interface DataTableDataProps<T> 
      currentRoute?: string;
  }
  
 -type CssRules = "tableBody" | "root" | "content" | "noItemsInfo" | 'tableCell' | 'arrow' | 'arrowButton' | 'tableCellWorkflows';
 +type CssRules = "tableBody" | "root" | "content" | "noItemsInfo" | 'tableCell' | 'arrow' | 'arrowButton' | 'tableCellWorkflows' | 'loader';
  
  const styles: StyleRulesCallback<CssRules> = (theme: Theme) => ({
      root: {
-         overflowX: 'auto',
-         overflowY: 'auto',
-         height: 'calc(100vh - 280px)',
+         width: '100%',
      },
      content: {
          display: 'inline-block',
-         width: '100%'
+         width: '100%',
      },
      tableBody: {
          background: theme.palette.background.paper
      },
 +    loader: {
 +        top: '50%',
 +        left: '50%',
 +        marginTop: '-15px',
 +        marginLeft: '-15px',
 +        position: 'absolute'
 +    },
      noItemsInfo: {
          textAlign: "center",
          padding: theme.spacing.unit
@@@ -99,13 -90,7 +97,13 @@@ export const DataTable = withStyles(sty
                              </TableRow>
                          </TableHead>
                          <TableBody className={classes.tableBody}>
 -                            {items.map(this.renderBodyRow)}
 +                            {
 +                                this.props.working ? 
 +                                    <div>
 +                                        <CircularProgress className={classes.loader} size={30} />
 +                                    </div> :
 +                                    items.map(this.renderBodyRow)
 +                            }
                          </TableBody>
                      </Table>
                      {items.length === 0 && this.props.working !== undefined && !this.props.working && this.renderNoItemsPlaceholder()}
diff --combined src/views-components/context-menu/action-sets/collection-files-action-set.ts
index 3aeec4c0,59a5f368..7e08eef0
--- a/src/views-components/context-menu/action-sets/collection-files-action-set.ts
+++ b/src/views-components/context-menu/action-sets/collection-files-action-set.ts
@@@ -4,7 -4,7 +4,7 @@@
  
  import { ContextMenuActionSet } from "views-components/context-menu/context-menu-action-set";
  import { collectionPanelFilesAction, openMultipleFilesRemoveDialog } from "store/collection-panel/collection-panel-files/collection-panel-files-actions";
--import { openCollectionPartialCopyDialog, openCollectionPartialCopyToSelectedCollectionDialog } from 'store/collections/collection-partial-copy-actions';
++import { openCollectionPartialCopyDialog } from 'store/collections/collection-partial-copy-actions';
  
  // These action sets are used on the multi-select actions button.
  export const readOnlyCollectionFilesActionSet: ContextMenuActionSet = [[
@@@ -26,12 -26,13 +26,13 @@@
              dispatch<any>(openCollectionPartialCopyDialog());
          }
      },
-     {
-         name: "Copy selected into the collection",
-         execute: dispatch => {
-             dispatch<any>(openCollectionPartialCopyToSelectedCollectionDialog());
-         }
-     }
+     // Disabled while addressing #18587
+     // {
+     //     name: "Copy selected into the collection",
+     //     execute: dispatch => {
+     //         dispatch<any>(openCollectionPartialCopyToSelectedCollectionDialog());
+     //     }
+     // }
  ]];
  
  export const collectionFilesActionSet: ContextMenuActionSet = readOnlyCollectionFilesActionSet.concat([[
diff --combined src/views/project-panel/project-panel.tsx
index 80663330,4a3f60a6..ab11593d
--- a/src/views/project-panel/project-panel.tsx
+++ b/src/views/project-panel/project-panel.tsx
@@@ -51,9 -51,7 +51,7 @@@ type CssRules = 'root' | "button"
  
  const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
      root: {
-         position: 'relative',
          width: '100%',
-         height: '100%'
      },
      button: {
          marginLeft: theme.spacing.unit
@@@ -133,37 -131,22 +131,37 @@@ interface ProjectPanelDataProps 
      resources: ResourcesState;
      isAdmin: boolean;
      userUuid: string;
 +    dataExplorerItems: any;
  }
  
  type ProjectPanelProps = ProjectPanelDataProps & DispatchProp
      & WithStyles<CssRules> & RouteComponentProps<{ id: string }>;
  
 +let data: any[] = [];
 +let href: string = '';
 +
  export const ProjectPanel = withStyles(styles)(
      connect((state: RootState) => ({
          currentItemId: getProperty(PROJECT_PANEL_CURRENT_UUID)(state.properties),
          resources: state.resources,
          userUuid: state.auth.user!.uuid,
 +        dataExplorerItems: state.dataExplorer?.projectPanel.items,
      }))(
          class extends React.Component<ProjectPanelProps> {
              render() {
 -                const { classes } = this.props;
 +                const { classes, dataExplorerItems } = this.props;
 +                let loading = false;
 +
 +                if (dataExplorerItems.length > 0 && data === dataExplorerItems && href !== window.location.href) {
 +                    loading = true
 +                } else {
 +                    href = window.location.href;
 +                    data = dataExplorerItems;
 +                }
 +
-                 return <div className={classes.root}>
+                 return <div data-cy='project-panel' className={classes.root}>
                      <DataExplorer
 +                        working={loading}
                          id={PROJECT_PANEL_ID}
                          onRowClick={this.handleRowClick}
                          onRowDoubleClick={this.handleRowDoubleClick}