Fix TemporaryAlert (#81384)

2026-07-30 00:08:10 -05:00 · 2024-01-26 21:46:52 +01:00
parent b758b91e84
commit 77b0369fdb
1 changed files with 13 additions and 9 deletions
@@ -30,22 +30,26 @@ const timeoutMap = {
 export const TemporaryAlert = (props: { severity: AlertVariant; text: string }) => {
  const style = getStyle(useTheme2());
  const [visible, setVisible] = useState(false);
+  const [timer, setTimer] = useState<NodeJS.Timeout>();

  useEffect(() => {
-    const timer = setTimeout(() => {
-      setVisible(false);
-    }, timeoutMap[props.severity]);
-
    return () => {
-      clearTimeout(timer);
+      if (timer) {
+        clearTimeout(timer);
+      }
    };
-  }, [props.severity, visible]);
+  }, [timer]);

  useEffect(() => {
    if (props.text !== '') {
      setVisible(true);
-    }
-  }, [props.text]);

-  return <Alert className={style} elevated={true} title={props.text} severity={props.severity} />;
+      const timer = setTimeout(() => {
+        setVisible(false);
+      }, timeoutMap[props.severity]);
+      setTimer(timer);
+    }
+  }, [props.severity, props.text]);
+
+  return <>{visible && <Alert className={style} elevated={true} title={props.text} severity={props.severity} />}</>;
 };