From 5e388b1f0241c569aed1be2729fe7c0f4ee8779c Mon Sep 17 00:00:00 2001
From: Paulus Schoutsen <balloob@gmail.com>
Date: Wed, 12 Jan 2022 10:22:04 -0800
Subject: [PATCH] Add entity ID being browsed to URL of media browser (#11164)

---
 .../media-browser/ha-panel-media-browser.ts   | 34 +++++++++++++++++--
 1 file changed, 31 insertions(+), 3 deletions(-)

diff --git a/src/panels/media-browser/ha-panel-media-browser.ts b/src/panels/media-browser/ha-panel-media-browser.ts
index 5b1cc9b0dc..2f7bd736db 100644
--- a/src/panels/media-browser/ha-panel-media-browser.ts
+++ b/src/panels/media-browser/ha-panel-media-browser.ts
@@ -1,11 +1,19 @@
 import "@polymer/app-layout/app-header/app-header";
 import "@polymer/app-layout/app-toolbar/app-toolbar";
-import { css, CSSResultGroup, html, LitElement, TemplateResult } from "lit";
+import {
+  css,
+  CSSResultGroup,
+  html,
+  LitElement,
+  PropertyValues,
+  TemplateResult,
+} from "lit";
 import { customElement, property } from "lit/decorators";
 import { LocalStorage } from "../../common/decorators/local-storage";
 import { HASSDomEvent } from "../../common/dom/fire_event";
 import { computeStateDomain } from "../../common/entity/compute_state_domain";
 import { supportsFeature } from "../../common/entity/supports-feature";
+import { navigate } from "../../common/navigate";
 import "../../components/ha-menu-button";
 import "../../components/media-player/ha-media-player-browse";
 import {
@@ -15,7 +23,7 @@ import {
 } from "../../data/media-player";
 import "../../layouts/ha-app-layout";
 import { haStyle } from "../../resources/styles";
-import type { HomeAssistant } from "../../types";
+import type { HomeAssistant, Route } from "../../types";
 import { showWebBrowserPlayMediaDialog } from "./show-media-player-dialog";
 import { showSelectMediaPlayerDialog } from "./show-select-media-source-dialog";
 
@@ -26,6 +34,8 @@ class PanelMediaBrowser extends LitElement {
   @property({ type: Boolean, reflect: true })
   public narrow!: boolean;
 
+  @property() public route!: Route;
+
   // @ts-ignore
   @LocalStorage("mediaBrowseEntityId", true)
   private _entityId = BROWSER_PLAYER;
@@ -74,11 +84,29 @@ class PanelMediaBrowser extends LitElement {
     `;
   }
 
+  public updated(changedProps: PropertyValues): void {
+    super.updated(changedProps);
+
+    if (!changedProps.has("route")) {
+      return;
+    }
+
+    if (this.route.path === "") {
+      navigate(`/media-browser/${this._entityId}`, { replace: true });
+      return;
+    }
+
+    const routePlayer = this.route.path.substring(1).split("/")[0];
+    if (routePlayer !== this._entityId) {
+      this._entityId = routePlayer;
+    }
+  }
+
   private _showSelectMediaPlayerDialog(): void {
     showSelectMediaPlayerDialog(this, {
       mediaSources: this._mediaPlayerEntities,
       sourceSelectedCallback: (entityId) => {
-        this._entityId = entityId;
+        navigate(`/media-browser/${entityId}`, { replace: true });
       },
     });
   }