Move all Notifications settings to the Notifications tab

src/components/settings_modal/tabs/filtering_tab.js

@@ -29,15 +29,6 @@ const FilteringTab = {
   },
   // Updating nested properties
   watch: {
-    notificationVisibility: {
-      handler (value) {
-        this.$store.dispatch('setOption', {
-          name: 'notificationVisibility',
-          value: this.$store.getters.mergedConfig.notificationVisibility
-        })
-      },
-      deep: true
-    },
     replyVisibility () {
       this.$store.dispatch('queueFlushAll')
     }

src/components/settings_modal/tabs/filtering_tab.vue

@@ -1,41 +1,6 @@
 <template>
   <div :label="$t('settings.filtering')">
     <div class="setting-item">
-      <div class="select-multiple">
-        <span class="label">{{ $t('settings.notification_visibility') }}</span>
-        <ul class="option-list">
-          <li>
-            <Checkbox v-model="notificationVisibility.likes">
-              {{ $t('settings.notification_visibility_likes') }}
-            </Checkbox>
-          </li>
-          <li>
-            <Checkbox v-model="notificationVisibility.repeats">
-              {{ $t('settings.notification_visibility_repeats') }}
-            </Checkbox>
-          </li>
-          <li>
-            <Checkbox v-model="notificationVisibility.follows">
-              {{ $t('settings.notification_visibility_follows') }}
-            </Checkbox>
-          </li>
-          <li>
-            <Checkbox v-model="notificationVisibility.mentions">
-              {{ $t('settings.notification_visibility_mentions') }}
-            </Checkbox>
-          </li>
-          <li>
-            <Checkbox v-model="notificationVisibility.moves">
-              {{ $t('settings.notification_visibility_moves') }}
-            </Checkbox>
-          </li>
-          <li>
-            <Checkbox v-model="notificationVisibility.emojiReactions">
-              {{ $t('settings.notification_visibility_emoji_reactions') }}
-            </Checkbox>
-          </li>
-        </ul>
-      </div>
       <div>
         {{ $t('settings.replies_in_timeline') }}
         <label

src/components/settings_modal/tabs/general_tab.vue

@@ -235,17 +235,6 @@
       </ul>
     </div>
 
-    <div class="setting-item">
-      <h2>{{ $t('settings.notifications') }}</h2>
-      <ul class="setting-list">
-        <li>
-          <Checkbox v-model="webPushNotifications">
-            {{ $t('settings.enable_web_push_notifications') }}
-          </Checkbox>
-        </li>
-      </ul>
-    </div>
-
     <div class="setting-item">
       <h2>{{ $t('settings.fun') }}</h2>
       <ul class="setting-list">

src/components/settings_modal/tabs/notifications_tab.js

@@ -1,5 +1,7 @@
 import Checkbox from 'src/components/checkbox/checkbox.vue'
 
+import SharedComputedObject from '../helpers/shared_computed_object.js'
+
 const NotificationsTab = {
   data () {
     return {
@@ -12,6 +14,7 @@ const NotificationsTab = {
     Checkbox
   },
   computed: {
+    ...SharedComputedObject(),
     user () {
       return this.$store.state.users.currentUser
     }
@@ -21,6 +24,17 @@ const NotificationsTab = {
       this.$store.state.api.backendInteractor
         .updateNotificationSettings({ settings: this.notificationSettings })
     }
+  },
+  watch: {
+    notificationVisibility: {
+      handler (value) {
+        this.$store.dispatch('setOption', {
+          name: 'notificationVisibility',
+          value: this.$store.getters.mergedConfig.notificationVisibility
+        })
+      },
+      deep: true
+    }
   }
 }
 

src/components/settings_modal/tabs/notifications_tab.vue

@@ -2,6 +2,41 @@
   <div :label="$t('settings.notifications')">
     <div class="setting-item">
       <h2>{{ $t('settings.notification_setting_filters') }}</h2>
+      <div class="select-multiple">
+        <span class="label">{{ $t('settings.notification_visibility') }}</span>
+        <ul class="option-list">
+          <li>
+            <Checkbox v-model="notificationVisibility.likes">
+              {{ $t('settings.notification_visibility_likes') }}
+            </Checkbox>
+          </li>
+          <li>
+            <Checkbox v-model="notificationVisibility.repeats">
+              {{ $t('settings.notification_visibility_repeats') }}
+            </Checkbox>
+          </li>
+          <li>
+            <Checkbox v-model="notificationVisibility.follows">
+              {{ $t('settings.notification_visibility_follows') }}
+            </Checkbox>
+          </li>
+          <li>
+            <Checkbox v-model="notificationVisibility.mentions">
+              {{ $t('settings.notification_visibility_mentions') }}
+            </Checkbox>
+          </li>
+          <li>
+            <Checkbox v-model="notificationVisibility.moves">
+              {{ $t('settings.notification_visibility_moves') }}
+            </Checkbox>
+          </li>
+          <li>
+            <Checkbox v-model="notificationVisibility.emojiReactions">
+              {{ $t('settings.notification_visibility_emoji_reactions') }}
+            </Checkbox>
+          </li>
+        </ul>
+      </div>
       <p>
         <Checkbox v-model="notificationSettings.block_from_strangers">
           {{ $t('settings.notification_setting_block_from_strangers') }}
@@ -9,6 +44,16 @@
       </p>
     </div>
 
+    <div class="setting-item">
+      <h2>{{ $t('settings.notifications_advanced') }}</h2>
+      <p>
+        <Checkbox v-model="webPushNotifications">
+          {{ $t('settings.enable_web_push_notifications') }}
+        </Checkbox>
+      </p>
+      <p>{{ $t('settings.notification_browser') }}</p>
+    </div>
+
     <div class="setting-item">
       <h2>{{ $t('settings.notification_setting_privacy') }}</h2>
       <p>

src/i18n/en.json

@@ -432,6 +432,7 @@
     "fun": "Fun",
     "greentext": "Meme arrows",
     "notifications": "Notifications",
+    "notifications_advanced": "Advanced",
     "notification_setting_filters": "Filters",
     "notification_setting_block_from_strangers": "Block notifications from users who you do not follow",
     "notification_setting_privacy": "Privacy",
@@ -439,6 +440,7 @@
     "notification_mutes": "To stop receiving notifications from a specific user, use a mute.",
     "notification_blocks": "Blocking a user stops all notifications as well as unsubscribes them.",
     "enable_web_push_notifications": "Enable web push notifications",
+    "notification_browser": "Allows background push notifications with supported browsers",
     "style": {
       "switcher": {
         "keep_color": "Keep colors",