tooltips: Show tooltip on disabled "Add" button in group and channel settings.

Fixes: #34325.

web/src/tippyjs.ts

@@ -512,6 +512,36 @@ export function initialize(): void {
         },
     });
 
+    tippy.delegate("body", {
+        target: ".add-users-button-wrapper",
+        onShow(instance) {
+            const $wrapper = $(instance.reference);
+            const $button = $wrapper.find("button");
+            const $container = $wrapper.closest(".add-button-container").find(".pill-container");
+
+            const button_is_disabled = Boolean($button.prop("disabled"));
+            const container_is_enabled =
+                $container.find(".input").prop("contenteditable") === "true";
+
+            if (button_is_disabled && container_is_enabled) {
+                instance.setContent(
+                    $t({
+                        defaultMessage: "Enter who should be added.",
+                    }),
+                );
+                return undefined;
+            }
+
+            return false;
+        },
+        appendTo: () => document.body,
+        placement: "top",
+        delay: INSTANT_HOVER_DELAY,
+        onHidden(instance) {
+            instance.destroy();
+        },
+    });
+
     tippy.delegate("body", {
         target: ".user_row .actions button",
         trigger: "mouseenter",

web/templates/stream_settings/add_subscribers_form.hbs

@@ -6,7 +6,7 @@
         </div>
     </div>
     {{#if (not hide_add_button)}}
-        <div class="add_subscriber_button_wrapper inline-block">
+        <div class="add_subscriber_button_wrapper add-users-button-wrapper inline-block">
             {{> ../components/action_button
               label=(t "Add")
               custom_classes="add-subscriber-button add-users-button"

web/templates/user_group_settings/add_members_form.hbs

@@ -6,7 +6,7 @@
         </div>
     </div>
     {{#if (not hide_add_button)}}
-        <div class="add_member_button_wrapper inline-block">
+        <div class="add_member_button_wrapper add-users-button-wrapper inline-block">
             {{> ../components/action_button
               label=(t "Add")
               custom_classes="add-member-button add-users-button"