RPP: hide minimap when the trace is not visible

This fixes a drastic over-reporting in VE logs for the breadcrumbs
button, which was visible by default on all views.

[email protected]

Bug: None
Change-Id: Id9f9b6f73696108946c1e7af59ee92e66361a40d
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6696646
Commit-Queue: Jack Franklin <[email protected]>
Reviewed-by: Alina Varkki <[email protected]>
Auto-Submit: Jack Franklin <[email protected]>
Commit-Queue: Alina Varkki <[email protected]>

Author: jackfranklin

front_end/panels/timeline/TimelineMiniMap.ts

@@ -53,7 +53,7 @@ export class TimelineMiniMap extends
   constructor() {
     super();
     this.registerRequiredCSS(miniMapStyles);
-    this.element.classList.add('timeline-minimap');
+    this.element.classList.add('timeline-minimap', 'no-trace-active');
     this.#breadcrumbsUI = new TimelineComponents.BreadcrumbsUI.BreadcrumbsUI();
     this.element.prepend(this.#breadcrumbsUI);
 
@@ -269,7 +269,15 @@ export class TimelineMiniMap extends
     return this.#controls;
   }
 
-  setData(data: OverviewData): void {
+  setData(data: OverviewData|null): void {
+    this.element.classList.toggle('no-trace-active', data === null);
+
+    if (data === null) {
+      this.#data = null;
+      this.#controls = [];
+      return;
+    }
+
     if (this.#data?.parsedTrace === data.parsedTrace) {
       return;
     }

front_end/panels/timeline/TimelinePanel.ts

@@ -867,6 +867,7 @@ export class TimelinePanel extends Common.ObjectWrapper.eventMixin<EventTypes, t
       case 'LANDING_PAGE': {
         this.#removeStatusPane();
         this.#showLandingPage();
+        this.updateMiniMap();
         this.dispatchEventToListeners(Events.IS_VIEWING_TRACE, false);
 
         // Whilst we don't reset this, we hide it, mainly so the user cannot
@@ -1567,6 +1568,7 @@ export class TimelinePanel extends Common.ObjectWrapper.eventMixin<EventTypes, t
 
   private updateMiniMap(): void {
     if (this.#viewMode.mode !== 'VIEWING_TRACE') {
+      this.#minimapComponent.setData(null);
       return;
     }
 

front_end/panels/timeline/timelineMiniMap.css

@@ -6,8 +6,13 @@
 
 .timeline-minimap {
   position: relative;
+
+  &.no-trace-active {
+    display: none;
+  }
 }
 
+
 .timeline-minimap .overview-strip {
   margin-top: 2px;
   justify-content: center;