RPP: care about data grid deselect events

This ensures that if the user deselects a row we deal with it correctly.
Otherwise the user can visually deselect the row, but the UI does not
update to account for that change.

Bug: 409474445
Change-Id: Ib89e9e0e9b767411f6d1add45f845c435624ee7d
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6443373
Reviewed-by: Andres Olivares <andoli@chromium.org>
Commit-Queue: Andres Olivares <andoli@chromium.org>
Auto-Submit: Jack Franklin <jacktfranklin@chromium.org>

Author: jackfranklin

front_end/panels/timeline/TimelineTreeView.ts

@@ -600,10 +600,12 @@ export class TimelineTreeView extends
 
   override wasShown(): void {
     this.dataGrid.addEventListener(DataGrid.DataGrid.Events.SELECTED_NODE, this.#onDataGridSelectionChange, this);
+    this.dataGrid.addEventListener(DataGrid.DataGrid.Events.DESELECTED_NODE, this.#onDataGridDeselection, this);
   }
 
   override childWasDetached(_widget: UI.Widget.Widget): void {
     this.dataGrid.removeEventListener(DataGrid.DataGrid.Events.SELECTED_NODE, this.#onDataGridSelectionChange);
+    this.dataGrid.removeEventListener(DataGrid.DataGrid.Events.DESELECTED_NODE, this.#onDataGridDeselection);
   }
 
   /**
@@ -617,6 +619,17 @@ export class TimelineTreeView extends
     this.onHover((event.data as GridNode).profileNode);
   }
 
+  /**
+   * Called when the user deselects a row.
+   * This can either be because they have selected a new row
+   * (you should expect a SELECTED_NODE event after this one)
+   * or because they have deselected without a new selection.
+   */
+  #onDataGridDeselection(): void {
+    this.onClick(null);
+    this.onHover(null);
+  }
+
   onGridNodeOpened(): void {
     const gridNode = this.dataGrid.selectedNode as TreeGridNode;
     // Use tree's hover method in case of unique hover experiences (like ThirdPartyTree).