<div class="b-admin-packages">

	<div class="alert" style="margin-top: 10px;" data-bind="visible: !packagesReal() && !packages.loading()"
		data-i18n="TAB_PACKAGES/ALERT_CANNOT_ACCESS_REPOSITORY"></div>

	<div class="alert" style="margin-top: 10px;" data-bind="visible: '' !== packagesError()">
		<button type="button" class="close" data-bind="click: function () { packagesError('') }">&times;</button>
		<span data-bind="text: packagesError"></span>
	</div>

	<div data-bind="visible: 0 < packagesAvailableForUpdate().length">
		<div class="legend">
			<span data-i18n="TAB_PACKAGES/LEGEND_AVAILABLE_FOR_UPDATE"></span>&nbsp;
			(<span data-bind="text: packagesAvailableForUpdate().length"></span>)
		</div>
		<div data-bind="template: { name: 'AdminSettingsPackagesTable', data: {f: packagesAvailableForUpdate} }"></div>
		<br />
	</div>

	<div data-bind="visible: 0 < packagesCurrent().length">
		<div class="legend" data-i18n="TAB_PACKAGES/LEGEND_INSTALLED_PACKAGES"></div>
		<div data-bind="template: { name: 'AdminSettingsPackagesTable', data: {f: packagesCurrent} }"></div>
		<br />
	</div>

	<div data-bind="visible: 0 < packagesAvailableForInstallation().length">
		<div class="legend" data-i18n="TAB_PACKAGES/LEGEND_AVAILABLE_FOR_INSTALLATION"></div>
		<div data-bind="template: { name: 'AdminSettingsPackagesTable', data: {f: packagesAvailableForInstallation} }"></div>
		<br />
	</div>

</div>