Add a couple of labels (#3310)

* Add a couple of labels

* Add some more labels

src/components/entity/ha-entity-toggle.ts

@@ -15,6 +15,7 @@ import {
 import { HomeAssistant } from "../../types";
 import { HassEntity } from "home-assistant-js-websocket";
 import { forwardHaptic } from "../../data/haptics";
+import computeStateName from "../../common/entity/compute_state_name";
 
 const isOn = (stateObj?: HassEntity) =>
   stateObj !== undefined && !STATES_OFF.includes(stateObj.state);
@@ -35,11 +36,13 @@ class HaEntityToggle extends LitElement {
     if (this.stateObj.attributes.assumed_state) {
       return html`
         <paper-icon-button
+          aria-label=${`Turn ${computeStateName(this.stateObj)} off`}
           icon="hass:flash-off"
           @click=${this._turnOff}
           ?state-active=${!this._isOn}
         ></paper-icon-button>
         <paper-icon-button
+          aria-label=${`Turn ${computeStateName(this.stateObj)} on`}
           icon="hass:flash"
           @click=${this._turnOn}
           ?state-active=${this._isOn}
@@ -49,6 +52,9 @@ class HaEntityToggle extends LitElement {
 
     return html`
       <paper-toggle-button
+        aria-label=${`Toggle ${computeStateName(this.stateObj)} ${
+          this._isOn ? "off" : "on"
+        }`}
         .checked=${this._isOn}
         @change=${this._toggleChanged}
       ></paper-toggle-button>