{% if banner %}
	<div class="text-center">{{ banner }}</div>
	<br/>
{% endif %}
{% if extensions %}
	<fieldset id="recommended">
		<legend>{{ text_recommended }}</legend>
		<div class="table-responsive">
			<table class="table table-bordered table-hover">
				<thead>
					<tr>
						<td class="text-start">{{ column_name }}</td>
						<td class="text-end">{{ column_action }}</td>
					</tr>
				</thead>
				<tbody>
					{% for extension in extensions %}
						<tr>
							<td class="text-start"><a href="{{ extension.href }}">{{ extension.name }}</a></td>
							<td class="text-end">
								<div class="dropdown">
									<div class="btn-group">
										<button type="button" value="{{ extension.download }}" data-bs-toggle="tooltip" title="{{ button_download }}" class="btn btn-primary"{% if not extension.download %} disabled{% endif %}><i class="fa-solid fa-download"></i></button>
										<button type="button" data-bs-toggle="dropdown" class="btn btn-outline-dark dropdown-toggle dropdown-toggle-split"><i class="fa-solid fa-caret-down"></i></button>
										<div class="dropdown-menu dropdown-menu-end">
											<a href="{{ extension.install }}" class="dropdown-item{% if not extension.install %} disabled{% endif %}"><i class="fa-solid fa-plus-circle fa-fw"></i> {{ text_install }}</a> <a href="{{ extension.delete }}" class="dropdown-item{% if not extension.delete %} disabled{% endif %}"><i class="fa-regular fa-trash-can fa-fw"></i> {{ text_delete }}</a>
										</div>
									</div>
								</div>
							</td>
						</tr>
					{% endfor %}
				</tbody>
			</table>
		</div>
	</fieldset>
{% endif %}