Web UI: TemperatureDial always displays °F regardless of Celsius preference

[ng]

Report

User: trinity (Discord), Pod 4 (likely affects all pods).

Web UI keeps displaying Fahrenheit despite toggling to Celsius. 'Inside' temp indicator below does show up as Celsius. App also displays Celsius correctly. Issue remains after refreshing/clearing cache and cookies.

Initial investigation

The mismatch is consistent: the hero TemperatureDial ignores the unit preference; EnvironmentInfoPanel (the 'Inside' temp chip below) reads it correctly. Native iOS app is fine.

Root cause

src/components/TemperatureDial/TemperatureDial.tsx never consults useTemperatureUnit — the hook responsible for the global °F/°C gate. It receives temperatures already in Fahrenheit (currentTempF, targetTempF — produced by hardware/responseParser.ts from the firmware level encoding) and renders them unconverted:

• Line 340: {formatTemp(targetTempF)} — calls lib/tempUtils.ts formatTemp(value, unit='F') with no unit arg → suffix defaults to °F.
• Line 218: aria-valuetext={${targetTempF}°F} — hard-coded °F.
• The 'NOW' / current-temp marker and offset display nearby also format raw tempF values.

By contrast EnvironmentInfoPanel consumes raw Celsius from environment.getLatestBedTemp and calls useTemperatureUnit().formatTemp(celsius), so it converts + relabels correctly.

Why cache-clearing didn't help

The bug is purely client-side rendering in the dial component — there's no stale storage involved. The preference IS being read (other panels respect it); the dial just doesn't subscribe to it.

Suspected scope

Components in src/components/TemperatureDial/ and any consumer that passes tempF values to UI text (likely affects ±1 control labels, TempScreen aria-text, and possibly the BedTemp / FreezerHealth surfaces — grep -n '°F' src/components finds 1+ raw literals).

Expected behavior

When settings.device.temperatureUnit === 'C':

• Hero target reads e.g. 22°C, not 72°F.
• 'NOW' marker label reads in °C.
• aria-valuetext reads in °C with converted bounds.
• ±1 button still maps to a hardware-meaningful step (the hardware accepts °F internally per hardware/client.ts setTemperature; the conversion is display-only — the mutation can keep sending °F as long as the UI is consistent).

Acceptance

• TemperatureDial displays target, current/NOW, and aria-valuetext in the user's preferred unit
• Unit switch is reactive (no reload needed) — verified by toggling in Settings while TempScreen is mounted
• Regression test in src/components/TemperatureDial/tests/ mounts the dial under both unit settings and asserts the rendered hero string
• grep -nE '°F|°C' src/components shows no hard-coded °F literals in components that should be unit-aware

Refs

• src/components/TemperatureDial/TemperatureDial.tsx lines 25–27, 218, 340
• src/hooks/useTemperatureUnit.ts (the gate hook to consume)
• src/lib/tempUtils.ts formatTemp(value, unit) (note the misleading default unit = 'F' — caller forgot to pass)
• src/components/EnvironmentInfo/EnvironmentInfoPanel.tsx (working reference)
• Reporter: trinity on Discord, Pod 4