Address PR review comments: localize error messages, fix deprecated method, use spacing tokens (#28246)

* Initial plan

* Address PR review comments: localize error messages, replace substr with substring, use spacing tokens

Co-authored-by: balloob <[email protected]>

---------

Co-authored-by: copilot-swe-agent[bot] <[email protected]>
Co-authored-by: balloob <[email protected]>

Author: Copilot

src/panels/config/apps/app-view/config/supervisor-app-audio.ts

@@ -171,7 +171,9 @@ class SupervisorAppAudio extends LitElement {
       this._inputDevices = [noDevice, ...input];
       this._outputDevices = [noDevice, ...output];
     } catch {
-      this._error = "Failed to fetch audio hardware";
+      this._error = this.hass.localize(
+        "ui.panel.config.apps.configuration.audio.failed_to_load_hardware"
+      );
       this._inputDevices = [noDevice];
       this._outputDevices = [noDevice];
     }
@@ -198,7 +200,9 @@ class SupervisorAppAudio extends LitElement {
         await suggestSupervisorAppRestart(this, this.hass, this.addon);
       }
     } catch {
-      this._error = "Failed to set addon audio device";
+      this._error = this.hass.localize(
+        "ui.panel.config.apps.configuration.audio.failed_to_save"
+      );
     }
 
     button.progress = false;

src/panels/config/apps/app-view/info/supervisor-app-info.ts

@@ -1171,7 +1171,9 @@ class SupervisorAppInfo extends LitElement {
       button.actionError();
       button.progress = false;
       showAlertDialog(this, {
-        title: "Failed to validate addon configuration",
+        title: this.hass.localize(
+          "ui.panel.config.apps.dashboard.action_error.validate_config"
+        ),
         text: extractApiErrorMessage(err),
       });
       return;

src/panels/config/apps/app-view/util/supervisor-app.ts

@@ -12,7 +12,7 @@ export const extractChangelog = (
   content: string
 ): string => {
   if (content.startsWith("# Changelog")) {
-    content = content.substr(12, content.length);
+    content = content.substring(12);
   }
   if (
     content.includes(`# ${addon.version}`) &&

src/panels/config/apps/resources/supervisor-apps-style.ts

@@ -2,7 +2,7 @@ import { css } from "lit";
 
 export const supervisorAppsStyle = css`
   .content {
-    margin: 8px;
+    margin: var(--ha-space-2);
   }
   h1,
   .description,

src/translations/en.json

@@ -2591,7 +2591,8 @@
               "uninstall": "Failed to uninstall app",
               "get_changelog": "Failed to get changelog",
               "start_invalid_config": "Invalid configuration",
-              "go_to_config": "Go to configuration"
+              "go_to_config": "Go to configuration",
+              "validate_config": "Failed to validate app configuration"
             },
             "uninstall_dialog": {
               "title": "Uninstall {name}?",
@@ -2634,7 +2635,9 @@
               "header": "Audio",
               "input": "Audio input",
               "output": "Audio output",
-              "default": "Default"
+              "default": "Default",
+              "failed_to_load_hardware": "Failed to fetch audio hardware",
+              "failed_to_save": "Failed to set audio device"
             },
             "confirm": {
               "reset_options": {