Add keyboard shortcut to open settings drawer

Fixes: #65 

1 files changed, 26 insertions, 0 deletions

diff --git a/app/features/settings/components/SettingsButton.js b/app/features/settings/components/SettingsButton.js
index 6d030cc..aee13c2 100644
--- a/app/features/settings/components/SettingsButton.js
+++ b/app/features/settings/components/SettingsButton.js
@@ -2,6 +2,9 @@
 
 import SettingsIcon from '@atlaskit/icon/glyph/settings';
 
+import * as Mousetrap from 'mousetrap';
+import 'mousetrap/plugins/global-bind/mousetrap-global-bind';
+
 import React, { Component } from 'react';
 import { connect } from 'react-redux';
 import type { Dispatch } from 'redux';
@@ -19,6 +22,11 @@ type Props = {
 };
 
 /**
+ * Shortcut keys by which the drawer will open.
+ */
+const drawerShortcut = [ 'command+,', 'ctrl+shift+s' ];
+
+/**
  * Setttings button for Navigation Bar.
  */
 class SettingButton extends Component<Props, *> {
@@ -34,6 +42,24 @@ class SettingButton extends Component<Props, *> {
     }
 
     /**
+     * Bind shortcut when the component did mount.
+     *
+     * @returns {void}
+     */
+    componentDidMount() {
+        Mousetrap.bindGlobal(drawerShortcut, this._onIconClick);
+    }
+
+    /**
+     * Bind shortcut when the component before unmount.
+     *
+     * @returns {void}
+     */
+    componentWillUnmount() {
+        Mousetrap.unbind(drawerShortcut);
+    }
+
+    /**
      * Render function of component.
      *
      * @returns {ReactElement}