feat: limit input of composition box to 2000 char

ts/components/conversation/composition/CompositionTextArea.tsx

@@ -12,6 +12,7 @@ import { renderEmojiQuickResultRow, searchEmojiForQuery } from './EmojiQuickResu
 import { renderUserMentionRow, styleForCompositionBoxSuggestions } from './UserMentions';
 import { HTMLDirection, useHTMLDirection } from '../../../util/i18n/rtlSupport';
 import { ConvoHub } from '../../../session/conversations';
+import { Constants } from '../../../session';
 
 const sendMessageStyle = (dir?: HTMLDirection) => {
   return {
@@ -87,7 +88,10 @@ export const CompositionTextArea = (props: Props) => {
       throw new Error('selectedConversationKey is needed');
     }
 
-    const newDraft = event.target.value ?? '';
+    const newDraft = (event.target.value ?? '').slice(
+      0,
+      Constants.CONVERSATION.MAX_MESSAGE_CHAR_COUNT
+    );
     setDraft(newDraft);
     updateDraftForConversation({ conversationKey: selectedConversationKey, draft: newDraft });
   };
@@ -121,6 +125,7 @@ export const CompositionTextArea = (props: Props) => {
       spellCheck={true}
       dir={htmlDirection}
       inputRef={textAreaRef}
+      maxLength={Constants.CONVERSATION.MAX_MESSAGE_CHAR_COUNT}
       disabled={!typingEnabled}
       rows={1}
       data-testid="message-input-text-area"

ts/session/constants.ts

@@ -77,6 +77,11 @@ export const CONVERSATION = {
   MAX_GLOBAL_UNREAD_COUNT: 99, // the global one does not look good with 4 digits (999+) so we have a smaller one for it
   /** NOTE some existing groups might not have joinedAtSeconds and we need a fallback value that is not falsy in order to poll and show up in the conversations list */
   LAST_JOINED_FALLBACK_TIMESTAMP: 1,
+  /**
+   * the maximum chars that can be typed/pasted in the composition box.
+   * Same as android.
+   */
+  MAX_MESSAGE_CHAR_COUNT: 2000,
 } as const;
 
 /**