[Meta] Uptime Redesign

[andrewvc]

This meta issue tracks the implementation of the design overhaul of the Uptime app. Screenshots are provided at the bottom of this issue.

Tasks

• New overview page
  • New overview status panel ( [Uptime] New overview page status panel kibana#44533 )
  • New MonitorList Expanded row ( [Uptime] New MonitorList Expanded Row kibana#44541 )
    • Add filters to expanded row [Uptime] Added date range filter into expanded list query kibana#52609
• New details page
  • New details status panel + location world map ( [Uptime] New details status panel + location world map kibana#44550 )
  • Use red-gray color scheme on pings histogram ( [Uptime] Use red/gray color scheme for pings histogram on details page kibana#44553 )
    - [ ] Monitor timelines ( [Uptime] Monitor Timelines kibana#44546 )

Sequencing

We should tackle tasks in the following order:

1. Everything on the overview page, there are few dependencies here. The one exception is the timeline widget, which can be temporarily implemented via the current mini histogram used on monitor rows on the current overview page.
2. New details page: This has more complexity, and has the new map widget.
3. Monitor Timelines: Even though we have a working PoC it's a lot of code. We should add this in as a final evolutionary phase.

Overview Page

Details Page

[justinkambic]

@andrewvc what is your thinking about the implementation process for these enhancements? Should we create separate components that we can host in master, and then perform a switch when all items are completed? Or we complete them piecemeal and have master straddle the enhanced design with the legacy styling?

[andrewvc]

@justinkambic we can go piecemeal here, the components are an improvement individually as well as combined.

[shahzad31]

Seems like we need to get to timelines at some point.