diff --git a/apps/meteor/client/views/room/Sidepanel/RoomSidepanel.tsx b/apps/meteor/client/views/room/Sidepanel/RoomSidepanel.tsx
index 73871f04e7732..d7b62972e65c3 100644
--- a/apps/meteor/client/views/room/Sidepanel/RoomSidepanel.tsx
+++ b/apps/meteor/client/views/room/Sidepanel/RoomSidepanel.tsx
@@ -8,7 +8,7 @@ import RoomSidepanelListWrapper from './RoomSidepanelListWrapper';
 import RoomSidepanelLoading from './RoomSidepanelLoading';
 import RoomSidepanelItem from './SidepanelItem';
 import { useTeamsListChildrenUpdate } from './hooks/useTeamslistChildren';
-import { CustomScrollbars } from '../../../components/CustomScrollbars';
+import { VirtualizedScrollbars } from '../../../components/CustomScrollbars';
 import { useRoomInfoEndpoint } from '../../../hooks/useRoomInfoEndpoint';
 import { useOpenedRoom, useSecondLevelOpenedRoom } from '../../../lib/RoomManager';
 
@@ -50,7 +50,7 @@ const RoomSidepanelWithData = ({ parentRid, openedRoom }: { parentRid: string; o
 	return (
 		<Sidepanel>
 			<Box pb={8} h='full'>
-				<CustomScrollbars>
+				<VirtualizedScrollbars>
 					<Virtuoso
 						totalCount={result.data.length}
 						data={result.data}
@@ -59,7 +59,7 @@ const RoomSidepanelWithData = ({ parentRid, openedRoom }: { parentRid: string; o
 							<RoomSidepanelItem openedRoom={openedRoom} room={data} parentRid={parentRid} viewMode={sidebarViewMode} />
 						)}
 					/>
-				</CustomScrollbars>
+				</VirtualizedScrollbars>
 			</Box>
 		</Sidepanel>
 	);
diff --git a/apps/meteor/client/views/room/contextualBar/MessageListTab.tsx b/apps/meteor/client/views/room/contextualBar/MessageListTab.tsx
index df0a897a38914..d4f0d735a38d2 100644
--- a/apps/meteor/client/views/room/contextualBar/MessageListTab.tsx
+++ b/apps/meteor/client/views/room/contextualBar/MessageListTab.tsx
@@ -17,7 +17,7 @@ import {
 	ContextualbarClose,
 	ContextualbarEmptyContent,
 } from '../../../components/Contextualbar';
-import { CustomScrollbars } from '../../../components/CustomScrollbars';
+import { VirtualizedScrollbars } from '../../../components/CustomScrollbars';
 import RoomMessage from '../../../components/message/variants/RoomMessage';
 import SystemMessage from '../../../components/message/variants/SystemMessage';
 import { useFormatDate } from '../../../hooks/useFormatDate';
@@ -67,7 +67,7 @@ const MessageListTab = ({ iconName, title, emptyResultMessage, context, queryRes
 							<MessageListErrorBoundary>
 								<MessageListProvider>
 									<Box is='section' display='flex' flexDirection='column' flexGrow={1} flexShrink={1} flexBasis='auto' height='full'>
-										<CustomScrollbars>
+										<VirtualizedScrollbars>
 											<Virtuoso
 												totalCount={queryResult.data.length}
 												overscan={25}
@@ -104,7 +104,7 @@ const MessageListTab = ({ iconName, title, emptyResultMessage, context, queryRes
 													);
 												}}
 											/>
-										</CustomScrollbars>
+										</VirtualizedScrollbars>
 									</Box>
 								</MessageListProvider>
 							</MessageListErrorBoundary>
diff --git a/apps/meteor/client/views/room/contextualBar/MessageSearchTab/components/MessageSearch.tsx b/apps/meteor/client/views/room/contextualBar/MessageSearchTab/components/MessageSearch.tsx
index c60ec4faa4767..3f71e8c41e832 100644
--- a/apps/meteor/client/views/room/contextualBar/MessageSearchTab/components/MessageSearch.tsx
+++ b/apps/meteor/client/views/room/contextualBar/MessageSearchTab/components/MessageSearch.tsx
@@ -6,7 +6,7 @@ import { Virtuoso } from 'react-virtuoso';
 
 import { MessageTypes } from '../../../../../../app/ui-utils/client';
 import { ContextualbarEmptyContent } from '../../../../../components/Contextualbar';
-import { CustomScrollbars } from '../../../../../components/CustomScrollbars';
+import { VirtualizedScrollbars } from '../../../../../components/CustomScrollbars';
 import RoomMessage from '../../../../../components/message/variants/RoomMessage';
 import SystemMessage from '../../../../../components/message/variants/SystemMessage';
 import { useFormatDate } from '../../../../../hooks/useFormatDate';
@@ -41,7 +41,7 @@ const MessageSearch = ({ searchText, globalSearch }: MessageSearchProps): ReactE
 						<MessageListErrorBoundary>
 							<MessageListProvider>
 								<Box is='section' display='flex' flexDirection='column' flexGrow={1} flexShrink={1} flexBasis='auto' height='full'>
-									<CustomScrollbars>
+									<VirtualizedScrollbars>
 										<Virtuoso
 											totalCount={messageSearchQuery.data.length}
 											overscan={25}
@@ -82,7 +82,7 @@ const MessageSearch = ({ searchText, globalSearch }: MessageSearchProps): ReactE
 												setLimit((limit) => limit + pageSize);
 											}}
 										/>
-									</CustomScrollbars>
+									</VirtualizedScrollbars>
 								</Box>
 							</MessageListProvider>
 						</MessageListErrorBoundary>
diff --git a/apps/meteor/client/views/teams/contextualBar/channels/TeamsChannels.spec.tsx b/apps/meteor/client/views/teams/contextualBar/channels/TeamsChannels.spec.tsx
new file mode 100644
index 0000000000000..7c100cd13b7ea
--- /dev/null
+++ b/apps/meteor/client/views/teams/contextualBar/channels/TeamsChannels.spec.tsx
@@ -0,0 +1,58 @@
+/* eslint-disable testing-library/no-container */
+/* eslint-disable testing-library/no-node-access */
+import { mockAppRoot } from '@rocket.chat/mock-providers';
+import { render, waitFor } from '@testing-library/react';
+
+import TeamsChannels from './TeamsChannels';
+import { createFakeRoom } from '../../../../../tests/mocks/data';
+
+jest.mock('../../../../lib/rooms/roomCoordinator', () => ({
+	roomCoordinator: {
+		getRouteLink: () => undefined,
+	},
+}));
+
+const mainRoom = createFakeRoom({ name: 'Main Room' });
+const fakeRooms = Array.from({ length: 10 }, (_, index) => createFakeRoom({ t: 'c', name: `Fake Room ${index}` }));
+
+beforeEach(() => {
+	Object.defineProperty(window, 'getComputedStyle', {
+		value: () => {
+			return {
+				getPropertyPriority: () => undefined,
+				getPropertyValue: () => undefined,
+			};
+		},
+	});
+});
+
+// TODO: Replace this with the storybook & snapshot
+it('should render scrollbars', async () => {
+	const { container } = render(
+		<TeamsChannels
+			text=''
+			type='all'
+			reload={() => undefined}
+			loadMoreItems={() => undefined}
+			setText={() => undefined}
+			setType={() => undefined}
+			onClickClose={() => undefined}
+			onClickAddExisting={() => undefined}
+			onClickView={() => undefined}
+			onClickCreateNew={() => undefined}
+			total={fakeRooms.length}
+			loading={false}
+			mainRoom={mainRoom}
+			channels={fakeRooms}
+		/>,
+		{
+			wrapper: mockAppRoot().build(),
+		},
+	);
+
+	await waitFor(() => {
+		expect(container.querySelector('[data-overlayscrollbars]')).toBeInTheDocument();
+	});
+
+	expect(container.querySelector('[data-overlayscrollbars]')).toBeInTheDocument();
+});
diff --git a/apps/meteor/client/views/teams/contextualBar/channels/TeamsChannels.tsx b/apps/meteor/client/views/teams/contextualBar/channels/TeamsChannels.tsx
index 6e4868494d0c6..19b8e46590bdb 100644
--- a/apps/meteor/client/views/teams/contextualBar/channels/TeamsChannels.tsx
+++ b/apps/meteor/client/views/teams/contextualBar/channels/TeamsChannels.tsx
@@ -18,7 +18,7 @@ import {
 	ContextualbarEmptyContent,
 	ContextualbarSection,
 } from '../../../../components/Contextualbar';
-import { CustomScrollbars } from '../../../../components/CustomScrollbars';
+import { VirtualizedScrollbars } from '../../../../components/CustomScrollbars';
 import InfiniteListAnchor from '../../../../components/InfiniteListAnchor';
 
 type TeamsChannelsProps = {
@@ -111,7 +111,7 @@ const TeamsChannels = ({
 							</Box>
 						</Box>
 						<Box w='full' h='full' role='list' overflow='hidden' flexShrink={1}>
-							<CustomScrollbars>
+							<VirtualizedScrollbars>
 								<Virtuoso
 									totalCount={total}
 									data={channels}
@@ -121,7 +121,7 @@ const TeamsChannels = ({
 										<TeamsChannelItem onClickView={onClickView} room={data} mainRoom={mainRoom} reload={reload} key={index} />
 									)}
 								/>
-							</CustomScrollbars>
+							</VirtualizedScrollbars>
 						</Box>
 					</>
 				)}