fix(#2543): added chromecast teams info

src/features/ChromeCast/CastVideos.js

@@ -23,7 +23,7 @@ const PLAYER_STATE = {
  * @struct @constructor
  */
 export class CastPlayer {
-  constructor(source) {
+  constructor(source, teamsInfo) {
     /** @type {PlayerHandler} Delegation proxy for media playback */
     this.playerHandler = new PlayerHandler(this)
 
@@ -37,6 +37,7 @@ export class CastPlayer {
     this.remotePlayerController = null
 
     this.src = source
+    this.teamsInfo = teamsInfo
   }
 
   initializeCastPlayer() {
@@ -109,8 +110,8 @@ export class CastPlayer {
 
       mediaInfo.metadata = new chrome.cast.media.GenericMediaMetadata()
       mediaInfo.metadata.metadataType = chrome.cast.media.MetadataType.GENERIC
-      mediaInfo.metadata.title = 'title'
-      mediaInfo.metadata.images = [{ url: 'https://s3.eu-central-1.amazonaws.com/img.hromadske.ua/posts/224808/opng/medium.jpg' }]
+      mediaInfo.metadata.title = this.teamsInfo
+      // mediaInfo.metadata.images = [{ url: 'https://s3.eu-central-1.amazonaws.com/img.hromadske.ua/posts/224808/opng/medium.jpg' }]
       const request = new chrome.cast.media.LoadRequest(mediaInfo)
       request.credentials = 'user-credentials'
       request.atvCredentials = 'atv-user-credentials'

src/features/ChromeCast/index.tsx

@@ -13,6 +13,7 @@ import { usePageParams } from 'hooks/usePageParams'
 
 import { Container } from './styled'
 import { CastPlayer } from './CastVideos'
+import { useMatchPageStore } from '../MatchPage/store'
 
 type Props = {
   src?: string,
@@ -21,6 +22,7 @@ type Props = {
 export const ChromeCast = memo(({ src } : Props) => {
   const [isCastAvailable, setIsCastAvailable] = useState(false)
 
+  const { profile } = useMatchPageStore()
   const { profileId: matchId, sportType } = usePageParams()
 
   const containerRef = useRef<HTMLDivElement | null>(null)
@@ -30,6 +32,8 @@ export const ChromeCast = memo(({ src } : Props) => {
   const baseUrl = src ?? `${API_ROOT}/video/chromecast/stream/${sportType}/${matchId}.m3u8`
   const urlWithToken = (/\d.m3u8/.test(baseUrl)) ? `${baseUrl}?access_token=${readToken()}` : baseUrl
 
+  const teamsInfo = `${profile?.team1.name_eng} - ${profile?.team2.name_eng}`
+
   useEffect(() => {
     if (
       containerRef.current
@@ -48,7 +52,7 @@ export const ChromeCast = memo(({ src } : Props) => {
 
     document.body.appendChild(script)
 
-    const castPlayer = new CastPlayer(urlWithToken);
+    const castPlayer = new CastPlayer(urlWithToken, teamsInfo);
     (window as any).__onGCastApiAvailable = (isAvailable: boolean) => {
       if (isAvailable) {
         castPlayer.initializeCastPlayer()
@@ -60,7 +64,7 @@ export const ChromeCast = memo(({ src } : Props) => {
       document.body.removeChild(script)
       setIsCastAvailable(false)
     }
-  }, [urlWithToken])
+  }, [teamsInfo, urlWithToken])
 
   return (
     <Fragment>