From 9511533b112fa103e4c8a734afdca23d00cd644a Mon Sep 17 00:00:00 2001
From: Hristo Terezov <hristo@jitsi.org>
Date: Thu, 17 Nov 2022 16:17:43 -0600
Subject: [PATCH] fix(dialog): cancel hide timeout on openDialog

Since we unmount the dialog after a timeout because of an animation we
need to cancel the timeout in case we need to render new dialog.
Otherwise the actual hiding can be executed after we render the new
dialog.
---
 .../ui/components/web/DialogTransition.tsx    | 19 +++++++++++++++----
 1 file changed, 15 insertions(+), 4 deletions(-)

diff --git a/react/features/base/ui/components/web/DialogTransition.tsx b/react/features/base/ui/components/web/DialogTransition.tsx
index 408a0d3a7..472775899 100644
--- a/react/features/base/ui/components/web/DialogTransition.tsx
+++ b/react/features/base/ui/components/web/DialogTransition.tsx
@@ -2,18 +2,29 @@ import React, { ReactElement, useEffect, useState } from 'react';
 
 export const DialogTransitionContext = React.createContext({ isUnmounting: false });
 
+type TimeoutType = ReturnType<typeof setTimeout>;
+
 const DialogTransition = ({ children }: { children: ReactElement | null; }) => {
     const [ childrenToRender, setChildrenToRender ] = useState(children);
     const [ isUnmounting, setIsUnmounting ] = useState(false);
+    const [ timeoutID, setTimeoutID ] = useState<TimeoutType | undefined>(undefined);
 
     useEffect(() => {
         if (children === null) {
             setIsUnmounting(true);
-            setTimeout(() => {
-                setChildrenToRender(children);
-                setIsUnmounting(false);
-            }, 150);
+            if (typeof timeoutID === 'undefined') {
+                setTimeoutID(setTimeout(() => {
+                    setChildrenToRender(children);
+                    setIsUnmounting(false);
+                    setTimeoutID(undefined);
+                }, 150));
+            }
         } else {
+            if (typeof timeoutID !== 'undefined') {
+                clearTimeout(timeoutID);
+                setTimeoutID(undefined);
+                setIsUnmounting(false);
+            }
             setChildrenToRender(children);
         }
     }, [ children ]);