diff options
author | 2022-06-24 15:29:40 +0100 | |
---|---|---|
committer | 2022-06-24 22:26:52 +0530 | |
commit | 68d4a04a02335493e35545d8d5f43680b64cc9a2 (patch) | |
tree | 785cdb991c3067fef95c648319af8e2104b949fe /src/components | |
parent | fix: disable todos feature by default (#355) (diff) | |
download | ferdium-app-68d4a04a02335493e35545d8d5f43680b64cc9a2.tar.gz ferdium-app-68d4a04a02335493e35545d8d5f43680b64cc9a2.tar.zst ferdium-app-68d4a04a02335493e35545d8d5f43680b64cc9a2.zip |
Add split mode toggle to side bar and hide collapse buttonv6.0.0-nightly-alphrag.57.7
Diffstat (limited to 'src/components')
-rw-r--r-- | src/components/layout/Sidebar.js | 33 | ||||
-rw-r--r-- | src/components/settings/settings/EditSettingsForm.js | 4 |
2 files changed, 35 insertions, 2 deletions
diff --git a/src/components/layout/Sidebar.js b/src/components/layout/Sidebar.js index 0d3a7c20c..1d3c81dcd 100644 --- a/src/components/layout/Sidebar.js +++ b/src/components/layout/Sidebar.js | |||
@@ -14,6 +14,7 @@ import { | |||
14 | mdiMenu, | 14 | mdiMenu, |
15 | mdiChevronDown, | 15 | mdiChevronDown, |
16 | mdiChevronRight, | 16 | mdiChevronRight, |
17 | mdiViewSplitVertical, | ||
17 | } from '@mdi/js'; | 18 | } from '@mdi/js'; |
18 | 19 | ||
19 | import Tabbar from '../services/tabs/Tabbar'; | 20 | import Tabbar from '../services/tabs/Tabbar'; |
@@ -23,6 +24,7 @@ import { | |||
23 | todosToggleShortcutKey, | 24 | todosToggleShortcutKey, |
24 | workspaceToggleShortcutKey, | 25 | workspaceToggleShortcutKey, |
25 | addNewServiceShortcutKey, | 26 | addNewServiceShortcutKey, |
27 | splitModeToggleShortcutKey, | ||
26 | muteFerdiumShortcutKey, | 28 | muteFerdiumShortcutKey, |
27 | } from '../../environment'; | 29 | } from '../../environment'; |
28 | import { todosStore } from '../../features/todos'; | 30 | import { todosStore } from '../../features/todos'; |
@@ -37,6 +39,10 @@ const messages = defineMessages({ | |||
37 | id: 'sidebar.addNewService', | 39 | id: 'sidebar.addNewService', |
38 | defaultMessage: 'Add new service', | 40 | defaultMessage: 'Add new service', |
39 | }, | 41 | }, |
42 | splitModeToggle: { | ||
43 | id: 'sidebar.splitModeToggle', | ||
44 | defaultMessage: 'Split Mode Toggle', | ||
45 | }, | ||
40 | mute: { | 46 | mute: { |
41 | id: 'sidebar.muteApp', | 47 | id: 'sidebar.muteApp', |
42 | defaultMessage: 'Disable notifications & audio', | 48 | defaultMessage: 'Disable notifications & audio', |
@@ -137,11 +143,14 @@ class Sidebar extends Component { | |||
137 | isTodosServiceActive, | 143 | isTodosServiceActive, |
138 | } = this.props; | 144 | } = this.props; |
139 | const { | 145 | const { |
146 | hideCollapseButton, | ||
140 | hideRecipesButton, | 147 | hideRecipesButton, |
141 | hideWorkspacesButton, | 148 | hideWorkspacesButton, |
142 | hideNotificationsButton, | 149 | hideNotificationsButton, |
143 | hideSettingsButton, | 150 | hideSettingsButton, |
144 | useVerticalStyle | 151 | hideSplitModeButton, |
152 | useVerticalStyle, | ||
153 | splitMode, | ||
145 | } = stores.settings.app; | 154 | } = stores.settings.app; |
146 | const { intl } = this.props; | 155 | const { intl } = this.props; |
147 | const todosToggleMessage = todosStore.isTodosPanelVisible | 156 | const todosToggleMessage = todosStore.isTodosPanelVisible |
@@ -157,6 +166,7 @@ class Sidebar extends Component { | |||
157 | !hideWorkspacesButton, | 166 | !hideWorkspacesButton, |
158 | !hideNotificationsButton, | 167 | !hideNotificationsButton, |
159 | !hideSettingsButton, | 168 | !hideSettingsButton, |
169 | !hideSplitModeButton, | ||
160 | todosStore.isFeatureEnabledByUser | 170 | todosStore.isFeatureEnabledByUser |
161 | ].filter(Boolean).length; | 171 | ].filter(Boolean).length; |
162 | 172 | ||
@@ -169,7 +179,7 @@ class Sidebar extends Component { | |||
169 | useVerticalStyle={stores.settings.all.app.useVerticalStyle} | 179 | useVerticalStyle={stores.settings.all.app.useVerticalStyle} |
170 | /> | 180 | /> |
171 | <> | 181 | <> |
172 | {numberActiveButtons <= 1 ? ( | 182 | {numberActiveButtons <= 1 || hideCollapseButton ? ( |
173 | null | 183 | null |
174 | ) : | 184 | ) : |
175 | <button | 185 | <button |
@@ -199,6 +209,25 @@ class Sidebar extends Component { | |||
199 | <Icon icon={mdiPlusBox} size={1.5} /> | 209 | <Icon icon={mdiPlusBox} size={1.5} /> |
200 | </button> | 210 | </button> |
201 | ) : null} | 211 | ) : null} |
212 | {!hideSplitModeButton && !this.state.isCollapsed ? ( | ||
213 | <button | ||
214 | type="button" | ||
215 | onClick={() => { | ||
216 | actions.settings.update({ | ||
217 | type: 'app', | ||
218 | data: { | ||
219 | splitMode: !splitMode, | ||
220 | }, | ||
221 | }); | ||
222 | }} | ||
223 | className="sidebar__button sidebar__button--split-mode-toggle" | ||
224 | data-tip={`${intl.formatMessage( | ||
225 | messages.splitModeToggle, | ||
226 | )} (${splitModeToggleShortcutKey(false)})`} | ||
227 | > | ||
228 | <Icon icon={mdiViewSplitVertical} size={1.5} /> | ||
229 | </button> | ||
230 | ) : null} | ||
202 | {!hideWorkspacesButton && !this.state.isCollapsed ? ( | 231 | {!hideWorkspacesButton && !this.state.isCollapsed ? ( |
203 | <button | 232 | <button |
204 | type="button" | 233 | type="button" |
diff --git a/src/components/settings/settings/EditSettingsForm.js b/src/components/settings/settings/EditSettingsForm.js index 3d46fd376..ce090ea99 100644 --- a/src/components/settings/settings/EditSettingsForm.js +++ b/src/components/settings/settings/EditSettingsForm.js | |||
@@ -679,8 +679,12 @@ class EditSettingsForm extends Component { | |||
679 | 679 | ||
680 | <Toggle field={form.$('useVerticalStyle')} /> | 680 | <Toggle field={form.$('useVerticalStyle')} /> |
681 | 681 | ||
682 | <Toggle field={form.$('hideCollapseButton')} /> | ||
683 | |||
682 | <Toggle field={form.$('hideRecipesButton')} /> | 684 | <Toggle field={form.$('hideRecipesButton')} /> |
683 | 685 | ||
686 | <Toggle field={form.$('hideSplitModeButton')} /> | ||
687 | |||
684 | <Toggle field={form.$('hideWorkspacesButton')} /> | 688 | <Toggle field={form.$('hideWorkspacesButton')} /> |
685 | 689 | ||
686 | <Toggle field={form.$('hideNotificationsButton')} /> | 690 | <Toggle field={form.$('hideNotificationsButton')} /> |