setting the default option to the first device in the list

src/bin/conditioning/modeChangeDialog.tsx

@@ -105,6 +105,8 @@ export default function ModeChangeDialog(props: Props){
   const [outdoorTempInput, setOutdoorTempInput] = useState<string>("")
   const [outdoorHumidityInput, setOutdoorHumidityInput] = useState<string>("")
 
+  const [deviceOption, setDeviceOption] = useState<Option>()
+
   useEffect(()=>{
     setMoistureInput(defaultTargetMoisture?.toFixed(2) ?? "0")
     setOutdoorTempInput(defaultOutdoorTemp?.toFixed(2) ?? "0")
@@ -185,7 +187,12 @@ if (!selectedDevice) return;
   useEffect(() => {
     let o: Option[] = [];
     devices.forEach(device => {
-      o.push({ device: device, label: device.name() });
+      let newOption: Option = {device: device, label: device.name()}
+      if(deviceOption === undefined) {
+        setDeviceOption(newOption)
+        setSelectedDevice(device)
+      }
+      o.push(newOption);
     });
     setOptions(o);
   }, [devices, setOptions]);
@@ -535,6 +542,7 @@ if (!selectedDevice) return;
       <Autocomplete
         disablePortal
         options={options}
+        value={deviceOption}
         fullWidth
         getOptionLabel={option => option.label || ""}
         onChange={(_, newValue) => {