Page Title: Allow to disable chat title display (#2691)

src/components/left/settings/SettingsPrivacy.tsx

@@ -29,6 +29,7 @@ type StateProps = {
   canChangeSensitive?: boolean;
   canDisplayAutoarchiveSetting: boolean;
   shouldArchiveAndMuteNewNonContact?: boolean;
+  canDisplayChatInTitle?: boolean;
   privacyPhoneNumber?: ApiPrivacySettings;
   privacyLastSeen?: ApiPrivacySettings;
   privacyProfilePhoto?: ApiPrivacySettings;
@@ -50,6 +51,7 @@ const SettingsPrivacy: FC<OwnProps & StateProps> = ({
   canChangeSensitive,
   canDisplayAutoarchiveSetting,
   shouldArchiveAndMuteNewNonContact,
+  canDisplayChatInTitle,
   privacyPhoneNumber,
   privacyLastSeen,
   privacyProfilePhoto,
@@ -71,6 +73,8 @@ const SettingsPrivacy: FC<OwnProps & StateProps> = ({
     updateGlobalPrivacySettings,
     loadWebAuthorizations,
     showNotification,
+    setSettingOption,
+    updatePageTitle,
   } = getActions();
 
   useEffect(() => {
@@ -110,6 +114,13 @@ const SettingsPrivacy: FC<OwnProps & StateProps> = ({
     }
   }, [isCurrentUserPremium, lang, onScreenSelect, showNotification]);
 
+  const handleChatInTitleChange = useCallback((isChecked: boolean) => {
+    setSettingOption({
+      canDisplayChatInTitle: isChecked,
+    });
+    updatePageTitle();
+  }, []);
+
   const handleUpdateContentSettings = useCallback((isChecked: boolean) => {
     updateContentSettings(isChecked);
   }, [updateContentSettings]);
@@ -316,6 +327,17 @@ const SettingsPrivacy: FC<OwnProps & StateProps> = ({
         </div>
       )}
 
+      <div className="settings-item">
+        <h4 className="settings-item-header" dir={lang.isRtl ? 'rtl' : undefined}>
+          {lang('lng_settings_window_system')}
+        </h4>
+        <Checkbox
+          label={lang('lng_settings_title_chat_name')}
+          checked={Boolean(canDisplayChatInTitle)}
+          onCheck={handleChatInTitleChange}
+        />
+      </div>
+
       {canChangeSensitive && (
         <div className="settings-item">
           <h4 className="settings-item-header" dir={lang.isRtl ? 'rtl' : undefined}>
@@ -340,6 +362,7 @@ export default memo(withGlobal<OwnProps>(
       settings: {
         byKey: {
           hasPassword, isSensitiveEnabled, canChangeSensitive, shouldArchiveAndMuteNewNonContact,
+          canDisplayChatInTitle,
         },
         privacy,
       },
@@ -368,6 +391,7 @@ export default memo(withGlobal<OwnProps>(
       privacyGroupChats: privacy.chatInvite,
       privacyPhoneCall: privacy.phoneCall,
       privacyPhoneP2P: privacy.phoneP2P,
+      canDisplayChatInTitle,
     };
   },
 )(SettingsPrivacy));

src/global/actions/ui/misc.ts

@@ -23,7 +23,7 @@ import setPageTitle from '../../../util/updatePageTitle';
 import { updateTabState } from '../../reducers/tabs';
 import { getIsMobile, getIsTablet } from '../../../hooks/useAppLayout';
 import * as langProvider from '../../../util/langProvider';
-import { getAllowedAttachmentOptions } from '../../helpers';
+import { getAllowedAttachmentOptions, getChatTitle } from '../../helpers';
 
 export const APP_VERSION_URL = 'version.txt';
 const MAX_STORED_EMOJIS = 8 * 4; // Represents four rows of recent emojis
@@ -658,6 +658,8 @@ addActionHandler('onTabFocusChange', (global, actions, payload): ActionReturnTyp
 
 addActionHandler('updatePageTitle', (global, actions, payload): ActionReturnType => {
   const { isInactive, notificationCount, tabId = getCurrentTabId() } = payload || {};
+  const { canDisplayChatInTitle } = global.settings.byKey;
+  const currentUserId = global.currentUserId;
 
   if (isInactive) {
     setPageTitle(`${PAGE_TITLE} ${INACTIVE_MARKER}`);
@@ -670,16 +672,17 @@ addActionHandler('updatePageTitle', (global, actions, payload): ActionReturnType
   }
 
   const messageList = selectCurrentMessageList(global, tabId);
-  if (messageList) {
+  if (messageList && canDisplayChatInTitle) {
     const { chatId, threadId } = messageList;
     const currentChat = selectChat(global, chatId);
     if (currentChat) {
+      const title = getChatTitle(langProvider.translate, currentChat, undefined, chatId === currentUserId);
       if (currentChat.isForum && currentChat.topics?.[threadId]) {
-        setPageTitle(`${currentChat.title} › ${currentChat.topics[threadId].title}`);
+        setPageTitle(`${title} › ${currentChat.topics[threadId].title}`);
         return;
       }
 
-      setPageTitle(currentChat.title);
+      setPageTitle(title);
       return;
     }
   }

src/global/initialState.ts

@@ -168,6 +168,7 @@ export const INITIAL_GLOBAL_STATE: GlobalState = {
       canTranslate: false,
       canTranslateChats: true,
       doNotTranslate: [],
+      canDisplayChatInTitle: true,
     },
     themes: {
       light: {

src/types/index.ts

@@ -92,6 +92,7 @@ export interface ISettings extends NotifySettings, Record<string, any> {
   canTranslate: boolean;
   canTranslateChats: boolean;
   doNotTranslate: string[];
+  canDisplayChatInTitle: boolean;
 }
 
 export interface ApiPrivacySettings {