Merge remote-tracking branch 'origin' into 13694-Data-operations-Project-creation
[arvados-workbench2.git] / src / components / context-menu / context-menu.tsx
index c86c5177a319945cd45635a28bb650d1041cd249..c892ba2616dda6480de47d2c3767596636267917 100644 (file)
@@ -5,30 +5,31 @@ import * as React from "react";
 import { Popover, List, ListItem, ListItemIcon, ListItemText, Divider } from "@material-ui/core";
 import { DefaultTransformOrigin } from "../popover/helpers";
 
-export interface ContextMenuAction<T> {
+export interface ContextMenuAction {
     name: string;
     icon: string;
-    onClick: (item: T) => void;
+    openCreateDialog?: boolean;
 }
 
-export type ContextMenuActionGroup<T> = Array<ContextMenuAction<T>>;
+export type ContextMenuActionGroup = ContextMenuAction[];
 
 export interface ContextMenuProps<T> {
     anchorEl?: HTMLElement;
-    item?: T;
+    actions: ContextMenuActionGroup[];
+    onActionClick: (action: ContextMenuAction) => void;
     onClose: () => void;
-    actions: Array<ContextMenuActionGroup<T>>;
 }
 
 export default class ContextMenu<T> extends React.PureComponent<ContextMenuProps<T>> {
     render() {
-        const { anchorEl, onClose, actions, item } = this.props;
+        const { anchorEl, actions, onClose, onActionClick } = this.props;
         return <Popover
             anchorEl={anchorEl}
-            open={Boolean(anchorEl)}
+            open={!!anchorEl}
             onClose={onClose}
             transformOrigin={DefaultTransformOrigin}
-            anchorOrigin={DefaultTransformOrigin}>
+            anchorOrigin={DefaultTransformOrigin}
+            onContextMenu={this.handleContextMenu}>
             <List dense>
                 {actions.map((group, groupIndex) =>
                     <React.Fragment key={groupIndex}>
@@ -36,7 +37,7 @@ export default class ContextMenu<T> extends React.PureComponent<ContextMenuProps
                             <ListItem
                                 button
                                 key={actionIndex}
-                                onClick={() => item && action.onClick(item)}>
+                                onClick={() => onActionClick(action)}>
                                 <ListItemIcon>
                                     <i className={action.icon} />
                                 </ListItemIcon>
@@ -49,4 +50,9 @@ export default class ContextMenu<T> extends React.PureComponent<ContextMenuProps
             </List>
         </Popover>;
     }
+
+    handleContextMenu = (event: React.MouseEvent<HTMLElement>) => {
+        event.preventDefault();
+        this.props.onClose();
+    }
 }