{{> add_subscribers_form hide_add_button=true}}

<div class="add-subscribers-subtitle">
    {{#tr}}
        Enter a <z-user-roles-link>user role</z-user-roles-link>,
        <z-user-groups-link>user group</z-user-groups-link>,
        or <z-channel-link>#channel</z-channel-link> to add multiple users at once.
        {{#*inline "z-user-roles-link"}}<a href="/help/user-roles" target="_blank" rel="noopener noreferrer">{{> @partial-block}}</a>{{/inline}}
        {{#*inline "z-user-groups-link"}}<a href="/help/user-groups" target="_blank" rel="noopener noreferrer">{{> @partial-block}}</a>{{/inline}}
        {{#*inline "z-channel-link"}}<a href="/help/introduction-to-channels" target="_blank" rel="noopener noreferrer">{{> @partial-block}}</a>{{/inline}}
    {{/tr}}
</div>

<div class="settings_panel_list_header">
    <div class="subscribers-heading">
        <h3 class="settings-table-title">{{t 'Subscribers preview' }}</h3>
        <div class="add-subscriber-loading-spinner"></div>
    </div>
    <div class="user_filters">
        {{> ../settings/filter_text_input placeholder=(t 'Filter') aria_label=(t 'Filter subscribers') }}
    </div>
</div>

<div class="subscriber-list-box">
    <div class="subscriber_list_container" data-simplebar data-simplebar-tab-index="-1">
        <table class="subscriber-list table table-striped">
            <thead class="table-sticky-headers">
                <tr>
                    <th class="panel_user_list" data-sort="alphabetic" data-sort-prop="full_name">{{t "Name" }}
                        <i class="table-sortable-arrow zulip-icon zulip-icon-sort-arrow-down"></i>
                    </th>
                    <th class="settings-email-column" data-sort="email">{{t "Email" }}
                        <i class="table-sortable-arrow zulip-icon zulip-icon-sort-arrow-down"></i>
                    </th>
                    <th class="action-column">{{t "Action" }}</th>
                </tr>
            </thead>
            <tbody id="create_stream_subscribers" class="subscriber_table" data-empty="{{t 'This channel has no subscribers.' }}" data-search-results-empty="{{t 'No channel subscribers match your current filter.'}}"></tbody>
        </table>
    </div>
</div>