<div class="repo-panel-settings-element">
  <h3 class="tab-header">Repository Settings</h3>

    <!-- User/Team Permissions -->
    <div class="co-panel" id="repoPermissions">
      <div class="co-panel-heading"><i class="fa fa-key"></i> User and Robot Permissions</div>
      <div class="panel-body" style="padding-top: 5px;">
        <div class="repository-permissions-table" repository="repository"
             is-enabled="isEnabled"></div>
      </div>
    </div>

    <!-- Access Tokens (DEPRECATED) -->
    <div class="co-panel" ng-show="hasTokens">
      <div class="co-panel-heading"><i class="fa fa-key"></i> Access Token Permissions</div>
      <div class="panel-body" style="padding-top: 5px;">
        <div class="repository-tokens-table" repository="repository" has-tokens="hasTokens" is-enabled="isEnabled"></div>
      </div>
    </div>

    <!-- Events and Notifications -->
    <div class="repository-events-table" repository="repository"
         is-enabled="isEnabled"></div>

    <!-- Visibility settings -->
    <div class="co-panel">
      <div class="co-panel-heading"><i class="fa fa-unlock-alt"></i> Repository Visibility</div>
      <div class="cor-loader" ng-show="!repository"></div>
      <div ng-show="repository">
        <!-- Public/Private -->
        <div class="panel-body panel-section lock-section" ng-if="!repository.is_public">
          <i class="fa fa-lock lock-icon"></i>
          <div>This repository is currently <b>private</b>. Only users on the permissions list may view and interact with it.</div>

          <button class="btn btn-default" ng-click="askChangeAccess('public')">
            <i class="fa fa-unlock"></i>Make Public
          </button>
        </div>

        <div class="panel-body panel-section lock-section" ng-if="repository.is_public">
          <i class="fa fa-unlock lock-icon"></i>

          <div>This repository is currently <b>public</b> and is visible to all users, and may be pulled by all users.</div>

          <button class="btn btn-default" ng-click="askChangeAccess('private')" ng-show="!planRequired">
            <i class="fa fa-lock"></i>Make Private
          </button>

          <!-- Payment -->
          <div class="repo-count-checker" namespace="repository.namespace" plan-required="planRequired"
               is-enabled="repository.is_public">
          </div>
        </div>
      </div>
    </div>

    <!-- Delete repository -->
    <div class="co-panel">
      <div class="co-panel-heading"><i class="fa fa-trash"></i> Delete Repository</div>
      <div class="cor-loader" ng-show="!repository"></div>
      <div ng-show="repository">
        <div class="panel-body panel-section">
          <div class="co-alert co-alert-danger">
            <button class="btn btn-danger delete-btn" ng-click="askDelete()">
              <i class="fa fa-trash"></i>
              Delete Repository
            </button>

            Deleting a repository <b>cannot be undone</b>. Here be dragons!
          </div>
        </div>
      </div>
    </div>


    <!-- Build Status Badge -->
    <div class="co-panel hidden-xs">
      <div class="co-panel-heading"><i class="fa fa-tasks"></i> Build Status Badge</div>
      <div class="cor-loader" ng-show="!repository"></div>
      <div ng-show="repository">
        <div class="panel-body panel-section">
          <!-- Token Info Banner -->
          <div class="co-alert co-alert-info" ng-if="!repository.is_public">
             Note: This badge contains a token so the badge can be seen by external users. The token does not grant any other access and is safe to share!
          </div>

          <!-- Status Image -->
          <a ng-href="/repository/{{ repository.namespace }}/{{ repository.name }}">
            <img ng-src="/repository/{{ repository.namespace }}/{{ repository.name }}/status?token={{ repository.status_token }}"
                 data-title="Container Repository on Quay">
          </a>

          <!-- Embed formats -->
          <table style="margin-top: 20px; width: 600px;">
            <thead>
              <th style="width: 150px"></th>
              <th></th>
            </thead>
            <tr>
              <td>Image (SVG):</td>
              <td>
                <div class="copy-box" hovering-message="true" value="getBadgeFormat('svg', repository)"></div>
              </td>
            </tr>
            <tr>
              <td>Markdown:</td>
              <td>
                <div class="copy-box" hovering-message="true" value="getBadgeFormat('md', repository)"></div>
              </td>
            </tr>
            <tr>
              <td>AsciiDoc:</td>
              <td>
                <div class="copy-box" hovering-message="true" value="getBadgeFormat('asciidoc', repository)"></div>
              </td>
            </tr>
          </table>
        </div>
      </div>
    </div>

    <!-- Delete Repository Dialog -->
    <div class="cor-confirm-dialog"
       dialog-context="deleteRepoInfo"
       dialog-action="deleteRepo(info, callback)"
       dialog-title="Delete Repository"
       dialog-action-title="Delete Repository">
     <div class="co-alert co-alert-danger" style="margin-bottom: 10px;">
       This action cannot be undone!
     </div>

     Continue with deletion of this repository?
  </div>
</div>