From 049c3caadd167fcecc5e2b3608df1b621da4f1b3 Mon Sep 17 00:00:00 2001
From: Philip Allgaier <mail@spacegaier.de>
Date: Sat, 22 Jan 2022 02:27:40 +0100
Subject: [PATCH] Remove "authSig" from media player source (#11394)

---
 src/data/media-player.ts                            |  9 +++++++++
 src/panels/lovelace/cards/hui-media-control-card.ts | 13 ++++++-------
 src/panels/media-browser/ha-bar-media-player.ts     |  6 ++++--
 src/util/hass-media-player-model.js                 |  3 ++-
 4 files changed, 21 insertions(+), 10 deletions(-)

diff --git a/src/data/media-player.ts b/src/data/media-player.ts
index cfb9c615d3..4f622ddeb7 100644
--- a/src/data/media-player.ts
+++ b/src/data/media-player.ts
@@ -333,3 +333,12 @@ export const formatMediaTime = (seconds: number): string => {
       : secondsString.substring(14, 19);
   return secondsString.replace(/^0+/, "").padStart(4, "0");
 };
+
+export const cleanupMediaTitle = (title?: string): string | undefined => {
+  if (!title) {
+    return undefined;
+  }
+
+  const index = title.indexOf("?authSig=");
+  return index > 0 ? title.slice(0, index) : title;
+};
diff --git a/src/panels/lovelace/cards/hui-media-control-card.ts b/src/panels/lovelace/cards/hui-media-control-card.ts
index 36bb87268b..50e26074f2 100644
--- a/src/panels/lovelace/cards/hui-media-control-card.ts
+++ b/src/panels/lovelace/cards/hui-media-control-card.ts
@@ -24,6 +24,7 @@ import "../../../components/ha-state-icon";
 import { showMediaBrowserDialog } from "../../../components/media-player/show-media-browser-dialog";
 import { UNAVAILABLE_STATES } from "../../../data/entity";
 import {
+  cleanupMediaTitle,
   computeMediaControls,
   computeMediaDescription,
   getCurrentProgress,
@@ -182,6 +183,7 @@ export class HuiMediaControlCard extends LitElement implements LovelaceCard {
         entityState === "on");
 
     const mediaDescription = computeMediaDescription(stateObj);
+    const mediaTitleClean = cleanupMediaTitle(stateObj.attributes.media_title);
 
     return html`
       <ha-card>
@@ -244,24 +246,21 @@ export class HuiMediaControlCard extends LitElement implements LovelaceCard {
             </div>
           </div>
           ${!isUnavailable &&
-          (mediaDescription || stateObj.attributes.media_title || showControls)
+          (mediaDescription || mediaTitleClean || showControls)
             ? html`
                 <div>
                   <div class="title-controls">
-                    ${!mediaDescription && !stateObj.attributes.media_title
+                    ${!mediaDescription && !mediaTitleClean
                       ? ""
                       : html`
                           <div class="media-info">
                             <hui-marquee
-                              .text=${stateObj.attributes.media_title ||
-                              mediaDescription}
+                              .text=${mediaTitleClean || mediaDescription}
                               .active=${this._marqueeActive}
                               @mouseover=${this._marqueeMouseOver}
                               @mouseleave=${this._marqueeMouseLeave}
                             ></hui-marquee>
-                            ${!stateObj.attributes.media_title
-                              ? ""
-                              : mediaDescription}
+                            ${!mediaTitleClean ? "" : mediaDescription}
                           </div>
                         `}
                     ${!showControls
diff --git a/src/panels/media-browser/ha-bar-media-player.ts b/src/panels/media-browser/ha-bar-media-player.ts
index b8864ed93f..0b60d5eb8b 100644
--- a/src/panels/media-browser/ha-bar-media-player.ts
+++ b/src/panels/media-browser/ha-bar-media-player.ts
@@ -30,6 +30,7 @@ import "../../components/ha-icon-button";
 import { UNAVAILABLE_STATES } from "../../data/entity";
 import {
   BROWSER_PLAYER,
+  cleanupMediaTitle,
   computeMediaControls,
   computeMediaDescription,
   formatMediaTime,
@@ -185,6 +186,7 @@ class BarMediaPlayer extends LitElement {
       : [{}];
     const mediaDescription = computeMediaDescription(stateObj);
     const mediaDuration = formatMediaTime(stateObj!.attributes.media_duration!);
+    const mediaTitleClean = cleanupMediaTitle(stateObj.attributes.media_title);
 
     return html`
       <div class="info">
@@ -195,7 +197,7 @@ class BarMediaPlayer extends LitElement {
           : ""}
         <div class="media-info">
           <hui-marquee
-            .text=${stateObj.attributes.media_title ||
+            .text=${mediaTitleClean ||
             mediaDescription ||
             this.hass.localize(`ui.card.media_player.nothing_playing`)}
             .active=${this._marqueeActive}
@@ -203,7 +205,7 @@ class BarMediaPlayer extends LitElement {
             @mouseleave=${this._marqueeMouseLeave}
           ></hui-marquee>
           <span class="secondary">
-            ${stateObj.attributes.media_title ? mediaDescription : ""}
+            ${mediaTitleClean ? mediaDescription : ""}
           </span>
         </div>
       </div>
diff --git a/src/util/hass-media-player-model.js b/src/util/hass-media-player-model.js
index aa50b0a7d6..fd71465750 100644
--- a/src/util/hass-media-player-model.js
+++ b/src/util/hass-media-player-model.js
@@ -1,4 +1,5 @@
 import { supportsFeature } from "../common/entity/supports-feature";
+import { cleanupMediaTitle } from "../data/media-player";
 
 export default class MediaPlayerEntity {
   constructor(hass, stateObj) {
@@ -115,7 +116,7 @@ export default class MediaPlayerEntity {
   }
 
   get primaryTitle() {
-    return this._attr.media_title;
+    return cleanupMediaTitle(this._attr.media_title);
   }
 
   get secondaryTitle() {