setting(stream): Support user group pills when typeahead is unused.

This extra commit adds support for creating user group pills
in cases that do not use typeahead like, pasting the group
name, copying it from the user group pill.

This completes the remaining work required to support
addition of all members of a user groups to stream.

Fixes #15186.

frontend_tests/node_tests/user_group_pill.js

@@ -0,0 +1,54 @@
+"use strict";
+
+const {strict: assert} = require("assert");
+
+const {zrequire} = require("../zjsunit/namespace");
+const {run_test} = require("../zjsunit/test");
+
+const user_groups = zrequire("user_groups");
+const user_group_pill = zrequire("user_group_pill");
+
+const admins = {
+    name: "Admins",
+    description: "foo",
+    id: 1,
+    members: [10, 20],
+};
+const testers = {
+    name: "Testers",
+    description: "bar",
+    id: 2,
+    members: [20, 30, 40],
+};
+
+const admins_pill = {
+    id: admins.id,
+    group_name: admins.name,
+    display_value: admins.name + ": " + admins.members.length + " users",
+};
+const testers_pill = {
+    id: testers.id,
+    group_name: testers.name,
+    display_value: testers.name + ": " + testers.members.length + " users",
+};
+
+const groups = [admins, testers];
+for (const group of groups) {
+    user_groups.add(group);
+}
+
+run_test("create_item", () => {
+    function test_create_item(group_name, current_items, expected_item) {
+        const item = user_group_pill.create_item_from_group_name(group_name, current_items);
+        assert.deepEqual(item, expected_item);
+    }
+
+    test_create_item(" admins ", [], admins_pill);
+    test_create_item("admins", [testers_pill], admins_pill);
+    test_create_item("admins", [admins_pill], undefined);
+    test_create_item("unknown", [], undefined);
+});
+
+run_test("get_stream_id", () => {
+    assert.equal(user_group_pill.get_group_name_from_item(admins_pill), admins.name);
+});

static/js/stream_edit.js

@@ -322,19 +322,33 @@ export function sort_but_pin_current_user_on_top(users) {
 }
 
 export function create_item_from_text(text, current_items) {
-    const item = stream_pill.create_item_from_stream_name(text, current_items);
+    const funcs = [
+        stream_pill.create_item_from_stream_name,
+        user_group_pill.create_item_from_group_name,
+        user_pill.create_item_from_email,
+    ];
+    for (const func of funcs) {
+        const item = func(text, current_items);
         if (item) {
             return item;
         }
-    return user_pill.create_item_from_email(text, current_items);
+    }
+    return undefined;
 }
 
 export function get_text_from_item(item) {
-    const text = stream_pill.get_stream_name_from_item(item);
+    const funcs = [
+        stream_pill.get_stream_name_from_item,
+        user_group_pill.get_group_name_from_item,
+        user_pill.get_email_from_item,
+    ];
+    for (const func of funcs) {
+        const text = func(item);
         if (text) {
             return text;
         }
-    return user_pill.get_email_from_item(item);
+    }
+    return undefined;
 }
 
 function show_subscription_settings(sub) {

static/js/user_group_pill.js

@@ -1,5 +1,34 @@
 import * as user_groups from "./user_groups";
 
+function display_pill(group) {
+    return group.name + ": " + group.members.size + " users";
+}
+
+export function create_item_from_group_name(group_name, current_items) {
+    group_name = group_name.trim();
+    const group = user_groups.get_user_group_from_name(group_name);
+    if (!group) {
+        return undefined;
+    }
+
+    const in_current_items = current_items.find((item) => item.id === group.id);
+    if (in_current_items !== undefined) {
+        return undefined;
+    }
+
+    const item = {
+        display_value: display_pill(group),
+        id: group.id,
+        group_name: group.name,
+    };
+
+    return item;
+}
+
+export function get_group_name_from_item(item) {
+    return item.group_name;
+}
+
 function get_user_ids_from_user_groups(items) {
     let user_ids = [];
     const group_ids = items.map((item) => item.id).filter(Boolean);
@@ -22,7 +51,7 @@ export function get_user_ids(pill_widget) {
 export function append_user_group(group, pill_widget) {
     if (group !== undefined && group !== null) {
         pill_widget.appendValidatedData({
-            display_value: group.name + ": " + group.members.size + " users",
+            display_value: display_pill(group),
             id: group.id,
         });
         pill_widget.clear_text();