Can select catchup hours

central_frontend/src/dialogs/EditDeviceRelaysDialog.tsx

@@ -18,6 +18,7 @@ import { dayjsToTimeOfDay, timeOfDay } from "../utils/DateUtils";
 import { lenValid } from "../utils/StringsUtils";
 import { CheckboxInput } from "../widgets/forms/CheckboxInput";
 import { TextInput } from "../widgets/forms/TextInput";
+import { MultipleSelectInput } from "../widgets/forms/MultipleSelectInput";
 
 export function EditDeviceRelaysDialog(p: {
   onClose: () => void;
@@ -243,16 +244,23 @@ export function EditDeviceRelaysDialog(p: {
                 />
               </Grid>
               <Grid item xs={6}>
-                <TimePicker
-                  label="Catch up hours"
-                  value={timeOfDay(relay.daily_runtime!.reset_time)}
+                <MultipleSelectInput
+                  label="Catchup hours"
+                  helperText="The hours during which the relay should be turned on to reach expected runtime"
+                  values={Array.apply(null, Array(24)).map((_y, i) => {
+                    return {
+                      label: `${i.toString().padStart(2, "0")}:00`,
+                      value: i,
+                    };
+                  })}
+                  selected={relay.daily_runtime!.catch_up_hours}
                   onChange={(d) =>
                     setRelay((r) => {
                       return {
                         ...r,
                         daily_runtime: {
                           ...r.daily_runtime!,
-                          reset_time: d ? dayjsToTimeOfDay(d) : 0,
+                          catch_up_hours: d,
                         },
                       };
                     })