<template name="adminEmoji">
	<section class="page-container page-list">
		<header class="fixed-title">
			{{> burger}}
			<h2>
				<span class="room-title">{{_ "Custom_Emoji"}}</span>
			</h2>
		</header>
		<div class="content">
			{{#unless hasPermission 'manage-emoji'}}
				<p>{{_ "You_are_not_authorized_to_view_this_page"}}</p>
			{{else}}
				<form class="search-form" role="form">
					<div class="input-line search">
						<input type="text" id="emoji-filter" placeholder="{{_ "Search"}}" dir="auto">
						<i class="icon-search"></i>
						{{#unless isReady}}<i class="icon-spin"></i>{{/unless}}
					</div>
				</form>
				<div class="results">
					{{{_ "Showing_results" customemoji.length}}}
				</div>
				<div class="list">
					<table>
						<thead>
							<tr>
								<th>&nbsp;</th>
								<th width="51%">{{_ "Name"}}</th>
								<th width="49%">{{_ "Aliases"}}</th>
							</tr>
						</thead>
						<tbody>
							{{#each customemoji}}
							<tr class="emoji-info row-link">
								<td>
									<div class="emojiAdminPreview-image">
										{{> emojiPreview name=name extension=extension}}
									</div>
								</td>
								<td>{{name}}</td>
								<td>{{aliases}}</td>
							</tr>
							{{/each}}
						</tbody>
					</table>
					{{#if hasMore}}
						<button class="button secondary load-more {{isLoading}}">{{_ "Load_more"}}</button>
					{{/if}}
				</div>
			{{/unless}}
		</div>
	</section>
	<section class="flex-tab">
		{{> Template.dynamic template=flexTemplate data=flexData}}
	</section>
</template>
