diff options
Diffstat (limited to 'src/components/layout/Sidebar.js')
-rw-r--r-- | src/components/layout/Sidebar.js | 35 |
1 files changed, 23 insertions, 12 deletions
diff --git a/src/components/layout/Sidebar.js b/src/components/layout/Sidebar.js index 802538eba..daa5642c3 100644 --- a/src/components/layout/Sidebar.js +++ b/src/components/layout/Sidebar.js | |||
@@ -6,16 +6,13 @@ import { inject, observer } from 'mobx-react'; | |||
6 | import { Link } from 'react-router'; | 6 | import { Link } from 'react-router'; |
7 | 7 | ||
8 | import Tabbar from '../services/tabs/Tabbar'; | 8 | import Tabbar from '../services/tabs/Tabbar'; |
9 | import { ctrlKey, isMac } from '../../environment'; | 9 | import { settingsShortcutKey, lockFerdiShortcutKey, todosToggleShortcutKey, workspaceToggleShortcutKey, addNewServiceShortcutKey, muteFerdiShortcutKey } from '../../environment'; |
10 | import { workspaceStore } from '../../features/workspaces'; | 10 | import { workspaceStore } from '../../features/workspaces'; |
11 | import { todosStore } from '../../features/todos'; | 11 | import { todosStore } from '../../features/todos'; |
12 | import { todoActions } from '../../features/todos/actions'; | 12 | import { todoActions } from '../../features/todos/actions'; |
13 | import AppStore from '../../stores/AppStore'; | 13 | import AppStore from '../../stores/AppStore'; |
14 | import SettingsStore from '../../stores/SettingsStore'; | 14 | import SettingsStore from '../../stores/SettingsStore'; |
15 | 15 | ||
16 | // Platform specific shortcut keys | ||
17 | const settingsShortcutKey = isMac ? ',' : 'P'; | ||
18 | |||
19 | const messages = defineMessages({ | 16 | const messages = defineMessages({ |
20 | settings: { | 17 | settings: { |
21 | id: 'sidebar.settings', | 18 | id: 'sidebar.settings', |
@@ -58,6 +55,19 @@ const messages = defineMessages({ | |||
58 | export default @inject('stores', 'actions') @observer class Sidebar extends Component { | 55 | export default @inject('stores', 'actions') @observer class Sidebar extends Component { |
59 | static propTypes = { | 56 | static propTypes = { |
60 | openSettings: PropTypes.func.isRequired, | 57 | openSettings: PropTypes.func.isRequired, |
58 | closeSettings: PropTypes.func.isRequired, | ||
59 | setActive: PropTypes.func.isRequired, | ||
60 | reorder: PropTypes.func.isRequired, | ||
61 | reload: PropTypes.func.isRequired, | ||
62 | toggleNotifications: PropTypes.func.isRequired, | ||
63 | toggleAudio: PropTypes.func.isRequired, | ||
64 | toggleDarkMode: PropTypes.func.isRequired, | ||
65 | showMessageBadgeWhenMutedSetting: PropTypes.bool.isRequired, | ||
66 | showMessageBadgesEvenWhenMuted: PropTypes.bool.isRequired, | ||
67 | deleteService: PropTypes.func.isRequired, | ||
68 | updateService: PropTypes.func.isRequired, | ||
69 | hibernateService: PropTypes.func.isRequired, | ||
70 | wakeUpService: PropTypes.func.isRequired, | ||
61 | toggleMuteApp: PropTypes.func.isRequired, | 71 | toggleMuteApp: PropTypes.func.isRequired, |
62 | isAppMuted: PropTypes.bool.isRequired, | 72 | isAppMuted: PropTypes.bool.isRequired, |
63 | isWorkspaceDrawerOpen: PropTypes.bool.isRequired, | 73 | isWorkspaceDrawerOpen: PropTypes.bool.isRequired, |
@@ -139,7 +149,7 @@ export default @inject('stores', 'actions') @observer class Sidebar extends Comp | |||
139 | }, | 149 | }, |
140 | }); | 150 | }); |
141 | }} | 151 | }} |
142 | data-tip={`${intl.formatMessage(messages.lockFerdi)} (${ctrlKey}+Shift+L)`} | 152 | data-tip={`${intl.formatMessage(messages.lockFerdi)} (${lockFerdiShortcutKey(false)})`} |
143 | > | 153 | > |
144 | <i className="mdi mdi-lock" /> | 154 | <i className="mdi mdi-lock" /> |
145 | </button> | 155 | </button> |
@@ -152,8 +162,8 @@ export default @inject('stores', 'actions') @observer class Sidebar extends Comp | |||
152 | this.updateToolTip(); | 162 | this.updateToolTip(); |
153 | }} | 163 | }} |
154 | disabled={isTodosServiceActive} | 164 | disabled={isTodosServiceActive} |
155 | className={`sidebar__button sidebar__button--todos ${todosStore.isTodosPanelVisible ? 'is-active' : ''}`} | 165 | className={`sidebar__button sidebar__button--todos ${todosStore.isTodosPanelVisible ? 'is-active' : ''}`} |
156 | data-tip={`${intl.formatMessage(todosToggleMessage)} (${ctrlKey}+T)`} | 166 | data-tip={`${intl.formatMessage(todosToggleMessage)} (${todosToggleShortcutKey(false)})`} |
157 | > | 167 | > |
158 | <i className="mdi mdi-check-all" /> | 168 | <i className="mdi mdi-check-all" /> |
159 | </button> | 169 | </button> |
@@ -166,7 +176,7 @@ export default @inject('stores', 'actions') @observer class Sidebar extends Comp | |||
166 | this.updateToolTip(); | 176 | this.updateToolTip(); |
167 | }} | 177 | }} |
168 | className={`sidebar__button sidebar__button--workspaces ${isWorkspaceDrawerOpen ? 'is-active' : ''}`} | 178 | className={`sidebar__button sidebar__button--workspaces ${isWorkspaceDrawerOpen ? 'is-active' : ''}`} |
169 | data-tip={`${intl.formatMessage(workspaceToggleMessage)} (${ctrlKey}+D)`} | 179 | data-tip={`${intl.formatMessage(workspaceToggleMessage)} (${workspaceToggleShortcutKey(false)})`} |
170 | > | 180 | > |
171 | <i className="mdi mdi-view-grid" /> | 181 | <i className="mdi mdi-view-grid" /> |
172 | </button> | 182 | </button> |
@@ -178,7 +188,7 @@ export default @inject('stores', 'actions') @observer class Sidebar extends Comp | |||
178 | this.updateToolTip(); | 188 | this.updateToolTip(); |
179 | }} | 189 | }} |
180 | className={`sidebar__button sidebar__button--audio ${isAppMuted ? 'is-muted' : ''}`} | 190 | className={`sidebar__button sidebar__button--audio ${isAppMuted ? 'is-muted' : ''}`} |
181 | data-tip={`${intl.formatMessage(isAppMuted ? messages.unmute : messages.mute)} (${ctrlKey}+Shift+M)`} | 191 | data-tip={`${intl.formatMessage(isAppMuted ? messages.unmute : messages.mute)} (${muteFerdiShortcutKey(false)})`} |
182 | > | 192 | > |
183 | <i className={`mdi mdi-bell${isAppMuted ? '-off' : ''}`} /> | 193 | <i className={`mdi mdi-bell${isAppMuted ? '-off' : ''}`} /> |
184 | </button> | 194 | </button> |
@@ -186,7 +196,7 @@ export default @inject('stores', 'actions') @observer class Sidebar extends Comp | |||
186 | type="button" | 196 | type="button" |
187 | onClick={() => openSettings({ path: 'recipes' })} | 197 | onClick={() => openSettings({ path: 'recipes' })} |
188 | className="sidebar__button sidebar__button--new-service" | 198 | className="sidebar__button sidebar__button--new-service" |
189 | data-tip={`${intl.formatMessage(messages.addNewService)} (${ctrlKey}+N)`} | 199 | data-tip={`${intl.formatMessage(messages.addNewService)} (${addNewServiceShortcutKey(false)})`} |
190 | > | 200 | > |
191 | <i className="mdi mdi-plus-box" /> | 201 | <i className="mdi mdi-plus-box" /> |
192 | </button> | 202 | </button> |
@@ -204,9 +214,10 @@ export default @inject('stores', 'actions') @observer class Sidebar extends Comp | |||
204 | type="button" | 214 | type="button" |
205 | onClick={() => openSettings({ path: 'app' })} | 215 | onClick={() => openSettings({ path: 'app' })} |
206 | className="sidebar__button sidebar__button--settings" | 216 | className="sidebar__button sidebar__button--settings" |
207 | data-tip={`${intl.formatMessage(messages.settings)} (${ctrlKey}+${settingsShortcutKey})`} | 217 | data-tip={`${intl.formatMessage(messages.settings)} (${settingsShortcutKey(false)})`} |
208 | > | 218 | > |
209 | <i className="mdi mdi-settings" /> | 219 | {/* TODO: Because of https://github.com/Templarian/MaterialDesign-Webfont/issues/81 bug in @mdi/font in 5.9.55, added `mdi-memory` as a fallback */} |
220 | <i className="mdi mdi-settings mdi-memory" /> | ||
210 | { (this.props.stores.app.updateStatus === this.props.stores.app.updateStatusTypes.AVAILABLE | 221 | { (this.props.stores.app.updateStatus === this.props.stores.app.updateStatusTypes.AVAILABLE |
211 | || this.props.stores.app.updateStatus === this.props.stores.app.updateStatusTypes.DOWNLOADED) && ( | 222 | || this.props.stores.app.updateStatus === this.props.stores.app.updateStatusTypes.DOWNLOADED) && ( |
212 | <span className="update-available"> | 223 | <span className="update-available"> |