{% extends '/layout/admin_layout.html.twig' %}
{% import "macro/listing.html.twig" as listingMacro %}
{% import "user/macro.html.twig" as userMacro %}

{% block title %}
	{{ target.label }}
{% endblock %}

{% block content %}

	<div class="listing-container">
		<div class="listing-panel">
			<div class="listing-search">
				<form action="{{ path('app_user_index', app.request.query|merge({'target': target.value})) }}" method="get">
					<div class="input-group me-2 me-lg-3 fmxw-400">
						{% set search = app.request.query.get('search') %}
						<input type="text" name="search" class="form-control" placeholder="Search" value="{{ search }}">
						{% if search is not empty %}
							<a href="{{ path('app_user_index', {'target': target.value}) }}" class="btn btn-danger btn-sm">
								Clear
							</a>
						{% endif %}
						<button class="btn btn-primary btn-sm" type="submit">
							<svg class="icon icon-xs" x-description="Heroicon name: solid/search" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 20 20" fill="currentColor" aria-hidden="true">
								<path fill-rule="evenodd" d="M8 4a4 4 0 100 8 4 4 0 000-8zM2 8a6 6 0 1110.89 3.476l4.817 4.817a1 1 0 01-1.414 1.414l-4.816-4.816A6 6 0 012 8z" clip-rule="evenodd"></path>
							</svg>
						</button>
					</div>

				</form>
			</div>
			<div class="listing-toolbar">
				<div class="btn-toolbar">
					{% if (target.isCustomer or app.user.isSuperadmin) %}
						<a href="{{ path('app_user_new', {'target': target.value}) }}" class="btn btn-sm btn-gray-800 d-inline-flex align-items-center">
							<svg class="icon icon-xs me-2" fill="none" stroke="currentColor" viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
								<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 6v6m0 0v6m0-6h6m-6 0H6"></path>
							</svg>
							Add
							{{ target.singular }}
						</a>
						{{ listingMacro.bulkDeleteButton(path('app_user_bulk_delete'), csrf_token('delete')) }}
					{% endif %}

					<div class="btn-group ms-2 ms-lg-3">
						{{ listingMacro.filtersBtn( path('app_user_filters', app.request.query|merge({'target': target.value})) ) }}
						{{ listingMacro.exportBtn( exportTypes, 'app_user_bulk_export', app.request.query|merge({'target': target.value}) ) }}
						<a href="{{ path('app_user_actions_index', {'target': target.value}) }}" class="btn btn-sm btn-outline-gray-600">
							Actions
						</a>
						<a href="{{ path('app_auth_log_index', {'target': target.value}) }}" class="btn btn-sm btn-outline-gray-600">
							Activity
						</a>
					</div>

					<div class="ms-2 ms-lg-3">
						{% include('components/page_size_choice.html.twig') %}
					</div>
				</div>
			</div>
		</div>

		<div class="card border-0 shadow mb-3">
			<div class="card-body p-2">
				<div class="table-wrapper table-responsive">
					<table class="table table-hover">
						<thead class="thead-light">
							<tr>
								{% if (target.isCustomer or app.user.isSuperadmin) %}
									<th>{{ listingMacro.listingHeaderCheckbox() }}</th>
								{% endif %}
								<th>#</th>
								<th>{{ listingMacro.sortItem(sort, 'username') }}</th>
								<th>{{ listingMacro.sortItem(sort, 'is_enabled', 'Status') }}</th>
								<th>{{ listingMacro.sortItem(sort, 'created_at', 'Created at') }}</th>
								<th>{{ listingMacro.sortItem(sort, 'lastActivityAt', 'Last activity at') }}</th>
								{% if (target.isCustomer or app.user.isSuperadmin) %}
									<th>Actions</th>
								{% endif %}
							</tr>
						</thead>
						<tbody>
							{% for user in users %}
								<tr>
									{% if (target.isCustomer or app.user.isSuperadmin) %}
										<td>{{ listingMacro.listingCheckbox(user.id) }}</td>
									{% endif %}
									<td>{{ pagination.rowIndex(loop.index) }}</td>
									<td>
										<a href="{{ path('app_user_show', {'id': user.id}) }}" class="link-primary">
											<b>{{ user.username }}</b>
										</a>
									</td>
									<td>
										{{ userMacro.statusBadge(user) }}
									</td>
									<td>{{ user.createdAt ? user.createdAt|dtz : '-' }}</td>
									<td>{{ user.lastActivityAt ? user.lastActivityAt|dtz : '-' }}</td>
									{% if (target.isCustomer or app.user.isSuperadmin) %}
										<td>
											<a href="{{ path('app_user_show', {'id': user.id}) }}" class="ms-1">
												<svg class="icon icon-xxs" data-slot="icon" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" fill="currentColor">
													<path d="M12 15a3 3 0 1 0 0-6 3 3 0 0 0 0 6Z"/>
													<path fill-rule="evenodd" d="M1.323 11.447C2.811 6.976 7.028 3.75 12.001 3.75c4.97 0 9.185 3.223 10.675 7.69.12.362.12.752 0 1.113-1.487 4.471-5.705 7.697-10.677 7.697-4.97 0-9.186-3.223-10.675-7.69a1.762 1.762 0 0 1 0-1.113ZM17.25 12a5.25 5.25 0 1 1-10.5 0 5.25 5.25 0 0 1 10.5 0Z" clip-rule="evenodd"/>
												</svg>
											</a>
											<a href="{{ path('app_user_edit', {'id': user.id}) }}" class="ms-1">
												<svg class="icon icon-xxs" data-slot="icon" fill="currentColor" viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
													<path d="m2.695 14.762-1.262 3.155a.5.5 0 0 0 .65.65l3.155-1.262a4 4 0 0 0 1.343-.886L17.5 5.501a2.121 2.121 0 0 0-3-3L3.58 13.419a4 4 0 0 0-.885 1.343Z"></path>
												</svg>
											</a>
											{% if user.isCustomer %}
												<a href="{{ path('file_modal', {'ownerType': 'App\\Entity\\User', 'ownerId': user.id}) }}"
												  class="ms-1 {{ user.filesCount > 0 ? 'text-success' : '' }}"
												  data-bs-toggle="modal" data-bs-target="#turbo_modal" data-trb-frame="turbo_modal_frame" data-trb-modal="1">
													<svg class="icon icon-xs" fill="currentColor" viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
														<path clip-rule="evenodd" fill-rule="evenodd" d="M2 4.75C2 3.784 2.784 3 3.75 3h4.836c.464 0 .909.184 1.237.513l1.414 1.414a.25.25 0 0 0 .177.073h4.836c.966 0 1.75.784 1.75 1.75v8.5A1.75 1.75 0 0 1 16.25 17H3.75A1.75 1.75 0 0 1 2 15.25V4.75Zm8.75 4a.75.75 0 0 0-1.5 0v2.546l-.943-1.048a.75.75 0 1 0-1.114 1.004l2.25 2.5a.75.75 0 0 0 1.114 0l2.25-2.5a.75.75 0 1 0-1.114-1.004l-.943 1.048V8.75Z"></path>
													</svg>
												</a>
												<a href="{{ path('app_user_block', {'id': user.id}) }}" class="ms-1 {{ user.isBlocked ? 'text-warning' : '' }}" data-bs-toggle="modal" data-bs-target="#turbo_modal" data-trb-frame="turbo_modal_frame" data-trb-modal="1">
													<svg class="icon icon-xs" fill="currentColor" viewbox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
														<path fill-rule="evenodd" d="M13.477 14.89A6 6 0 015.11 6.524l8.367 8.368zm1.414-1.414L6.524 5.11a6 6 0 018.367 8.367zM18 10a8 8 0 11-16 0 8 8 0 0116 0z" clip-rule="evenodd"></path>
													</svg>
												</a>
											{% endif %}
											{% if not user.isSuperadmin %}
												<form class="d-inline" method="post" action="{{ path('app_user_delete', {'id': user.id}) }}" onsubmit="return confirm('Are you sure you want to delete this item?');">
													<input type="hidden" name="_token" value="{{ csrf_token('delete' ~ user.id) }}">
													<button class="btn btn-sm btn-link text-danger ms-1 p-0">
														<svg class="icon icon-xs" fill="none" stroke="currentColor" viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
															<path clip-rule="evenodd" fill-rule="evenodd" d="M8.75 1A2.75 2.75 0 0 0 6 3.75v.443c-.795.077-1.584.176-2.365.298a.75.75 0 1 0 .23 1.482l.149-.022.841 10.518A2.75 2.75 0 0 0 7.596 19h4.807a2.75 2.75 0 0 0 2.742-2.53l.841-10.52.149.023a.75.75 0 0 0 .23-1.482A41.03 41.03 0 0 0 14 4.193V3.75A2.75 2.75 0 0 0 11.25 1h-2.5ZM10 4c.84 0 1.673.025 2.5.075V3.75c0-.69-.56-1.25-1.25-1.25h-2.5c-.69 0-1.25.56-1.25 1.25v.325C8.327 4.025 9.16 4 10 4ZM8.58 7.72a.75.75 0 0 0-1.5.06l.3 7.5a.75.75 0 1 0 1.5-.06l-.3-7.5Zm4.34.06a.75.75 0 1 0-1.5-.06l-.3 7.5a.75.75 0 1 0 1.5.06l.3-7.5Z"></path>
														</svg>
													</button>
												</form>
											{% endif %}
										</td>
									{% endif %}
								</tr>
							{% else %}
								<tr>
									<td colspan="100%">no records found</td>
								</tr>
							{% endfor %}
						</tbody>
					</table>
				</div>
			</div>
			<div class="card-footer">{%- include 'components/pagination.html.twig' with { 'pagination': pagination } -%}</div>
		</div>
	</div>

	{{ listingMacro.filtersModal( path('app_user_index', {'target': target.value}), false ) }}

	<div class="modal fade" id="turbo_modal" tabindex="-1" role="dialog" aria-labelledby="blockModalLabel" aria-hidden="true">
		<turbo-frame id="turbo_modal_frame">
			<div class="modal-dialog">
				<div class="modal-content modal-body">
					<div class="d-flex justify-content-center align-items-center">
						<div class="spinner-grow spinner-grow-sm text-dark" role="status">
							<span class="visually-hidden">Loading...</span>
						</div>
						<div class="spinner-grow spinner-grow-sm text-dark" role="status">
							<span class="visually-hidden">Loading...</span>
						</div>
						<div class="spinner-grow spinner-grow-sm text-dark" role="status">
							<span class="visually-hidden">Loading...</span>
						</div>
						<div class="spinner-grow spinner-grow-sm text-dark" role="status">
							<span class="visually-hidden">Loading...</span>
						</div>
						<div class="spinner-grow spinner-grow-sm text-dark" role="status">
							<span class="visually-hidden">Loading...</span>
						</div>
					</div>
				</div>
			</div>
		</turbo-frame>
	</div>


{% endblock %}