ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[Refactoring] Chat List: Fix redundant DOM operations

Browse Source
This commit is contained in:
Alexander Zinchuk 2022-05-30 15:40:34 +04:00
parent 706839953a
commit b2d4f78c65
2 changed files with 21 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

30
src/components/left/main/ChatList.tsx
View File

@ -13,7 +13,7 @@ import {
} from '../../../config'; } from '../../../config';
import { IS_MAC_OS, IS_PWA } from '../../../util/environment'; import { IS_MAC_OS, IS_PWA } from '../../../util/environment';
import { mapValues } from '../../../util/iteratees'; import { mapValues } from '../../../util/iteratees';
import { getPinnedChatsCount } from '../../../util/folderManager'; import { getPinnedChatsCount, getOrderKey } from '../../../util/folderManager';
import usePrevious from '../../../hooks/usePrevious'; import usePrevious from '../../../hooks/usePrevious';
import useInfiniteScroll from '../../../hooks/useInfiniteScroll'; import useInfiniteScroll from '../../../hooks/useInfiniteScroll';
import { useFolderManagerForOrderedIds } from '../../../hooks/useFolderManager'; import { useFolderManagerForOrderedIds } from '../../../hooks/useFolderManager';
@ -117,18 +117,22 @@ const ChatList: FC<OwnProps> = ({
const viewportOffset = orderedIds!.indexOf(viewportIds![0]); const viewportOffset = orderedIds!.indexOf(viewportIds![0]);
const pinnedCount = getPinnedChatsCount(resolvedFolderId) || 0; const pinnedCount = getPinnedChatsCount(resolvedFolderId) || 0;
return viewportIds!.map((id, i) => ( return viewportIds!.map((id, i) => {
<Chat const isPinned = viewportOffset + i < pinnedCount;
key={id}
teactOrderKey={i} return (
chatId={id} <Chat
isPinned={viewportOffset + i < pinnedCount} key={id}
folderId={folderId} teactOrderKey={isPinned ? i : getOrderKey(id)}
animationType={getAnimationType(id)} chatId={id}
orderDiff={orderDiffById[id]} isPinned={isPinned}
style={`top: ${(viewportOffset + i) * CHAT_HEIGHT_PX}px;`} folderId={folderId}
/> animationType={getAnimationType(id)}
)); orderDiff={orderDiffById[id]}
style={`top: ${(viewportOffset + i) * CHAT_HEIGHT_PX}px;`}
/>
);
});
} }
return ( return (

4
src/util/folderManager.ts
View File

@ -135,6 +135,10 @@ export function getAllNotificationsCount() {
return getUnreadCounters()[ALL_FOLDER_ID]?.notificationsCount || 0; return getUnreadCounters()[ALL_FOLDER_ID]?.notificationsCount || 0;
} }
export function getOrderKey(chatId: string) {
return prepared.chatSummariesById.get(chatId)!.order;
}
/* Callback managers */ /* Callback managers */
export function addOrderedIdsCallback(folderId: number, callback: (orderedIds: string[]) => void) { export function addOrderedIdsCallback(folderId: number, callback: (orderedIds: string[]) => void) {