From aabd393e15697df7b605ce86e8f48f03d244a8b6 Mon Sep 17 00:00:00 2001
From: Absturztaube <me@absturztaube.ch>
Date: Sun, 26 Jul 2020 20:36:03 +0200
Subject: [PATCH] add settings for third column

---
 src/App.js                                         | 10 ++++++++++
 src/App.scss                                       |  2 +-
 src/App.vue                                        |  4 ++++
 src/components/settings_modal/tabs/general_tab.vue |  5 +++++
 src/i18n/en.json                                   |  1 +
 src/modules/config.js                              |  1 +
 6 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/src/App.js b/src/App.js
index e245615a..2cc9a499 100644
--- a/src/App.js
+++ b/src/App.js
@@ -5,6 +5,7 @@ import SearchBar from './components/search_bar/search_bar.vue'
 import InstanceSpecificPanel from './components/instance_specific_panel/instance_specific_panel.vue'
 import FeaturesPanel from './components/features_panel/features_panel.vue'
 import WhoToFollowPanel from './components/who_to_follow_panel/who_to_follow_panel.vue'
+import ChatList from './components/chat_list/chat_list.vue'
 import ChatPanel from './components/chat_panel/chat_panel.vue'
 import SettingsModal from './components/settings_modal/settings_modal.vue'
 import MediaModal from './components/media_modal/media_modal.vue'
@@ -27,6 +28,7 @@ export default {
     FeaturesPanel,
     WhoToFollowPanel,
     ChatPanel,
+    ChatList,
     MediaModal,
     SideDrawer,
     MobilePostStatusButton,
@@ -103,6 +105,9 @@ export default {
         !this.$store.getters.mergedConfig.hideISP &&
         this.$store.state.instance.instanceSpecificPanelContent
     },
+    thirdColumnEnabled () {
+      return this.$store.getters.mergedConfig.showThirdColumn || false
+    },
     showFeaturesPanel () { return this.$store.state.instance.showFeaturesPanel },
     isMobileLayout () { return this.$store.state.interface.mobileLayout },
     privateMode () { return this.$store.state.instance.private },
@@ -110,6 +115,11 @@ export default {
       return {
         'order': this.$store.state.instance.sidebarRight ? 99 : 0
       }
+    },
+    thirdColumnLayout () {
+      return {
+        'max-width': this.$store.getters.mergedConfig.showThirdColumn ? '1400px' : '980px'
+      }
     }
   },
   methods: {
diff --git a/src/App.scss b/src/App.scss
index 38ecd8d6..baf17e6c 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -30,7 +30,7 @@ h4 {
   padding-top: 60px;
   margin: auto;
   min-height: 100vh;
-  max-width: 1400px;
+  max-width: 980px;
   align-content: flex-start;
 }
 .underlay {
diff --git a/src/App.vue b/src/App.vue
index 2ac96a15..a0972a63 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -80,6 +80,7 @@
     <div class="app-bg-wrapper app-container-wrapper" />
     <div
       id="content"
+      :style="thirdColumnLayout"
       class="container underlay"
     >
       <div
@@ -94,6 +95,8 @@
                 <nav-panel />
                 <instance-specific-panel v-if="showInstanceSpecificPanel" />
                 <who-to-follow-panel v-if="currentUser && suggestionsEnabled" />
+                <notifications v-if="currentUser && !thirdColumnEnabled" />
+                <features-panel v-if="!currentUser && !thirdColumnEnabled" />
               </div>
             </div>
           </div>
@@ -114,6 +117,7 @@
         <router-view />
       </div>
       <div
+        v-if="thirdColumnEnabled"
         class="sidebar-flexer mobile-hidden"
         :style="sidebarAlign"
       >
diff --git a/src/components/settings_modal/tabs/general_tab.vue b/src/components/settings_modal/tabs/general_tab.vue
index 7f06d0bd..7f2dcff9 100644
--- a/src/components/settings_modal/tabs/general_tab.vue
+++ b/src/components/settings_modal/tabs/general_tab.vue
@@ -11,6 +11,11 @@
             {{ $t('settings.hide_isp') }}
           </Checkbox>
         </li>
+        <li>
+          <Checkbox v-model="showThirdColumn">
+            {{ $t('settings.show_third_column') }}
+          </Checkbox>
+        </li>
       </ul>
     </div>
     <div class="setting-item">
diff --git a/src/i18n/en.json b/src/i18n/en.json
index 6bc63cfd..cf78d23d 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -321,6 +321,7 @@
     "hide_muted_posts": "Hide posts of muted users",
     "max_thumbnails": "Maximum amount of thumbnails per post",
     "hide_isp": "Hide instance-specific panel",
+    "show_third_column": "Move Notifications to a seperate column",
     "preload_images": "Preload images",
     "use_one_click_nsfw": "Open NSFW attachments with just one click",
     "hide_post_stats": "Hide post statistics (e.g. the number of favorites)",
diff --git a/src/modules/config.js b/src/modules/config.js
index 409d77a4..294a5ed0 100644
--- a/src/modules/config.js
+++ b/src/modules/config.js
@@ -18,6 +18,7 @@ export const defaultState = {
   colors: {},
   theme: undefined,
   customTheme: undefined,
+  showThirdColumn: false,
   customThemeSource: undefined,
   hideISP: false,
   // bad name: actually hides posts of muted USERS