From ad17ec5ccad3ceffd383f228d4529438b5a3b9a6 Mon Sep 17 00:00:00 2001
From: niu tech <jerzyglowacki@gmail.com>
Date: Fri, 12 Nov 2021 23:52:58 +0100
Subject: Adjust number of columns for Split Mode (#2208)

Co-authored-by: Vijay A <vraravam@users.noreply.github.com>
---
 src/stores/ServicesStore.js |  7 +++++++
 src/stores/UIStore.js       | 28 ++++++++++++++++++++--------
 2 files changed, 27 insertions(+), 8 deletions(-)

(limited to 'src/stores')

diff --git a/src/stores/ServicesStore.js b/src/stores/ServicesStore.js
index 926ee36f0..a34390d88 100644
--- a/src/stores/ServicesStore.js
+++ b/src/stores/ServicesStore.js
@@ -170,6 +170,13 @@ export default class ServicesStore extends Store {
       },
     );
 
+    reaction(
+      () => this.stores.settings.app.splitColumns,
+      () => {
+        this._shareSettingsWithServiceProcess();
+      },
+    );
+
     reaction(
       () => this.stores.settings.app.searchEngine,
       () => {
diff --git a/src/stores/UIStore.js b/src/stores/UIStore.js
index 779f89b9f..9c194aa91 100644
--- a/src/stores/UIStore.js
+++ b/src/stores/UIStore.js
@@ -54,6 +54,13 @@ export default class UIStore extends Store {
       },
       { fireImmediately: true },
     );
+    reaction(
+      () => this.splitColumnsNo,
+      () => {
+        this._setupColumnsInDOM();
+      },
+      { fireImmediately: true },
+    );
   }
 
   @computed get showMessageBadgesEvenWhenMuted() {
@@ -84,6 +91,10 @@ export default class UIStore extends Store {
     return this.stores.settings.app.splitMode;
   }
 
+  @computed get splitColumnsNo() {
+    return this.stores.settings.app.splitColumns;
+  }
+
   @computed get theme() {
     const themeId =
       this.isDarkThemeActive || this.stores.settings.app.darkMode
@@ -113,22 +124,23 @@ export default class UIStore extends Store {
 
   // Reactions
   _setupThemeInDOM() {
-    const body = document.querySelector('body');
-
     if (!this.isDarkThemeActive) {
-      body?.classList.remove('theme__dark');
+      document.body.classList.remove('theme__dark');
     } else {
-      body?.classList.add('theme__dark');
+      document.body.classList.add('theme__dark');
     }
   }
 
   _setupModeInDOM() {
-    const body = document.querySelector('body');
-
     if (!this.isSplitModeActive) {
-      body?.classList.remove('mode__split');
+      document.body.classList.remove('mode__split');
     } else {
-      body?.classList.add('mode__split');
+      document.body.classList.add('mode__split');
+      document.body.dataset.columns = this.splitColumnsNo;
     }
   }
+
+  _setupColumnsInDOM() {
+    document.body.dataset.columns = this.splitColumnsNo;
+  }
 }
-- 
cgit v1.2.3-70-g09d2