<div class="editor-row">

	<div class="tight-form-container">
		<query-editor-loader ng-repeat="target in panel.targets" ng-class="{'tight-form-disabled': target.hide}" >
		</query-editor-loader>
	</div>

	<div style="margin: 20px 0 0 0">
		<button class="btn btn-inverse" ng-click="addDataQuery()" ng-hide="datasource.meta.mixed">
			<i class="fa fa-plus"></i>&nbsp;
			Query
		</button>

		<div class="dropdown" ng-if="datasource.meta.mixed">
			<button class="btn btn-inverse dropdown-toggle" data-toggle="dropdown">
				<i class="fa fa-plus"></i>&nbsp;
				Query &nbsp; <span class="caret"></span>
			</button>

			<ul class="dropdown-menu" role="menu">
				<li ng-repeat="datasource in datasources" role="menuitem" ng-hide="datasource.meta.builtIn">
					<a ng-click="addDataQuery(datasource);">{{datasource.name}}</a>
				</li>
			</ul>
		</div>

	</div>

	<datasource-editor-view datasource="panel.datasource" name="metric-query-options"></datasource-editor-view>
</div>

<div class="editor-row" style="margin-top: 30px">

	<div class="pull-right dropdown" style="margin-right: 10px;">
		<button class="btn btn-inverse dropdown-toggle" data-toggle="dropdown" bs-tooltip="'Datasource'">
			<i class="fa fa-database"></i>&nbsp;
			{{datasource.name}} &nbsp; <span class="caret"></span>
		</button>

		<ul class="dropdown-menu" role="menu">
			<li ng-repeat="datasource in datasources" role="menuitem">
				<a ng-click="setDatasource(datasource);">{{datasource.name}}</a>
			</li>
		</ul>
	</div>

	<div class="clearfix"></div>
</div>
