rearrange notification visibility page a bit.

This commit is contained in:
Henry Jameson 2023-11-19 16:12:43 +02:00
parent e3ee3eacca
commit fd3ad106be
5 changed files with 139 additions and 26 deletions

View File

@ -3,6 +3,10 @@
.settings-modal { .settings-modal {
overflow: hidden; overflow: hidden;
h4 {
margin-bottom: 0.5em;
}
.setting-list, .setting-list,
.option-list { .option-list {
list-style-type: none; list-style-type: none;
@ -15,6 +19,14 @@
.suboptions { .suboptions {
margin-top: 0.3em; margin-top: 0.3em;
} }
&.two-column {
column-count: 2;
> li {
break-inside: avoid;
}
}
} }
.setting-description { .setting-description {

View File

@ -16,6 +16,10 @@ const NotificationsTab = {
user () { user () {
return this.$store.state.users.currentUser return this.$store.state.users.currentUser
}, },
canReceiveReports () {
if (!this.user) { return false }
return this.user.privileges.includes('reports_manage_reports')
},
...SharedComputedObject() ...SharedComputedObject()
}, },
methods: { methods: {

View File

@ -34,46 +34,131 @@
{{ $t('settings.notification_setting_block_from_strangers') }} {{ $t('settings.notification_setting_block_from_strangers') }}
</BooleanSetting> </BooleanSetting>
</li> </li>
<li class="select-multiple">
<span class="label">{{ $t('settings.notification_visibility') }}</span>
<ul class="option-list">
<li> <li>
<BooleanSetting path="notificationVisibility.likes"> <h3> {{ $t('settings.notification_visibility') }}</h3>
{{ $t('settings.notification_visibility_likes') }} <ul class="setting-list two-column">
</BooleanSetting>
</li>
<li> <li>
<BooleanSetting path="notificationVisibility.repeats"> <h4> {{ $t('settings.notification_visibility_mentions') }}</h4>
{{ $t('settings.notification_visibility_repeats') }} <ul class="setting-list">
</BooleanSetting>
</li>
<li>
<BooleanSetting path="notificationVisibility.follows">
{{ $t('settings.notification_visibility_follows') }}
</BooleanSetting>
</li>
<li> <li>
<BooleanSetting path="notificationVisibility.mentions"> <BooleanSetting path="notificationVisibility.mentions">
{{ $t('settings.notification_visibility_mentions') }} {{ $t('settings.notification_visibility_in_column') }}
</BooleanSetting> </BooleanSetting>
</li> </li>
<li> <li>
<BooleanSetting path="notificationVisibility.moves"> <BooleanSetting path="notificationNative.mentions" >
{{ $t('settings.notification_visibility_moves') }} {{ $t('settings.notification_visibility_native_notifications') }}
</BooleanSetting> </BooleanSetting>
</li> </li>
</ul>
</li>
<li>
<h4> {{ $t('settings.notification_visibility_likes') }}</h4>
<ul class="setting-list">
<li>
<BooleanSetting path="notificationVisibility.likes">
{{ $t('settings.notification_visibility_in_column') }}
</BooleanSetting>
</li>
<li>
<BooleanSetting path="notificationNative.likes" >
{{ $t('settings.notification_visibility_native_notifications') }}
</BooleanSetting>
</li>
</ul>
</li>
<li>
<h4> {{ $t('settings.notification_visibility_repeats') }}</h4>
<ul class="setting-list">
<li>
<BooleanSetting path="notificationVisibility.repeats">
{{ $t('settings.notification_visibility_in_column') }}
</BooleanSetting>
</li>
<li>
<BooleanSetting path="notificationNative.repeats" >
{{ $t('settings.notification_visibility_native_notifications') }}
</BooleanSetting>
</li>
</ul>
</li>
<li>
<h4> {{ $t('settings.notification_visibility_emoji_reactions') }}</h4>
<ul class="setting-list">
<li> <li>
<BooleanSetting path="notificationVisibility.emojiReactions"> <BooleanSetting path="notificationVisibility.emojiReactions">
{{ $t('settings.notification_visibility_emoji_reactions') }} {{ $t('settings.notification_visibility_in_column') }}
</BooleanSetting> </BooleanSetting>
</li> </li>
<li> <li>
<BooleanSetting path="notificationVisibility.polls"> <BooleanSetting path="notificationNative.emojiReactions" >
{{ $t('settings.notification_visibility_polls') }} {{ $t('settings.notification_visibility_native_notifications') }}
</BooleanSetting> </BooleanSetting>
</li> </li>
</ul> </ul>
</li> </li>
<li>
<h4> {{ $t('settings.notification_visibility_follows') }}</h4>
<ul class="setting-list">
<li>
<BooleanSetting path="notificationVisibility.follows">
{{ $t('settings.notification_visibility_in_column') }}
</BooleanSetting>
</li>
<li>
<BooleanSetting path="notificationNative.follows" >
{{ $t('settings.notification_visibility_native_notifications') }}
</BooleanSetting>
</li>
</ul>
</li>
<li>
<h4> {{ $t('settings.notification_visibility_moves') }}</h4>
<ul class="setting-list">
<li>
<BooleanSetting path="notificationVisibility.moves">
{{ $t('settings.notification_visibility_in_column') }}
</BooleanSetting>
</li>
<li>
<BooleanSetting path="notificationNative.moves" >
{{ $t('settings.notification_visibility_native_notifications') }}
</BooleanSetting>
</li>
</ul>
</li>
<li>
<h4> {{ $t('settings.notification_visibility_polls') }}</h4>
<ul class="setting-list">
<li>
<BooleanSetting path="notificationVisibility.polls">
{{ $t('settings.notification_visibility_in_column') }}
</BooleanSetting>
</li>
<li>
<BooleanSetting path="notificationNative.polls" >
{{ $t('settings.notification_visibility_native_notifications') }}
</BooleanSetting>
</li>
</ul>
</li>
<li v-if="canReceiveReports">
<h4> {{ $t('settings.notification_visibility_reports') }}</h4>
<ul class="setting-list">
<li>
<BooleanSetting path="notificationVisibility.reports">
{{ $t('settings.notification_visibility_in_column') }}
</BooleanSetting>
</li>
<li>
<BooleanSetting path="notificationNative.reports" >
{{ $t('settings.notification_visibility_native_notifications') }}
</BooleanSetting>
</li>
</ul>
</li>
</ul>
</li>
<li> <li>
<BooleanSetting path="showExtraNotifications"> <BooleanSetting path="showExtraNotifications">
{{ $t('settings.notification_show_extra') }} {{ $t('settings.notification_show_extra') }}

View File

@ -561,10 +561,13 @@
"posts": "Posts", "posts": "Posts",
"user_profiles": "User Profiles", "user_profiles": "User Profiles",
"notification_visibility": "Types of notifications to show", "notification_visibility": "Types of notifications to show",
"notification_visibility_in_column": "Show in notifications column/drawer",
"notification_visibility_native_notifications": "Show a native notification",
"notification_visibility_follows": "Follows", "notification_visibility_follows": "Follows",
"notification_visibility_likes": "Favorites", "notification_visibility_likes": "Favorites",
"notification_visibility_mentions": "Mentions", "notification_visibility_mentions": "Mentions",
"notification_visibility_repeats": "Repeats", "notification_visibility_repeats": "Repeats",
"notification_visibility_reports": "Reports",
"notification_visibility_moves": "User Migrates", "notification_visibility_moves": "User Migrates",
"notification_visibility_emoji_reactions": "Reactions", "notification_visibility_emoji_reactions": "Reactions",
"notification_visibility_polls": "Ends of polls you voted in", "notification_visibility_polls": "Ends of polls you voted in",

View File

@ -66,8 +66,17 @@ export const defaultState = {
chatMention: true, chatMention: true,
polls: true polls: true
}, },
notificationSettings: { notificationNative: {
nativeNotifications: ['follows', 'mentions', 'followRequest', 'reports', 'chatMention', 'polls'] follows: true,
mentions: true,
likes: false,
repeats: false,
moves: false,
emojiReactions: false,
followRequest: true,
reports: true,
chatMention: true,
polls: true
}, },
webPushNotifications: false, webPushNotifications: false,
muteWords: [], muteWords: [],