Page MenuHomePhabricator

Add 'warning' message type and use 'warning' flag to OOUI messages
Closed, ResolvedPublic

Description

As of T89765: Show warning about privacy/security issues on PDF file pages being resolved we now have an orange warning color available for certain icons.

From the (abandoned, but content-wise valueable) LSG draft:

Warn (orange) conveys to the user their action may fail or have serious consequence but are not destructive. Some examples could be that an edit is likely to encounter an automated block due to the nature of the content, or that a preference is being reset to a default options.

From event management differentiation by ITSM:

Informational events [notices] are typically events within normal operating boundaries. They are the types of “good” events that tend to fill most IT Service Management tools. These events are typically an indication that something has worked as it should.

Warnings are an early indicator or potential indicator of trouble. However, we need to understand that a warning is a flag to something being “unusual”, not necessarily negative (e.g. someone logs in after 6 weeks of inactivity)

Exceptions [errors] are the most typical precursor to incidents, but they will not always lead to an incident (e.g. a CPU spikes above the set threshold as a power user starts a processing job). Exception events will generally be of interest to IT Operations staff as they may be a sign of more trouble to come.


Additional resources
Color swatches: https://design.wikimedia.org/style-guide/visual-style_colors.html

Outcome

WikimediaUIApex

Event Timeline

TrevorParscal updated the task description. (Show Details)
TrevorParscal raised the priority of this task from to Needs Triage.
TrevorParscal added projects: Design, OOUI.
Restricted Application added a subscriber: Aklapper. · View Herald TranscriptMar 9 2015, 9:36 PM

I can't imagine a use case where a button should have a "warning" flag applied. Buttons are not warnings, blocks of text are (dialogs, popups, or just text in a page). Constructive, destructive or progressive buttons make sense; warningey buttons do not.

MediaWiki core has three classes for information messages, .successbox, .warningbox and .errorbox, that are used e.g. in the account creation workflow, introduced as part of the "VForm" stuff some time ago. I think that is a pretty good design direction.

The orange part in Pau's mockup from T89765 is not really a button (it doesn't look like one, nor like a link; it's just colored text). I'm not sure how that's supposed to work; it does make sense if the popup opens automatically, but it doesn't look very clickable if it doesn't. I think it's the popup that should have "warning" styles applied, with the alert icon being a regular non-colored one.

This isn't specific to buttons… tipsy, icon buttons, and possibly other controls and UI elements.

@werdna's task name was more accurate than this one.

Jaredzimmerman-WMF triaged this task as High priority.
Jaredzimmerman-WMF set Security to None.
matmarex renamed this task from Add warning button styles to buttons to Add 'warning' or 'warn' flag to OOjs UI stylings.Mar 15 2015, 7:07 PM
matmarex updated the task description. (Show Details)

@werdna's task name was more accurate than this one.

Well, that's easily fixed at least.

This isn't specific to buttons… tipsy, icon buttons, and possibly other controls and UI elements.

Okay. All I am saying is that it is inappropriate for buttons. I am not questioning the utility for other UI elements, like "tipsies" (=popups).

Change 196211 had a related patch set uploaded (by Prtksxna):
[wip] MediaWiki Theme: Add button definitions for -warning flag

https://gerrit.wikimedia.org/r/196211

What's the semantic meaning of the warning flag on a user action button?

Destructive == if you click this you're doing something damaging
Constructive == if you click this you're doing something creative
Progressive == if you click this you're doing something to move things onwards

Warning == if you click this you're doing something which …

  • … will warn you that you're doing it?
  • … you should already magically know from it being orange is bad but not bad-bad like if it were red?
  • … will warn someone else against doing something?
  • … will warn someone else and encourage them to do something instead?
  • something else?

I don't think anyone suggested a warn button, so I not sure why we're still talking about this.

Some possible places for warn…

Tipsy (field input is currently invalid, but its not too late to fix it)
Wikidata rank control (something has only one statement but you're lowing the rank of that statement)
Toggle (this is supposed to be "on" but you've turned it off, things may get weird)
AbuseFilter (sure you can post this, but its already been flagged as needing review)

Eventually it might make sense to say that certain intention flags only work on certain ui elements, but I don't think OOUI is set up for that yet. Once it is, we'll be able to limit only certain colors to certain controls to keep people from making Warn Buttons, since as we can all agree, that makes no sense.

Jdforrester-WMF moved this task from Backlog to Next-up on the OOUI board.Mar 28 2015, 1:20 AM
Jdforrester-WMF moved this task from Next-up to Doing on the OOUI board.
Jdforrester-WMF assigned this task to Prtksxna.

Change 201693 had a related patch set uploaded (by Prtksxna):
[wip] Make PopupsWidget and FlaggedElement

https://gerrit.wikimedia.org/r/201693

The elements that could use the warning flag and have been implemented in OOjs UI are PopupsWidget or tipsy, and ToggleSwitchWidget. I am working on a patch that adds the warning flag to PopupsWidget

Is this what we want? Are we all on the same page?

Change 196211 abandoned by Prtksxna:
MediaWiki Theme: Add LESS variables for warning colors

https://gerrit.wikimedia.org/r/196211

Change 201693 abandoned by Prtksxna:
[wip] Make PopupsWidget and FlaggedElement

https://gerrit.wikimedia.org/r/201693

Prtksxna removed Prtksxna as the assignee of this task.Aug 13 2015, 10:39 AM
Prtksxna moved this task from Doing to Next-up on the OOUI board.

@Prtksxna Please give me an update on that task, either here or via IRC on why you've abandoned this task?

@Prtksxna Please give me an update on that task, either here or via IRC on why you've abandoned this task?

I can't find the message at this moment, but I am pretty sure that @TrevorParscal said somewhere that we should add the variable as and when we actually need it.

Jdforrester-WMF moved this task from Next-up to Backlog on the OOUI board.Mar 2 2016, 1:59 AM
Prtksxna lowered the priority of this task from High to Normal.Jul 25 2017, 4:39 PM
Volker_E renamed this task from Add 'warning' or 'warn' flag to OOjs UI stylings to Add 'warning' or 'warn' flag to OOUI stylings.Jan 10 2018, 1:09 AM
Volker_E renamed this task from Add 'warning' or 'warn' flag to OOjs UI stylings to Add 'warning' or 'warn' flag to OOUI stylings.
Volker_E moved this task from Backlog to Next-up on the OOUI board.Feb 2 2018, 2:47 AM
Volker_E updated the task description. (Show Details)Mar 27 2018, 4:28 PM

Change 489917 had a related patch set uploaded (by VolkerE; owner: VolkerE):
[oojs/ui@master] Implement 'error' flag and 'warning' type messages

https://gerrit.wikimedia.org/r/489917

Volker_E renamed this task from Add 'warning' or 'warn' flag to OOUI stylings to Add 'warning' message type and use 'warning' flag to OOUI messages.Feb 20 2019, 11:03 PM
Volker_E updated the task description. (Show Details)
Volker_E updated the task description. (Show Details)Feb 20 2019, 11:05 PM
Volker_E updated the task description. (Show Details)

Re-using this task, as the separation in three different system/user message types (notice, warning, error) instead of just two (notice, error) makes sense from my point of view.

Volker_E updated the task description. (Show Details)Feb 20 2019, 11:07 PM

That would also align OOUI with MW core and obsolete mediawiki.ui styles, see T127405

Volker_E moved this task from Next-up to Doing on the OOUI board.Feb 27 2019, 1:00 AM

Change 489917 merged by jenkins-bot:
[oojs/ui@master] Implement 'error' flag and 'warning' type messages

https://gerrit.wikimedia.org/r/489917

Volker_E moved this task from Doing to OOUI-0.30.4 on the OOUI board.Mar 6 2019, 9:59 PM
Volker_E edited projects, added OOUI (OOUI-0.30.4); removed OOUI.
Volker_E closed this task as Resolved.
Volker_E claimed this task.
Volker_E removed a project: Patch-For-Review.
Volker_E removed a subscriber: gerritbot.
Volker_E updated the task description. (Show Details)Mar 6 2019, 10:05 PM

Change 494883 had a related patch set uploaded (by Jforrester; owner: Jforrester):
[mediawiki/core@master] Update OOUI to v0.30.4

https://gerrit.wikimedia.org/r/494883

Change 494883 merged by jenkins-bot:
[mediawiki/core@master] Update OOUI to v0.30.4

https://gerrit.wikimedia.org/r/494883