187 files

custom_components/maintenance_supporter/frontend-src/components/battery-fleet-section.ts

@@ -6,9 +6,10 @@
 import { css, html, LitElement, nothing } from "lit";
 import { property, state } from "lit/decorators.js";
 
-import { t, ensureLocale, langOf } from "../styles";
+import { t, ensureLocale, langOf, formatDate, syncLocaleFromHass } from "../styles";
 import { LS_KEYS, lsGet, lsSet } from "../helpers/storage-keys";
 import { describeWsError } from "../ws-errors";
+import { px } from "../renderers/chart-utils";
 import type { HomeAssistant } from "../types";
 
 interface BatteryRow {
@@ -100,6 +101,11 @@ export class MaintenanceBatteryFleetSection extends LitElement {
   }
 
   updated(changed: Map<string, unknown>): void {
+    // #163: the forecast dates go through formatDate(), which reads the HA
+    // profile date format from a window singleton — feed it here too, so a
+    // stand-alone battery-fleet card (no panel / task card on the page to do
+    // it) still renders DD/MM vs MM/DD the way the profile says.
+    syncLocaleFromHass(this, changed);
     if (changed.has("hass") && this.hass && !this._localeReady) {
       this._localeReady = true;
       ensureLocale(this._lang).then(() => this.requestUpdate());
@@ -257,9 +263,9 @@ export class MaintenanceBatteryFleetSection extends LitElement {
     const tMax = Math.max(tLast, projEnd ?? tLast);
     const x = (t: number) => (tMax === t0 ? P : P + ((t - t0) / (tMax - t0)) * (W - 2 * P));
     const y = (v: number) => P + (1 - Math.min(100, Math.max(0, v)) / 100) * (H - 2 * P);
-    const line = h.points.map(([t, v]) => `${x(t).toFixed(1)},${y(v).toFixed(1)}`).join(" ");
+    const line = h.points.map(([t, v]) => `${px(x(t))},${px(y(v))}`).join(" ");
     const vLast = h.points[h.points.length - 1][1];
-    const yTh = y(h.threshold).toFixed(1);
+    const yTh = px(y(h.threshold));
     return html`<svg
       class="bf-spark"
       viewBox="0 0 ${W} ${H}"
@@ -272,9 +278,9 @@ export class MaintenanceBatteryFleetSection extends LitElement {
       ${projEnd !== null
         ? html`<line
             class="bf-spark-proj"
-            x1=${x(tLast).toFixed(1)}
-            y1=${y(vLast).toFixed(1)}
-            x2=${x(projEnd).toFixed(1)}
+            x1=${px(x(tLast))}
+            y1=${px(y(vLast))}
+            x2=${px(x(projEnd))}
             y2=${yTh}
           ></line>`
         : nothing}
@@ -314,8 +320,13 @@ export class MaintenanceBatteryFleetSection extends LitElement {
     return this._fmtDate(Date.now() + daysUntil * 864e5);
   }
 
+  /** Local calendar date of an epoch, in the HA profile date format (#163 —
+   *  a direct Intl.DateTimeFormat call here ignored the profile and showed
+   *  9/2/2026 to a DD/MM/YYYY user). */
   private _fmtDate(epochMs: number): string {
-    return new Intl.DateTimeFormat(this._lang, { day: "numeric", month: "numeric", year: "numeric" }).format(new Date(epochMs));
+    const d = new Date(epochMs);
+    const pad = (n: number) => String(n).padStart(2, "0");
+    return formatDate(`${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())}`, this._lang);
   }
 
   /** The grouped shopping quantities as CLICKABLE chips: a type filters the