4 files changed, 38 insertions, 6 deletions

diff --git a/src/components/services/content/ServiceWebview.js b/src/components/services/content/ServiceWebview.js
index 185d41175..2562c09ce 100644
--- a/src/components/services/content/ServiceWebview.js
+++ b/src/components/services/content/ServiceWebview.js
@@ -30,9 +30,14 @@ class ServiceWebview extends Component {
           this.webview.view.addEventListener('console-message', e => {
             debug('Service logged a message:', e.message);
           });
+          this.webview.view.addEventListener('did-navigate', () => {
+            document.title = `Ferdi - ${this.props.service.name} ${this.props.service.dialogTitle
+              ? ` - ${this.props.service.dialogTitle}`
+              : ''
+              } ${`- ${this.props.service._webview.getTitle()}`}`;
+          })
         }
-      },
-    );
+      })
   }
 
   componentWillUnmount() {
@@ -47,6 +52,12 @@ class ServiceWebview extends Component {
     if (this.props.service.isActive) {
       webview.view.blur();
       webview.view.focus();
+      window.setTimeout(() => {
+        document.title = `Ferdi - ${this.props.service.name} ${this.props.service.dialogTitle
+          ? ` - ${this.props.service.dialogTitle}`
+          : ''
+          } ${`- ${this.props.service._webview.getTitle()}`}`;
+      }, 100);
     } else {
       debug('Refocus not required - Not active service');
     }
@@ -92,9 +103,8 @@ class ServiceWebview extends Component {
         }
         allowpopups
         nodeintegration
-        webpreferences={`spellcheck=${
-          isSpellcheckerEnabled ? 1 : 0
-        }, contextIsolation=1, enableRemoteModule=1`}
+        webpreferences={`spellcheck=${isSpellcheckerEnabled ? 1 : 0
+          }, contextIsolation=1, enableRemoteModule=1`}
       />
     );
   }
diff --git a/src/components/services/tabs/TabBarSortableList.js b/src/components/services/tabs/TabBarSortableList.js
index 69a12e982..3049b6efa 100644
--- a/src/components/services/tabs/TabBarSortableList.js
+++ b/src/components/services/tabs/TabBarSortableList.js
@@ -21,6 +21,7 @@ class TabBarSortableList extends Component {
     hibernateService: PropTypes.func.isRequired,
     wakeUpService: PropTypes.func.isRequired,
     showMessageBadgeWhenMutedSetting: PropTypes.bool.isRequired,
+    showServiceNameSetting: PropTypes.bool.isRequired,
     showMessageBadgesEvenWhenMuted: PropTypes.bool.isRequired,
   };
 
@@ -39,6 +40,7 @@ class TabBarSortableList extends Component {
       wakeUpService,
       openSettings,
       showMessageBadgeWhenMutedSetting,
+      showServiceNameSetting,
       showMessageBadgesEvenWhenMuted,
     } = this.props;
 
@@ -65,6 +67,7 @@ class TabBarSortableList extends Component {
             openSettings={openSettings}
             showMessageBadgeWhenMutedSetting={showMessageBadgeWhenMutedSetting}
             showMessageBadgesEvenWhenMuted={showMessageBadgesEvenWhenMuted}
+            showServiceNameSetting={showServiceNameSetting}
           />
         ))}
       </ul>
diff --git a/src/components/services/tabs/TabItem.js b/src/components/services/tabs/TabItem.js
index ed8430b89..3ea6c5da2 100644
--- a/src/components/services/tabs/TabItem.js
+++ b/src/components/services/tabs/TabItem.js
@@ -132,6 +132,7 @@ class TabItem extends Component {
     hibernateService: PropTypes.func.isRequired,
     wakeUpService: PropTypes.func.isRequired,
     showMessageBadgeWhenMutedSetting: PropTypes.bool.isRequired,
+    showServiceNameSetting: PropTypes.bool.isRequired,
     showMessageBadgesEvenWhenMuted: PropTypes.bool.isRequired,
     stores: PropTypes.shape({
       settings: PropTypes.instanceOf(SettingsStore).isRequired,
@@ -219,6 +220,7 @@ class TabItem extends Component {
       wakeUpService,
       openSettings,
       showMessageBadgeWhenMutedSetting,
+      showServiceNameSetting,
       showMessageBadgesEvenWhenMuted,
     } = this.props;
     const { intl } = this.props;
@@ -331,6 +333,13 @@ class TabItem extends Component {
       );
     }
 
+    let errorBadge = null;
+    if ( service.isError ) {
+      errorBadge=(
+        <i className = " mdi mdi-exclamation tab-item__error-icon"/>
+      )
+    }
+
     return (
       <li
         className={classnames({
@@ -340,6 +349,7 @@ class TabItem extends Component {
           'is-active': service.isActive,
           'has-custom-icon': service.hasCustomIcon,
           'is-disabled': !service.isEnabled,
+          'is-label-enabled': showServiceNameSetting,
         })}
         onClick={clickHandler}
         onContextMenu={() => menu.popup()}
@@ -349,8 +359,14 @@ class TabItem extends Component {
             : ''
         }`}
       >
-        <img src={service.icon} className="tab-item__icon" alt="" />
+
+        {showServiceNameSetting? <div>
+          <img src={service.icon} className="tab-item__icon" alt="" />
+          <span className="tab-item__label">{service.name}</span>
+        </div> : <img src={service.icon} className="tab-item__icon" alt="" />}
+
         {notificationBadge}
+        {errorBadge}
         {IS_SERVICE_DEBUGGING_ENABLED && (
           <>
             <div
diff --git a/src/components/services/tabs/Tabbar.js b/src/components/services/tabs/Tabbar.js
index 4ab0e8611..94d6f33c1 100644
--- a/src/components/services/tabs/Tabbar.js
+++ b/src/components/services/tabs/Tabbar.js
@@ -23,6 +23,7 @@ class TabBar extends Component {
     wakeUpService: PropTypes.func.isRequired,
     useVerticalStyle: PropTypes.bool.isRequired,
     showMessageBadgeWhenMutedSetting: PropTypes.bool.isRequired,
+    showServiceNameSetting: PropTypes.bool.isRequired,
     showMessageBadgesEvenWhenMuted: PropTypes.bool.isRequired,
   };
 
@@ -82,6 +83,7 @@ class TabBar extends Component {
       deleteService,
       useVerticalStyle,
       showMessageBadgeWhenMutedSetting,
+      showServiceNameSetting,
       showMessageBadgesEvenWhenMuted,
     } = this.props;
 
@@ -110,6 +112,7 @@ class TabBar extends Component {
           lockAxis={axis}
           helperClass="is-reordering"
           showMessageBadgeWhenMutedSetting={showMessageBadgeWhenMutedSetting}
+          showServiceNameSetting={showServiceNameSetting}
           showMessageBadgesEvenWhenMuted={showMessageBadgesEvenWhenMuted}
         />
       </div>