<topnav title="Data sources" icon="fa fa-fw fa-database" subnav="true">
	<ul class="nav">
		<li class="active" ><a href="datasources">Overview</a></li>
		<li><a href="datasources/new">Add new</a></li>
	</ul>
</topnav>

<div class="page-container">
	<div class="page">
		<h2>Data sources</h2>

		<div ng-if="datasources.length === 0">
			<em>No datasources defined</em>
		</div>

		<table class="grafana-options-table" ng-if="datasources.length > 0">
			<tr>
				<td><strong>Name</strong></td>
				<td><strong>Url</strong></td>
				<td></td>
				<td></td>
				<td></td>
			</tr>
			<tr ng-repeat="ds in datasources">
				<td style="width:1%">
					<i class="fa fa-database"></i> &nbsp;
					{{ds.name}}
				</td>
				<td style="width:90%">
					{{ds.url}}
				</td>
				<td style="width:2%" class="text-center">
					<span ng-if="ds.isDefault">
						<span class="label label-info">default</span>
					</span>
				</td>
				<td style="width: 1%">
					<a href="datasources/edit/{{ds.id}}" class="btn btn-inverse btn-mini">
						<i class="fa fa-edit"></i>
						Edit
					</a>
				</td>
				<td style="width: 1%">
					<a ng-click="remove(ds)" class="btn btn-danger btn-mini">
						<i class="fa fa-remove"></i>
					</a>
				</td>
			</tr>
		</table>

	</div>
</div>
