mirror of
https://gitcode.com/GitHub_Trending/ji/jitsi-meet.git
synced 2026-05-19 07:47:46 +00:00
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.
This commit is contained in:
@@ -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 ]);
|
||||
|
||||
Reference in New Issue
Block a user