Fix map recenter (root cause), login logo/theming, policy pricing display

- ROOT CAUSE: MapLibre Camera re-applies its last setCamera() stop on every
  re-render, so a search (setZones) snapped the map back to the last programmatic
  target. Memoize the Camera + UserLocation elements so search re-renders never
  touch them; only the marker ShapeSource updates. (Confirmed via [CAM] trace.)
- Login: brain-car logo + full theming so text is readable in light/dark
- Meter policies: negative Rate is a sentinel (RateType No Parking=-1 / Free=-3),
  not a price; show DisplayString + colored type dot, real $/hr only when positive.
  Fix zone rate "$ 4.00" formatting.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Hank 2026-07-06 11:14:23 -07:00
parent 648acb95cb
commit a4150555ae
3 changed files with 83 additions and 61 deletions

View file

@ -178,6 +178,29 @@ export function MapScreen() {
}
};
// MapLibre's Camera re-applies its last imperative setCamera() stop whenever it
// re-renders — so a search re-render (setZones) would snap the map back to the
// last programmatic target. Memoize these elements so search re-renders never
// touch them; only the marker ShapeSource below updates.
const cameraEl = useMemo(() => <Camera ref={cameraRef} />, []);
const userLocationEl = useMemo(
() => (
<UserLocation
visible
renderMode="normal"
onUpdate={(loc: any) => {
if (loc?.coords) {
nativeFix.current = {
latitude: loc.coords.latitude,
longitude: loc.coords.longitude,
};
}
}}
/>
),
[],
);
return (
<View style={styles.container}>
<MapView
@ -198,25 +221,8 @@ export function MapScreen() {
)
}
>
{/* Uncontrolled camera; we position it imperatively (once on load, then
only on explicit user actions) so re-renders never move the map. */}
<Camera ref={cameraRef} />
{/* renderMode="normal" draws the dot in the JS layer and does NOT engage
the native location component, which was tracking the camera back to
the user on re-render. */}
<UserLocation
visible
renderMode="normal"
onUpdate={(loc: any) => {
if (loc?.coords) {
nativeFix.current = {
latitude: loc.coords.latitude,
longitude: loc.coords.longitude,
};
}
}}
/>
{cameraEl}
{userLocationEl}
<ShapeSource id="meters" shape={meterFeatures} onPress={onPinPress}>
<CircleLayer