From be7920f9e08d0815b1c8337e9f986da9b0b26fad Mon Sep 17 00:00:00 2001 From: Alexander Zinchuk Date: Wed, 5 Jul 2023 13:15:11 +0200 Subject: [PATCH] [Perf] Reduce usage of frequently updated `currentUser` --- src/components/left/settings/SettingsMain.tsx | 24 +++++++++---------- .../SettingsPrivacyPublicProfilePhoto.tsx | 10 ++++---- .../settings/SettingsPrivacyVisibility.tsx | 16 ++++++------- src/components/main/Main.tsx | 9 +++---- src/components/main/UrlAuthModal.tsx | 7 +++--- 5 files changed, 32 insertions(+), 34 deletions(-) diff --git a/src/components/left/settings/SettingsMain.tsx b/src/components/left/settings/SettingsMain.tsx index c1c639698..d6a519a64 100644 --- a/src/components/left/settings/SettingsMain.tsx +++ b/src/components/left/settings/SettingsMain.tsx @@ -3,9 +3,8 @@ import { getActions, withGlobal } from '../../../global'; import type { FC } from '../../../lib/teact/teact'; import { SettingsScreens } from '../../../types'; -import type { ApiUser } from '../../../api/types'; -import { selectIsPremiumPurchaseBlocked, selectUser } from '../../../global/selectors'; +import { selectIsPremiumPurchaseBlocked } from '../../../global/selectors'; import useLang from '../../../hooks/useLang'; import useHistoryBack from '../../../hooks/useHistoryBack'; @@ -22,7 +21,7 @@ type OwnProps = { type StateProps = { sessionCount: number; - currentUser?: ApiUser; + currentUserId?: string; canBuyPremium?: boolean; }; @@ -30,7 +29,7 @@ const SettingsMain: FC = ({ isActive, onScreenSelect, onReset, - currentUser, + currentUserId, sessionCount, canBuyPremium, }) => { @@ -41,13 +40,12 @@ const SettingsMain: FC = ({ } = getActions(); const lang = useLang(); - const profileId = currentUser?.id; useEffect(() => { - if (profileId) { - loadProfilePhotos({ profileId }); + if (currentUserId) { + loadProfilePhotos({ profileId: currentUserId }); } - }, [profileId, loadProfilePhotos]); + }, [currentUserId, loadProfilePhotos]); useHistoryBack({ isActive, @@ -61,16 +59,16 @@ const SettingsMain: FC = ({ return (
- {currentUser && ( + {currentUserId && ( )} - {currentUser && ( + {currentUserId && ( )} @@ -160,7 +158,7 @@ export default memo(withGlobal( return { sessionCount: global.activeSessions.orderedHashes.length, - currentUser: currentUserId ? selectUser(global, currentUserId) : undefined, + currentUserId, canBuyPremium: !selectIsPremiumPurchaseBlocked(global), }; }, diff --git a/src/components/left/settings/SettingsPrivacyPublicProfilePhoto.tsx b/src/components/left/settings/SettingsPrivacyPublicProfilePhoto.tsx index 919875e2d..ccf282afc 100644 --- a/src/components/left/settings/SettingsPrivacyPublicProfilePhoto.tsx +++ b/src/components/left/settings/SettingsPrivacyPublicProfilePhoto.tsx @@ -4,7 +4,7 @@ import React, { import { getActions } from '../../../global'; import type { FC } from '../../../lib/teact/teact'; -import type { ApiPhoto, ApiUser } from '../../../api/types'; +import type { ApiPhoto } from '../../../api/types'; import useFlag from '../../../hooks/useFlag'; import useLang from '../../../hooks/useLang'; @@ -17,13 +17,13 @@ import ConfirmDialog from '../../ui/ConfirmDialog'; import styles from './SettingsPrivacyPublicPhoto.module.scss'; type OwnProps = { - currentUser: ApiUser; + currentUserId: string; hasCurrentUserFullInfo?: boolean; currentUserFallbackPhoto?: ApiPhoto; }; const SettingsPrivacyPublicProfilePhoto: FC = ({ - currentUser, + currentUserId, hasCurrentUserFullInfo, currentUserFallbackPhoto, }) => { @@ -40,9 +40,9 @@ const SettingsPrivacyPublicProfilePhoto: FC = ({ useEffect(() => { if (!hasCurrentUserFullInfo) { - loadFullUser({ userId: currentUser.id }); + loadFullUser({ userId: currentUserId }); } - }, [hasCurrentUserFullInfo, currentUser.id, loadFullUser]); + }, [hasCurrentUserFullInfo, currentUserId, loadFullUser]); const handleSelectFile = useCallback((file: File) => { uploadProfilePhoto({ diff --git a/src/components/left/settings/SettingsPrivacyVisibility.tsx b/src/components/left/settings/SettingsPrivacyVisibility.tsx index be0a9a5d7..bd4be2266 100644 --- a/src/components/left/settings/SettingsPrivacyVisibility.tsx +++ b/src/components/left/settings/SettingsPrivacyVisibility.tsx @@ -7,7 +7,7 @@ import type { ApiPrivacySettings } from '../../../types'; import { SettingsScreens } from '../../../types'; import { getPrivacyKey } from './helpers/privacy'; -import { selectUser, selectUserFullInfo } from '../../../global/selectors'; +import { selectUserFullInfo } from '../../../global/selectors'; import useLang from '../../../hooks/useLang'; import useHistoryBack from '../../../hooks/useHistoryBack'; @@ -26,7 +26,7 @@ type StateProps = Partial & { chatsById?: Record; usersById?: Record; - currentUser: ApiUser; + currentUserId: string; hasCurrentUserFullInfo?: boolean; currentUserFallbackPhoto?: ApiPhoto; }; @@ -42,7 +42,7 @@ const SettingsPrivacyVisibility: FC = ({ blockUserIds, blockChatIds, chatsById, - currentUser, + currentUserId, hasCurrentUserFullInfo, currentUserFallbackPhoto, }) => { @@ -227,7 +227,7 @@ const SettingsPrivacyVisibility: FC = ({ {screen === SettingsScreens.PrivacyProfilePhoto && exceptionLists.shouldShowAllowed && ( @@ -241,12 +241,12 @@ export default memo(withGlobal( let privacySettings: ApiPrivacySettings | undefined; const { + currentUserId, chats: { byId: chatsById }, settings: { privacy }, } = global; - const currentUser = selectUser(global, global.currentUserId!)!; - const currentUserFullInfo = selectUserFullInfo(global, global.currentUserId!); + const currentUserFullInfo = selectUserFullInfo(global, currentUserId!); switch (screen) { case SettingsScreens.PrivacyPhoneNumber: @@ -284,7 +284,7 @@ export default memo(withGlobal( if (!privacySettings) { return { - currentUser, + currentUserId: currentUserId!, hasCurrentUserFullInfo: Boolean(currentUserFullInfo), currentUserFallbackPhoto: currentUserFullInfo?.fallbackPhoto, }; @@ -293,7 +293,7 @@ export default memo(withGlobal( return { ...privacySettings, chatsById, - currentUser, + currentUserId: currentUserId!, hasCurrentUserFullInfo: Boolean(currentUserFullInfo), currentUserFallbackPhoto: currentUserFullInfo?.fallbackPhoto, }; diff --git a/src/components/main/Main.tsx b/src/components/main/Main.tsx index 552b84b40..45166e7c6 100644 --- a/src/components/main/Main.tsx +++ b/src/components/main/Main.tsx @@ -37,6 +37,7 @@ import { selectCanAnimateInterface, selectChatFolder, } from '../../global/selectors'; +import { getUserFullName } from '../../global/helpers'; import buildClassName from '../../util/buildClassName'; import { waitForTransitionEnd } from '../../util/cssAnimationEndListeners'; import { processDeepLink } from '../../util/deeplink'; @@ -135,7 +136,7 @@ type StateProps = { attachBotToInstall?: ApiAttachBot; requestedAttachBotInChat?: TabState['requestedAttachBotInChat']; requestedDraft?: TabState['requestedDraft']; - currentUser?: ApiUser; + currentUserName?: string; urlAuth?: TabState['urlAuth']; limitReached?: ApiLimitTypeWithModal; deleteFolderDialog?: ApiChatFolder; @@ -191,7 +192,7 @@ const Main: FC = ({ requestedAttachBotInChat, requestedDraft, webApp, - currentUser, + currentUserName, urlAuth, isPremiumModalOpen, isPaymentModalOpen, @@ -516,7 +517,7 @@ const Main: FC = ({ {audioMessage && } - + ( attachBotToInstall: requestedAttachBotInstall?.bot, requestedAttachBotInChat, webApp, - currentUser, + currentUserName: getUserFullName(currentUser), urlAuth, isCurrentUserPremium: selectIsCurrentUserPremium(global), isPremiumModalOpen: premiumModal?.isOpen, diff --git a/src/components/main/UrlAuthModal.tsx b/src/components/main/UrlAuthModal.tsx index bd9061d82..201721e0b 100644 --- a/src/components/main/UrlAuthModal.tsx +++ b/src/components/main/UrlAuthModal.tsx @@ -4,7 +4,6 @@ import React, { import { getActions, getGlobal } from '../../global'; import type { FC } from '../../lib/teact/teact'; -import type { ApiUser } from '../../api/types'; import type { TabState } from '../../global/types'; import { ensureProtocol } from '../../util/ensureProtocol'; @@ -21,11 +20,11 @@ import styles from './UrlAuthModal.module.scss'; export type OwnProps = { urlAuth?: TabState['urlAuth']; - currentUser?: ApiUser; + currentUserName?: string; }; const UrlAuthModal: FC = ({ - urlAuth, currentUser, + urlAuth, currentUserName, }) => { const { closeUrlAuthModal, acceptBotUrlAuth, acceptLinkUrlAuth } = getActions(); const [isLoginChecked, setLoginChecked] = useState(true); @@ -82,7 +81,7 @@ const UrlAuthModal: FC = ({ label={( <> {renderText( - lang('Conversation.OpenBotLinkLogin', [domain, getUserFullName(currentUser)]), + lang('Conversation.OpenBotLinkLogin', [domain, currentUserName]), ['simple_markdown'], )}