Permalink
Browse files

Implement a context menu for pilots list items

  • Loading branch information...
markerikson committed Jul 16, 2017
1 parent 958a2c3 commit 70208eae474ba5744b7fbec926d5eed690ac5310
@@ -3,12 +3,15 @@ import {connect} from "react-redux";
import Portal from 'react-portal';
import ContextMenu from "./ContextMenu";
import TestContextMenu from "./TestContextMenu";
import PilotsListItemMenu from "features/pilots/PilotsList/PilotsListItemMenu";
import {selectContextMenu} from "./contextMenuSelectors";
const menuTypes = {
TestContextMenu
TestContextMenu,
PilotsListItemMenu
};
@@ -0,0 +1,43 @@
import React, { Component } from 'react'
import {connect} from "react-redux";
import { Menu } from 'semantic-ui-react'
import {selectPilot} from "../pilotsActions";
import {deleteEntity} from "features/entities/entityActions";
import {hideContextMenu} from "features/contextMenus/contextMenuActions";
const actions = {
selectPilot,
deleteEntity,
hideContextMenu,
}
export class PilotsListItemMenu extends Component {
onSelectClicked = () => {
this.props.selectPilot(this.props.pilotId);
this.props.hideContextMenu();
}
onDeleteClicked = () => {
this.props.deleteEntity("Pilot", this.props.pilotId);
this.props.hideContextMenu();
}
render() {
return (
<Menu vertical>
<Menu.Item>
<Menu.Header>Pilot: {this.props.text} </Menu.Header>
<Menu.Menu>
<Menu.Item onClick={this.onSelectClicked}>Select Pilot</Menu.Item>
<Menu.Item onClick={this.onDeleteClicked}>Delete Pilot</Menu.Item>
</Menu.Menu>
</Menu.Item>
</Menu>
)
}
}
export default connect(null, actions)(PilotsListItemMenu);
@@ -9,6 +9,7 @@ import _ from "lodash";
import {getEntitiesSession} from "features/entities/entitySelectors";
import {deleteEntity} from "features/entities/entityActions";
import {showContextMenu} from "features/contextMenus/contextMenuActions";
const mapState = (state, ownProps) => {
@@ -45,10 +46,11 @@ const mapState = (state, ownProps) => {
const actions = {
deleteEntity,
showContextMenu,
};
const PilotsListRow = ({pilot={}, onPilotClicked=_.noop, selected, deleteEntity}) => {
const PilotsListRow = ({pilot={}, onPilotClicked=_.noop, selected, deleteEntity, showContextMenu}) => {
const {
id = null,
name = "",
@@ -67,9 +69,17 @@ const PilotsListRow = ({pilot={}, onPilotClicked=_.noop, selected, deleteEntity}
const onRowClicked = () => onPilotClicked(id);
const onRowRightClicked = (e) => {
e.preventDefault();
e.stopPropagation();
const {pageX, pageY} = e;
showContextMenu(pageX, pageY, "PilotsListItemMenu", {text: pilot.name, pilotId : id});
}
return (
<Table.Row onClick={onRowClicked} active={selected}>
<Table.Row onClick={onRowClicked} onContextMenu={onRowRightClicked} active={selected}>
<Table.Cell>
{name}
</Table.Cell>

0 comments on commit 70208ea

Please sign in to comment.