diff options
author | 2021-08-13 00:45:01 +0530 | |
---|---|---|
committer | 2021-08-13 00:45:01 +0530 | |
commit | 2d27d5e66649d4f5baf127a53ee5ae524eae3a59 (patch) | |
tree | c592ea219ac8cd987fc367f57b54034c450ab2ab /src/features/workspaces/components/WorkspaceDrawerItem.js | |
parent | Ferdi v5.6.0 (diff) | |
parent | 5.6.1-nightly.24 [skip ci] (diff) | |
download | ferdium-app-2d27d5e66649d4f5baf127a53ee5ae524eae3a59.tar.gz ferdium-app-2d27d5e66649d4f5baf127a53ee5ae524eae3a59.tar.zst ferdium-app-2d27d5e66649d4f5baf127a53ee5ae524eae3a59.zip |
chore: merge from nightly branch into release branch in prep for next beta
Diffstat (limited to 'src/features/workspaces/components/WorkspaceDrawerItem.js')
-rw-r--r-- | src/features/workspaces/components/WorkspaceDrawerItem.js | 47 |
1 files changed, 31 insertions, 16 deletions
diff --git a/src/features/workspaces/components/WorkspaceDrawerItem.js b/src/features/workspaces/components/WorkspaceDrawerItem.js index 2e58b70d6..fff607330 100644 --- a/src/features/workspaces/components/WorkspaceDrawerItem.js +++ b/src/features/workspaces/components/WorkspaceDrawerItem.js | |||
@@ -5,7 +5,7 @@ import { observer } from 'mobx-react'; | |||
5 | import injectSheet from 'react-jss'; | 5 | import injectSheet from 'react-jss'; |
6 | import classnames from 'classnames'; | 6 | import classnames from 'classnames'; |
7 | import { defineMessages, intlShape } from 'react-intl'; | 7 | import { defineMessages, intlShape } from 'react-intl'; |
8 | import { ctrlKey } from '../../../environment'; | 8 | import { altKey, shortcutKey } from '../../../environment'; |
9 | 9 | ||
10 | const messages = defineMessages({ | 10 | const messages = defineMessages({ |
11 | noServicesAddedYet: { | 11 | noServicesAddedYet: { |
@@ -18,12 +18,18 @@ const messages = defineMessages({ | |||
18 | }, | 18 | }, |
19 | }); | 19 | }); |
20 | 20 | ||
21 | let itemTransition = 'none'; | ||
22 | |||
23 | if (window && window.matchMedia('(prefers-reduced-motion: no-preference)')) { | ||
24 | itemTransition = 'background-color 300ms ease-out'; | ||
25 | } | ||
26 | |||
21 | const styles = theme => ({ | 27 | const styles = theme => ({ |
22 | item: { | 28 | item: { |
23 | height: '67px', | 29 | height: '67px', |
24 | padding: `15px ${theme.workspaces.drawer.padding}px`, | 30 | padding: `15px ${theme.workspaces.drawer.padding}px`, |
25 | borderBottom: `1px solid ${theme.workspaces.drawer.listItem.border}`, | 31 | borderBottom: `1px solid ${theme.workspaces.drawer.listItem.border}`, |
26 | transition: 'background-color 300ms ease-out', | 32 | transition: itemTransition, |
27 | '&:first-child': { | 33 | '&:first-child': { |
28 | borderTop: `1px solid ${theme.workspaces.drawer.listItem.border}`, | 34 | borderTop: `1px solid ${theme.workspaces.drawer.listItem.border}`, |
29 | }, | 35 | }, |
@@ -59,7 +65,8 @@ const styles = theme => ({ | |||
59 | }, | 65 | }, |
60 | }); | 66 | }); |
61 | 67 | ||
62 | @injectSheet(styles) @observer | 68 | @injectSheet(styles) |
69 | @observer | ||
63 | class WorkspaceDrawerItem extends Component { | 70 | class WorkspaceDrawerItem extends Component { |
64 | static propTypes = { | 71 | static propTypes = { |
65 | classes: PropTypes.object.isRequired, | 72 | classes: PropTypes.object.isRequired, |
@@ -91,15 +98,19 @@ class WorkspaceDrawerItem extends Component { | |||
91 | } = this.props; | 98 | } = this.props; |
92 | const { intl } = this.context; | 99 | const { intl } = this.context; |
93 | 100 | ||
94 | const contextMenuTemplate = [{ | 101 | const contextMenuTemplate = [ |
95 | label: name, | 102 | { |
96 | enabled: false, | 103 | label: name, |
97 | }, { | 104 | enabled: false, |
98 | type: 'separator', | 105 | }, |
99 | }, { | 106 | { |
100 | label: intl.formatMessage(messages.contextMenuEdit), | 107 | type: 'separator', |
101 | click: onContextMenuEditClick, | 108 | }, |
102 | }]; | 109 | { |
110 | label: intl.formatMessage(messages.contextMenuEdit), | ||
111 | click: onContextMenuEditClick, | ||
112 | }, | ||
113 | ]; | ||
103 | 114 | ||
104 | const contextMenu = Menu.buildFromTemplate(contextMenuTemplate); | 115 | const contextMenu = Menu.buildFromTemplate(contextMenuTemplate); |
105 | 116 | ||
@@ -110,10 +121,12 @@ class WorkspaceDrawerItem extends Component { | |||
110 | isActive ? classes.isActiveItem : null, | 121 | isActive ? classes.isActiveItem : null, |
111 | ])} | 122 | ])} |
112 | onClick={onClick} | 123 | onClick={onClick} |
113 | onContextMenu={() => ( | 124 | onContextMenu={() => |
114 | onContextMenuEditClick && contextMenu.popup(getCurrentWindow()) | 125 | onContextMenuEditClick && contextMenu.popup(getCurrentWindow()) |
115 | )} | 126 | } |
116 | data-tip={`${shortcutIndex <= 9 ? `(${ctrlKey}+Alt+${shortcutIndex})` : ''}`} | 127 | data-tip={`${ |
128 | shortcutIndex <= 9 ? `(${shortcutKey(false)}+${altKey}+${shortcutIndex})` : '' | ||
129 | }`} | ||
117 | > | 130 | > |
118 | <span | 131 | <span |
119 | className={classnames([ | 132 | className={classnames([ |
@@ -129,7 +142,9 @@ class WorkspaceDrawerItem extends Component { | |||
129 | isActive ? classes.activeServices : null, | 142 | isActive ? classes.activeServices : null, |
130 | ])} | 143 | ])} |
131 | > | 144 | > |
132 | {services.length ? services.join(', ') : intl.formatMessage(messages.noServicesAddedYet)} | 145 | {services.length |
146 | ? services.join(', ') | ||
147 | : intl.formatMessage(messages.noServicesAddedYet)} | ||
133 | </span> | 148 | </span> |
134 | </div> | 149 | </div> |
135 | ); | 150 | ); |