18195: Added multiple action dispatch in order to refresh left panel

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

diff --git a/cypress/integration/side-panel.spec.js b/cypress/integration/side-panel.spec.js
index 912e68ebfe229c394fdb7287226060f39956202f..59e143ee69a2c2b5155ef7eec370631682c8527c 100644 (file)
--- a/cypress/integration/side-panel.spec.js
+++ b/cypress/integration/side-panel.spec.js
@@ -114,4 +114,37 @@ describe('Side panel tests', function() {
             });
     });
 
+    it('side panel react to refresh when project data changes', () => {
+        const project1 = 'writableProject1';
+        const project2 = 'writableProject2';
+
+        cy.createProject({
+            owningUser: activeUser,
+            targetUser: activeUser,
+            projectName: project1,
+            canWrite: true,
+            addToFavorites: false
+        });
+
+        cy.createProject({
+            owningUser: activeUser,
+            targetUser: activeUser,
+            projectName: project2,
+            canWrite: true,
+            addToFavorites: false
+        });
+
+        cy.getAll('@writableProject1', '@writableProject2')
+            .then(function ([writableProject1, writableProject2]) {
+                cy.loginAs(activeUser);
+                
+                cy.get('[data-cy=side-panel-tree]').contains('Projects').click();
+
+                cy.trashGroup(activeUser.token, writableProject2.uuid);
+
+                cy.contains('Refresh').click();
+
+                cy.contains(writableProject2.name).should('not.exist');
+            });
+    });
 })

diff --git a/src/components/refresh-button/refresh-button.tsx b/src/components/refresh-button/refresh-button.tsx
index f2c41d28f63769a74f45bfa38f2867d93a2dfefa..9971547bf092a5462b90f4db0e9ee66bb32f43a7 100644 (file)
--- a/src/components/refresh-button/refresh-button.tsx
+++ b/src/components/refresh-button/refresh-button.tsx
@@ -22,13 +22,20 @@ const styles: StyleRulesCallback<CssRules> = theme => ({
     },
 });
 
-export const RefreshButton = ({ history, classes }: RouteComponentProps & WithStyles<CssRules>) =>
+interface RefreshButtonProps {
+    onClick?: () => void;
+}
+
+export const RefreshButton = ({ history, classes, onClick }: RouteComponentProps & WithStyles<CssRules> & RefreshButtonProps) =>
     <Button
         color="primary"
         size="small"
         variant="contained"
         onClick={() => {
             history.replace(window.location.pathname);
+            if (onClick) {
+                onClick();
+            }
         }}
         className={classNames(classes.buttonRight, classes.button)}>
         <ReRunProcessIcon />

diff --git a/src/views-components/main-content-bar/main-content-bar.tsx b/src/views-components/main-content-bar/main-content-bar.tsx
index 6e1368c007d254eeedf4f179ba369cda153addb5..10ae1790da29cff215bb48de177f08bce707ad08 100644 (file)
--- a/src/views-components/main-content-bar/main-content-bar.tsx
+++ b/src/views-components/main-content-bar/main-content-bar.tsx
@@ -12,6 +12,8 @@ import { RootState } from 'store/store';
 import * as Routes from 'routes/routes';
 import { toggleDetailsPanel } from 'store/details-panel/details-panel-action';
 import RefreshButton from "components/refresh-button/refresh-button";
+import { reloadProjectMatchingUuid } from "store/workbench/workbench-actions";
+import { loadSidePanelTreeProjects } from "store/side-panel-tree/side-panel-tree-actions";
 
 type CssRules = "infoTooltip";
 
@@ -55,10 +57,15 @@ const isButtonVisible = ({ router }: RootState) => {
 
 export const MainContentBar =
     connect((state: RootState) => ({
-        buttonVisible: isButtonVisible(state)
-    }), {
+        buttonVisible: isButtonVisible(state),
+        projectUuid: state.detailsPanel.resourceUuid,
+    }), (dispatch) => ({
             onDetailsPanelToggle: toggleDetailsPanel,
-        })(
+            onRefreshButtonClick: (id) => {
+                dispatch<any>(loadSidePanelTreeProjects(id));
+                dispatch<any>(reloadProjectMatchingUuid([id]));
+            }
+        }))(
             withStyles(styles)(
                 (props: MainContentBarProps & WithStyles<CssRules> & any) =>
                     <Toolbar>
@@ -67,7 +74,9 @@ export const MainContentBar =
                                 <Breadcrumbs />
                             </Grid>
                             <Grid item>
-                                <RefreshButton />
+                                <RefreshButton onClick={() => {
+                                    props.onRefreshButtonClick(props.projectUuid);
+                                }} />
                             </Grid>
                             <Grid item>
                                 {props.buttonVisible && <Tooltip title="Additional Info">