Add display stream icon

README.md

@@ -9,9 +9,9 @@ playlistcast ( work in progress )
 * [x] Play / pause / back and forward 30 seconds 
 * [x] Video playback time, duration and seek bar
 * [x] Video subtitle pick, disable
+* [x] Display stream icon if available
  
 ### TODO
-* [ ] Display stream icon if available
 * [ ] Pick m3u file and assign to device ( TODO ui )
 * [ ] Play m3u file with interactive ui 
 * [ ] Display interactive playlist

frontend/src/service/chromecast.js

@@ -13,7 +13,8 @@ query {
     port,
     status {
       volumeLevel,
-      volumeMuted
+      volumeMuted,
+      iconUrl
     },
     mediaController {
       appId,

frontend/src/view/player/chromecast.jsx

@@ -1,5 +1,5 @@
 import React, { useState, useEffect } from 'react';
-import { Button, Card } from 'antd';
+import { Avatar, Button, Card } from 'antd';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import { faPlayCircle, faPauseCircle, faClosedCaptioning } from '@fortawesome/free-regular-svg-icons';
 import { faRedo, faUndo, faVolumeUp } from '@fortawesome/free-solid-svg-icons';
@@ -152,7 +152,15 @@ const ChromecastDevice = ({ device }) => {
     );
   }
   return (
-    <Card title={device.name}>
+    <Card title={
+      (
+        <span>
+          <Avatar src={castStatus.iconUrl} />
+          <span style={{ marginLeft: '10px' }}>{device.name}</span>
+        </span>
+      )
+    }
+    >
       <div>
         <p>{name}</p>
         {component}