Feature: Indication Icon which service is playing media (#655)

1 files changed, 6 insertions, 1 deletions

diff --git a/src/components/services/tabs/TabItem.js b/src/components/services/tabs/TabItem.js
index a996990b5..5b901f3bf 100644
--- a/src/components/services/tabs/TabItem.js
+++ b/src/components/services/tabs/TabItem.js
@@ -9,7 +9,7 @@ import injectSheet from 'react-jss';
 import ms from 'ms';
 
 import { observable, autorun, reaction, makeObservable } from 'mobx';
-import { mdiExclamation } from '@mdi/js';
+import { mdiExclamation, mdiVolumeSource } from '@mdi/js';
 import ServiceModel from '../../../models/Service';
 import { cmdOrCtrlShortcutKey, shiftKey, altKey } from '../../../environment';
 import globalMessages from '../../../i18n/globalMessages';
@@ -350,6 +350,10 @@ class TabItem extends Component {
       );
     }
 
+    const mediaBadge = service.isMediaPlaying ? (
+      <Icon icon={mdiVolumeSource} className="tab-item__icon" />
+    ) : null;
+
     return (
       <li
         className={classnames({
@@ -375,6 +379,7 @@ class TabItem extends Component {
         )}
         {notificationBadge}
         {errorBadge}
+        {mediaBadge}
         {IS_SERVICE_DEBUGGING_ENABLED && (
           <>
             <div