quay/static/partials/repo-view.html

<div class="resource-view repository-view"
     resource="repositoryResource"
     error-message="'Repository not found'">
  <div class="page-content">
    <!-- New Public Repo Page experiment -->
    <div ng-if="newRepoExperiment" class="main-panel">
      <!-- Test React Component -->
      <div>
        <div>
          <div>This is using the generic react-component directive</div>
          <react-component name="test-component" props="reactProps"/>
        </div>
        <div>
          <div>This is creating a specific directive corresponding to a react component</div>
          <test-component first-prop="reactProps.firstProp" second-prop="reactProps.secondProp"/>
        </div>
      </div>
    </div>
    <!-- Old Repo Page -->
    <div ng-if="!newRepoExperiment">
      <div class="cor-title">
        <span class="cor-title-link">
          <a class="back-link" href="/repository">
            Repositories
          </a>
        </span>
        <span class="cor-title-content">
          <span class="repo-circle no-background hidden-xs" repo="viewScope.repository"></span>
          {{ namespace }} / {{ name }}
          <span class="repo-star hidden-xs" repository="viewScope.repository" ng-if="!user.anonymous"></span>
        </span>
      </div>

      <div class="cor-tab-panel">
        <div class="cor-tabs">
          <span class="cor-tab" tab-active="true" tab-title="Information" tab-target="#info"
                tab-init="showInfo()">
            <i class="fa fa-info-circle"></i>
          </span>

          <span class="cor-tab" tab-title="Tags" tab-target="#tags" id="tagsTab"
                tab-init="showTags()">
            <i class="fa fa-tags"></i>
          </span>

          <span class="cor-tab" tab-title="Builds" tab-target="#builds" id="buildsTab"
                tab-init="showBuilds()"
                quay-show="viewScope.repository.can_write && Features.BUILD_SUPPORT">
            <i class="fa fa-tasks"></i>
          </span>

          <span class="cor-tab" tab-title="Visualize" tab-target="#changes"
                tab-shown="handleChangesState(true)"
                tab-hidden="handleChangesState(false)">
            <i class="fa fa-code-fork"></i>
          </span>

          <!-- Admin Only Tabs -->
          <span class="cor-tab" tab-title="Usage Logs" tab-target="#logs" tab-init="showLogs()"
                ng-show="viewScope.repository.can_admin">
            <i class="fa fa-bar-chart"></i>
          </span>

          <span class="cor-tab" tab-title="Settings" tab-target="#settings" id="settingsTab"
                tab-init="showSettings()"
                ng-show="viewScope.repository.can_admin">
            <i class="fa fa-gear"></i>
          </span>
        </div> <!-- /cor-tabs -->

        <div class="cor-tab-content">
          <!-- Information -->
          <div id="info" class="tab-pane active">
            <div class="repo-panel-info"
                 repository="viewScope.repository"
                 builds="viewScope.builds"
                 is-enabled="infoShown"></div>
          </div>

          <!-- Tags -->
          <div id="tags" class="tab-pane">
            <div class="repo-panel-tags"
                 repository="viewScope.repository"
                 image-loader="viewScope.imageLoader"
                 selected-tags="viewScope.selectedTags"
                 is-enabled="tagsShown"></div>
          </div>

          <!-- Builds -->
          <div id="builds" class="tab-pane">
            <div class="repo-panel-builds"
                 repository="viewScope.repository"
                 builds="viewScope.builds"
                 is-enabled="buildsShown"></div>
          </div>

          <!-- Changes -->
          <div id="changes" class="tab-pane">
            <div class="repo-panel-changes"
                 repository="viewScope.repository"
                 image-loader="viewScope.imageLoader"
                 selected-tags="viewScope.selectedTags"
                 is-enabled="viewScope.changesVisible"></div>
          </div>

          <!-- Usage Logs -->
          <div id="logs" class="tab-pane" ng-if="viewScope.repository.can_admin">
            <div class="logs-view" repository="viewScope.repository" makevisible="logsShown"></div>
          </div>

          <!-- Settings -->
          <div id="settings" class="tab-pane" ng-if="viewScope.repository.can_admin">
            <div class="repo-panel-settings" repository="viewScope.repository"
                 is-enabled="settingsShown"></div>
          </div>
        </div> <!-- /cor-tab-content -->
      </div>
    </div>
  </div>
</div>