better display max reached

Co-Authored-By: David Battersby <info@davidbattersby.com>

plugins/chat/assets/javascripts/discourse/components/chat/message-creator/add-members.gjs

@@ -4,6 +4,7 @@ import { inject as service } from "@ember/service";
 import DButton from "discourse/components/d-button";
 import { popupAjaxError } from "discourse/lib/ajax-error";
 import I18n from "discourse-i18n";
+import gte from "truth-helpers/helpers/gte";
 import MembersCount from "./members-count";
 import MembersSelector from "./members-selector";
 
@@ -57,6 +58,10 @@ export default class AddMembers extends Component {
           @onChange={{@onChangeMembers}}
           @close={{@close}}
           @cancel={{@cancel}}
+          @maxReached={{gte
+            this.membersCount
+            this.siteSettings.chat_max_direct_message_users
+          }}
         />
 
         {{#if @members.length}}

plugins/chat/assets/javascripts/discourse/components/chat/message-creator/list.gjs

@@ -3,12 +3,17 @@ import { fn } from "@ember/helper";
 import { on } from "@ember/modifier";
 import { action } from "@ember/object";
 import concatClass from "discourse/helpers/concat-class";
+import I18n from "discourse-i18n";
 import eq from "truth-helpers/helpers/eq";
 import Channel from "./channel";
 import ListAction from "./list-action";
 import User from "./user";
 
 export default class List extends Component {
+  cantAddMoreMembersLabel = I18n.t(
+    "chat.new_message_modal.cant_add_more_members"
+  );
+
   componentForItem(type) {
     switch (type) {
       case "list-action":
@@ -44,28 +49,33 @@ export default class List extends Component {
 
   <template>
     <div class="chat-message-creator__list-container">
-      <ul class="chat-message-creator__list">
-        {{#each @items as |item|}}
-          <li
-            class={{concatClass
-              "chat-message-creator__list-item"
-              (if
-                (eq item.identifier @highlightedItem.identifier) "-highlighted"
-              )
-            }}
-            {{on "click" (fn this.handleClick item)}}
-            {{on "keypress" (fn this.handleEnter item)}}
-            {{on "mouseenter" (fn @onHighlight item)}}
-            {{on "mouseleave" (fn @onHighlight null)}}
-            role="button"
-            tabindex="0"
-            data-identifier={{item.identifier}}
-            id={{item.id}}
-          >
-            {{component (this.componentForItem item.type) item=item}}
-          </li>
-        {{/each}}
-      </ul>
+      {{#if @maxReached}}
+        {{this.cantAddMoreMembersLabel}}
+      {{else}}
+        <ul class="chat-message-creator__list">
+          {{#each @items as |item|}}
+            <li
+              class={{concatClass
+                "chat-message-creator__list-item"
+                (if
+                  (eq item.identifier @highlightedItem.identifier)
+                  "-highlighted"
+                )
+              }}
+              {{on "click" (fn this.handleClick item)}}
+              {{on "keypress" (fn this.handleEnter item)}}
+              {{on "mouseenter" (fn @onHighlight item)}}
+              {{on "mouseleave" (fn @onHighlight null)}}
+              role="button"
+              tabindex="0"
+              data-identifier={{item.identifier}}
+              id={{item.id}}
+            >
+              {{component (this.componentForItem item.type) item=item}}
+            </li>
+          {{/each}}
+        </ul>
+      {{/if}}
     </div>
   </template>
 }

plugins/chat/assets/javascripts/discourse/components/chat/message-creator/members-selector.gjs

@@ -133,6 +133,7 @@ export default class MembersSelector extends Component {
         @highlightedItem={{this.highlightedChatable}}
         @onSelect={{this.selectChatable}}
         @onHighlight={{this.highlightChatable}}
+        @maxReached={{@maxReached}}
       />
 
     </ListHandler>

plugins/chat/assets/javascripts/discourse/components/chat/message-creator/new-group.gjs

@@ -6,6 +6,7 @@ import { inject as service } from "@ember/service";
 import DButton from "discourse/components/d-button";
 import { popupAjaxError } from "discourse/lib/ajax-error";
 import I18n from "discourse-i18n";
+import gte from "truth-helpers/helpers/gte";
 import MembersCount from "./members-count";
 import MembersSelector from "./members-selector";
 
@@ -66,6 +67,10 @@ export default class NewGroup extends Component {
           @onChange={{@onChangeMembers}}
           @close={{@close}}
           @cancel={{@cancel}}
+          @maxReached={{gte
+            this.membersCount
+            this.siteSettings.chat_max_direct_message_users
+          }}
         />
 
         {{#if @members.length}}

plugins/chat/config/locales/client.en.yml

@@ -341,6 +341,7 @@ en:
         participants_counter:  "%{selection_count}/%{max} participants"
         new_group_chat: "New group chat"
         filter: "Filter"
+        cant_add_more_members: "Maximum number of members reached"
 
       channel_edit_name_slug_modal:
         title: Edit channel