15768: proper buttons installed Arvados-DCO-1.1-Signed-off-by: Lisa Knox <lisa.knox...

diff --git a/src/components/data-explorer/data-explorer.tsx b/src/components/data-explorer/data-explorer.tsx
index 82ce5603dc84fd22d9bb3cad08a76d47cd842abf..8d16aed2e17968430cacbdf1c1e35064c8d05e26 100644 (file)
--- a/src/components/data-explorer/data-explorer.tsx
+++ b/src/components/data-explorer/data-explorer.tsx
@@ -14,7 +14,7 @@ import { DataTableFilters } from 'components/data-table-filters/data-table-filte
 import { CloseIcon, IconType, MaximizeIcon, UnMaximizeIcon, MoreOptionsIcon } from 'components/icon/icon';
 import { PaperProps } from '@material-ui/core/Paper';
 import { MPVPanelProps } from 'components/multi-panel-view/multi-panel-view';
-import MultiselectToolbar from 'components/multiselectToolbar/MultiselectToolbar';
+import { MultiselectToolbar, defaultActions } from 'components/multiselectToolbar/MultiselectToolbar';
 
 type CssRules = 'searchBox' | 'headerMenu' | 'toolbar' | 'footer' | 'root' | 'moreOptionsButton' | 'title' | 'dataTable' | 'container';
 
@@ -228,7 +228,7 @@ export const DataExplorer = withStyles(styles)(
                                             </Tooltip>
                                         )}
                                     </Toolbar>
-                                    {isMSToolbarVisible && <MultiselectToolbar />}
+                                    {isMSToolbarVisible && <MultiselectToolbar actions={defaultActions} />}
                                 </Grid>
                             )}
                         </div>

diff --git a/src/components/multiselectToolbar/MultiselectToolbar.tsx b/src/components/multiselectToolbar/MultiselectToolbar.tsx
index 46c33ee3f9346b3cd50cfd7046162b0b024ccc2d..ea00860d26f38ca12de85dc9e4679039203c6887 100644 (file)
--- a/src/components/multiselectToolbar/MultiselectToolbar.tsx
+++ b/src/components/multiselectToolbar/MultiselectToolbar.tsx
@@ -4,7 +4,7 @@
 
 import React from 'react';
 import { connect } from 'react-redux';
-import { StyleRulesCallback, withStyles, WithStyles, Toolbar } from '@material-ui/core';
+import { StyleRulesCallback, withStyles, WithStyles, Toolbar, Button } from '@material-ui/core';
 import { ArvadosTheme } from 'common/custom-theme';
 import { RootState } from 'store/store';
 
@@ -26,19 +26,29 @@ type MultiselectToolbarAction = {
     fn: () => void;
 };
 
-export type MultiselectToolbarActions = MultiselectToolbarAction[];
+export type MultiselectToolbarActions = {
+    actions: Array<MultiselectToolbarAction>;
+};
+
+export const defaultActions: Array<MultiselectToolbarAction> = [
+    {
+        name: 'foo',
+        fn: () => console.log('yo'),
+    },
+];
 
-// type MultiselectToolbarProps = MultiselectToolbarActions & WithStyles<CssRules>;
-type MultiselectToolbarProps = WithStyles<CssRules>;
+type MultiselectToolbarProps = MultiselectToolbarActions & WithStyles<CssRules>;
 
-export default connect(mapStateToProps)(
+export const MultiselectToolbar = connect(mapStateToProps)(
     withStyles(styles)((props: MultiselectToolbarProps) => {
-        const { classes } = props;
+        const { classes, actions } = props;
         return (
             <Toolbar className={classes.root}>
-                <div className={classes.item}>test1</div>
-                <div className={classes.item}>test2</div>
-                <div className={classes.item}>test3</div>
+                {actions.map((action, i) => (
+                    <Button key={i} onClick={action.fn}>
+                        {action.name}
+                    </Button>
+                ))}
             </Toolbar>
         );
     })