[Uptime] Added step duraion in step list

[shahzad31]

Summary

Fixes elastic/uptime#392

Added a step duraiton in the step list and trend chart and deep link to exploratory view for further exploration.

Updated screenshot with updated units

Won't display for skipped step

Will not show any step duration for fixed steps.

Shows trend chart for last 48 checks last values.

Added functional tests as well using @elastic/synthetics .

[drewpost]

I'm a sucker for these super useful "little" additions. I'd be happy to see that ship in the product.

[drewpost]

@shahzad31 a couple of little things.

• Can we change the units from MS into seconds in a SS.s format?
• What happens if a step doesn't run or fails? Do we still show a chart? ie if a step didn't run then there's no value for duration in that view. What's displayed and can I still get to the chart for the history of that step?
• This might be a bit more challenging but is there a way to distinguish between good test runs that passed for that step and ones that failed with some sort of colour or indicator?
• Just to double check - the results are individual test runs and not aggregated buckets of time, right?
  cc @liciavale

[shahzad31]

Ignore skipped step duration

[elasticmachine]

Pinging @elastic/uptime (Team:uptime)

[justinkambic]

Change looks great! Had a few comments/questions I wanted to address, but this is really close.

[paulb-elastic]

This should probably use metrics consistent with the overview history page (seconds), or at least show in seconds with a decimal to millisecond precision (current implementation of microseconds is probably too detailed)

[shahzad31]

@paulb-elastic it's already converted to seconds, i will update the screenshot in the description.

[justinkambic]

Code is looking good. Had a few remarks on the functionality, illustrated by the GIF:

Two main points:

1. We might need to re-evaluate the way these lists are handling the open state for these popovers. We should probably only have one of these open at a given time.
2. I think it's better if we drop the second significant digit for the duration metric, and just display the number of seconds as an integer. I'm thinking there might be a bug where we are losing precision since all of these real-world steps are reading as x.0.

[shahzad31]

@justinkambic fixed the decimal point issue and also it will only show one popover now

[justinkambic]

Found some weirdness happening based on the step name (I think):

Not sure if there's some kind of escaping we need to do before sending the data to lens.

Other than that this is looking good. I did find a few UI glitches but they seem to be happening on main, so unrelated.

[justinkambic]

LGTM!

[kibana-ci]

💚 Build Succeeded

• Buildkite Build
• Commit: b6f4c31
• Storybooks Preview

Metrics [docs]

Module Count

Fewer modules leads to a faster build time

id	before	after	diff
uptime	644	646	+2

Async chunks

Total size of all lazy-loaded chunks that will be downloaded as the user navigates the app

id	before	after	diff
observability	362.2KB	362.3KB	+84.0B
uptime	599.5KB	600.8KB	+1.3KB
total			+1.4KB

History

• 💔 Build #11076 failed b107a0a
• 💔 Build #10984 failed 29bf790
• 💔 Build #10623 failed 28d8914
• 💔 Build #10333 failed b3eab1b
• 💔 Build #10029 failed 36bb246

To update your PR or re-run it, just comment with:
@elasticmachine merge upstream

[drewpost]

Looks good to me! LGTM

[kibanamachine]

Friendly reminder: Looks like this PR hasn’t been backported yet.
To create backports run node scripts/backport --pr 116266 or prevent reminders by adding the backport:skip label.

[kibanamachine]

💚 Backport successful

Status	Branch	Result
✅	8.0

This backport PR will be merged automatically after passing CI.