diff options
author | MCMXC <16797721+mcmxcdev@users.noreply.github.com> | 2023-07-23 20:08:52 -0600 |
---|---|---|
committer | Vijay Aravamudhan <vraravam@users.noreply.github.com> | 2023-07-25 07:45:23 +0000 |
commit | 8c131073730ec684145c2cc8ee8d6b39bbe9278d (patch) | |
tree | 1129d432ae88475909f0e5d38960395b75364902 /src/components/layout/Sidebar.tsx | |
parent | 6.4.1-nightly.11 [skip ci] (diff) | |
download | ferdium-app-8c131073730ec684145c2cc8ee8d6b39bbe9278d.tar.gz ferdium-app-8c131073730ec684145c2cc8ee8d6b39bbe9278d.tar.zst ferdium-app-8c131073730ec684145c2cc8ee8d6b39bbe9278d.zip |
chore: improve lint setup
- update eslint config
- merged eslint rules for JS and TS to avoid duplicates
- extended stricter lint ruleset from typescript-eslint
- corrected wrong setup for certain eslint rulesets
- opt in to reportUnusedDisableDirectives config option
- fix or disable a lot of lint issues throughout codebase
- remove trailingComma: all from prettier config which is default in prettier v3
- add volta configuration to package.json to autoload correct node and pnpm versions
- upgrade all eslint and prettier related dependencies to latest
- remove config options from settings.json which are default anyways
- remove config options from settings.json which are outdated/unknown
- set up prettier as default formatter in settings.json
Diffstat (limited to 'src/components/layout/Sidebar.tsx')
-rw-r--r-- | src/components/layout/Sidebar.tsx | 248 |
1 files changed, 123 insertions, 125 deletions
diff --git a/src/components/layout/Sidebar.tsx b/src/components/layout/Sidebar.tsx index 2b1e87023..ceb9cfff9 100644 --- a/src/components/layout/Sidebar.tsx +++ b/src/components/layout/Sidebar.tsx | |||
@@ -205,133 +205,131 @@ class Sidebar extends Component<IProps, IState> { | |||
205 | hibernateService={this.props.hibernateService} | 205 | hibernateService={this.props.hibernateService} |
206 | wakeUpService={this.props.wakeUpService} | 206 | wakeUpService={this.props.wakeUpService} |
207 | /> | 207 | /> |
208 | <> | 208 | {numberActiveButtons <= 1 || hideCollapseButton ? null : ( |
209 | {numberActiveButtons <= 1 || hideCollapseButton ? null : ( | 209 | <button |
210 | <button | 210 | type="button" |
211 | type="button" | 211 | onClick={() => toggleCollapseMenu()} |
212 | onClick={() => toggleCollapseMenu()} | 212 | className="sidebar__button sidebar__button--hamburger-menu" |
213 | className="sidebar__button sidebar__button--hamburger-menu" | 213 | > |
214 | > | 214 | {isMenuCollapsed ? <Icon icon={mdiMenu} size={1.5} /> : null} |
215 | {isMenuCollapsed ? <Icon icon={mdiMenu} size={1.5} /> : null} | ||
216 | 215 | ||
217 | {!isMenuCollapsed && !useHorizontalStyle ? ( | 216 | {!isMenuCollapsed && !useHorizontalStyle ? ( |
218 | <Icon icon={mdiChevronDown} size={1.5} /> | 217 | <Icon icon={mdiChevronDown} size={1.5} /> |
219 | ) : null} | 218 | ) : null} |
220 | 219 | ||
221 | {!isMenuCollapsed && useHorizontalStyle ? ( | 220 | {!isMenuCollapsed && useHorizontalStyle ? ( |
222 | <Icon icon={mdiChevronRight} size={1.5} /> | 221 | <Icon icon={mdiChevronRight} size={1.5} /> |
223 | ) : null} | 222 | ) : null} |
224 | </button> | 223 | </button> |
225 | )} | 224 | )} |
226 | {!hideRecipesButton && !isMenuCollapsed ? ( | 225 | {!hideRecipesButton && !isMenuCollapsed ? ( |
227 | <button | 226 | <button |
228 | type="button" | 227 | type="button" |
229 | onClick={() => openSettings({ path: 'recipes' })} | 228 | onClick={() => openSettings({ path: 'recipes' })} |
230 | className="sidebar__button sidebar__button--new-service" | 229 | className="sidebar__button sidebar__button--new-service" |
231 | data-tooltip-id="tooltip-sidebar-button" | 230 | data-tooltip-id="tooltip-sidebar-button" |
232 | data-tooltip-content={`${intl.formatMessage( | 231 | data-tooltip-content={`${intl.formatMessage( |
233 | messages.addNewService, | 232 | messages.addNewService, |
234 | )} (${addNewServiceShortcutKey(false)})`} | 233 | )} (${addNewServiceShortcutKey(false)})`} |
235 | > | 234 | > |
236 | <Icon icon={mdiPlusBox} size={1.5} /> | 235 | <Icon icon={mdiPlusBox} size={1.5} /> |
237 | </button> | 236 | </button> |
238 | ) : null} | 237 | ) : null} |
239 | {!hideSplitModeButton && !isMenuCollapsed ? ( | 238 | {!hideSplitModeButton && !isMenuCollapsed ? ( |
240 | <button | 239 | <button |
241 | type="button" | 240 | type="button" |
242 | onClick={() => { | 241 | onClick={() => { |
243 | actions!.settings.update({ | 242 | actions!.settings.update({ |
244 | type: 'app', | 243 | type: 'app', |
245 | data: { | 244 | data: { |
246 | splitMode: !splitMode, | 245 | splitMode: !splitMode, |
247 | }, | 246 | }, |
248 | }); | 247 | }); |
249 | }} | 248 | }} |
250 | className="sidebar__button sidebar__button--split-mode-toggle" | 249 | className="sidebar__button sidebar__button--split-mode-toggle" |
251 | data-tooltip-id="tooltip-sidebar-button" | 250 | data-tooltip-id="tooltip-sidebar-button" |
252 | data-tooltip-content={`${intl.formatMessage( | 251 | data-tooltip-content={`${intl.formatMessage( |
253 | messages.splitModeToggle, | 252 | messages.splitModeToggle, |
254 | )} (${splitModeToggleShortcutKey(false)})`} | 253 | )} (${splitModeToggleShortcutKey(false)})`} |
255 | > | 254 | > |
256 | <Icon icon={mdiViewSplitVertical} size={1.5} /> | 255 | <Icon icon={mdiViewSplitVertical} size={1.5} /> |
257 | </button> | 256 | </button> |
258 | ) : null} | 257 | ) : null} |
259 | {!hideWorkspacesButton && !isMenuCollapsed ? ( | 258 | {!hideWorkspacesButton && !isMenuCollapsed ? ( |
260 | <button | 259 | <button |
261 | type="button" | 260 | type="button" |
262 | onClick={() => { | 261 | onClick={() => { |
263 | toggleWorkspaceDrawer(); | 262 | toggleWorkspaceDrawer(); |
264 | this.updateToolTip(); | 263 | this.updateToolTip(); |
265 | }} | 264 | }} |
266 | className={`sidebar__button sidebar__button--workspaces ${ | 265 | className={`sidebar__button sidebar__button--workspaces ${ |
267 | isWorkspaceDrawerOpen ? 'is-active' : '' | 266 | isWorkspaceDrawerOpen ? 'is-active' : '' |
268 | }`} | 267 | }`} |
269 | data-tooltip-id="tooltip-sidebar-button" | 268 | data-tooltip-id="tooltip-sidebar-button" |
270 | data-tooltip-content={`${intl.formatMessage( | 269 | data-tooltip-content={`${intl.formatMessage( |
271 | workspaceToggleMessage, | 270 | workspaceToggleMessage, |
272 | )} (${workspaceToggleShortcutKey(false)})`} | 271 | )} (${workspaceToggleShortcutKey(false)})`} |
273 | > | 272 | > |
274 | <Icon icon={mdiViewGrid} size={1.5} /> | 273 | <Icon icon={mdiViewGrid} size={1.5} /> |
275 | </button> | 274 | </button> |
276 | ) : null} | 275 | ) : null} |
277 | {!hideNotificationsButton && !isMenuCollapsed ? ( | 276 | {!hideNotificationsButton && !isMenuCollapsed ? ( |
278 | <button | 277 | <button |
279 | type="button" | 278 | type="button" |
280 | onClick={() => { | 279 | onClick={() => { |
281 | toggleMuteApp(); | 280 | toggleMuteApp(); |
282 | this.updateToolTip(); | 281 | this.updateToolTip(); |
283 | }} | 282 | }} |
284 | className={`sidebar__button sidebar__button--audio ${ | 283 | className={`sidebar__button sidebar__button--audio ${ |
285 | isAppMuted ? 'is-muted' : '' | 284 | isAppMuted ? 'is-muted' : '' |
286 | }`} | 285 | }`} |
287 | data-tooltip-id="tooltip-sidebar-button" | 286 | data-tooltip-id="tooltip-sidebar-button" |
288 | data-tooltip-content={`${intl.formatMessage( | 287 | data-tooltip-content={`${intl.formatMessage( |
289 | isAppMuted ? messages.unmute : messages.mute, | 288 | isAppMuted ? messages.unmute : messages.mute, |
290 | )} (${muteFerdiumShortcutKey(false)})`} | 289 | )} (${muteFerdiumShortcutKey(false)})`} |
291 | > | 290 | > |
292 | <Icon icon={isAppMuted ? mdiBellOff : mdiBell} size={1.5} /> | 291 | <Icon icon={isAppMuted ? mdiBellOff : mdiBell} size={1.5} /> |
293 | </button> | 292 | </button> |
294 | ) : null} | 293 | ) : null} |
295 | {todosStore.isFeatureEnabledByUser && !isMenuCollapsed ? ( | 294 | {todosStore.isFeatureEnabledByUser && !isMenuCollapsed ? ( |
296 | <button | 295 | <button |
297 | type="button" | 296 | type="button" |
298 | onClick={() => { | 297 | onClick={() => { |
299 | todoActions.toggleTodosPanel(); | 298 | todoActions.toggleTodosPanel(); |
300 | this.updateToolTip(); | 299 | this.updateToolTip(); |
301 | }} | 300 | }} |
302 | disabled={isTodosServiceActive} | 301 | disabled={isTodosServiceActive} |
303 | className={`sidebar__button sidebar__button--todos ${ | 302 | className={`sidebar__button sidebar__button--todos ${ |
304 | todosStore.isTodosPanelVisible ? 'is-active' : '' | 303 | todosStore.isTodosPanelVisible ? 'is-active' : '' |
305 | }`} | 304 | }`} |
306 | data-tooltip-id="tooltip-sidebar-button" | 305 | data-tooltip-id="tooltip-sidebar-button" |
307 | data-tooltip-content={`${intl.formatMessage( | 306 | data-tooltip-content={`${intl.formatMessage( |
308 | todosToggleMessage, | 307 | todosToggleMessage, |
309 | )} (${todosToggleShortcutKey(false)})`} | 308 | )} (${todosToggleShortcutKey(false)})`} |
310 | > | 309 | > |
311 | <Icon icon={mdiCheckAll} size={1.5} /> | 310 | <Icon icon={mdiCheckAll} size={1.5} /> |
312 | </button> | 311 | </button> |
313 | ) : null} | 312 | ) : null} |
314 | {stores!.settings.all.app.lockingFeatureEnabled ? ( | 313 | {stores!.settings.all.app.lockingFeatureEnabled ? ( |
315 | <button | 314 | <button |
316 | type="button" | 315 | type="button" |
317 | className="sidebar__button" | 316 | className="sidebar__button" |
318 | onClick={() => { | 317 | onClick={() => { |
319 | actions!.settings.update({ | 318 | actions!.settings.update({ |
320 | type: 'app', | 319 | type: 'app', |
321 | data: { | 320 | data: { |
322 | locked: true, | 321 | locked: true, |
323 | }, | 322 | }, |
324 | }); | 323 | }); |
325 | }} | 324 | }} |
326 | data-tooltip-id="tooltip-sidebar-button" | 325 | data-tooltip-id="tooltip-sidebar-button" |
327 | data-tooltip-content={`${intl.formatMessage( | 326 | data-tooltip-content={`${intl.formatMessage( |
328 | messages.lockFerdium, | 327 | messages.lockFerdium, |
329 | )} (${lockFerdiumShortcutKey(false)})`} | 328 | )} (${lockFerdiumShortcutKey(false)})`} |
330 | > | 329 | > |
331 | <Icon icon={mdiLock} size={1.5} /> | 330 | <Icon icon={mdiLock} size={1.5} /> |
332 | </button> | 331 | </button> |
333 | ) : null} | 332 | ) : null} |
334 | </> | ||
335 | {this.state.tooltipEnabled && ( | 333 | {this.state.tooltipEnabled && ( |
336 | <ReactTooltip | 334 | <ReactTooltip |
337 | id="tooltip-sidebar-button" | 335 | id="tooltip-sidebar-button" |