[Lens] Improve error UI

[stratoula]

Describe the feature:
Currently in Lens we have a paginated results UI to show the errors:

According to Michael's comments here we could improve it to be inline with the ccs errors #172971 (comment)

Something like that

[elasticmachine]

Pinging @elastic/kibana-visualizations (Team:Visualizations)

[nreese]

Am I correct in assuming that the "View details" button would open the same inspect flyout that you and I have discussed in our previous work on remote cluster errors? If so, do we even need the error pagination shown in the last example screenshot above? Would it be better to take an approach that is consistent with our work on remote cluster errors and simply have a general error message and count, with the "View details" button allowing users to view all the error(s) details in the flyout?

The "View details" action button is only available for elasticsearch errors. In the example with the pagination, the errors are configuration errors and a query is never is sent to elasicsearch. Therefore the pagination errors are still required for lens configuration errors.

[MichaelMarcialis]

Thanks for that clarification, @nreese! After a closer review of the original PR, it looks we may be able to avoid issue that causes the error in your example altogether with a small behavior change. In Lens, we try to do everything we can to avoid obstructing users with errors, if there is any way they can be prevented. By manually deleting the field selection value for the cumulative sum function, as per your steps, it seems you're able to circumvent the checks we've put in place to prevent users from applying a configuration with no field selected.

Test - EsError in embeddable

1. install sample web logs
2. create new dashboard
3. Click "Create visualization"
4. Drag "timestamp" field into workspace.
5. Change "Vertical axis" to "Cumulative sum". Select "Field" select and hit delete key
6. Clone layer one or more times
7. Verify pagination is displayed, allowing users to click through all configuration errors

I'm thinking we should treat this situation similar to how Lens treats other instances of a configuration being applied without a field (i.e. revert the configuration to its last known good state). @stratoula, would we have the ability to revert to the last known good state when the user closes a configuration flyout after manually deleting the field selection? Doing so would make this error message unnecessary. For example, the below screenshots show how Lens currently falls back to the last known good configuration when the user closes the configuration flyout without having selected a field:

Step 1: User transitions from "Filter" function to "Intervals" function and is warned that they must supply a field	Step 2: User closes the flyout without supplying a field, so the configuration reverts back to the last known good state

Otherwise, if we're not able to prevent this error as we do with similar situations in Lens, then I'd recommend that we make a few changes to how the error presented across the Lens UI. Example mockups below.

• The error(s) should be logged in the errors/warnings button count and subsequent dropdown in the top-right of the Lens toolbar (along with any actions accompany them).
• If an error can be attributed to a specific dimension item, that item should be flagged with a red error icon, text, and accompanying tooltip.
• As errors cause the visualization not to be able to be rendered (unlike warnings), the workspace should display a user friendly message in an empty prompt with a red error icon.

Single error example

Multiple error example

As for the other examples provided in the original PR, here are some quick mockups with my suggested changes, for the sake of consistency:

Lens shard error

Dashboard shard error

---

@stratoula: As an additional note, it unfortunately appears that Lens isn't very consistent with how it present its error messages currently. Error messages can be displayed in varying ways, as shown below.

If we can adopt the same patterns as suggested above (and first proposed within this old errors/warnings design document that @drewdaemon and I collaborated on a while back), that would be a nice win for error and warning consistency in Lens. Let me know if that needs to be a separate issue.

[stratoula]

Yes @MichaelMarcialis I agree, let's see this issue holistically and try to apply a common error strategy and UI.

@stratoula, would we have the ability to revert to the last known good state when the user closes a configuration flyout after manually deleting the field selection?

Yes I think we can, especially in this scenario it makes sense to me