<template name="membersList">
	{{> videoCall}}
	{{#if isGroupChat}}
	{{#with roomUsers}}
		<div class="flex-tab__header">
			<form class="search-form rc-member-list__search" role="form">
				<div class="rc-input">

					<div class="rc-input__icon">
						{{> icon block="rc-input__icon-svg" icon="magnifier"}}
					</div>
					<input type="text" class="rc-input__element js-filter" name="user-search" id="user-search" placeholder={{_ "Search_by_username"}} autocomplete="off" />

				</div>
				<label class="rc-select">
					<select id="status-type" class="rc-select__element js-type" name="status-type">
						<option value="">{{_ 'online'}}</option>
						<option value="">{{_ 'All_users'}}</option>
					</select>
					{{> icon block="rc-select__arrow" icon="arrow-down" }}
				</label>
			</form>

			{{#unless loading}}
			<div class="rc-user-info__row rc-user-info__row--separator">
				<div class="rc-member-list__counter">{{{_ "Showing_online_users" total_showing=totalShowing online=totalOnline total=total}}}</div>
			</div>
			{{/unless}}
		</div>
		<div class="flex-tab__result list-view">
				{{#if loading}}
					{{> loading}}
				{{else}}
					<ul class='list clearfix lines'>
						{{#each users}}
							<li class='rc-member-list__user'>
								{{> avatar username=user.username}}
								<div class="rc-member-list__username">
									<div class="rc-member-list__status rc-member-list__status--{{status}}"></div>
									{{ignored}} {{displayName}} {{utcOffset}}
									</div>
								{{> icon user=. block="rc-member-list__menu js-action" icon="menu" }}
							</li>
						{{/each}}
					</ul>
				{{/if}}
			{{#if hasMore}}
				<button class="rc-button rc-button--secondary show-more-users">{{_ "Show_more"}}</button>
			{{/if}}
		</div>

		{{#if canAddUser}}
			<button class="rc-button rc-button--primary js-add">{{> icon block="rc-input__icon-svg" icon="plus"}}{{_ "Invite_Users"}}</button>
		{{/if}}
		{{/with}}
	{{/if}}
	<div class="rc-user-info-container flex-nav animated{{#unless showUserInfo}} animated-hidden{{/unless}}">
		{{> userInfo (userInfoDetail)}}
	</div>
</template>
