<div class="external-notification-view-element">
  <div class="side-controls">
    <div class="dropdown" style="display: inline-block">
      <button class="btn btn-default dropdown-toggle" data-toggle="dropdown">
        <i class="fa fa-cog"></i>
        <b class="caret"></b>
      </button>
      <ul class="dropdown-menu dropdown-menu-right pull-right">
        <li ng-if="methodInfo.id == 'webhook'">
          <a href="http://docs.quay.io/guides/notifications.html#webhook_{{ eventInfo.id }}"
             ng-safenewtab>
            <i class="fa fa-book"></i>
            Webhook Documentation</a>
        </li>
        <li class="divider" ng-if="methodInfo.id == 'webhook'"></li>
        <li><a ng-click="testNotification()">
            <i class="fa fa-send"></i>
            Issue Test Notification</a>
        </li>
        <li><a ng-click="deleteNotification()">
            <i class="fa fa-times"></i>
            Delete</a>
        </li>
      </ul>
    </div>
  </div>

  <div class="view-row">
    <span class="flow-text">On</span>
    <span class="notification-event">
      <i class="fa fa-lg" ng-class="eventInfo.icon"></i>
      {{ eventInfo.title }}
    </span>
  </div>

  <div class="view-row">
    <span class="flow-text">Issue A</span>
    <span class="notification-method">
      <i class="fa fa-lg" ng-class="methodInfo.icon"></i>
      {{ methodInfo.title }}
    </span>
  </div>

  <div class="view-row">
    <span ng-switch on="methodInfo.id">
      <span ng-switch-when="email">
        <span class="flow-text">To</span>
        <code>{{ config.email }}</code>
      </span>

      <span ng-switch-when="webhook">
        <span class="flow-text">To</span>
        <code>{{ config.url }}</code>
      </span>

      <span ng-switch-when="quay_notification">
        <span class="flow-text">To</span>
        <span class="entity-reference" entity="config.target" namespace="repository.namespace"></span>
      </span>
    </span>
  </div>
</div>