Add analytics translations (#15821)

* Add analytics translations

* Move translations to panels

* Fix learn more link

src/components/ha-analytics-learn-more.ts

@@ -1,11 +0,0 @@
-import { html } from "lit";
-import { HomeAssistant } from "../types";
-import { documentationUrl } from "../util/documentation-url";
-
-export const analyticsLearnMore = (hass: HomeAssistant) => html`<a
-  .href=${documentationUrl(hass, "/integrations/analytics/")}
-  target="_blank"
-  rel="noreferrer"
->
-  How we process your data
-</a>`;

src/components/ha-analytics.ts

@@ -9,18 +9,7 @@ import "./ha-settings-row";
 import "./ha-switch";
 import type { HaSwitch } from "./ha-switch";
 
-const ADDITIONAL_PREFERENCES = [
-  {
-    key: "usage",
-    title: "Usage",
-    description: "Details of what you use with Home Assistant",
-  },
-  {
-    key: "statistics",
-    title: "Statistical data",
-    description: "Counts containing total number of datapoints",
-  },
-];
+const ADDITIONAL_PREFERENCES = ["usage", "statistics"] as const;
 
 declare global {
   interface HASSDomEvents {
@@ -34,15 +23,25 @@ export class HaAnalytics extends LitElement {
 
   @property({ attribute: false }) public analytics?: Analytics;
 
+  @property({ attribute: "translation_key_panel" }) public translationKeyPanel:
+    | "page-onboarding"
+    | "config" = "config";
+
   protected render(): TemplateResult {
     const loading = this.analytics === undefined;
     const baseEnabled = !loading && this.analytics!.preferences.base;
 
     return html`
       <ha-settings-row>
-        <span slot="heading" data-for="base"> Basic analytics </span>
+        <span slot="heading" data-for="base">
+          ${this.hass.localize(
+            `ui.panel.${this.translationKeyPanel}.analytics.preferences.base.title`
+          )}
+        </span>
         <span slot="description" data-for="base">
-          This includes information about your system.
+          ${this.hass.localize(
+            `ui.panel.${this.translationKeyPanel}.analytics.preferences.base.description`
+          )}
         </span>
         <ha-switch
           @change=${this._handleRowClick}
@@ -57,25 +56,30 @@ export class HaAnalytics extends LitElement {
         (preference) =>
           html`
             <ha-settings-row>
-              <span slot="heading" data-for=${preference.key}>
-                ${preference.title}
+              <span slot="heading" data-for=${preference}>
+                ${this.hass.localize(
+                  `ui.panel.${this.translationKeyPanel}.analytics.preferences.${preference}.title`
+                )}
               </span>
-              <span slot="description" data-for=${preference.key}>
-                ${preference.description}
+              <span slot="description" data-for=${preference}>
+                ${this.hass.localize(
+                  `ui.panel.${this.translationKeyPanel}.analytics.preferences.${preference}.description`
+                )}
               </span>
               <span>
                 <ha-switch
                   @change=${this._handleRowClick}
-                  .checked=${this.analytics?.preferences[preference.key]}
-                  .preference=${preference.key}
-                  name=${preference.key}
+                  .checked=${this.analytics?.preferences[preference]}
+                  .preference=${preference}
+                  name=${preference}
                 >
                 </ha-switch>
                 ${!baseEnabled
                   ? html`
                       <paper-tooltip animation-delay="0" position="right">
-                        You need to enable basic analytics for this option to be
-                        available
+                        ${this.hass.localize(
+                          `ui.panel.${this.translationKeyPanel}.analytics.need_base_enabled`
+                        )}
                       </paper-tooltip>
                     `
                   : ""}
@@ -84,9 +88,15 @@ export class HaAnalytics extends LitElement {
           `
       )}
       <ha-settings-row>
-        <span slot="heading" data-for="diagnostics"> Diagnostics </span>
+        <span slot="heading" data-for="diagnostics">
+          ${this.hass.localize(
+            `ui.panel.${this.translationKeyPanel}.analytics.preferences.diagnostics.title`
+          )}
+        </span>
         <span slot="description" data-for="diagnostics">
-          Share crash reports when unexpected errors occur.
+          ${this.hass.localize(
+            `ui.panel.${this.translationKeyPanel}.analytics.preferences.diagnostics.description`
+          )}
         </span>
         <ha-switch
           @change=${this._handleRowClick}
@@ -132,7 +142,7 @@ export class HaAnalytics extends LitElement {
     preferences[preference] = target.checked;
 
     if (
-      ADDITIONAL_PREFERENCES.some((entry) => entry.key === preference) &&
+      ADDITIONAL_PREFERENCES.some((entry) => entry === preference) &&
       target.checked
     ) {
       preferences.base = true;

src/onboarding/onboarding-analytics.ts

@@ -4,10 +4,10 @@ import { customElement, property, state } from "lit/decorators";
 import { fireEvent } from "../common/dom/fire_event";
 import { LocalizeFunc } from "../common/translations/localize";
 import "../components/ha-analytics";
-import { analyticsLearnMore } from "../components/ha-analytics-learn-more";
 import { Analytics, setAnalyticsPreferences } from "../data/analytics";
 import { onboardAnalyticsStep } from "../data/onboarding";
 import type { HomeAssistant } from "../types";
+import { documentationUrl } from "../util/documentation-url";
 
 @customElement("onboarding-analytics")
 class OnboardingAnalytics extends LitElement {
@@ -23,12 +23,9 @@ class OnboardingAnalytics extends LitElement {
 
   protected render(): TemplateResult {
     return html`
-      <p>
-        Share anonymized information from your installation to help make Home
-        Assistant better and help us convince manufacturers to add local control
-        and privacy-focused features.
-      </p>
+      <p>${this.hass.localize("ui.panel.page-onboarding.analytics.intro")}</p>
       <ha-analytics
+        translation_key_panel="page-onboarding"
         @analytics-preferences-changed=${this._preferencesChanged}
         .hass=${this.hass}
         .analytics=${this._analyticsDetails}
@@ -39,7 +36,13 @@ class OnboardingAnalytics extends LitElement {
         <mwc-button @click=${this._save} .disabled=${!this._analyticsDetails}>
           ${this.localize("ui.panel.page-onboarding.analytics.finish")}
         </mwc-button>
-        ${analyticsLearnMore(this.hass)}
+        <a
+          .href=${documentationUrl(this.hass, "/integrations/analytics/")}
+          target="_blank"
+          rel="noreferrer"
+        >
+          ${this.hass.localize("ui.panel.page-onboarding.analytics.learn_more")}
+        </a>
       </div>
     `;
   }

src/panels/config/core/ha-config-analytics.ts

@@ -10,7 +10,6 @@ import {
 import { customElement, property, state } from "lit/decorators";
 import { isComponentLoaded } from "../../../common/config/is_component_loaded";
 import "../../../components/ha-analytics";
-import { analyticsLearnMore } from "../../../components/ha-analytics-learn-more";
 import "../../../components/ha-card";
 import "../../../components/ha-checkbox";
 import "../../../components/ha-settings-row";
@@ -21,6 +20,7 @@ import {
 } from "../../../data/analytics";
 import { haStyle } from "../../../resources/styles";
 import type { HomeAssistant } from "../../../types";
+import { documentationUrl } from "../../../util/documentation-url";
 
 @customElement("ha-config-analytics")
 class ConfigAnalytics extends LitElement {
@@ -41,12 +41,9 @@ class ConfigAnalytics extends LitElement {
       <ha-card outlined>
         <div class="card-content">
           ${error ? html`<div class="error">${error}</div>` : ""}
-          <p>
-            Share anonymized information from your installation to help make
-            Home Assistant better and help us convince manufacturers to add
-            local control and privacy-focused features.
-          </p>
+          <p>${this.hass.localize("ui.panel.config.analytics.intro")}</p>
           <ha-analytics
+            translation_key_panel="config"
             @analytics-preferences-changed=${this._preferencesChanged}
             .hass=${this.hass}
             .analytics=${this._analyticsDetails}
@@ -60,7 +57,15 @@ class ConfigAnalytics extends LitElement {
           </mwc-button>
         </div>
       </ha-card>
-      <div class="footer">${analyticsLearnMore(this.hass)}</div>
+      <div class="footer">
+        <a
+          .href=${documentationUrl(this.hass, "/integrations/analytics/")}
+          target="_blank"
+          rel="noreferrer"
+        >
+          ${this.hass.localize("ui.panel.config.analytics.learn_more")}
+        </a>
+      </div>
     `;
   }
 

src/translations/en.json

@@ -3753,7 +3753,28 @@
         },
         "analytics": {
           "caption": "Analytics",
-          "description": "Learn how to share data to improve Home Assistant"
+          "description": "Learn how to share data to improve Home Assistant",
+          "preferences": {
+            "base": {
+              "title": "Basic analytics",
+              "description": "This includes information about your system."
+            },
+            "usage": {
+              "title": "Usage",
+              "description": "Details of what you use with Home Assistant"
+            },
+            "statistics": {
+              "title": "Statistical data",
+              "description": "Counts containing total number of datapoints."
+            },
+            "diagnostics": {
+              "title": "Diagnostics",
+              "description": "Share crash reports when unexpected errors occur."
+            }
+          },
+          "need_base_enabled": "You need to enable basic analytics for this option to be available",
+          "learn_more": "How we process your data",
+          "intro": "Share anonymized information from your installation to help make Home Assistant better and help us convince manufacturers to add local control and privacy-focused features."
         },
         "network": {
           "caption": "Network",
@@ -5026,7 +5047,28 @@
           "finish": "Finish"
         },
         "analytics": {
-          "finish": "Next"
+          "finish": "Next",
+          "preferences": {
+            "base": {
+              "title": "[%key:ui::panel::config::analytics::preferences::base::title%]",
+              "description": "[%key:ui::panel::config::analytics::preferences::base::description%]"
+            },
+            "usage": {
+              "title": "[%key:ui::panel::config::analytics::preferences::usage::title%]",
+              "description": "[%key:ui::panel::config::analytics::preferences::usage::description%]"
+            },
+            "statistics": {
+              "title": "[%key:ui::panel::config::analytics::preferences::statistics::title%]",
+              "description": "[%key:ui::panel::config::analytics::preferences::statistics::description%]"
+            },
+            "diagnostics": {
+              "title": "[%key:ui::panel::config::analytics::preferences::diagnostics::title%]",
+              "description": "[%key:ui::panel::config::analytics::preferences::diagnostics::description%]"
+            }
+          },
+          "need_base_enabled": "[%key:ui::panel::config::analytics::need_base_enabled%]",
+          "learn_more": "[%key:ui::panel::config::analytics::learn_more%]",
+          "intro": "[%key:ui::panel::config::analytics::intro%]"
         },
         "restore": {
           "description": "Alternatively you can restore from a previous backup.",