Add title property to elements showing entity names (#9264)

src/components/entity/ha-state-label-badge.ts

@@ -88,7 +88,7 @@ export class HaStateLabelBadge extends LitElement {
           entityState,
           this._timerTimeRemaining
         )}
-        .description=${this.name ? this.name : computeStateName(entityState)}
+        .description=${this.name ?? computeStateName(entityState)}
       ></ha-label-badge>
     `;
   }

src/components/entity/state-info.ts

@@ -24,13 +24,15 @@ class StateInfo extends LitElement {
       return html``;
     }
 
+    const name = computeStateName(this.stateObj);
+
     return html`<state-badge
         .stateObj=${this.stateObj}
         .stateColor=${true}
       ></state-badge>
       <div class="info">
-        <div class="name" .inDialog=${this.inDialog}>
-          ${computeStateName(this.stateObj)}
+        <div class="name" .title=${name} .inDialog=${this.inDialog}>
+          ${name}
         </div>
         ${this.inDialog
           ? html`<div class="time-ago">