aboutsummaryrefslogtreecommitdiffstats
path: root/src/stores/UIStore.ts
diff options
context:
space:
mode:
authorLibravatar Markus Hatvan <markus_hatvan@aon.at>2021-11-12 07:16:59 +0100
committerLibravatar GitHub <noreply@github.com>2021-11-12 07:16:59 +0100
commitbb6e67d95c1be207c223f28f3e8b185570732988 (patch)
tree88a594cc02d6cc02206e071d25eb074bd72b6b99 /src/stores/UIStore.ts
parentchore: update eslint deps to latest (#2213) (diff)
downloadferdium-app-bb6e67d95c1be207c223f28f3e8b185570732988.tar.gz
ferdium-app-bb6e67d95c1be207c223f28f3e8b185570732988.tar.zst
ferdium-app-bb6e67d95c1be207c223f28f3e8b185570732988.zip
chore: update typescript to latest (#2214)
Diffstat (limited to 'src/stores/UIStore.ts')
-rw-r--r--src/stores/UIStore.ts138
1 files changed, 0 insertions, 138 deletions
diff --git a/src/stores/UIStore.ts b/src/stores/UIStore.ts
deleted file mode 100644
index 6a9597006..000000000
--- a/src/stores/UIStore.ts
+++ /dev/null
@@ -1,138 +0,0 @@
1import { action, observable, computed, reaction } from 'mobx';
2import { nativeTheme, systemPreferences } from '@electron/remote';
3
4import { theme, ThemeType } from '../themes';
5import Store from './lib/Store';
6import { isMac, isWindows } from '../environment';
7
8export default class UIStore extends Store {
9 actions: any;
10
11 stores: any;
12
13 @observable showServicesUpdatedInfoBar = false;
14
15 @observable isOsDarkThemeActive = nativeTheme.shouldUseDarkColors;
16
17 constructor(...args) {
18 super(...args);
19
20 // Register action handlers
21 this.actions.ui.openSettings.listen(this._openSettings.bind(this));
22 this.actions.ui.closeSettings.listen(this._closeSettings.bind(this));
23 this.actions.ui.toggleServiceUpdatedInfoBar.listen(
24 this._toggleServiceUpdatedInfoBar.bind(this),
25 );
26
27 // Listen for theme change on MacOS
28 if (isMac) {
29 systemPreferences.subscribeNotification(
30 'AppleInterfaceThemeChangedNotification',
31 () => {
32 this.isOsDarkThemeActive = nativeTheme.shouldUseDarkColors;
33 this.actions.service.shareSettingsWithServiceProcess();
34 },
35 );
36 }
37
38 if (isWindows) {
39 nativeTheme.on('updated', () => {
40 this.isOsDarkThemeActive = nativeTheme.shouldUseDarkColors;
41 this.actions.service.shareSettingsWithServiceProcess();
42 });
43 }
44 }
45
46 setup() {
47 reaction(
48 () => this.isDarkThemeActive,
49 () => {
50 this._setupThemeInDOM();
51 },
52 { fireImmediately: true },
53 );
54 reaction(
55 () => this.isSplitModeActive,
56 () => {
57 this._setupModeInDOM();
58 },
59 { fireImmediately: true },
60 );
61 }
62
63 @computed get showMessageBadgesEvenWhenMuted() {
64 const settings = this.stores.settings.all;
65
66 return (
67 (settings.app.isAppMuted && settings.app.showMessageBadgeWhenMuted) ||
68 !settings.app.isAppMuted
69 );
70 }
71
72 @computed get isDarkThemeActive() {
73 const isWithAdaptableInDarkMode =
74 this.stores.settings.all.app.adaptableDarkMode &&
75 this.isOsDarkThemeActive;
76 const isWithoutAdaptableInDarkMode =
77 this.stores.settings.all.app.darkMode &&
78 !this.stores.settings.all.app.adaptableDarkMode;
79 const isInDarkMode = this.stores.settings.all.app.darkMode;
80 return !!(
81 isWithAdaptableInDarkMode ||
82 isWithoutAdaptableInDarkMode ||
83 isInDarkMode
84 );
85 }
86
87 @computed get isSplitModeActive() {
88 return this.stores.settings.app.splitMode;
89 }
90
91 @computed get theme() {
92 const themeId =
93 this.isDarkThemeActive || this.stores.settings.app.darkMode
94 ? ThemeType.dark
95 : ThemeType.default;
96 const { accentColor } = this.stores.settings.app;
97 return theme(themeId, accentColor);
98 }
99
100 // Actions
101 @action _openSettings({ path = '/settings' }) {
102 const settingsPath = path !== '/settings' ? `/settings/${path}` : path;
103 this.stores.router.push(settingsPath);
104 }
105
106 @action _closeSettings() {
107 this.stores.router.push('/');
108 }
109
110 @action _toggleServiceUpdatedInfoBar({ visible }) {
111 let visibility = visible;
112 if (visibility === null) {
113 visibility = !this.showServicesUpdatedInfoBar;
114 }
115 this.showServicesUpdatedInfoBar = visibility;
116 }
117
118 // Reactions
119 _setupThemeInDOM() {
120 const body = document.querySelector('body');
121
122 if (!this.isDarkThemeActive) {
123 body?.classList.remove('theme__dark');
124 } else {
125 body?.classList.add('theme__dark');
126 }
127 }
128
129 _setupModeInDOM() {
130 const body = document.querySelector('body');
131
132 if (!this.isSplitModeActive) {
133 body?.classList.remove('mode__split');
134 } else {
135 body?.classList.add('mode__split');
136 }
137 }
138}