{namespace neos=Neos\Neos\ViewHelpers}
<f:layout name="BackendSubModule" />

<f:section name="content">
	<div class="neos-row-fluid">
		<f:form action="index">
			<div class="neos-search-bar">
				<f:spaceless>
					<button class="neos-button"><i class="fas fa-search"></i></button>
					<f:form.textfield type="search" name="searchTerm" placeholder="{neos:backend.translate(id: 'search', package: 'Neos.Neos')}" value="{searchTerm}" autofocus="autofocus" />
					<f:link.action action="index" class="neos-button"><i class="fas fa-times"></i></f:link.action>
				</f:spaceless>
			</div>
		</f:form>

		<br><br>

		<f:if condition="{searchTerm} && !{users}">
			<p><neos:backend.translate id="noMatchesFound"/></p>
		</f:if>

		<f:if condition="{users}">
			<f:widget.paginate objects="{users}" as="paginatedUsers">
			<table class="neos-table">
					<thead>
						<tr>
							<th><neos:backend.translate id="users.name" source="Modules" package="Neos.Neos"/></th>
							<th><neos:backend.translate id="users.accountsAndRoles" source="Modules" package="Neos.Neos"/></th>
							<th>&nbsp;</th>
						</tr>
					</thead>
					<f:for each="{paginatedUsers}" key="index" as="user">
						<tr>
							<td>{user.name.fullName}</td>
							<td>
								<f:for each="{user.accounts}" as="account">
									<i class="fas fa-user icon-white"></i>{account.accountIdentifier} <f:render partial="Module/Shared/Roles" arguments="{roles: account.roles}" />
								</f:for>
							</td>
							<td class="neos-action">
								<div class="neos-pull-right">
									<f:link.action action="show" arguments="{user: user}" class="neos-button neos-button-primary" title="{neos:backend.translate(id: 'users.tooltip.view', source: 'Modules', package: 'Neos.Neos')}" additionalAttributes="{data-neos-toggle: 'tooltip'}">
										<i class="fas fa-info-circle icon-white"></i>
									</f:link.action>

									<f:if condition="{neos:backend.isAllowedToEditUser(user: user)}">
										<f:then>
											<f:link.action action="edit" arguments="{user: user}" class="neos-button neos-button-primary" title="{neos:backend.translate(id: 'users.tooltip.edit', source: 'Modules', package: 'Neos.Neos')}" additionalAttributes="{data-neos-toggle: 'tooltip'}">
												<i class="fas fa-pencil-alt icon-white"></i>
											</f:link.action>
										</f:then>
										<f:else>
											<button class="neos-button neos-button-primary neos-disabled" title="{neos:backend.translate(id: 'users.tooltip.editDisallowed', source: 'Modules', package: 'Neos.Neos')}" data-neos-toggle="tooltip">
												<i class="fas fa-pencil-alt icon-white"></i>
											</button>
										</f:else>
									</f:if>

									<f:if condition="{currentUser} === {user} || !{neos:backend.isAllowedToEditUser(user: user)}">
										<f:then>
											<f:if condition="{neos:backend.isAllowedToEditUser(user: user)}">
												<f:then>
													<button class="neos-button neos-button-danger neos-disabled" title="{neos:backend.translate(id: 'users.tooltip.cannotDeleteYourself', source: 'Modules', package: 'Neos.Neos')}" data-neos-toggle="tooltip"><i class="fas fa-trash-alt icon-white"></i></button>
												</f:then>
												<f:else>
													<button class="neos-button neos-button-danger neos-disabled" title="{neos:backend.translate(id: 'users.tooltip.deleteDisallowed', source: 'Modules', package: 'Neos.Neos')}" data-neos-toggle="tooltip"><i class="fas fa-trash-alt icon-white"></i></button>
												</f:else>
											</f:if>
										</f:then>
										<f:else>
											<button class="neos-button neos-button-danger" title="{neos:backend.translate(id: 'users.tooltip.delete', source: 'Modules', package: 'Neos.Neos')}" data-toggle="modal" href="#user-{index}" data-neos-toggle="tooltip">
												<i class="fas fa-trash-alt icon-white"></i>
											</button>
											<div class="neos-hide" id="user-{index}">
												<div class="neos-modal-centered">
													<div class="neos-modal-content">
														<div class="neos-modal-header">
															<button type="button" class="neos-close neos-button" data-dismiss="modal"></button>
															<div class="neos-header">
																<neos:backend.translate id="users.message.reallyDelete" arguments="{0:user.name}" source="Modules" package="Neos.Neos"/>
															</div>
															<div>
																<div class="neos-subheader">
																	<p>
																		<neos:backend.translate id="users.message.willBeDeleted" source="Modules" package="Neos.Neos"/><br/>
																		<neos:backend.translate id="operationCannotBeUndone" package="Neos.Neos"/>
																	</p>
																</div>
															</div>
														</div>
														<div class="neos-modal-footer">
															<a href="#" class="neos-button" data-dismiss="modal">{neos:backend.translate(id: 'cancel', value: 'Cancel')}</a>
															<f:form action="delete" arguments="{user: user}" class="neos-inline">
																<button type="submit" class="neos-button neos-button-danger" title="{neos:backend.translate(id: 'users.tooltip.delete', source: 'Modules', package: 'Neos.Neos')}">
																	<neos:backend.translate id="users.message.confirmDelete" source="Modules" package="Neos.Neos"/>
																</button>
															</f:form>
														</div>
													</div>
												</div>
												<div class="neos-modal-backdrop neos-in"></div>
											</div>
										</f:else>
									</f:if>
								</div>
							</td>
						</tr>
					</f:for>
				</table>
			</f:widget.paginate>
		</f:if>
	</div>
	<div class="neos-footer">
		<f:link.action action="new" class="neos-button neos-button-primary" title="{neos:backend.translate(id: 'users.actions.new.label', source: 'Modules', package: 'Neos.Neos')}"><neos:backend.translate id="users.actions.new.label" source="Modules" package="Neos.Neos"/></f:link.action>
	</div>
</f:section>