aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
authorNoah Loomans <noahloomans@gmail.com>2018-03-20 15:23:02 +0100
committerNoah Loomans <noahloomans@gmail.com>2018-03-20 15:23:02 +0100
commit32c7951d5e5db2dfde5305707e4d9bf021952db2 (patch)
tree7f8c65b5cc2382c6f30621f101b06143fdd990d0 /src
parent24f2d1ca1f762d0cc634b650cc68591e9b46a9fe (diff)
Properly support keyboard navigation for the menu
Diffstat (limited to 'src')
-rw-r--r--src/client/react/components/container/Menu.js22
1 files changed, 18 insertions, 4 deletions
diff --git a/src/client/react/components/container/Menu.js b/src/client/react/components/container/Menu.js
index 36367ed..f99ed37 100644
--- a/src/client/react/components/container/Menu.js
+++ b/src/client/react/components/container/Menu.js
@@ -30,16 +30,30 @@ class Menu extends React.Component {
dispatch: PropTypes.func.isRequired,
}
+ onItemSelected(index) {
+ switch (index) {
+ case 'room_finder':
+ this.props.dispatch({ type: 'ROOM_FINDER/SHOW' });
+ break;
+ default:
+ // No default
+ }
+ }
+
render() {
return (
<SimpleMenu
handle={<Button><ButtonIcon use="more_vert" /></Button>}
+ onSelected={(event) => {
+ // Send the `data-type` of the selected <MenuItem />
+ this.onItemSelected(event.detail.item.dataset.type);
+ }}
>
- <MenuItem><Icon use="bookmark_border" />Voeg label toe</MenuItem>
- <MenuItem><Icon use="star_border" />Maak favoriet</MenuItem>
+ <MenuItem data-type="add_label"><Icon use="bookmark_border" />Voeg label toe</MenuItem>
+ <MenuItem data-type="make_favorite"><Icon use="star_border" />Maak favoriet</MenuItem>
<div className="mdc-list-divider" role="separator" />
- <MenuItem onClick={() => this.props.dispatch({ type: 'ROOM_FINDER/SHOW' })}><Icon use="location_searching" />Lokaal zoeken</MenuItem>
- <MenuItem><Icon use="launch" />Oud rooster gebruiken</MenuItem>
+ <MenuItem data-type="room_finder"><Icon use="location_searching" />Lokaal zoeken</MenuItem>
+ <MenuItem data-type="use_legacy_schedule"><Icon use="launch" />Oud rooster gebruiken</MenuItem>
</SimpleMenu>
);
}