refs #2258 Apply filter to notifications

src/renderer/components/TimelineSpace/Contents/Notifications.vue

@@ -9,6 +9,7 @@
             :message="item"
             :focused="item.id === focusedId"
             :overlaid="modalOpened"
+            :filters="filters"
             v-on:update="updateToot"
             @focusNext="focusNext"
             @focusPrev="focusPrev"
@@ -51,7 +52,7 @@ export default {
       heading: state => state.TimelineSpace.Contents.Notifications.heading,
       unread: state => state.TimelineSpace.Contents.Notifications.unreadNotifications
     }),
-    ...mapGetters('TimelineSpace/Contents/Notifications', ['handledNotifications']),
+    ...mapGetters('TimelineSpace/Contents/Notifications', ['handledNotifications', 'filters']),
     ...mapGetters('TimelineSpace/Modals', ['modalOpened']),
     shortcutEnabled: function () {
       if (this.modalOpened) {

src/renderer/components/organisms/Notification.vue

@@ -3,7 +3,7 @@
     <favourite
       v-if="message.type === 'favourite'"
       :message="message"
-      :filter="filter"
+      :filters="filters"
       :focused="focused"
       :overlaid="overlaid"
       @focusNext="$emit('focusNext')"
@@ -37,7 +37,7 @@
     <mention
       v-else-if="message.type === 'mention'"
       :message="message"
-      :filter="filter"
+      :filters="filters"
       :focused="focused"
       :overlaid="overlaid"
       v-on:update="updateToot"
@@ -51,7 +51,7 @@
     <quote
       v-else-if="message.type === 'reblog' && message.status.quote"
       :message="message"
-      :filter="filter"
+      :filters="filters"
       :focused="focused"
       :overlaid="overlaid"
       @focusNext="$emit('focusNext')"
@@ -63,7 +63,7 @@
     <reblog
       v-else-if="message.type === 'reblog' && !message.status.quote"
       :message="message"
-      :filter="filter"
+      :filters="filters"
       :focused="focused"
       :overlaid="overlaid"
       @focusNext="$emit('focusNext')"
@@ -75,7 +75,7 @@
     <reaction
       v-else-if="message.type === 'emoji_reaction'"
       :message="message"
-      :filter="filter"
+      :filters="filters"
       :focused="focused"
       :overlaid="overlaid"
       @focusNext="$emit('focusNext')"
@@ -87,7 +87,7 @@
     <status
       v-else-if="message.type === 'status'"
       :message="message"
-      :filter="filter"
+      :filters="filters"
       :focused="focused"
       :overlaid="overlaid"
       @focusNext="$emit('focusNext')"
@@ -99,7 +99,7 @@
     <PollVote
       v-else-if="message.type === 'poll_vote'"
       :message="message"
-      :filter="filter"
+      :filters="filters"
       :focused="focused"
       :overlaid="overlaid"
       @focusNext="$emit('focusNext')"
@@ -111,7 +111,7 @@
     <PollExpired
       v-else-if="message.type === 'poll_expired'"
       :message="message"
-      :filter="filter"
+      :filters="filters"
       :focused="focused"
       :overlaid="overlaid"
       @focusNext="$emit('focusNext')"
@@ -142,9 +142,9 @@ export default {
       type: Object,
       default: {}
     },
-    filter: {
-      type: String,
-      default: ''
+    filters: {
+      type: Array,
+      default: []
     },
     focused: {
       type: Boolean,

src/renderer/components/organisms/Notification/Favourite.vue

@@ -112,6 +112,7 @@ import emojify from '~/src/renderer/utils/emojify'
 import TimeFormat from '~/src/constants/timeFormat'
 import FailoverImg from '~/src/renderer/components/atoms/FailoverImg'
 import LinkPreview from '~/src/renderer/components/molecules/Toot/LinkPreview'
+import Filtered from '@/utils/filter'
 
 export default {
   name: 'favourite',
@@ -124,9 +125,9 @@ export default {
       type: Object,
       default: {}
     },
-    filter: {
-      type: String,
-      default: ''
+    filters: {
+      type: Array,
+      default: []
     },
     focused: {
       type: Boolean,
@@ -233,7 +234,7 @@ export default {
       return message.media_attachments
     },
     filtered(message) {
-      return this.filter.length > 0 && message.status.content.search(this.filter) >= 0
+      return Filtered(message.status.content, this.filters)
     },
     spoilered(message) {
       return message.spoiler_text.length > 0

src/renderer/components/organisms/Notification/Mention.vue

@@ -2,7 +2,7 @@
   <div class="mention">
     <toot
       :message="message.status"
-      :filter="filter"
+      :filters="filters"
       :focused="focused"
       :overlaid="overlaid"
       v-on:update="updateToot"
@@ -11,7 +11,7 @@
       @focusPrev="$emit('focusPrev')"
       @focusRight="$emit('focusRight')"
       @selectToot="$emit('select')"
-      >
+    >
     </toot>
   </div>
 </template>
@@ -26,9 +26,9 @@ export default {
       type: Object,
       default: {}
     },
-    filter: {
-      type: String,
-      default: ''
+    filters: {
+      type: Array,
+      default: []
     },
     focused: {
       type: Boolean,
@@ -41,10 +41,10 @@ export default {
   },
   components: { Toot },
   methods: {
-    updateToot (message) {
+    updateToot(message) {
       return this.$emit('update', message)
     },
-    deleteToot (message) {
+    deleteToot(message) {
       return this.$emit('delete', message)
     }
   }

src/renderer/components/organisms/Notification/PollExpired.vue

@@ -112,6 +112,7 @@ import emojify from '~/src/renderer/utils/emojify'
 import TimeFormat from '~/src/constants/timeFormat'
 import FailoverImg from '~/src/renderer/components/atoms/FailoverImg'
 import LinkPreview from '~/src/renderer/components/molecules/Toot/LinkPreview'
+import Filtered from '@/utils/filter'
 
 export default {
   name: 'poll-expired',
@@ -124,9 +125,9 @@ export default {
       type: Object,
       default: {}
     },
-    filter: {
-      type: String,
-      default: ''
+    filters: {
+      type: Array,
+      default: []
     },
     focused: {
       type: Boolean,
@@ -233,7 +234,7 @@ export default {
       return message.media_attachments
     },
     filtered(message) {
-      return this.filter.length > 0 && message.status.content.search(this.filter) >= 0
+      return Filtered(message.status.content, this.filters)
     },
     spoilered(message) {
       return message.spoiler_text.length > 0

src/renderer/components/organisms/Notification/PollVote.vue

@@ -112,6 +112,7 @@ import emojify from '~/src/renderer/utils/emojify'
 import TimeFormat from '~/src/constants/timeFormat'
 import FailoverImg from '~/src/renderer/components/atoms/FailoverImg'
 import LinkPreview from '~/src/renderer/components/molecules/Toot/LinkPreview'
+import Filtered from '@/utils/filter'
 
 export default {
   name: 'poll-vote',
@@ -124,9 +125,9 @@ export default {
       type: Object,
       default: {}
     },
-    filter: {
-      type: String,
-      default: ''
+    filters: {
+      type: Array,
+      default: []
     },
     focused: {
       type: Boolean,
@@ -233,7 +234,7 @@ export default {
       return message.media_attachments
     },
     filtered(message) {
-      return this.filter.length > 0 && message.status.content.search(this.filter) >= 0
+      return Filtered(message.status.content, this.filters)
     },
     spoilered(message) {
       return message.spoiler_text.length > 0

src/renderer/components/organisms/Notification/Quote.vue

@@ -9,9 +9,7 @@
     role="article"
     aria-label="quoted toot"
   >
-    <div v-show="filtered(message)" class="filtered">
-      Filtered
-    </div>
+    <div v-show="filtered(message)" class="filtered">Filtered</div>
     <div v-show="!filtered(message)" class="quoted">
       <div class="action">
         <div class="action-mark">
@@ -125,6 +123,7 @@ import TimeFormat from '~/src/constants/timeFormat'
 import FailoverImg from '~/src/renderer/components/atoms/FailoverImg'
 import LinkPreview from '~/src/renderer/components/molecules/Toot/LinkPreview'
 import Quote from '@/components/molecules/Toot/Quote'
+import Filtered from '@/utils/filter'
 
 export default {
   name: 'quote',
@@ -138,9 +137,9 @@ export default {
       type: Object,
       default: {}
     },
-    filter: {
-      type: String,
-      default: ''
+    filters: {
+      type: Array,
+      default: []
     },
     focused: {
       type: Boolean,
@@ -245,7 +244,7 @@ export default {
       return message.media_attachments
     },
     filtered(message) {
-      return this.filter.length > 0 && message.status.content.search(this.filter) >= 0
+      return Filtered(message.status.content, this.filters)
     },
     spoilered(message) {
       return message.spoiler_text.length > 0

src/renderer/components/organisms/Notification/Reaction.vue

@@ -9,9 +9,7 @@
     role="article"
     aria-label="reacted toot"
   >
-    <div v-show="filtered(message)" class="filtered">
-      Filtered
-    </div>
+    <div v-show="filtered(message)" class="filtered">Filtered</div>
     <div v-show="!filtered(message)" class="favourite">
       <div class="action">
         <div class="action-mark">
@@ -114,6 +112,7 @@ import emojify from '~/src/renderer/utils/emojify'
 import TimeFormat from '~/src/constants/timeFormat'
 import FailoverImg from '~/src/renderer/components/atoms/FailoverImg'
 import LinkPreview from '~/src/renderer/components/molecules/Toot/LinkPreview'
+import Filtered from '@/utils/filter'
 
 export default {
   name: 'reaction',
@@ -126,9 +125,9 @@ export default {
       type: Object,
       default: {}
     },
-    filter: {
-      type: String,
-      default: ''
+    filters: {
+      type: Array,
+      default: []
     },
     focused: {
       type: Boolean,
@@ -235,7 +234,7 @@ export default {
       return message.media_attachments
     },
     filtered(message) {
-      return this.filter.length > 0 && message.status.content.search(this.filter) >= 0
+      return Filtered(message.status.content, this.filters)
     },
     spoilered(message) {
       return message.spoiler_text.length > 0

src/renderer/components/organisms/Notification/Reblog.vue

@@ -9,9 +9,7 @@
     role="article"
     aria-label="reblogged toot"
   >
-    <div v-show="filtered(message)" class="filtered">
-      Filtered
-    </div>
+    <div v-show="filtered(message)" class="filtered">Filtered</div>
     <div v-show="!filtered(message)" class="reblog">
       <div class="action">
         <div class="action-mark">
@@ -116,6 +114,7 @@ import emojify from '~/src/renderer/utils/emojify'
 import TimeFormat from '~/src/constants/timeFormat'
 import FailoverImg from '~/src/renderer/components/atoms/FailoverImg'
 import LinkPreview from '~/src/renderer/components/molecules/Toot/LinkPreview'
+import Filtered from '@/utils/filter'
 
 export default {
   name: 'reblog',
@@ -128,9 +127,9 @@ export default {
       type: Object,
       default: {}
     },
-    filter: {
-      type: String,
-      default: ''
+    filters: {
+      type: Array,
+      default: []
     },
     focused: {
       type: Boolean,
@@ -235,7 +234,7 @@ export default {
       return message.media_attachments
     },
     filtered(message) {
-      return this.filter.length > 0 && message.status.content.search(this.filter) >= 0
+      return Filtered(message.status.content, this.filters)
     },
     spoilered(message) {
       return message.spoiler_text.length > 0

src/renderer/components/organisms/Notification/Status.vue

@@ -15,7 +15,7 @@
     <div class="clearfix"></div>
     <toot
       :message="message.status"
-      :filter="filter"
+      :filters="filters"
       :focused="focused"
       :overlaid="overlaid"
       v-on:update="updateToot"
@@ -42,9 +42,9 @@ export default {
       type: Object,
       default: {}
     },
-    filter: {
-      type: String,
-      default: ''
+    filters: {
+      type: Array,
+      default: []
     },
     focused: {
       type: Boolean,

src/renderer/store/TimelineSpace/Contents/Notifications.ts

@@ -1,4 +1,4 @@
-import generator, { Entity, NotificationType } from 'megalodon'
+import generator, { Entity, FilterContext, NotificationType } from 'megalodon'
 import { Module, MutationTree, ActionTree, GetterTree } from 'vuex'
 import { RootState } from '@/store'
 import { MyWindow } from '~/src/types/global'
@@ -156,6 +156,9 @@ const getters: GetterTree<NotificationsState, RootState> = {
           return false
       }
     })
+  },
+  filters: (_state, _getters, rootState) => {
+    return rootState.TimelineSpace.filters.filter(f => f.context.includes(FilterContext.Notifications) && !f.irreversible)
   }
 }