[Lens] Make changing time intervals easier and with less effort/clicks

[AlonaNadler]

Currently to change time intervals in Lens users need to turn a switch which shows them customized time interval options.
Changing the interval is a common operation that the default interval doesn't always capture the right way.
It should be easy to change the intervals to the common intervals (hourly, daily, monthly).
In Lens it requires to usually change both dropdowns to move to common intervals

Few suggestions:

• users should have the intervals visible without the need to turn on a switch
• the common smile intervals should be easy to select
• there should be a custom option that allows users to select custom intervals such as 4 hours intervals

@cchaos

[elasticmachine]

Pinging @elastic/kibana-app (Team:KibanaApp)

[wylieconlon]

These are good suggestions, and I want to add another, which is to add a slider that influences the "auto" interval in increments of "small, medium, large". We already do this internally, for example TSVB uses a "small" interval while Lens and Visualize use a "medium" interval. For bar charts, this would affect the width of the bars (which is also the interval between buckets). This is basically the same setting as "target number of bars," which is an advanced setting Kibana already supports for TSVB and Visualize.

Small: 100 bars
Medium: 50 bars
Large: 20 bars

The main reason to support both a "target number of bars" and "target interval" is because they support different use cases. If the target number of bars is always the same, you get a more detailed view at smaller time ranges than at larger time ranges.

[wylieconlon]

Changing the title of the issue to reflect that a decision was made. Based on @cchaos's feedback, we have decided to offer the same entry options as what Visualize has, which is an EuiComboBox with the a list of time intervals or the ability to type a custom time interval.

[AlonaNadler]

We have two somehow related issues which go around similar problem.
problem:

• Users/dashboard consumers often need to view the chart with a different time range than the one configured. For example, users see a chart on 12 hours intervals but they need it to be daily. On dashboard, there is no way to change the interval
• Cumbersome intervals UI in Lens: changing intervals is done often when creating time series charts. In Lens, it's hidden behind a switch and then more often they need to change two drop-down, in many cases, the simple (like in visualize) intervals make more sense. This combination of UI input creates a cumbersome experience for something done often

In Lens by default this will become more front and center and will create frustration.
If the user is in a dashboard, to change the time intervals, they need to:

• Click edit dashboard
• go back to the right panel
• Click edit panel
• open x-axis dimension
• Click the switch for time intervals
• change the two dropdowns.

We need to find a way to make it easier since occasionally users need to view the chart switching between multiple time intervals, for example, this is the chart on daily intervals and then move to weekly intervals and vis versa

Two option (we can start with one, the other or eventually do both):

• Make a more effortless UI for changing Lens @MichaelMarcialis - less clicks fewer changes quicker and easier
• Allow users to change the time intervals when on a dashboard (without saving the changes) Related to Partial configuration editing while on dashboard for Lens panels  #72437

cc: @flash1293

[MichaelMarcialis]

• Cumbersome intervals UI in Lens: changing intervals is done often when creating time series charts. In Lens, it's hidden behind a switch and then more often they need to change two drop-down, in many cases, the simple (like in visualize) intervals make more sense. This combination of UI input creates a cumbersome experience for something done often

Hey, @AlonaNadler. This is a great observation. I agree that we can probably improve this experience to make it faster for users to apply a desired time interval. One particular solution that immediately jumps to mind is an interface similar to one that we had designed during our work on scheduled reporting.

We initially offer users a single form field with the most commonly selected time intervals. For most users, they simply select one of these common intervals and move along. Should an advanced user require a less common time interval, we also offer a custom option that reveals additional fields for a specific time interval to be defined. I could see something very similar being used here to good effect.

Thoughts? I'd be happy to add a mockup of this to my to-do list. Just let me know what kind of timeline you're thinking for this effort.

[wylieconlon]

I thought we already made a decision about this. I commented earlier:

Based on @cchaos's feedback, we have decided to offer the same entry options as what Visualize has, which is an EuiComboBox with the a list of time intervals or the ability to type a custom time interval.

[MichaelMarcialis]

I thought we already made a decision about this. I commented earlier:

Based on @cchaos's feedback, we have decided to offer the same entry options as what Visualize has, which is an EuiComboBox with the a list of time intervals or the ability to type a custom time interval.

Ah, apologies. If a decision has already been made/finalized, then please ignore my comment above.