<div class="form-group">
    <label class="control-label col-sm-2">
        Destinations
    </label>
    <div class="col-sm-10">
        <div class="input-group">
            <input type="text" ng-model="certificate.selectedDestination" placeholder="AWS..."
                   uib-typeahead="destination.label for destination in destinationService.findDestinationsByName($viewValue)" typeahead-loading="loadingDestinations"
                   class="form-control input-md" typeahead-on-select="certificate.attachDestination($item)"
                   uib-tooltip="Lemur can upload certificates to any pre-defined destination"
                   uib-tooltip-trigger="focus" uib-tooltip-placement="top"
                   typeahead-wait-ms="500">
          <span class="input-group-btn">
            <button ng-model="destinations.show" class="btn btn-md btn-default" uib-btn-checkbox btn-checkbox-true="1" btn-checkbox-false="0">
                <span class="badge">{{ certificate.destinations.length || 0 }}</span>
            </button>
          </span>
        </div>
        <table class="table">
            <tr ng-repeat="destination in certificate.destinations track by $index">
                <td><a class="btn btn-sm btn-info" href="#/destinations/{{ destination.id }}/certificates">{{ destination.label }}</a></td>
                <td><span class="text-muted">{{ destination.description }}</span></td>
                <td>
                    <button type="button" ng-click="certificate.removeDestination($index)" confirm-click="Proceed to delete certificate resources in {{ destination.label }}?" class="btn btn-danger btn-sm pull-right">Remove</button>
                </td>
            </tr>
        </table>
    </div>
</div>
