From 5621d4dc9d82e5af64c37d93b52569068fed55cd Mon Sep 17 00:00:00 2001
From: Alexander Zinchuk <alx.zinchuk@gmail.com>
Date: Mon, 13 Dec 2021 15:37:21 +0100
Subject: [PATCH] Message List: Fix FAB and notch when going back in history
 stack

---
 src/components/middle/MessageList.tsx         |  4 +---
 src/components/middle/MessageListContent.tsx  |  6 +++---
 src/components/middle/MiddleColumn.tsx        |  3 +--
 src/components/middle/hooks/useScrollHooks.ts | 10 ++++++++--
 4 files changed, 13 insertions(+), 10 deletions(-)

diff --git a/src/components/middle/MessageList.tsx b/src/components/middle/MessageList.tsx
index f8ce9323d..cb2295cb7 100644
--- a/src/components/middle/MessageList.tsx
+++ b/src/components/middle/MessageList.tsx
@@ -61,7 +61,6 @@ type OwnProps = {
   type: MessageListType;
   canPost: boolean;
   isReady: boolean;
-  isActive: boolean;
   onFabToggle: (shouldShow: boolean) => void;
   onNotchToggle: (shouldShow: boolean) => void;
   hasTools?: boolean;
@@ -117,7 +116,6 @@ const MessageList: FC<OwnProps & StateProps & DispatchProps> = ({
   isGroupChat,
   canPost,
   isReady,
-  isActive,
   isChatWithSelf,
   isRepliesChat,
   isCreator,
@@ -516,7 +514,7 @@ const MessageList: FC<OwnProps & StateProps & DispatchProps> = ({
           memoFirstUnreadIdRef={memoFirstUnreadIdRef}
           threadId={threadId}
           type={type}
-          isActive={isActive}
+          isReady={isReady}
           threadTopMessageId={threadTopMessageId}
           hasLinkedChat={hasLinkedChat}
           isSchedule={messageGroups ? type === 'scheduled' : false}
diff --git a/src/components/middle/MessageListContent.tsx b/src/components/middle/MessageListContent.tsx
index 6219d87dd..6cc18a92f 100644
--- a/src/components/middle/MessageListContent.tsx
+++ b/src/components/middle/MessageListContent.tsx
@@ -30,7 +30,7 @@ interface OwnProps {
   memoFirstUnreadIdRef: { current: number | undefined };
   threadId: number;
   type: MessageListType;
-  isActive: boolean;
+  isReady: boolean;
   threadTopMessageId: number | undefined;
   hasLinkedChat: boolean | undefined;
   isSchedule: boolean;
@@ -55,7 +55,7 @@ const MessageListContent: FC<OwnProps> = ({
   memoFirstUnreadIdRef,
   threadId,
   type,
-  isActive,
+  isReady,
   threadTopMessageId,
   hasLinkedChat,
   isSchedule,
@@ -82,7 +82,7 @@ const MessageListContent: FC<OwnProps> = ({
     isUnread,
     onFabToggle,
     onNotchToggle,
-    isActive,
+    isReady,
   );
 
   const lang = useLang();
diff --git a/src/components/middle/MiddleColumn.tsx b/src/components/middle/MiddleColumn.tsx
index 67861a6e7..ba1274a3c 100644
--- a/src/components/middle/MiddleColumn.tsx
+++ b/src/components/middle/MiddleColumn.tsx
@@ -396,7 +396,7 @@ const MiddleColumn: FC<StateProps & DispatchProps> = ({
               cleanupExceptionKey={cleanupExceptionKey}
               onStop={() => setIsReady(true)}
             >
-              {(isActive) => (
+              {() => (
                 <>
                   <MessageList
                     key={`${renderingChatId}-${renderingThreadId}-${renderingMessageListType}`}
@@ -408,7 +408,6 @@ const MiddleColumn: FC<StateProps & DispatchProps> = ({
                     onFabToggle={setIsFabShown}
                     onNotchToggle={setIsNotchShown}
                     isReady={isReady && !willSwitchMessageList}
-                    isActive={isActive}
                     withBottomShift={withMessageListBottomShift}
                   />
                   <div className={footerClassName}>
diff --git a/src/components/middle/hooks/useScrollHooks.ts b/src/components/middle/hooks/useScrollHooks.ts
index 8a4197e67..d8d45eb21 100644
--- a/src/components/middle/hooks/useScrollHooks.ts
+++ b/src/components/middle/hooks/useScrollHooks.ts
@@ -23,7 +23,7 @@ export default function useScrollHooks(
   isUnread: boolean,
   onFabToggle: AnyToVoidFunction,
   onNotchToggle: AnyToVoidFunction,
-  isActive: boolean,
+  isReady: boolean,
 ) {
   const { loadViewportMessages } = getDispatch();
 
@@ -44,7 +44,7 @@ export default function useScrollHooks(
   const fabTriggerRef = useRef<HTMLDivElement>(null);
 
   function toggleScrollTools() {
-    if (!isActive) return;
+    if (!isReady) return;
 
     if (!messageIds || !messageIds.length) {
       onFabToggle(false);
@@ -124,6 +124,12 @@ export default function useScrollHooks(
 
   useOnIntersect(fabTriggerRef, observeIntersectionForNotch);
 
+  useOnChange(() => {
+    if (isReady) {
+      toggleScrollTools();
+    }
+  }, [isReady]);
+
   // Workaround for FAB and notch flickering with tall incoming message
   useOnChange(() => {
     freezeForFab();