From 228d831644de6c5628101c1f75762c9ebf8c9b7a Mon Sep 17 00:00:00 2001
From: Przemyslaw Jozwik <przemyslaw.jozwik96@gmail.com>
Date: Thu, 19 Dec 2024 15:22:00 +0100
Subject: [PATCH] update scroll to conversation

---
 setupTests.js                                 | 18 +++++++++
 .../Conversations/ConversationsList.test.tsx  |  8 ++--
 .../Conversations/ConversationsList.tsx       | 38 +++++++++++--------
 3 files changed, 45 insertions(+), 19 deletions(-)

diff --git a/setupTests.js b/setupTests.js
index ef2b232baa3..d219558ffdb 100644
--- a/setupTests.js
+++ b/setupTests.js
@@ -51,6 +51,24 @@ jest.mock('axios', () => {
   };
 });
 
+class ResizeObserver {
+  observe() {}
+  unobserve() {}
+  disconnect() {}
+}
+global.ResizeObserver = ResizeObserver;
+
+// Mock IntersectionObserver
+class IntersectionObserver {
+  observe() {}
+  unobserve() {}
+  disconnect() {}
+  takeRecords() {
+    return [];
+  }
+}
+global.IntersectionObserver = IntersectionObserver;
+
 window.TextEncoder = encoding.TextEncoder;
 window.TextDecoder = encoding.TextDecoder;
 
diff --git a/src/script/page/LeftSidebar/panels/Conversations/ConversationsList.test.tsx b/src/script/page/LeftSidebar/panels/Conversations/ConversationsList.test.tsx
index a7f1f4c57c2..a4b4434eb16 100644
--- a/src/script/page/LeftSidebar/panels/Conversations/ConversationsList.test.tsx
+++ b/src/script/page/LeftSidebar/panels/Conversations/ConversationsList.test.tsx
@@ -89,12 +89,14 @@ describe('ConversationsList', () => {
     );
 
   it("should render all 1:1 conversations if there's no search filter", () => {
-    const unserNames = ['Alice', 'Bob', 'Charlie'];
-    const conversations = unserNames.map(create1to1Conversation);
+    const userNames = ['Alice', 'Bob', 'Charlie'];
+    const conversations = userNames.map(create1to1Conversation);
+
+    window.Element.prototype.getBoundingClientRect = jest.fn().mockReturnValue({height: 1000, width: 1000});
 
     const {getByText} = renderComponent(conversations);
 
-    unserNames.forEach(userName => {
+    userNames.forEach(userName => {
       expect(getByText(userName)).toBeDefined();
     });
   });
diff --git a/src/script/page/LeftSidebar/panels/Conversations/ConversationsList.tsx b/src/script/page/LeftSidebar/panels/Conversations/ConversationsList.tsx
index 361f9182810..ba57b26d20b 100644
--- a/src/script/page/LeftSidebar/panels/Conversations/ConversationsList.tsx
+++ b/src/script/page/LeftSidebar/panels/Conversations/ConversationsList.tsx
@@ -41,7 +41,7 @@ import {matchQualifiedIds} from 'Util/QualifiedId';
 
 import {ConnectionRequests} from './ConnectionRequests';
 import {conversationsList, headingTitle, noResultsMessage} from './ConversationsList.styles';
-import {conversationSearchFilter, scrollToConversation} from './helpers';
+import {conversationSearchFilter} from './helpers';
 
 import {CallState} from '../../../../calling/CallState';
 import {ConversationState} from '../../../../conversation/ConversationState';
@@ -127,6 +127,19 @@ export const ConversationsList = ({
     listViewModel.contentViewModel.switchContent(ContentState.CONNECTION_REQUESTS);
   };
 
+  const isFolderView = currentTab === SidebarTabs.FOLDER;
+  const filteredConversations =
+    (isFolderView && currentFolder?.conversations().filter(conversationSearchFilter(conversationsFilter))) || [];
+  const conversationsToDisplay = filteredConversations.length ? filteredConversations : conversations;
+
+  const parentRef = useRef(null);
+
+  const rowVirtualizer = useVirtualizer({
+    count: conversationsToDisplay.length,
+    getScrollElement: () => parentRef.current,
+    estimateSize: () => 56,
+  });
+
   const onConversationClick = useCallback(
     (conversation: Conversation) =>
       (event: ReactMouseEvent<HTMLDivElement, MouseEvent> | ReactKeyBoardEvent<HTMLDivElement>) => {
@@ -164,23 +177,16 @@ export const ConversationsList = ({
 
   useEffect(() => {
     if (!conversationsFilter && clickedFilteredConversationId) {
-      scrollToConversation(clickedFilteredConversationId);
-      setClickedFilteredConversationId(null);
-    }
-  }, [conversationsFilter, clickedFilteredConversationId]);
+      const conversationIndex = conversationsToDisplay.findIndex(conv => conv.id === clickedFilteredConversationId);
 
-  const isFolderView = currentTab === SidebarTabs.FOLDER;
-  const filteredConversations =
-    (isFolderView && currentFolder?.conversations().filter(conversationSearchFilter(conversationsFilter))) || [];
-  const conversationsToDisplay = filteredConversations.length ? filteredConversations : conversations;
-
-  const parentRef = useRef(null);
+      if (conversationIndex !== -1) {
+        rowVirtualizer.scrollToIndex(conversationIndex, {align: 'center'});
+      }
 
-  const rowVirtualizer = useVirtualizer({
-    count: conversationsToDisplay.length,
-    getScrollElement: () => parentRef.current,
-    estimateSize: () => 56,
-  });
+      // scrollToConversation(clickedFilteredConversationId);
+      setClickedFilteredConversationId(null);
+    }
+  }, [conversationsFilter, clickedFilteredConversationId, conversationsToDisplay]);
 
   return (
     <>