fix: Ensure getAttributes().status is always string (#702)

* chore: Reformat vacuum-card.ts

* fix: Reference to null status value on HA versions >=2024.2

After upgrading to Home Assistant 2024.2.4, vacuum-card didn't
render due to null reference. The error shown on the console:

    Uncaught (in promise) TypeError: Cannot read properties of null (reading 'toLowerCase')
        at qr.renderStatus (vacuum-card.js?hacstag=261291295280:4:14674)
        at qr.render (vacuum-card.js?hacstag=261291295280:4:17680)
        at qr.update (vacuum-card.js?hacstag=261291295280:1:15173)
        at qr.performUpdate (vacuum-card.js?hacstag=261291295280:1:6493)
        at qr.scheduleUpdate (vacuum-card.js?hacstag=261291295280:1:6140)
        at qr._$Ej (vacuum-card.js?hacstag=261291295280:1:6048)

Based on the types, both `status` and `state` attributes can be undefined,
while the `state` on the entity itself always has a string value. By reorganizing
the return value of `getAttributes`, we ensure the derived `status` won't get
overwritten by an undefined `entity.attributes.status`.

src/vacuum-card.ts

@@ -31,13 +31,13 @@ const PKG_VERSION = 'PKG_VERSION_VALUE';
 console.info(
   `%c VACUUM-CARD %c ${PKG_VERSION}`,
   'color: white; background: blue; font-weight: 700;',
-  'color: blue; background: white; font-weight: 700;'
+  'color: blue; background: white; font-weight: 700;',
 );
 
 if (!customElements.get('ha-icon-button')) {
   customElements.define(
     'ha-icon-button',
-    class extends (customElements.get('paper-icon-button') ?? HTMLElement) {}
+    class extends (customElements.get('paper-icon-button') ?? HTMLElement) {},
   );
 }
 
@@ -105,7 +105,7 @@ export class VacuumCard extends LitElement {
       this.requestUpdate();
       this.thumbUpdater = setInterval(
         () => this.requestUpdate(),
-        this.config.map_refresh * 1000
+        this.config.map_refresh * 1000,
       );
     }
   }
@@ -127,7 +127,7 @@ export class VacuumCard extends LitElement {
       {
         bubbles: false,
         composed: true,
-      }
+      },
     );
   }
 
@@ -140,7 +140,7 @@ export class VacuumCard extends LitElement {
   private callVacuumService(
     service: ServiceCallRequest['service'],
     params: VacuumServiceCallParams = { request: true },
-    options: ServiceCallRequest['serviceData'] = {}
+    options: ServiceCallRequest['serviceData'] = {},
   ) {
     this.hass.callService('vacuum', service, {
       entity_id: this.config.entity,
@@ -160,7 +160,7 @@ export class VacuumCard extends LitElement {
 
   private handleVacuumAction(
     action: string,
-    params: VacuumActionParams = { request: true }
+    params: VacuumActionParams = { request: true },
   ) {
     return () => {
       if (!this.config.actions[action]) {
@@ -175,14 +175,14 @@ export class VacuumCard extends LitElement {
     const { status, state } = entity.attributes;
 
     return {
-      status: status || state || entity.state,
       ...entity.attributes,
+      status: status ?? state ?? entity.state,
     };
   }
 
   private renderSource(): Template {
     const { fan_speed: source, fan_speed_list: sources } = this.getAttributes(
-      this.entity
+      this.entity,
     );
 
     if (!sources || !source) {
@@ -201,16 +201,15 @@ export class VacuumCard extends LitElement {
             </span>
           </div>
           ${sources.map(
-            (item, index) =>
-              html`
-                <mwc-list-item
-                  ?activated=${selected === index}
-                  value=${item}
-                  @click=${this.handleSpeed}
-                >
-                  ${localize(`source.${item.toLowerCase()}`) || item}
-                </mwc-list-item>
-              `
+            (item, index) => html`
+              <mwc-list-item
+                ?activated=${selected === index}
+                value=${item}
+                @click=${this.handleSpeed}
+              >
+                ${localize(`source.${item.toLowerCase()}`) || item}
+              </mwc-list-item>
+            `,
           )}
         </ha-button-menu>
       </div>
@@ -295,7 +294,7 @@ export class VacuumCard extends LitElement {
             <div class="stats-subtitle">${subtitle}</div>
           </div>
         `;
-      }
+      },
     );
 
     if (!stats.length) {
@@ -421,7 +420,7 @@ export class VacuumCard extends LitElement {
                 <ha-icon icon="${icon}"></ha-icon>
               </ha-icon-button>
             `;
-          }
+          },
         );
 
         const dockButton = html`