fix(ui): Fix timer editor not being reset when creating multiple timers

Hypfer · May 27, 2023 · 342b5e3 · 342b5e3
1 parent a11ea2c
commit 342b5e3
Show file tree

Hide file tree

Showing 3 changed files with 31 additions and 28 deletions.
diff --git a/frontend/src/valetudo/timers/TimerCard.tsx b/frontend/src/valetudo/timers/TimerCard.tsx
@@ -267,18 +267,20 @@ const TimerCard: FunctionComponent<TimerCardProps> = ({
                     </DialogActions>
                 </Dialog>
 
-                <TimerEditDialog
-                    timerInLocalTime={timerInLocalTime}
-                    open={editDialogOpen}
-                    onCancel={() => {
-                        setEditDialogOpen(false);
-                    }}
-                    onSave={(timer) => {
-                        setEditDialogOpen(false);
-                        onSave(timer);
-                    }}
-                    timerProperties={timerProperties}
-                />
+                {
+                    editDialogOpen &&
+                    <TimerEditDialog
+                        timerInLocalTime={timerInLocalTime}
+                        onCancel={() => {
+                            setEditDialogOpen(false);
+                        }}
+                        onSave={(timer) => {
+                            setEditDialogOpen(false);
+                            onSave(timer);
+                        }}
+                        timerProperties={timerProperties}
+                    />
+                }
 
                 <Dialog
                     open={execNowDialogOpen}

diff --git a/frontend/src/valetudo/timers/TimerEditDialog.tsx b/frontend/src/valetudo/timers/TimerEditDialog.tsx
@@ -57,15 +57,13 @@ const preActionControls: Record<
 type TimerDialogProps = {
     timerInLocalTime: Timer;
     timerProperties: TimerProperties;
-    open: boolean;
     onSave: (newProps: Timer) => void;
     onCancel: () => void;
 };
 
 const TimerEditDialog: FunctionComponent<TimerDialogProps> = ({
     timerInLocalTime,
     timerProperties,
-    open,
     onSave,
     onCancel,
 }): JSX.Element => {
@@ -88,7 +86,7 @@ const TimerEditDialog: FunctionComponent<TimerDialogProps> = ({
         } else {
             setValidAction(false);
         }
-    }, [editTimer, open]);
+    }, [editTimer]);
 
     const setActionParams = React.useCallback(
         (newParams: any) => {
@@ -191,7 +189,7 @@ const TimerEditDialog: FunctionComponent<TimerDialogProps> = ({
     const CurrentBrowserTimezone = Intl.DateTimeFormat().resolvedOptions().timeZone;
 
     return (
-        <Dialog open={open} maxWidth={"lg"} fullScreen={narrowScreen}>
+        <Dialog open={true} maxWidth={"lg"} fullScreen={narrowScreen}>
             <DialogTitle>
                 {editTimer.id === "" ? "Add timer" : "Edit timer"}
             </DialogTitle>

diff --git a/frontend/src/valetudo/timers/Timers.tsx b/frontend/src/valetudo/timers/Timers.tsx
@@ -137,18 +137,21 @@ const Timers = (): JSX.Element => {
                 </Grid>
             </Grid>
 
-            <TimerEditDialog
-                timerInLocalTime={addTimerData}
-                timerProperties={timerPropertiesData}
-                open={addTimerDialogOpen}
-                onCancel={() => {
-                    setAddTimerDialogOpen(false);
-                }}
-                onSave={(timer) => {
-                    createTimer(convertTimer(timer, new Date().getTimezoneOffset()));
-                    setAddTimerDialogOpen(false);
-                }}
-            />
+            {
+                addTimerDialogOpen &&
+                <TimerEditDialog
+                    timerInLocalTime={addTimerData}
+                    timerProperties={timerPropertiesData}
+                    onCancel={() => {
+                        setAddTimerDialogOpen(false);
+                    }}
+                    onSave={(timer) => {
+                        createTimer(convertTimer(timer, new Date().getTimezoneOffset()));
+                        setAddTimerDialogOpen(false);
+                    }}
+                />
+            }
+
             <Grid
                 container
                 style={{