use server-provided limits instead of hardcoded ones

src/config.js

@@ -23,7 +23,9 @@ export const RECEIVED_DELAY = 500;
 export const READ_DELAY = 1000;
 
 // The shortest allowed tag length. Matches the value on the server.
-export const MIN_TAG_LENGTH = 4;
+export const MIN_TAG_LENGTH = 2;
+// The greatest allowed tag length. Matches the value on the server.
+export const MAX_TAG_LENGTH = 96;
 // The maximum number of tags allowed. Matches the value on the server.
 export const MAX_TAG_COUNT = 16;
 
@@ -53,13 +55,12 @@ export const BROKEN_IMAGE_SIZE = 32;
 // Number of chat messages to fetch in one call.
 export const MESSAGES_PAGE = 24;
 
-// Maximum in-band (included directly into the message) attachment size which fits into
-// a message of 256K in size, assuming base64 encoding and 1024 bytes of overhead.
-// This is size of an object *before* base64 encoding is applied.
+// Default maximum in-band (included directly into the message) attachment size which fits into
+// a message of 256K in size. The actual binary size of the attachment should be smaller due to
+// base64 encoding expansion and some overhead, for instance 1024 bytes.
 // Increase this limit to a greater value in production, if desired. Also increase
 // max_message_size in the server config.
-//  MAX_INBAND_ATTACHMENT_SIZE = base64DecodedLen(max_message_size) - 1024;
-export const MAX_INBAND_ATTACHMENT_SIZE = 195584;
+export const MAX_INBAND_ATTACHMENT_SIZE = 262144;
 
 // Absolute maximum attachment size to be used with the server = 8MB. Increase to
 // something like 100MB in production.

src/views/acc-general-view.jsx

@@ -157,6 +157,7 @@ export default class AccGeneralView extends React.Component {
             title={title_tag_manager}
             activated={false}
             tags={this.state.tags}
+            tinode={this.props.tinode}
             onSubmit={this.handleTagsUpdated} />
         }</FormattedMessage>
         <div className="hr" />

src/views/info-view.jsx

@@ -697,6 +697,7 @@ class InfoView extends React.Component {
                     title={tags}
                     tags={this.state.tags}
                     activated={false}
+                    tinode={this.props.tinode}
                     onSubmit={this.handleTagsUpdated} />
                 }</FormattedMessage>
                 <div className="hr" />

src/views/messages-view.jsx

@@ -632,7 +632,11 @@ class MessagesView extends React.Component {
   // - if file is too large, upload it and send a s link.
   // - if file is small enough, just send it in-band.
   sendFileAttachment(file) {
-    if (file.size > MAX_INBAND_ATTACHMENT_SIZE) {
+    // Server-provided limit reduced for base64 encoding and overhead.
+    const maxInbandAttachmentSize = (this.props.tinode.getServerLimit('maxMessageSize',
+      MAX_INBAND_ATTACHMENT_SIZE) * 0.75 - 1024) | 0;
+
+    if (file.size > maxInbandAttachmentSize) {
       // Too large to send inband - uploading out of band and sending as a link.
       const uploader = this.props.tinode.getLargeFileHelper();
       if (!uploader) {
@@ -661,10 +665,12 @@ class MessagesView extends React.Component {
 
   // handleAttachFile method is called when [Attach file] button is clicked.
   handleAttachFile(file) {
-    if (file.size > MAX_EXTERN_ATTACHMENT_SIZE) {
+    const maxExternAttachmentSize = this.props.tinode.getServerLimit('maxFileUploadSize', MAX_EXTERN_ATTACHMENT_SIZE);
+
+    if (file.size > maxExternAttachmentSize) {
       // Too large.
       this.props.onError(this.props.intl.formatMessage({id: 'file_attachment_too_large'},
-          {size: bytesToHumanSize(file.size), limit: bytesToHumanSize(MAX_EXTERN_ATTACHMENT_SIZE)}), 'err');
+          {size: bytesToHumanSize(file.size), limit: bytesToHumanSize(maxExternAttachmentSize)}), 'err');
     } else {
       this.setState({ docPreview: {
         file: file,
@@ -682,7 +688,11 @@ class MessagesView extends React.Component {
     const height = this.state.imagePreview.height;
     const fname = this.state.imagePreview.filename;
 
-    if (blob.size > MAX_INBAND_ATTACHMENT_SIZE) {
+    // Server-provided limit reduced for base64 encoding and overhead.
+    const maxInbandAttachmentSize = (this.props.tinode.getServerLimit('maxMessageSize',
+      MAX_INBAND_ATTACHMENT_SIZE) * 0.75 - 1024) | 0;
+
+    if (blob.size > maxInbandAttachmentSize) {
       // Too large to send inband - uploading out of band and sending as a link.
       const uploader = this.props.tinode.getLargeFileHelper();
       if (!uploader) {
@@ -741,8 +751,10 @@ class MessagesView extends React.Component {
 
   // handleAttachImage method is called when [Attach image] button is clicked.
   handleAttachImage(file) {
+    const maxExternAttachmentSize = this.props.tinode.getServerLimit('maxFileUploadSize', MAX_EXTERN_ATTACHMENT_SIZE);
+
     // Get image dimensions and size, optionally scale it down.
-    imageScaled(file, MAX_IMAGE_DIM, MAX_IMAGE_DIM, MAX_EXTERN_ATTACHMENT_SIZE, false,
+    imageScaled(file, MAX_IMAGE_DIM, MAX_IMAGE_DIM, maxExternAttachmentSize, false,
       // Success
       (blob, mime, width, height, fname) => {
         this.setState({imagePreview: {

src/views/new-topic-view.jsx

@@ -100,7 +100,9 @@ class NewTopicView extends React.Component {
           </li>
         </ul>
         {this.state.tabSelected === 'grp' ?
-          <NewTopicGroup onSubmit={this.handleNewGroupSubmit} /> :
+          <NewTopicGroup
+            tinode={this.props.tinode}
+            onSubmit={this.handleNewGroupSubmit} /> :
           this.state.tabSelected === 'byid' ?
             <NewTopicById
               onSubmit={this.handleGroupByID}

src/views/sidepanel-view.jsx

@@ -218,6 +218,7 @@ class SidepanelView extends React.Component {
 
           view === 'newtpk' ?
           <NewTopicView
+            tinode={this.props.tinode}
             searchResults={this.props.searchResults}
             onInitFind={this.props.onInitFind}
             onSearchContacts={this.props.onSearchContacts}

src/widgets/new-topic-group.jsx

@@ -98,6 +98,7 @@ export default class NewTopicGroup extends React.PureComponent {
             tags={this.state.tags}
             activated={true}
             onTagsChanged={this.handleTagsChanged}
+            tinode={this.props.tinode}
             title={title} />
         }</FormattedMessage>
         <div className="dialog-buttons">

src/widgets/tag-manager.jsx

@@ -4,7 +4,7 @@ import { FormattedMessage } from 'react-intl';
 
 import ChipInput from './chip-input.jsx';
 
-import { MAX_TAG_COUNT, MIN_TAG_LENGTH } from '../config.js';
+import { MAX_TAG_COUNT, MAX_TAG_LENGTH, MIN_TAG_LENGTH } from '../config.js';
 import { arrayEqual } from '../lib/utils.js';
 
 export default class TagManager extends React.Component {
@@ -48,7 +48,9 @@ export default class TagManager extends React.Component {
   }
 
   handleAddTag(tag) {
-    if (tag.length > 0 && this.state.tags.length < MAX_TAG_COUNT) {
+    const maxTagCount = this.props.tinode.getServerLimit('maxTagCount', MAX_TAG_COUNT);
+
+    if (tag.length > 0 && this.state.tags.length < maxTagCount) {
       const tags = this.state.tags.slice(0);
       tags.push(tag);
 
@@ -84,10 +86,13 @@ export default class TagManager extends React.Component {
   }
 
   render() {
+    const minTagLength = this.props.tinode.getServerLimit('minTagLength', MIN_TAG_LENGTH);
+    const maxTagLength = this.props.tinode.getServerLimit('maxTagLength', MAX_TAG_LENGTH);
+
     let tags = [];
     if (this.state.activated) {
       this.state.tags.map((tag) => {
-        tags.push({user: tag, invalid: (tag.length < MIN_TAG_LENGTH)});
+        tags.push({user: tag, invalid: (tag.length < minTagLength || tag.length > maxTagLength)});
       });
     } else {
       this.state.tags.map((tag) => {