[EPIC] Display core version of recent changes page for AMC users
Closed, ResolvedPublic
Actions

Assigned To

Authored By

	ovasileva
	May 20 2019, 4:30 PM

Description

User story

As an experienced editor, I would like to be able to access the entire functionality of the history page from my mobile device so that I can perform my work on mobile

Acceptance criteria

all desktop functionality (with tentative exceptions TBD) will be available on mobile

Design notes

Basic mockup - these mockups show what's possible with relatively little CSS overrides. Below there is a "refined mockup" that goes a bit further in terms of cleaning up the filter section and naturally would require more CSS.

full page	time range and # of results filter menu	saved filters menu

The two main components to consider here are:

1. Filters

can we display them in a modal or should we try to use the native multi-select element?
there are a lot of elements related to the filters, some of which we might want to consider removing:
- Search, allows typeahead search for filter names
- Saved filters, allows users to access saved filters
- Saving new filters, allows users to save new filters
- active filters pill things, allows users to see which filters are currently active and remove them
- Restore default filters button
- Highlighting results
- "How do these work" links on filter headings
- "Tell us what you think about these filtering tools" link

filters as native select elements	filters in a modal

2. List of recent changes

how much control over formatting do we have?
can we re-use some of the stuff from the history page?

Other considerations

remove live updates?
can we somehow disable "Group results by page" setting?

Refined mockup

Notes from hackathon

Action items

Related Objects
Search...

Status	Subtype	Assigned	Task
Resolved	Goal	ovasileva	T198313 [GOAL] Advanced mobile contributions
Resolved		ovasileva	T228916 Deploy AMC to all Wikipedias
Resolved		ovasileva	T223922 [EPIC] Display core version of recent changes page for AMC users
Duplicate		None	T178194 Enable new RC on mobile
Resolved		Jdlrobson	T197065 New Filters for Edit Review: UI displays poorly when the window is narrow
Resolved		ovasileva	T214531 History links with curid set do not redirect properly on mobile
Resolved		Jdlrobson	T223230 Enable Recent Changes modules on mobile
Duplicate		None	T223231 mw-rcfilters-ui-menuSelectWidget-group contents disappears on scroll on mobile
Resolved		None	T223363 Cleanup Special:RecentChanges filters appearance on Minerva (mobile)
Resolved		ovasileva	T224216 Add recent changes link into main menu for AMC
Resolved		MNeisler	T223206 [Hackday] Analyse user interactions with RecentChanges
Resolved	Spike	Jdrewniak	T224432 [SPIKE, 8hrs] Allow recent changes to display list items in AMC mode
Resolved		Jdrewniak	T224655 [SPIKE] Allow recent changes to display filters in AMC mode
Resolved		ovasileva	T225499 Fix Special:RecentChanges dropdown widget on mobile
Resolved		None	T229360 [Tracking/Epic] Problems with RecentChanges and Watchlist advanced mobile contribution experience
Resolved		ovasileva	T231049 Recent changes "Save current filter settings" input zooms when focused on iOS
Resolved	BUG REPORT	None	T231050 Issue with filter menu width on mobile (OOUI menuSelectWidget)
Declined	BUG REPORT	None	T231053 Click trash on recent changes doesn't clear open filter menus
Resolved	BUG REPORT	ovasileva	T231054 Disabling the recent changes highlighting feature on Minerva
Resolved		ovasileva	T235414 Deploy core version of watchlist for AMC users
Resolved		ovasileva	T225127 Display core version of watchlist page for AMC users
Invalid		None	T235534 [AMC] fix alignment of "Edit your list of watched pages
Resolved		ovasileva	T235535 [AMC] fix alignment of "Edit your list of watched pages" button on AMC watchlist page
Resolved		ovasileva	T235536 [AMC] fix alignment of "Saved filters" button on AMC watchlist page
Declined		ovasileva	T237204 Make the new design of mobile watchlist opt-in
Declined		None	T237750 Investigate user behavior on the new AMC Watchlist page
Invalid		None	T237244 OOUI buttons with large labels breaks width of several special pages in mobile view
Declined		None	T237711 [AMC] Rollback buttons in RecentChanges page and core Watchlist are misaligned

Event Timeline

ovasileva created this task.May 20 2019, 4:30 PM

Restricted Application added a subscriber: Aklapper. · View Herald TranscriptMay 20 2019, 4:31 PM

ovasileva triaged this task as High priority.May 20 2019, 4:31 PM

ovasileva moved this task from Incoming to Epics/Goals on the Web-Team-Backlog board.

ovasileva added a subtask: T223363: Cleanup Special:RecentChanges filters appearance on Minerva (mobile).May 21 2019, 11:45 AM

ovasileva added a subtask: T223230: Enable Recent Changes modules on mobile.

ovasileva added a subtask: T178194: Enable new RC on mobile.

• alexhollender_WMF updated the task description. (Show Details)May 23 2019, 4:58 PM

• alexhollender_WMF updated the task description. (Show Details)

• alexhollender_WMF updated the task description. (Show Details)May 23 2019, 5:05 PM

• alexhollender_WMF updated the task description. (Show Details)May 23 2019, 5:16 PM

• alexhollender_WMF updated the task description. (Show Details)May 24 2019, 8:18 PM

ovasileva added a subtask: T223206: [Hackday] Analyse user interactions with RecentChanges.May 27 2019, 11:20 AM

I think the most efficient way to work on the design here is to play around with the CSS in production. Here is some CSS I wrote and the resulting look of the page (i.e. visiting recent changes on mobile using Minerva skin). I assume a lot of the selectors could be simplified. I started to work on the filters menus, however there seems to be some javascript that is defining styles directly on the elements after the CSS loads, so until we disable that there isn’t much you can do with CSS. Though I do think if we disabled that js the CSS to make this work would be relatively minimal.

en.wikipedia.org_wiki_Special_RecentChanges_hidebots=1&hidecategorization=1&hideWikibase=1&limit=50&days=7&urlversion=2&useskin=Minerva(iPhone 6_7_8) (1).png (1×750 px, 119 KB)

/* other review tools & saved filters container */
.mw-rcfilters-ui-table, .mw-rcfilters-ui-row, .mw-rcfilters-ui-cell {
	display: unset;
}

/* other review tools button */
.mw-rcfilters-ui-rcTopSectionWidget-topLinks-table {
	display: block;
}

/* saved filters button */
.mw-rcfilters-ui-rcTopSectionWidget-savedLinks {
	display: block;
	padding: 0;
	margin-top: 10px;
}

/* active filters container */


/* save filters bookmark button */
.mw-rcfilters-ui-cell.mw-rcfilters-ui-filterTagMultiselectWidget-cell-save {
    position: absolute;
    top: 0;
    right: 55px;
}

/* clear filters trashcan button, reset default filters button */
.mw-rcfilters-ui-filterTagMultiselectWidget-cell-reset {
    margin-top: 5px;
    padding: 0;
    display: inline-block;
}

/* main filters continer */

/* main filters input element */
.oo-ui-tagMultiselectWidget-input.oo-ui-widget.oo-ui-widget-enabled.oo-ui-inputWidget.oo-ui-iconElement.oo-ui-textInputWidget.oo-ui-textInputWidget-type-text input {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* namespace and tags filter container */
.mw-rcfilters-ui-filterTagMultiselectWidget-views-select-widget.oo-ui-widget.oo-ui-widget-enabled.oo-ui-selectWidget.oo-ui-selectWidget-unpressed.oo-ui-selectWidget-depressed.oo-ui-buttonSelectWidget {
    display: flex;
    border: 1px solid #a2a9b1;
    border-top: 0;
    border-radius: 0 0 2px 2px;
}

/* namespace button */
.mw-rcfilters-ui-filterTagMultiselectWidget-views-select-widget.oo-ui-widget .oo-ui-buttonOptionWidget:first-child {
    border-right: 1px solid #a2a9b1;
}

/* namespace and tags filter buttons */
.mw-rcfilters-ui-filterTagMultiselectWidget-views-select-widget.oo-ui-widget.oo-ui-widget-enabled.oo-ui-selectWidget.oo-ui-selectWidget-unpressed.oo-ui-selectWidget-depressed.oo-ui-buttonSelectWidget div {
    width: 50%;
    text-align: left;
}

/* live update, view new changes, time filters container */
.mw-rcfilters-ui-filterWrapperWidget-bottom {
	width: 100%;
    flex-wrap: wrap;
}

/* children of above container */
.mw-rcfilters-ui-filterWrapperWidget-bottom span {
    margin-bottom: 8px;
}

/* time filters button */
.oo-ui-widget.oo-ui-widget-enabled.mw-rcfilters-ui-changesLimitAndDateButtonWidget {
    order: -2;
}

/* view new changes button */
span.mw-rcfilters-ui-filterWrapperWidget-showNewChanges.oo-ui-widget.oo-ui-widget-enabled.oo-ui-buttonElement.oo-ui-buttonElement-frameless.oo-ui-iconElement.oo-ui-flaggedElement-progressive.oo-ui-buttonWidget.oo-ui-labelElement {
    font-size: 14px;
    margin-top: 2px;
}

/* list of abbreviations legend */
.mw-rcfilters-ui-changesListWrapperWidget .mw-changeslist-legend {
    display: none;
}

/* time filters popup menu */

/* group results by page select box */
.mw-rcfilters-ui-changesLimitPopupWidget .oo-ui-layout.oo-ui-labelElement.oo-ui-fieldLayout.oo-ui-fieldLayout-align-inline {
    display: none;
}

• alexhollender_WMF updated the task description. (Show Details)May 29 2019, 11:21 PM

ovasileva mentioned this in T224655: [SPIKE] Allow recent changes to display filters in AMC mode.May 30 2019, 9:39 AM

ovasileva mentioned this in T223562: Topic (Structured Discussions) edits do not appear in mobile Recent Changes.Jun 3 2019, 10:33 AM

• alexhollender_WMF updated the task description. (Show Details)Jun 6 2019, 4:59 PM

• alexhollender_WMF mentioned this in T225127: Display core version of watchlist page for AMC users.Jun 6 2019, 8:50 PM

Jdrewniak added a subtask: T225499: Fix Special:RecentChanges dropdown widget on mobile.Jun 11 2019, 11:46 AM

Jdrewniak mentioned this in T223363: Cleanup Special:RecentChanges filters appearance on Minerva (mobile).Jun 11 2019, 12:26 PM

ovasileva moved this task from Backlog to Triaged on the Advanced Mobile Contributions board.Jun 18 2019, 11:28 PM

Volker_E subscribed.Jun 25 2019, 4:59 PM

• alexhollender_WMF merged a task: T178194: Enable new RC on mobile.Jul 1 2019, 6:05 PM

• alexhollender_WMF added subscribers: Jdlrobson, Etonkovidova, • jmatazzoni, Catrope.

ovasileva edited projects, added Web-Team-Backlog (Readers-Web-Kanbanana-Board-2018-19-Q4); removed Web-Team-Backlog.Jul 2 2019, 9:39 PM

ovasileva moved this task from To Do to Quarterly Goals on the Web-Team-Backlog (Readers-Web-Kanbanana-Board-2018-19-Q4) board.

MBinder_WMF edited projects, added Web-Team-Backlog (Readers-Web-Kanbanana-2019-20-Q1); removed Web-Team-Backlog (Readers-Web-Kanbanana-Board-2018-19-Q4).Jul 3 2019, 5:42 PM

ovasileva moved this task from Needs Analysis to Quarterly Goals on the Web-Team-Backlog (Readers-Web-Kanbanana-2019-20-Q1) board.Jul 3 2019, 5:43 PM

Quiddity added a project: User-notice.Jul 4 2019, 7:32 PM

Quiddity moved this task from To Triage to Not ready to announce on the User-notice board.

Jdrewniak closed subtask T224432: [SPIKE, 8hrs] Allow recent changes to display list items in AMC mode as Resolved.Jul 18 2019, 1:06 PM

ovasileva closed subtask T223206: [Hackday] Analyse user interactions with RecentChanges as Resolved.Jul 23 2019, 7:20 PM

ovasileva added a parent task: T228916: Deploy AMC to all Wikipedias.Jul 24 2019, 5:41 PM

Jdlrobson closed subtask T224655: [SPIKE] Allow recent changes to display filters in AMC mode as Resolved.Jul 25 2019, 6:49 PM

Jdlrobson closed subtask T223230: Enable Recent Changes modules on mobile as Resolved.Jul 29 2019, 11:45 PM

As I understand this is ready to be signed off and resolved. All desktop features should be available on mobile now.

ovasileva closed subtask T224216: Add recent changes link into main menu for AMC as Resolved.Aug 6 2019, 1:26 PM

ovasileva closed subtask T225499: Fix Special:RecentChanges dropdown widget on mobile as Resolved.Aug 6 2019, 1:37 PM

Moving back to goals column - let's finish all the open tasks before signing this off

Moving back to goals column - let's finish all the open tasks before signing this off

The remaining tasks are for the non-AMC mode or for OOjs UI issues (which are going to be time consuming to fix). I thought we were descoping these and doing the bare minimum to get AMC up and running, but the fact we're fixing them too makes me super happy! 🙏🙏🙏

(Just moving tag to parent task.)

Quiddity unsubscribed.Aug 8 2019, 8:18 PM

• alexhollender_WMF closed subtask T223363: Cleanup Special:RecentChanges filters appearance on Minerva (mobile) as Resolved.Aug 18 2019, 4:23 PM

ovasileva added a subtask: T229360: [Tracking/Epic] Problems with RecentChanges and Watchlist advanced mobile contribution experience.Aug 21 2019, 5:33 PM

Jdlrobson moved this task from Quarterly Goals to Ready for Signoff on the Web-Team-Backlog (Readers-Web-Kanbanana-2019-20-Q1) board.Sep 5 2019, 8:21 PM

The only remaining subtask is T229360 which is a tracking task and reflects the state of this task much better. I think this can be signed off with that in mind.

ovasileva closed this task as Resolved.Sep 9 2019, 5:02 PM

ovasileva claimed this task.

matmarex closed subtask T229360: [Tracking/Epic] Problems with RecentChanges and Watchlist advanced mobile contribution experience as Resolved.Aug 19 2024, 6:04 PM

	F29272339: en.wikipedia.org_wiki_Special_RecentChanges_hidebots=1&hidecategorization=1&hideWikibase=1&limit=50&days=7&urlversion=2&useskin=Minerva(iPhone 6_7_8) (2).png
	May 29 2019, 11:21 PM

	F29272337: en.wikipedia.org_wiki_Special_RecentChanges_hidebots=1&hidecategorization=1&hideWikibase=1&limit=50&days=7&urlversion=2&useskin=Minerva(iPhone 6_7_8) (3).png
	May 29 2019, 11:21 PM

	F29272247: en.wikipedia.org_wiki_Special_RecentChanges_hidebots=1&hidecategorization=1&hideWikibase=1&limit=50&days=7&urlversion=2&useskin=Minerva(iPhone 6_7_8) (1).png
	May 29 2019, 10:37 PM

	F29366411: image.png
	Jun 6 2019, 4:59 PM

	F29366378: image.png
	Jun 6 2019, 4:59 PM

[EPIC] Display core version of recent changes page for AMC usersClosed, ResolvedPublicActions