Merge pull request #161 from NREL/develop

release v1.2.1-beta

Author: RLiNREL

dw_tap

@@ -42,8 +42,8 @@
     "terser": "^5.43.1",
     "typescript": "~5.8.3",
     "typescript-eslint": "^8.35.1",
-    "vite": "^7.0.4",
-    "vitest": "^3.0.8"
+    "vite": "^7.1.12",
+    "vitest": "^4.0.3"
   },
   "engines": {
     "node": ">=22.14.0"

windwatts-ui/package.json

@@ -10,9 +10,9 @@ import { useOutputUnit } from "../../hooks";
 
 export const AnalysisResults = () => {
   const { ensemble, preferredModel } = useContext(SettingsContext);
-  
+
   useOutputUnit(); // auto-switches between kWh and MWh
-  
+
   return (
     <Stack spacing={2}>
       {/* Top row: either Wind Speed + Resource, or Ensemble Model tiles */}

windwatts-ui/src/components/resultPane/AnalysisResults.tsx

@@ -19,8 +19,17 @@ export const EnsembleSettings = () => {
           }
           label="Enable Ensemble Model"
         />
-        <Typography variant="body2" color="text.secondary" sx={{ mt: 1, fontStyle: "italic" }}>
-          The WindWatts Ensemble model is an alternative to our default atmospheric model, ERA5. This new model leverages machine learning with data from multiple constituent models with ancillary location and terrain data. While early results show significant performance improvements, this model is still being developed and should be used with care.
+        <Typography
+          variant="body2"
+          color="text.secondary"
+          sx={{ mt: 1, fontStyle: "italic" }}
+        >
+          The WindWatts Ensemble model is an alternative to our default
+          atmospheric model, ERA5. This new model leverages machine learning
+          with data from multiple constituent models with ancillary location and
+          terrain data. While early results show significant performance
+          improvements, this model is still being developed and should be used
+          with care.
         </Typography>
       </Paper>
     </>

windwatts-ui/src/components/settings/EnsembleSettings.tsx

@@ -1,9 +1,4 @@
-import {
-  Box,
-  Modal,
-  Typography,
-  IconButton,
-} from "@mui/material";
+import { Box, Modal, Typography, IconButton } from "@mui/material";
 import { Close } from "@mui/icons-material";
 import { UnitsSettings } from "./UnitsSettings";
 import { useContext, useState } from "react";
@@ -19,8 +14,7 @@ import {
 import { EnsembleSettings } from "./EnsembleSettings";
 
 export const Settings = () => {
-  const { settingsOpen, toggleSettings } =
-    useContext(SettingsContext);
+  const { settingsOpen, toggleSettings } = useContext(SettingsContext);
   const [hasScrolled, setHasScrolled] = useState(false);
 
   const handleScroll = (e: React.UIEvent<HTMLDivElement>) => {

windwatts-ui/src/components/settings/Settings.tsx

@@ -1,16 +1,20 @@
 import { Box, Typography, ToggleButton } from "@mui/material";
 import { useContext } from "react";
+import { SettingsContext } from "../../providers/SettingsContext";
 import { UnitsContext } from "../../providers/UnitsContext";
 import { SettingToggleButtonGroup } from "./SettingToggleButtonGroup";
 
 export function UnitsSettings() {
+  const { setWindspeedUnit } = useContext(SettingsContext);
   const { units, updateUnit } = useContext(UnitsContext);
 
   const handleWindspeedChange = (
     _: React.MouseEvent<HTMLElement>,
     newWindspeedUnit: string
   ) => {
     if (newWindspeedUnit !== null) {
+      // Update both: SettingsContext (for URL) and UnitsContext (for components)
+      setWindspeedUnit(newWindspeedUnit);
       updateUnit("windspeed", newWindspeedUnit);
     }
   };

windwatts-ui/src/components/settings/UnitsSettings.tsx

@@ -20,10 +20,12 @@ export const useOutputUnit = () => {
 
     let shouldUseMWh = false;
 
-    if (ensemble) { // ensemble mode - auto-convert if either output >= 10,000
+    if (ensemble) {
+      // ensemble mode - auto-convert if either output >= 10,000
       const ensembleProduction = Number(ensembleData?.energy_production || 0);
       shouldUseMWh = ensembleProduction >= 10000 || prodAvg >= 10000;
-    } else { // non-ensemble mode - auto-convert if average output >= 10,000
+    } else {
+      // non-ensemble mode - auto-convert if average output >= 10,000
       shouldUseMWh = prodAvg >= 10000;
     }
 

windwatts-ui/src/hooks/useOutputUnit.ts

@@ -8,8 +8,8 @@ interface AppProvidersProps {
 
 export const AppProviders: React.FC<AppProvidersProps> = ({ children }) => {
   return (
-    <SettingsProvider>
-      <UnitsProvider>{children}</UnitsProvider>
-    </SettingsProvider>
+    <UnitsProvider>
+      <SettingsProvider>{children}</SettingsProvider>
+    </UnitsProvider>
   );
 };

windwatts-ui/src/providers/AppProviders.tsx

@@ -16,6 +16,7 @@ export interface StoredSettings {
   preferredModel: DataModel;
   ensemble: boolean;
   lossAssumptionFactor: number;
+  windspeedUnit: string;
 }
 
 export interface Settings extends StoredSettings {
@@ -35,6 +36,7 @@ export interface Settings extends StoredSettings {
   setEnsemble: (ensemble: boolean) => void;
   setLossAssumptionFactor: (factor: number) => void;
   setLossAssumptionPercent: (percent: number) => void;
+  setWindspeedUnit: (unit: string) => void;
 }
 
 export const defaultValues: StoredSettings = {
@@ -47,6 +49,7 @@ export const defaultValues: StoredSettings = {
   preferredModel: "era5",
   ensemble: false,
   lossAssumptionFactor: 1.0, // 1.0 = 0% loss, 0.83 = 17% loss defaulted to 0% loss
+  windspeedUnit: "mph",
 };
 
 export const SettingsContext = createContext<Settings>({
@@ -62,4 +65,5 @@ export const SettingsContext = createContext<Settings>({
   setEnsemble: () => {},
   setLossAssumptionFactor: () => {},
   setLossAssumptionPercent: () => {},
+  setWindspeedUnit: () => {},
 });

windwatts-ui/src/providers/SettingsContext.tsx

@@ -1,10 +1,18 @@
-import { useState, useMemo, useCallback, useEffect } from "react";
+import {
+  useState,
+  useMemo,
+  useCallback,
+  useEffect,
+  useContext,
+  useRef,
+} from "react";
 import {
   SettingsContext,
   defaultValues,
   CurrentPosition,
   StoredSettings,
 } from "./SettingsContext";
+import { UnitsContext } from "./UnitsContext";
 import { DataModel } from "../types";
 import { percentToFactor } from "../utils";
 import {
@@ -15,8 +23,13 @@ import {
 } from "../utils/urlParams";
 
 export function SettingsProvider({ children }: { children: React.ReactNode }) {
+  const { updateUnit } = useContext(UnitsContext);
+
+  // Parse URL params once and cache the result
+  const urlParamsRef = useRef(parseUrlParams());
+
   const [settings, setSettings] = useState<StoredSettings>(() => {
-    const urlParams = parseUrlParams();
+    const urlParams = urlParamsRef.current;
 
     if (hasLaunchParams(urlParams)) {
       return {
@@ -34,6 +47,8 @@ export function SettingsProvider({ children }: { children: React.ReactNode }) {
           urlParams.lossAssumption !== undefined
             ? percentToFactor(urlParams.lossAssumption)
             : defaultValues.lossAssumptionFactor,
+        windspeedUnit:
+          urlParams.windspeedUnit ?? URL_PARAM_DEFAULTS.windspeedUnit,
       };
     }
 
@@ -43,21 +58,29 @@ export function SettingsProvider({ children }: { children: React.ReactNode }) {
     };
   });
 
+  useEffect(() => {
+    const urlParams = urlParamsRef.current;
+    if (urlParams.windspeedUnit) {
+      updateUnit("windspeed", urlParams.windspeedUnit);
+    }
+  }, [updateUnit]);
+
   useEffect(() => {
     if (!settings.currentPosition) {
       return;
     }
 
     const url = buildUrlFromSettings({
       currentPosition: settings.currentPosition,
-      zoom: settings.zoom,
       hubHeight: settings.hubHeight,
       powerCurve: settings.powerCurve,
       preferredModel: settings.preferredModel,
       ensemble: settings.ensemble,
       lossAssumptionPercent: Math.round(
         (1 - settings.lossAssumptionFactor) * 100
       ),
+      zoom: settings.zoom,
+      windspeedUnit: settings.windspeedUnit,
     });
 
     if (url !== "/") {
@@ -71,6 +94,7 @@ export function SettingsProvider({ children }: { children: React.ReactNode }) {
     settings.preferredModel,
     settings.ensemble,
     settings.lossAssumptionFactor,
+    settings.windspeedUnit,
   ]);
 
   const setCurrentPosition = useCallback(
@@ -137,6 +161,13 @@ export function SettingsProvider({ children }: { children: React.ReactNode }) {
     [setLossAssumptionFactor]
   );
 
+  const setWindspeedUnit = useCallback(
+    (unit: string) => {
+      setSettings((current) => ({ ...current, windspeedUnit: unit }));
+    },
+    [setSettings]
+  );
+
   // Toggle functions that update the settings directly
   const toggleSettings = useCallback(() => {
     setSettings((current) => ({
@@ -181,6 +212,8 @@ export function SettingsProvider({ children }: { children: React.ReactNode }) {
       ),
       setLossAssumptionFactor,
       setLossAssumptionPercent,
+      windspeedUnit: settings.windspeedUnit,
+      setWindspeedUnit,
     }),
     [
       settings.settingsOpen,
@@ -192,6 +225,7 @@ export function SettingsProvider({ children }: { children: React.ReactNode }) {
       settings.preferredModel,
       settings.ensemble,
       settings.lossAssumptionFactor,
+      settings.windspeedUnit,
       toggleSettings,
       toggleResults,
       setCurrentPosition,
@@ -202,6 +236,7 @@ export function SettingsProvider({ children }: { children: React.ReactNode }) {
       setEnsemble,
       setLossAssumptionFactor,
       setLossAssumptionPercent,
+      setWindspeedUnit,
     ]
   );