15768: reomve works except for 403 Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa...

diff --git a/src/components/multiselectToolbar/MultiselectToolbar.tsx b/src/components/multiselectToolbar/MultiselectToolbar.tsx
index 94570c6c7ddc3bb319a539f09a92fbba8de75680..9e36289c2c7d337a5d65948a17fce4e7c91f79b4 100644 (file)
--- a/src/components/multiselectToolbar/MultiselectToolbar.tsx
+++ b/src/components/multiselectToolbar/MultiselectToolbar.tsx
@@ -7,8 +7,13 @@ import { connect } from 'react-redux';
 import { StyleRulesCallback, withStyles, WithStyles, Toolbar, Button } from '@material-ui/core';
 import { ArvadosTheme } from 'common/custom-theme';
 import { RootState } from 'store/store';
+import { Dispatch } from 'redux';
 import { CopyToClipboardSnackbar } from 'components/copy-to-clipboard-snackbar/copy-to-clipboard-snackbar';
 import { TCheckedList } from 'components/data-table/data-table';
+import { openRemoveProcessDialog } from 'store/processes/processes-actions';
+import { processResourceActionSet } from '../../views-components/context-menu/action-sets/process-resource-action-set';
+import { ContextMenuResource } from 'store/context-menu/context-menu-actions';
+import { toggleTrashed } from 'store/trash/trash-actions';
 
 type CssRules = 'root' | 'button';
 
@@ -19,43 +24,50 @@ const styles: StyleRulesCallback<CssRules> = (theme: ArvadosTheme) => ({
     },
     button: {
         color: theme.palette.text.primary,
-        margin: '0.5rem',
+        // margin: '0.5rem',
     },
 });
 
 type MultiselectToolbarAction = {
-    fn: (checkedList) => ReactElement;
-};
-
-export type MultiselectToolbarProps = {
-    buttons: Array<MultiselectToolbarAction>;
-    checkedList: TCheckedList;
+    name: string;
+    fn: string;
 };
 
 export const defaultActions: Array<MultiselectToolbarAction> = [
+    // {
+    //     name: 'copy',
+    //     fn: (name, checkedList) => MSToolbarCopyButton(name, checkedList),
+    // },
     {
-        fn: (checkedList) => MSToolbarCopyButton(checkedList),
+        name: 'remove',
+        fn: 'REMOVE',
     },
 ];
 
-const MSToolbarCopyButton = (checkedList) => {
-    let stringifiedSelectedList: string = '';
-    for (const [key, value] of Object.entries(checkedList)) {
-        if (value === true) {
-            stringifiedSelectedList += key + '\n';
-        }
-    }
-    return <CopyToClipboardSnackbar value={stringifiedSelectedList} children={<div>Copy</div>} />;
+export type MultiselectToolbarProps = {
+    buttons: Array<MultiselectToolbarAction>;
+    checkedList: TCheckedList;
+    copySelected: () => void;
+    removeSelected: (selectedList: TCheckedList) => void;
 };
 
-export const MultiselectToolbar = connect(mapStateToProps)(
+export const MultiselectToolbar = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(
     withStyles(styles)((props: MultiselectToolbarProps & WithStyles<CssRules>) => {
+        console.log(props);
+        const actions = {
+            COPY: props.copySelected,
+            REMOVE: props.removeSelected,
+        };
+
         const { classes, buttons, checkedList } = props;
         return (
             <Toolbar className={classes.root}>
-                {buttons.map((btn, i) => (
-                    <Button key={i} className={classes.button}>
-                        {btn.fn(checkedList)}
+                {buttons.map((btn) => (
+                    <Button key={btn.name} className={classes.button} onClick={() => actions[btn.fn](checkedList)}>
+                        {btn.name}
                     </Button>
                 ))}
             </Toolbar>
@@ -63,8 +75,41 @@ export const MultiselectToolbar = connect(mapStateToProps)(
     })
 );
 
+function selectedToString(checkedList: TCheckedList) {
+    let stringifiedSelectedList: string = '';
+    for (const [key, value] of Object.entries(checkedList)) {
+        if (value === true) {
+            stringifiedSelectedList += key + ',';
+        }
+    }
+    return stringifiedSelectedList.slice(0, -1);
+}
+
+function selectedToArray<T>(checkedList: TCheckedList): Array<T | string> {
+    const arrayifiedSelectedList: Array<string> = [];
+    for (const [key, value] of Object.entries(checkedList)) {
+        if (value === true) {
+            arrayifiedSelectedList.push(key);
+        }
+    }
+    return arrayifiedSelectedList;
+}
+
 function mapStateToProps(state: RootState) {
+    // console.log(state.resources, state.multiselect.checkedList);
+    return {
+        checkedList: state.multiselect.checkedList as TCheckedList,
+        // selectedList: state.multiselect.checkedList.forEach(processUUID=>containerRequestUUID)
+    };
+}
+
+function mapDispatchToProps(dispatch: Dispatch) {
     return {
-        checkedList: state.multiselect.checkedList,
+        copySelected: () => {},
+        removeSelected: (selectedList) => removeMany(dispatch, selectedList),
     };
 }
+
+function removeMany(dispatch: Dispatch, checkedList: TCheckedList): void {
+    selectedToArray(checkedList).forEach((uuid: string) => dispatch<any>(openRemoveProcessDialog(uuid)));
+}

diff --git a/src/store/store.ts b/src/store/store.ts
index b6edaaef2d17a83c22b6fd44ffd3934c09b24b53..f4b82cb9144aa668a9c16e5b4198956a4d9020c3 100644 (file)
--- a/src/store/store.ts
+++ b/src/store/store.ts
@@ -113,6 +113,7 @@ export function configureStore(history: History, services: ServiceRepository, co
     const publicFavoritesMiddleware = dataExplorerMiddleware(new PublicFavoritesMiddlewareService(services, PUBLIC_FAVORITE_PANEL_ID));
     const collectionsContentAddress = dataExplorerMiddleware(new CollectionsWithSameContentAddressMiddlewareService(services, COLLECTIONS_CONTENT_ADDRESS_PANEL_ID));
     const subprocessMiddleware = dataExplorerMiddleware(new SubprocessMiddlewareService(services, SUBPROCESS_PANEL_ID));
+
     const redirectToMiddleware = (store: any) => (next: any) => (action: any) => {
         const state = store.getState();