Page MenuHomePhabricator

[Notifications] Add inbox filtering
Closed, ResolvedPublic

Assigned To
Authored By
Dmantena
Aug 13 2021, 10:05 PM
Referenced Files
F34948926: no_filter_one_or_more_project_off.png
Feb 11 2022, 9:59 PM
F34946729: image.png
Feb 9 2022, 3:44 PM
F34659706: filter_project_ideas.png
Sep 27 2021, 11:51 PM
F34659532: filter_project_symbols.png
Sep 27 2021, 7:23 PM
F34651920: IMG_2754.PNG
Sep 23 2021, 6:31 PM
F34651151: image.png
Sep 22 2021, 7:30 PM

Description

Filter the displayed notifications by Wikimedia projects and Wikipedias.

  • Add toolbar inbox button with two states(?) [1]
  • Create modal view with Wikimedia Projects and Wikipedias [2]
  • Persist filter selections to UserDefaults
  • Update the status text in the toolbar (content in separate task)

Product/Design Needs:
[1] What are the intended icon states here? In Figma I'm seeing a double stack inbox and a single stack inbox but not clear what they connote
[2] How is the Projects modal data populated? The Wikimedia Projects text states only projects you've created an account for will appear, but what about the Wikipedias sections?
[3] Is it intended for Read Status Filters and Inbox Filters to be persisted between app launches?

Engineering Needs:
[1] The UI needs API on the Notifications Data Controller to interact with here

Dependencies

https://phabricator.wikimedia.org/T287298
https://phabricator.wikimedia.org/T288654

Related

https://phabricator.wikimedia.org/T288874
https://phabricator.wikimedia.org/T288773

Event Timeline

Dmantena lowered the priority of this task from Medium to Low.Aug 13 2021, 10:33 PM

[1] What are the intended icon states here? In Figma I'm seeing a double stack inbox and a single stack inbox but not clear what they connote

@Dmantena this is following a pattern from Apple Mail where a single tray icon is used when you are viewing one of your inboxes and the stack is used when viewing messages across all of your inboxes.

[2] How is the Projects modal data populated? The Wikimedia Projects text states only projects you've created an account for will appear, but what about the Wikipedias sections?

CC: @JMinor: I believe that we were hoping to show the contributor's app language Wikis + any Wikis they have new messages in after logging into the app?

[3] Is it intended for Read Status Filters and Inbox Filters to be persisted between app launches?

Ideally, yes

[1] What are the intended icon states here? In Figma I'm seeing a double stack inbox and a single stack inbox but not clear what they connote

@Dmantena this is following a pattern from Apple Mail where a single tray icon is used when you are viewing one of your inboxes and the stack is used when viewing messages across all of your inboxes.

@cmadeo So correct me if I'm wrong, but your intent is:

  • the default display behavior, where the the user is viewing all Projects and hasn't "filtered down" their Project selections, is the double stack filled inbox (SF Symbol tray.2.fill)
  • if the user has unchecked some Projects ("filtered them down"), a single filled inbox is displayed (tray.fill)

I'm wondering if, in seeing the empty and filled "filter" symbol (line.3.horizontal.decrease.circle & line.3.horizontal.decrease.circle.fill) in context next to these inbox states, and what those fill states imply to a user, if a user might be confused about what the inbox symbol states are indicating.

The filter filled state (line.3.horizontal.decrease.circle.fill) implies there's active filtering happening, and an unfilled state implies there's no active filtering happening. The double stack inbox does imply more, but the lack of an unfilled state perhaps confuses the expectation about what is actually happening.

This isn't a complete design thought by me (and please do let me know if you think my thinking on this is misguided), but I'm wondering if you think we'd be better serving the user by somehow utilizing a single symbol with two different fill states (like tray and tray.fill) to indicate that Project filtering is active instead of two different symbols with a single fill state (inbox filled tray.fill and double inbox tray.2.fill) here?

Hmm, I think this should still be on the 6.9 board, but maybe I missed a decision somewhere. @LGoto do you remember why this was removed from the release?

[1] What are the intended icon states here? In Figma I'm seeing a double stack inbox and a single stack inbox but not clear what they connote

Please see below

image.png (1×551 px, 66 KB)

[2] How is the Projects modal data populated? The Wikimedia Projects text states only projects you've created an account for will appear, but what about the Wikipedias sections?

Did we come to a conclusion around this in a meeting @JMinor or @Tsevener ?

[3] Is it intended for Read Status Filters and Inbox Filters to be persisted between app launches?

Ideally yes, but it's okay if it can't be

[2] How is the Projects modal data populated? The Wikimedia Projects text states only projects you've created an account for will appear, but what about the Wikipedias sections?

@cmadeo and I chatted about this for a bit. What we will be importing at the data layer are:

  1. The entire history of each app language
  2. The entire history of commons and wikidata, and
  3. Only unread notifications of any other language wikis.

So with this we were thinking we could make a list like this:

  • Always have commons and wikidata options, even if they don't happen to have any notifications imported for those.
  • Always have their app language options (so this is a somewhat dynamic list, it'll change if they change their app languages)
  • Any additional language wikis for imported notifications that aren't in their app languages. So these items will be built off of what notifications we have saved in Core Data.

Sorry, my previous comment was needed but I briefly forgot about why we moved this in Needs Design to begin with. @cmadeo please take a look at https://phabricator.wikimedia.org/T288873#7286276 and let us know if you have any thoughts on @Dmantena 's comments. Thanks!

Hi @Dmantena sorry I missed your comment from earlier!

This isn't a complete design thought by me (and please do let me know if you think my thinking on this is misguided), but I'm wondering if you think we'd be better serving the user by somehow utilizing a single symbol with two different fill states (like tray and tray.fill) to indicate that Project filtering is active instead of two different symbols with a single fill state (inbox filled tray.fill and double inbox tray.2.fill) here?

Using the stacked icon is following the convention from Apple mail, but I think that your point around using unfilled icons vs. filled makes a lot of sense. can we update the icons to be unfilled?

IMG_2754.PNG (2×1 px, 675 KB)

Thanks for peeking back at this @cmadeo!

can we update the icons to be unfilled?

Gotcha - do these symbols correspond to what you're expecting to see in the toolbar now? No more fill states?

filter_project_symbols.png (207×680 px, 21 KB)

Sorry, @Dmantena this looks good except for 'filter applied' that's the only icon that should use the filled state

Sorry, @Dmantena this looks good except for 'filter applied' that's the only icon that should use the filled state

@cmadeo Ah got it – so this is where I think we may still benefit from changing our symbols and fill states. As a user, I can imagine this fill state logic (for these two items that are essentially both filters on a raw list) causing me to make an incorrect assessment when quickly trying to determine what information I'm viewing.

Just thinking about the fill states in this context, filled indicates active or engaged, and unfilled indicates it's disengaged or not active. That's Apple Mail's vibe with their toolbar filter button too (they throw a wrench in the works with that compose button, but that's a direct action not a state indicator).

Here're two ideas that preserve that on-filled off-unfilled logic:

filter_project_ideas.png (345×721 px, 33 KB)

As a user quickly visually scanning these symbols with their fill states, I can make a quicker more correct assessment of the data I'm viewing without the extra cognitive work to remember the left filter fill states operate differently than the right filter fill states.

Does my way of thinking about this seem off?

Happy to go down whatever path you feel is best even if it's not one of these – just wanted to communicate the rationale behind my suggested approach!

cmadeo added a subscriber: Deepak.

Hi @Deepak thanks for this! I'm happy to go with route B!

JMinor raised the priority of this task from Low to Medium.Oct 7 2021, 7:20 PM

@Tsevener or @Dmantena it looks like we have one small missing element, we're missing the subtitle for no filters turned on AND one or more projects turned off I'd expect this to read as 'All notifications in X projects'

image.png (1×551 px, 67 KB)

Hey @cmadeo – I could be misinterpreting something, but I think we cover this case. Here's a screenshot with 1. no filters turned on and 2. one or more projects turned off (just showing English and French projects out of five total projects in this case). Am I missing which what subtitle you are referring to?

no_filter_one_or_more_project_off.png (326×962 px, 88 KB)

Hi @Dmantena, ah, strange this wasn't showing up for me! Let me try to reproduce again.

@cmadeo Whoops - I accidentally deleted my last message. When you get a chance, can you share the Projects (both Wikimedia and Wikipedia projects) you have listed and selected in the Projects modal that reproduces this issue for you?

@Dmantena this is working for me now after the app update!

@Dmantena this is working for me now after the app update!

Awesome - glad to hear.

JMinor claimed this task.