Change interaction UI for adding users when creating streams

[timabbott]

Problem statement:

During onboarding or when creating a new channel, admin tries to add users to a new channel through the pills typeahead. But sometimes, they may click the create button without clicking the add button and assume that the people that they selected through the typeahead were already added. This leads to confusion in the future, when it turns out that those users weren't added.

Concepts:

• Input pills are the source of truth on which users are to be added.
• Subscriber list is a preview of this input, that will show them what it might look like once the channel has been created.

Expected behaviour:

Typeahead behaviour

• We will not explode pills once the user selects a group or channel from the typeahead.
• All individual users after selecting a group from the typeahead will be added to the subscriber list below along with a remove button in their respective row.
• The current behaviour is that if a group consisting of Iago and Aaron is added to the input box, we will still display Iago as an option. This behaviour will not change.

Clicking on the remove button:

• Clicking on the remove button will have no effect on the pills.
• If Iago was added individually through a pill, and the admin clicks on remove in the subscriber list. A strikethrough will appear through the row. We will also toggle the remove button to the Add button. The input pill will remain unchanged. Discussion on how to display the strike through is in a different message.
• If Aaron was added to the subscriber list via a group. A strikethrough will appear through the row. We will also toggle the remove button to the Add button. The input pill will remain unchanged. We will strike out both pill text and email text. See Option 2.png
• Even if Remove button has been clicked for all the users from the above group addition, we will not remove the pill.
• Once the user clicks on Create button to create the channel, all the strikethrough-ed users will not be part of the user id array being sent to create the channel.

Pills behaviour:

• Adding a pill will add a row to the subscriber list or multiple rows if it's a group or channel.
• Removing a pill will disappear its row(s) from the subscriber list, without any strikethroughs or intermediate states.
• There will no more add button for the input box, selecting a pill in the typeahead will auto add it.

General:

• All the state of the actions above will be preserved if the user goes back and forth between naming the channel and adding the subscribers as it does right now.
• Clicking on cancel will get rid of the state.
• Add all users behaviour will remain unchanged

CZO thread

[zulipbot]

Hello @zulip/server-onboarding, @zulip/server-streams members, this issue was labeled with the "area: onboarding", "area: stream settings" labels, so you may want to check it out!

[alya]

The current plan is to sequence this after the part that's still in #29403.

[shubham-padia]

Asked some clarifying questions here: CZO thread