From ac02fa4a4f5d0fe79ee328dedf87dd4b78156552 Mon Sep 17 00:00:00 2001 From: Alexander Zinchuk Date: Sun, 9 May 2021 02:00:05 +0300 Subject: [PATCH] Middle Column: Fix closing chat by --- src/components/middle/MiddleColumn.tsx | 10 +++++----- src/components/middle/composer/WebPagePreview.tsx | 4 ++-- ...sePrevForAnimation.ts => usePrevDuringAnimation.ts} | 4 ++-- 3 files changed, 9 insertions(+), 9 deletions(-) rename src/hooks/{usePrevForAnimation.ts => usePrevDuringAnimation.ts} (83%) diff --git a/src/components/middle/MiddleColumn.tsx b/src/components/middle/MiddleColumn.tsx index 083ed3294..524119f9a 100644 --- a/src/components/middle/MiddleColumn.tsx +++ b/src/components/middle/MiddleColumn.tsx @@ -33,7 +33,7 @@ import { pick } from '../../util/iteratees'; import buildClassName from '../../util/buildClassName'; import useCustomBackground from '../../hooks/useCustomBackground'; import useWindowSize from '../../hooks/useWindowSize'; -import usePrevForAnimation from '../../hooks/usePrevForAnimation'; +import usePrevDuringAnimation from '../../hooks/usePrevDuringAnimation'; import calculateMiddleFooterTransforms from './helpers/calculateMiddleFooterTransforms'; import useLang from '../../hooks/useLang'; @@ -103,10 +103,10 @@ const MiddleColumn: FC = ({ const [isFabShown, setIsFabShown] = useState(false); const [isUnpinModalOpen, setIsUnpinModalOpen] = useState(false); - const renderingChatId = usePrevForAnimation(chatId, CLOSE_ANIMATION_DURATION); - const renderingThreadId = usePrevForAnimation(threadId, CLOSE_ANIMATION_DURATION); - const renderingMessageListType = usePrevForAnimation(messageListType, CLOSE_ANIMATION_DURATION); - const renderingCanPost = usePrevForAnimation(canPost, CLOSE_ANIMATION_DURATION); + const renderingChatId = usePrevDuringAnimation(chatId, CLOSE_ANIMATION_DURATION); + const renderingThreadId = usePrevDuringAnimation(threadId, CLOSE_ANIMATION_DURATION); + const renderingMessageListType = usePrevDuringAnimation(messageListType, CLOSE_ANIMATION_DURATION); + const renderingCanPost = usePrevDuringAnimation(canPost, CLOSE_ANIMATION_DURATION); useEffect(() => { return chatId diff --git a/src/components/middle/composer/WebPagePreview.tsx b/src/components/middle/composer/WebPagePreview.tsx index 25530c53b..d89dda96f 100644 --- a/src/components/middle/composer/WebPagePreview.tsx +++ b/src/components/middle/composer/WebPagePreview.tsx @@ -12,7 +12,7 @@ import { pick } from '../../../util/iteratees'; import parseMessageInput from './helpers/parseMessageInput'; import useOnChange from '../../../hooks/useOnChange'; import useShowTransition from '../../../hooks/useShowTransition'; -import usePrevForAnimation from '../../../hooks/usePrevForAnimation'; +import useCurrentOrPrev from '../../../hooks/useCurrentOrPrev'; import buildClassName from '../../../util/buildClassName'; import WebPage from '../message/WebPage'; @@ -79,7 +79,7 @@ const WebPagePreview: FC = ({ const isShown = Boolean(webPagePreview && messageText.length && !noWebPage && !disabled); const { shouldRender, transitionClassNames } = useShowTransition(isShown); - const renderingWebPage = usePrevForAnimation(webPagePreview); + const renderingWebPage = useCurrentOrPrev(webPagePreview); if (!shouldRender || !renderingWebPage) { return undefined; diff --git a/src/hooks/usePrevForAnimation.ts b/src/hooks/usePrevDuringAnimation.ts similarity index 83% rename from src/hooks/usePrevForAnimation.ts rename to src/hooks/usePrevDuringAnimation.ts index b0a752f04..3a4d16f53 100644 --- a/src/hooks/usePrevForAnimation.ts +++ b/src/hooks/usePrevDuringAnimation.ts @@ -4,7 +4,7 @@ import usePrevious from './usePrevious'; import useForceUpdate from './useForceUpdate'; import useOnChange from './useOnChange'; -export default function usePrevForAnimation(current: any, duration?: number) { +export default function usePrevDuringAnimation(current: any, duration?: number) { const prev = usePrevious(current, true); const timeoutRef = useRef(); const forceUpdate = useForceUpdate(); @@ -26,5 +26,5 @@ export default function usePrevForAnimation(current: any, duration?: number) { } }, [current]); - return isCurrentPresent || (duration && !timeoutRef.current) ? current : prev; + return !timeoutRef.current || !duration || isCurrentPresent ? current : prev; }