Support 'Rquest to join'

src/components/popups/joinChatInvite.ts

@@ -5,17 +5,18 @@
  */
 
 import PopupElement, { addCancelButton } from ".";
+import { numberThousandSplitter } from "../../helpers/number";
 import { ChatInvite, Updates } from "../../layer";
 import apiUpdatesManager from "../../lib/appManagers/apiUpdatesManager";
 import appAvatarsManager from "../../lib/appManagers/appAvatarsManager";
-import appChatsManager from "../../lib/appManagers/appChatsManager";
 import appPhotosManager from "../../lib/appManagers/appPhotosManager";
-import { i18n } from "../../lib/langPack";
+import { i18n, _i18n } from "../../lib/langPack";
 import apiManager from "../../lib/mtproto/mtprotoworker";
 import { NULL_PEER_ID } from "../../lib/mtproto/mtproto_config";
 import RichTextProcessor from "../../lib/richtextprocessor";
 import rootScope from "../../lib/rootScope";
 import AvatarElement from "../avatar";
+import { toastNew } from "../toast";
 import { wrapPhoto } from "../wrappers";
 
 // const FAKE_CHAT_ID = Number.MAX_SAFE_INTEGER - 0x1000;
@@ -23,7 +24,7 @@ import { wrapPhoto } from "../wrappers";
 export default class PopupJoinChatInvite extends PopupElement {
   constructor(hash: string, chatInvite: ChatInvite.chatInvite) {
     super('popup-join-chat-invite', addCancelButton([{
-      langKey: chatInvite.pFlags.broadcast ? 'JoinByPeekChannelTitle' : 'JoinByPeekGroupTitle',
+      langKey: chatInvite.pFlags.request_needed ? 'RequestJoin.Button' : (chatInvite.pFlags.broadcast ? 'JoinByPeekChannelTitle' : 'JoinByPeekGroupTitle'),
       callback: () => {
         apiManager.invokeApi('messages.importChatInvite', {hash})
         .then((updates) => {
@@ -31,6 +32,10 @@ export default class PopupJoinChatInvite extends PopupElement {
           const chat = (updates as Updates.updates).chats[0];
           const peerId = chat.id.toPeerId(true);
           rootScope.dispatchEvent('history_focus', {peerId});
+        }, (error) => {
+          if(error.type === 'INVITE_REQUEST_SENT') {
+            toastNew({langPackKey: 'RequestToJoinSent'});
+          }
         });
       }
     }]), {closable: true, overlayClosable: true, body: true});
@@ -74,9 +79,17 @@ export default class PopupJoinChatInvite extends PopupElement {
     //avatarElem.setAttribute('peer', '' + -fakeChat.id);
     
     const isBroadcast = chatInvite.pFlags.broadcast;
-    const peopleCount = i18n(isBroadcast ? 'Subscribers' : 'Members', [chatInvite.participants_count]);
+    const peopleCount = i18n(isBroadcast ? 'Subscribers' : 'Members', [numberThousandSplitter(chatInvite.participants_count)]);
     peopleCount.classList.add('chat-participants-count');
 
     this.body.append(avatarElem, title, peopleCount);
+
+    if(chatInvite.pFlags.request_needed) {
+      const caption = document.createElement('div');
+      _i18n(caption, isBroadcast ? 'RequestToJoinChannelDescription' : 'RequestToJoinGroupDescription');
+      caption.classList.add('chat-participants-count', 'request-caption');
+
+      this.body.append(caption);
+    }
   }
 }

src/lang.ts

@@ -634,6 +634,11 @@ const lang = {
   "PeopleNearbyHeader": "People nearby",
   "ChatsNearbyHeader": "Groups nearby",
   "ChatLocation": "Location",
+  "RequestToJoinGroupDescription": "This group accepts new members only after they are approved by its admins.",
+  "RequestToJoinChannelDescription": "This channel accepts new subscribers only after they are approved by its admins.",
+  "RequestToJoinSent": "Join request sent",
+  "RequestToJoinGroupApproved": "Your request to join the group was approved",
+  "RequestToJoinChannelApproved": "Your request to join the channel was approved",
 
   // * macos
   "AccountSettings.Filters": "Chat Folders",
@@ -722,6 +727,8 @@ const lang = {
   "Chat.Service.VoiceChatInvitation": "%1$@ invited %2$@ to the [video chat](open)",
   "Chat.Service.VoiceChatInvitationByYou": "You invited %1$@ to the [video chat](open)",
   "Chat.Service.VoiceChatInvitationForYou": "%1$@ invited you to the [video chat](open)",
+  "ChatService.UserJoinedGroupByRequest": "%@ was accepted to the group",
+  "ChatService.UserJoinedChannelByRequest": "%@ joined the channel by request",
   "ChatList.Service.VoiceChatScheduled": "%1$@ scheduled a video chat for %2$@",
   "ChatList.Service.VoiceChatScheduledYou": "You scheduled a video chat for %2$@",
   "Chat.Poll.Unvote": "Retract Vote",
@@ -945,6 +952,7 @@ const lang = {
     "other_value": "%d users"
   },
   "RecentSessions.Error.FreshReset": "For security reasons, you can't terminate older sessions from a device that you've just connected. Please use an earlier connection or wait for a few hours.",
+  "RequestJoin.Button": "Request to Join",
   "Message.Context.Select": "Select",
   "Message.Context.Pin": "Pin",
   "Message.Context.Unpin": "Unpin",

src/lib/appManagers/appMessagesManager.ts

@@ -3175,6 +3175,17 @@ export class AppMessagesManager {
           break;
         }
 
+        case 'messageActionChatJoinedByRequest': {
+          const isBroadcast = appPeersManager.isBroadcast(message.peerId);
+          if(message.pFlags.out) {
+            langPackKey = isBroadcast ? 'RequestToJoinChannelApproved' : 'RequestToJoinGroupApproved';
+          } else {
+            langPackKey = isBroadcast ? 'ChatService.UserJoinedChannelByRequest' : 'ChatService.UserJoinedGroupByRequest';
+            args = [getNameDivHTML(message.fromId, plain)];
+          }
+          break;
+        }
+
         case 'messageActionContactSignUp':
         case 'messageActionChatReturn':
         case 'messageActionChatLeave':

src/scss/partials/popups/_joinChatInvite.scss

@@ -7,6 +7,10 @@
 .popup-join-chat-invite {
   user-select: none;
 
+  .popup-container {
+    max-width: 420px;
+  }
+  
   .popup-body {
     align-items: center;
     padding: .5rem 0 1.25rem;
@@ -23,4 +27,9 @@
     font-size: .875rem;
     line-height: var(--line-height);
   }
+
+  .request-caption {
+    margin-top: 1rem;
+    text-align: center;
+  }
 }