UX proposal: Display filtered notifications "inline"

[mcclure]

Motivation

There is a new "filtered notifications" feature in Mastodon we must support to some degree: #4331
I think (?) Conny has work toward the preference pane for choosing your notification filters, and also the new API endpoints.
But there's a problem: When there is a filtered notification, how do we display it?
Mastodon Web shows a big box pinned to the top of your notifications. Conny has a mockup doing similar.

But:

• I don't like Mastodon UI for this!!
• I am not the only one who seems frustrated by it, here's Christine Lemmer-Webber complaining (I have not talked to her about this)

The problem in the Mastodon Web approach is filtered notifications get too much emphasis— more than a regular notification. This is inappropriate because filtered notifications are less important than a regular notification, not more.

Pitch

I propose a solution: Show filtered notifications inline in the notification tab, so they have exactly as much emphasis of a regular notification.

A mockup:

➜

A filtered notification is shown at the correct place in the timeline, but we do not show the notification, only who is messaging you (with a yellow background to indicate it is special— this is similar to Mastodon Web coloring private mentions blue, which I still think we should adopt) (alternate version of image 2 without the yellow background here and options to show or hide. If the user hides, the notification disappears. If the user shows, the notification is shown in full. The user is then again given inline options, whether to banish that user from their timeline forever, or to always allow their notifications in future. (This corresponds to the "checkbox" and "mute" buttons in Mastodon Web.

Doing it this way may require us to request API support from Mastodon, as currently notifications and notification requests are shown as two separate streams.

This is just one approach to the appearance. There are some things we could do to make it fancier or just different:

• We could put a "?" in the corner of the initial "Filtered notification, show/hide" display (my left image above). Tapping the ? could bring up a modal box explaining why the notification was filtered (there are four filtered notification types the user can set, plus a fifth, non-optional "your instance thinks this is a low quality notification") (I don't know if the API gives us this "why" information currently), and also link to the notification-filter-types preference pane in case the popup makes the user realize they want to adjust those.
• In the initial filtered notification display (my left image above), if the user clicks "hide", a modal box could ask "Always hide from this user?". If the user says no we zap this one notification but don't send the "always hide" to the server. (Not sure if this requires API support.)
• We could have a setting in the preferences for "never show filtered notifications". If the user clicks this, they will not even see the filtered-notification offers (left image above).

[renchap]

I want to provide some additional context on this feature. It was designed as a separate inbox in the web app, as one of the intend here is to help fighting harassment and spam, like DM spam. If you start to be targeted by such messages and you enabled the settings to filter those, you most probably do not want your notification to be filled up with those, needing to handle them one by one.

[connyduck]

Here is a suggestion how it could look in the app @mcclure