fix(apps): sync unit preference from backend /settings (web useUnits parity)

The web app reads the account's unit preferences from the backend /settings document and
renders mi/mph/°F/psi accordingly; the native app was hard-defaulting to metric, so every
distance/speed/temp read km/°C even when the account is imperial.

- Rename Shell/BackendThemeSync -> BackendSettingsSync and extend it to also map the
  backend unit_of_length / unit_of_temp to the native metric/imperial preference and persist
  it alongside theme + mode (one /settings read seeds all three).
- ShellWindow.ApplySettings now rebuilds the visible page on a units flip (pages resolve
  their unit pref at construction, mirroring web useUnits at render); list pages that already
  subscribe to settings.Changed keep self-applying.
- Pass the resolved unit pref to the dashboard widgets that accept one (vehicle hero, motor,
  charge status, recent drives, analytics summary) so the Command Center renders in-account
  units on first paint.

Gates: full sln build 0 err, dotnet format clean, placeholders 0, 31537 tests pass.
Verified via live screenshot: dashboard now shows mi / °F / Wh/mi matching http://localhost:3000.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>

Author: atulmgupta

apps/windows/TeslaSync.App/App.xaml.cs

@@ -60,7 +60,7 @@ protected override void OnLaunched(Microsoft.UI.Xaml.LaunchActivatedEventArgs ar
     private static async Task InitializeSettingsThenThemeAsync(ShellDataContext data)
     {
         await AppSettingsHost.InitializeAsync().ConfigureAwait(false);
-        await BackendThemeSync.ApplyAsync(data).ConfigureAwait(false);
+        await BackendSettingsSync.ApplyAsync(data).ConfigureAwait(false);
     }
 
     /// <summary>

apps/windows/TeslaSync.App/Shell/BackendSettingsSync.cs

@@ -0,0 +1,128 @@
+using System;
+using System.Text.Json;
+using System.Threading.Tasks;
+using TeslaSync.App.Core.Data.Repositories;
+using TeslaSync.App.Core.Data.State;
+using TeslaSync.App.Core.Settings;
+using TeslaSync.App.Settings;
+
+namespace TeslaSync.App.Shell;
+
+/// <summary>
+/// Web-parity startup settings seed. The web app reads the persisted accent theme, colour mode and unit
+/// preferences from the backend <c>/settings</c> document on first mount (see
+/// <c>web/src/components/ui/ThemeProvider.tsx</c> for theme/mode and the <c>useUnits</c>/settings hooks for
+/// units) and applies them over its local defaults. This mirrors that so the native app shows the SAME
+/// theme AND the SAME units the web app shows for this account: the local <see cref="AppSettings"/> defaults
+/// (dark / neon-cyan / metric) only stand in until this resolves, and an unreachable or erroring backend
+/// keeps those defaults — the same fallback the web uses when its <c>GET /settings</c> fetch fails. The
+/// result is persisted through <see cref="AppSettingsHost"/>, whose <c>Changed</c> event drives the shell's
+/// live re-theme (the native <c>applyThemeCSS</c> analogue) and the per-page <c>ApplyUnits</c> refresh.
+/// </summary>
+internal static class BackendSettingsSync
+{
+    // The web ThemeProvider only accepts ids that exist in its theme/mode catalogs
+    // (`saved in themes` / `saved in modes`); mirror that allow-list so an unexpected
+    // backend value falls back to the local default instead of an unknown palette.
+    private static readonly string[] AccentThemeIds =
+        { "neon-cyan", "tesla-red", "matrix-green", "royal-purple", "solar-amber", "custom" };
+
+    private static readonly string[] ColorModeIds =
+        { "dark", "light", "oled", "midnight", "auto", "sunset", "nord" };
+
+    /// <summary>
+    /// Reads the backend settings document and, when it carries a recognised <c>theme</c>/<c>mode</c> or
+    /// unit preference, commits them to <see cref="AppSettingsHost"/>. Best-effort and non-blocking.
+    /// </summary>
+    public static async Task ApplyAsync(ShellDataContext data)
+    {
+        try
+        {
+            var repo = new SettingsRepository(data.Api, data.Engine, data.Options);
+            await foreach (var result in repo.GetSettingsAsync().ConfigureAwait(false))
+            {
+                if (result.Status != LoadStatus.Loaded)
+                {
+                    continue;
+                }
+
+                JsonElement document = result.Value;
+                if (document.ValueKind != JsonValueKind.Object)
+                {
+                    continue;
+                }
+
+                string? theme = ReadId(document, "theme", AccentThemeIds);
+                string? mode = ReadId(document, "mode", ColorModeIds);
+                UnitSystemPreference? units = ReadUnits(document);
+                if (theme is null && mode is null && units is null)
+                {
+                    return;
+                }
+
+                await AppSettingsHost.Service.UpdateAsync(s => s with
+                {
+                    AccentThemeId = theme ?? s.AccentThemeId,
+                    ColorModeId = mode ?? s.ColorModeId,
+                    Units = units ?? s.Units,
+                }).ConfigureAwait(false);
+                return;
+            }
+        }
+        catch (Exception)
+        {
+            // Best-effort: an unreachable/erroring backend keeps the local defaults in place,
+            // which is exactly what the web does when its GET /settings fetch fails.
+        }
+    }
+
+    private static string? ReadId(JsonElement settings, string property, string[] allowed)
+    {
+        if (settings.TryGetProperty(property, out var value)
+            && value.ValueKind == JsonValueKind.String)
+        {
+            string? id = value.GetString();
+            if (!string.IsNullOrEmpty(id) && Array.IndexOf(allowed, id) >= 0)
+            {
+                return id;
+            }
+        }
+
+        return null;
+    }
+
+    // The backend stores units granularly (unit_of_length / unit_of_temp / unit_of_pressure), while the
+    // native app carries a single metric/imperial preference. Length is the dominant display axis, so it
+    // drives the mapping (mi -> imperial, km -> metric); temperature is a tie-breaker when length is absent.
+    private static UnitSystemPreference? ReadUnits(JsonElement settings)
+    {
+        string? length = ReadString(settings, "unit_of_length");
+        if (string.Equals(length, "mi", StringComparison.OrdinalIgnoreCase))
+        {
+            return UnitSystemPreference.Imperial;
+        }
+
+        if (string.Equals(length, "km", StringComparison.OrdinalIgnoreCase))
+        {
+            return UnitSystemPreference.Metric;
+        }
+
+        string? temp = ReadString(settings, "unit_of_temp");
+        if (string.Equals(temp, "F", StringComparison.OrdinalIgnoreCase))
+        {
+            return UnitSystemPreference.Imperial;
+        }
+
+        if (string.Equals(temp, "C", StringComparison.OrdinalIgnoreCase))
+        {
+            return UnitSystemPreference.Metric;
+        }
+
+        return null;
+    }
+
+    private static string? ReadString(JsonElement settings, string property) =>
+        settings.TryGetProperty(property, out var value) && value.ValueKind == JsonValueKind.String
+            ? value.GetString()
+            : null;
+}

apps/windows/TeslaSync.App/Shell/BackendThemeSync.cs

@@ -45,6 +45,7 @@ public sealed partial class ShellWindow : Window
     private ElementTheme _theme = ElementTheme.Default;
     private string? _appliedAccent;
     private string? _appliedMode;
+    private UnitSystemPreference _appliedUnits = UnitSystemPreference.Metric;
     private bool _firstThemeApply = true;
     private AccessibilitySettings? _accessibility;
     private bool _navigating;
@@ -1337,16 +1338,20 @@ private void RegisterDataBackedPages()
         // (DashboardStatsWidget is intentionally omitted — its backend GET /dashboard/stats endpoint currently 500s.)
         _viewModel.PageFactory.Register("Dashboard", () =>
         {
+            // Resolve the current unit preference (web useUnits() parity) so the data widgets render in the
+            // account's units. The factory re-runs on a settings change (ApplySettings rebuilds on a units
+            // flip), so the widgets pick up metric/imperial changes without a manual refresh.
+            var units = AppSettingsHost.Current.ToUnitPref();
             var widgets = new UIElement[]
             {
-                DashboardWidgets.VehicleHeroCardWidget.Create(_data.Vehicles, _data.Api, _data.Engine, _data.Options, _data.Localizer),
+                DashboardWidgets.VehicleHeroCardWidget.Create(_data.Vehicles, _data.Api, _data.Engine, _data.Options, _data.Localizer, units: units),
                 DashboardWidgets.DigitalTwinWidget.Create(_data.Vehicles, _data.Api, _data.Engine, _data.Options, _data.Localizer),
                 DashboardWidgets.BatteryRadialGaugeWidget.Create(_data.Vehicles, _data.Api, _data.Engine, _data.Options, _data.Localizer),
                 DashboardWidgets.BatteryDegradationForecastWidget.Create(_data.Vehicles, _data.Api, _data.Engine, _data.Options, _data.Localizer),
-                DashboardWidgets.MotorPerformanceWidget.Create(_data.Vehicles, _data.Api, _data.Engine, _data.Options, _data.Localizer),
-                DashboardWidgets.ChargeStatusWidget.Create(_data.Vehicles, _data.Api, _data.Engine, _data.Options, _data.Localizer),
-                DashboardWidgets.RecentDrivesWidget.Create(_data.Vehicles, _data.Api, _data.Engine, _data.Options, _data.Localizer),
-                DashboardWidgets.AnalyticsSummaryWidget.Create(_data.Api, _data.Engine, _data.Options, _data.Localizer),
+                DashboardWidgets.MotorPerformanceWidget.Create(_data.Vehicles, _data.Api, _data.Engine, _data.Options, _data.Localizer, units: units),
+                DashboardWidgets.ChargeStatusWidget.Create(_data.Vehicles, _data.Api, _data.Engine, _data.Options, _data.Localizer, units: units),
+                DashboardWidgets.RecentDrivesWidget.Create(_data.Vehicles, _data.Api, _data.Engine, _data.Options, _data.Localizer, units: units),
+                DashboardWidgets.AnalyticsSummaryWidget.Create(_data.Api, _data.Engine, _data.Options, _data.Localizer, units: units),
                 DashboardWidgets.SoftwareUpdateHistoryWidget.Create(_data.Vehicles, _data.Api, _data.Engine, _data.Options, _data.Localizer),
             };
             var page = new FeatureViews.Dashboard.DashboardPage(
@@ -1386,6 +1391,7 @@ private void ConfigureWindow()
             startup.AccentThemeId, startup.ColorModeId, SystemPrefersDark(), Content as FrameworkElement);
         _appliedAccent = startup.AccentThemeId;
         _appliedMode = startup.ColorModeId;
+        _appliedUnits = startup.Units;
 
         // The startup palette above is the local default; the deferred local-settings load and the
         // backend /settings theme seed (web ThemeProvider parity) arrive as later Changed events. Clear the
@@ -1886,6 +1892,11 @@ private void ApplySettings(AppSettings settings)
             && (!string.Equals(_appliedAccent, settings.AccentThemeId, StringComparison.Ordinal)
                 || !string.Equals(_appliedMode, settings.ColorModeId, StringComparison.Ordinal));
 
+        // Units flip the same way: pages resolve their unit pref at construction (mirrors the web's
+        // useUnits() at render), so a metric/imperial change needs a rebuild for non-reactive pages. List
+        // pages that subscribe to settings.Changed re-apply units themselves; the rebuild covers the rest.
+        bool unitsChanged = !_firstThemeApply && _appliedUnits != settings.Units;
+
         if (highContrast)
         {
             if (Content is FrameworkElement hcRoot)
@@ -1903,12 +1914,13 @@ private void ApplySettings(AppSettings settings)
 
         _appliedAccent = settings.AccentThemeId;
         _appliedMode = settings.ColorModeId;
+        _appliedUnits = settings.Units;
         _firstThemeApply = false;
 
         ApplyDensity(settings.Density);
         MaybeApplyStartupRoute(settings);
 
-        if (themeChanged && !string.IsNullOrEmpty(_viewModel.CurrentPath))
+        if ((themeChanged || unitsChanged) && !string.IsNullOrEmpty(_viewModel.CurrentPath))
         {
             NavigateTo(_viewModel.CurrentPath, pushHistory: false, record: false);
         }