<template name="userEdit">
	{{#unless canEditOrAdd}}
		<p class="secondary-font-color">{{_ "You_are_not_authorized_to_view_this_page"}}</p>
	{{else}}
	<form class="" action="index.html" method="post" autocomplete="off">
		<div class="rc-input rc-form-group rc-form-group--small">
			<label class="rc-input__label">
				<div class="rc-input__title">{{_ "Name"}}</div>
				<div class="rc-input__wrapper">
					<input name="name" type="text" class="rc-input__element rc-input__element--small" id="name" autocomplete="off" value="{{user.name}}"/>
				</div>
			</label>
		</div>
		<div class="rc-input rc-form-group rc-form-group--small">
			<label class="rc-input__label">
				<div class="rc-input__title">{{_ "Username"}}</div>
				<div class="rc-input__wrapper">
					<div class="rc-input__icon">
						{{> icon icon='at' }}
					</div>
					<input name="name" type="text" class="rc-input__element rc-input__element--small" id="username" autocomplete="off" value="{{user.username}}"/>
				</div>
			</label>
		</div>
		<div class="rc-form-group rc-form-group--small">
			<div class="rc-input">
				<label class="rc-input__label">
					<div class="rc-input__title">{{_ "Email"}}</div>
					<div class="rc-input__wrapper">
						<div class="rc-input__icon">
							{{> icon icon='mail' }}
						</div>
						<input name="name" type="text" class="rc-input__element rc-input__element--small" id="email" autocomplete="off" value="{{user.emails.[0].address}}"/>
					</div>
				</label>
			</div>
			<div class="rc-switch">
				<label class="rc-switch__label" tabindex="-1">
					<input type="checkbox" class="rc-switch__input" name="type" id="verified" value="1" checked="{{user.emails.[0].verified}}"/>
					<span class="rc-switch__button">
						<span class="rc-switch__button-inside"></span>
					</span>
					<span class="rc-switch__text">
						{{_ "Verified"}}
					</span>
				</label>
			</div>
		</div>


		{{#if hasPermission 'edit-other-user-password'}}
		<div class="rc-form-group rc-form-group--small rc-form-group--inline">
			<div class="rc-input rc-form-item-inline">
				<label class="rc-input__label">
					<div class="rc-input__title">{{_ "Password"}}</div>
					<div class="rc-input__wrapper">
						<div class="rc-input__icon">
							{{> icon icon='key' }}
						</div>
						<input name="password" class="rc-input__element rc-input__element--small" type="password" id="password" autocomplete="off" value=""/>
					</div>
				</label>
			</div>
			<button id="randomPassword" class="rc-button rc-button--primary rc-form-item-inline">{{_ 'Random'}}</button>
		</div>
		<div class="rc-form-group rc-form-group--small rc-switch">
			<label class="rc-switch__label" tabindex="-1">
				<input class="rc-switch__input" type="checkbox" id="changePassword" value="1" checked="{{requirePasswordChange}}"/>
				<span class="rc-switch__button">
					<span class="rc-switch__button-inside"></span>
				</span>
				<span class="rc-switch__text">
					{{_ "Require_password_change"}}
				</span>
			</label>
		</div>
		{{/if}}

		<label for="roles">{{_ "Roles"}}</label>
		<div class="rc-form-group rc-form-group--small">
			<ul id="roles" class="chip-container current-user-roles">
				{{#each userRoles}}
				<li class="remove-role" title="{{this}}"><i class="icon icon-cancel-circled"></i>{{this}}</li>
				{{/each}}
			</ul>
		</div>

		<label for="roleSelect">{{_ "Add_Role"}}</label>
		<div class="rc-form-group rc-form-group--small rc-form-group--inline">
			{{#let roles=role}}
			<select id="roleSelect" class="rc-input rc-form-item-inline rc-input--small" {{disabled role}}>
				<option value="placeholder" disabled selected>{{_ "Select_role"}}</option>
				{{#each roles}}
				<option value="{{_id}}">{{name}}</option>
				{{/each}}
			</select>
			{{/let}}
			<button id="addRole" class="rc-button rc-button--primary rc-form-item-inline" {{disabled role}}>{{_ 'Add_Role'}}</button>
		</div>
		{{#unless user}}
		<div class="input-line">
			<label for="joinDefaultChannels">
				<input type="checkbox" id="joinDefaultChannels" value="1" checked="true">
				{{_ "Join_default_channels"}}
			</label>
		</div>
		<div class="input-line">
			<label for="sendWelcomeEmail">
				<input type="checkbox" id="sendWelcomeEmail" value="1" checked="true">
				{{_ "Send_welcome_email"}}
			</label>
		</div>
		{{/unless}}
		<div class="rc-user-info__flex rc-user-info__row">
			<button class='rc-button rc-button--cancel cancel' type="button"><span>{{_ "Cancel"}}</span></button>
			<button class='rc-button rc-button--primary save'><span>{{_ "Save"}}</span></button>
		</div>
	</form>
	{{/unless}}
</template>
