Add title to channel tooltip

src/list/components/channels.jsx

@@ -147,7 +147,8 @@ class Channel extends NavigateableItem {
             onRedirectorClick: PropTypes.func.isRequired,
             onContextMenu: PropTypes.func.isRequired,
             onCopy: PropTypes.func.isRequired,
-            onFocusChange: PropTypes.func.isRequired
+            onFocusChange: PropTypes.func.isRequired,
+            tooltip: PropTypes.string.isRequired
         };
     }
 
@@ -167,7 +168,7 @@ class Channel extends NavigateableItem {
         this.props.children.push(<InnerChannel image={ this.props.image } uname={ this.props.uname } title={ this.props.title } extras={ this.props.extras } liveState={ this.props.liveState } redirectors={ this.props.redirectors } imageSize={ this.props.imageSize } onRedirectorClick={ this.props.onRedirectorClick } key="inner"/>);
         const element = super.render();
         return React.cloneElement(element, {
-            title: this.props.uname,
+            title: this.props.tooltip,
             className,
             onClick: this.props.onClick,
             onContextMenu: this.props.onContextMenu,
@@ -223,6 +224,7 @@ const channelsShape = PropTypes.arrayOf(PropTypes.shape({
         imageSize: PropTypes.number,
         external: PropTypes.bool,
         url: PropTypes.string,
+        tooltip: PropTypes.string.isRequired
     })),
     ChannelList = (props) => {
         const channels = props.channels.map((ch) => {

src/list/utils.js

@@ -12,7 +12,8 @@ export const formatChannel = (channel, providers, type, extras = false, style =
         liveState: channel.live.state,
         imageSize: 30,
         hasChat: false,
-        providerEnabled: providers[channel.type].enabled
+        providerEnabled: providers[channel.type].enabled,
+        tooltip: channel.uname
     };
     if(style === "compact") {
         formattedChannel.imageSize = 12;
@@ -34,6 +35,9 @@ export const formatChannel = (channel, providers, type, extras = false, style =
         delete formattedChannel.extras.viewers;
         delete formattedChannel.extras.category;
     }
+    if(channel.live.state !== LiveState.OFFLINE && channel.title) {
+        formattedChannel.tooltip += ` - "${channel.title}"`;
+    }
 
     if("id" in channel) {
         formattedChannel.id = channel.id;