vbatts/quay
Archived
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

Merge pull request #1754 from coreos-inc/team-add-perms

Browse source 
Better UI and permissions handling for robots and teams
This commit is contained in:
josephschorr 2016-09-06 17:21:19 -04:00 • committed by GitHub
commit cd8b45e25b
21 changed files with 895 additions and 458 deletions
Download patch file Download diff file Expand all files Collapse all files

90
static/directives/create-entity-dialog.html
View file

@ -8,81 +8,25 @@
<i class="fa {{ entityIcon }}"></i>
Create {{ entityTitle }}
</h4>
<h4 class="modal-title" ng-show="view == 'addperms' || view == 'addingperms'">
<h4 class="modal-title" ng-show="view == 'setperms' || view == 'settingperms'">
Add permissions for <i class="fa {{ entityIcon }}"></i> {{ entity.name }}
</h4>
</div> <!-- /.model-header -->
<div class="modal-body" ng-show="view == 'creating' || view == 'addingperms'">
<div class="modal-body" ng-show="view == 'creating' || view == 'settingperms'">
<div class="cor-loader"></div>
</div>
<div class="modal-body co-modal-body-scrollable" ng-show="view == 'addperms'">
<span class="co-filter-box">
<span class="filter-message" ng-if="options.filter">
Showing {{ orderedRepositories.entries.length }} of {{ repositories.length }} repositories
</span>
<input class="form-control" type="text" ng-model="options.filter" placeholder="Filter Repositories...">
</span>
<label>
Select repositories in
<span class="avatar" size="16" data="namespace.avatar"></span>
{{ info.namespace }}:
</label>
<table class="co-table" style="margin-bottom: 210px;">
<thead>
<td class="checkbox-col checkbox-menu-col">
<span class="cor-checkable-menu" controller="checkedRepos">
<div class="cor-checkable-menu-item" item-filter="allRepositoriesFilter(item)">
<i class="fa fa-check-square-o"></i>All Repositories
</div>
<div class="cor-checkable-menu-item" item-filter="noRepositoriesFilter(item)">
<i class="fa fa-square-o"></i>No Repositories
</div>
<div class="cor-checkable-menu-item" item-filter="missingPermsRepositoriesFilter(item)">
<i class="fa fa-circle-o"></i>Missing Permissions
</div>
</span>
</td>
<td ng-class="TableService.tablePredicateClass('name', options.predicate, options.reverse)">
<a ng-click="TableService.orderBy('name', options)">Repository Name</a>
</td>
<td>Permission</td>
<td ng-class="TableService.tablePredicateClass('last_modified_datetime', options.predicate, options.reverse)">
<a ng-click="TableService.orderBy('last_modified_datetime', options)">Last Updated</a>
</td>
</thead>
<tr class="co-checkable-row"
ng-repeat="repo in orderedRepositories.visibleEntries"
ng-class="checkedRepos.isChecked(repo, checkedRepos.checked) ? 'checked' : ''"
bindonce>
<td class="offset-check-col">
<span class="cor-checkable-item" controller="checkedRepos" item="repo"></span>
</td>
<td>
<i class="fa fa-hdd-o"></i>
<span bo-text="repo.name"></span>
</td>
<td>
<span class="role-group small" current-role="repo.permission"
roles="repoRolesOrNone"
role-changed="setRole(role, repo)"></span>
</td>
<td>
<span ng-if="repo.last_modified">
{{ repo.last_modified * 1000 | amCalendar }}
</span>
<span class="empty" ng-if="!repo.last_modified">(Empty Repository)</span>
</td>
</tr>
</table>
<div class="empty" ng-if="!orderedRepositories.entries.length"
style="margin-top: 20px;">
<div class="empty-primary-msg">No matching repositories found.</div>
<div class="empty-secondary-msg">Try expanding your filtering terms.</div>
</div>
<div class="modal-body co-modal-body-scrollable" ng-show="view == 'setperms'">
<div class="set-repo-permissions"
namespace="info.namespace"
entity-name="entity.name"
entity-kind="entityKind"
has-changed-repositories="context.hasChangedRepositories"
has-checked-repositories="context.hasCheckedRepositories"
repositories-loaded="repositoriesLoaded(repositories)"
setting-permissions="settingPermissions()"
permissions-set="permissionsSet(repositories)"
set-permissions="context.setPermissionsCounter"
ng-if="entity"></div>
</div>
<div class="modal-body" ng-show="view == 'enterName'">
<form name="enterNameForm" ng-submit="createEntity()">
@ -94,9 +38,9 @@
</div>
</form>
</div> <!-- /.modal-body -->
<div class="modal-footer" ng-show="view == 'addperms'">
<button type="button" class="btn btn-primary" ng-click="addPermissions()"
ng-show="checkedRepos.checked.length">Add permissions</button>
<div class="modal-footer" ng-show="view == 'setperms'">
<button type="button" class="btn btn-primary" ng-click="setPermissions()"
ng-show="context.hasCheckedRepositories">Add permissions</button>
<button type="button" class="btn btn-default" ng-click="hide()">Close</button>
</div> <!-- /.footer-body -->
<div class="modal-footer" ng-show="view == 'enterName'">

131
static/directives/robots-manager.html
View file

@ -35,99 +35,66 @@
<thead>
<td>Robot Account Name</td>
<td ng-if="organization">Teams</td>
<td>Direct Repository Permissions</td>
<td>Repositories</td>
<td class="options-col"></td>
</thead>
<tbody ng-repeat="robotInfo in robots | filter:robotFilter | orderBy:getShortenedRobotName" bindonce>
<tr ng-class="robotInfo.showing_permissions ? 'open' : 'closed'">
<td class="robot">
<i class="fa ci-robot hidden-xs"></i>
<a ng-click="showRobot(robotInfo)">
<span class="prefix" bo-text="getPrefix(robotInfo.name) + '+'"></span><span bo-text="getShortenedName(robotInfo.name)"></span>
</a>
</td>
<td bo-if="organization">
<span class="empty" bo-if="robotInfo.teams.length == 0">
No teams
</span>
<span class="empty" bo-if="robotInfo.teams.length > 0">
<span ng-repeat="team in robotInfo.teams"
data-title="Team {{ team.name }}" bs-tooltip>
<span class="anchor" is-only-text="!organization.is_admin" href="/organization/{{ organization.name }}/teams/{{ team.name }}">
<span class="avatar" size="24" data="team.avatar"></span>
</span>
<tr ng-repeat="robotInfo in robots | filter:robotFilter | orderBy:getShortenedRobotName" bindonce>
<td class="robot">
<i class="fa ci-robot hidden-xs"></i>
<a ng-click="showRobot(robotInfo)">
<span class="prefix" bo-text="getPrefix(robotInfo.name) + '+'"></span><span bo-text="getShortenedName(robotInfo.name)"></span>
</a>
</td>
<td bo-if="organization">
<span class="empty" bo-if="robotInfo.teams.length == 0">
No teams
</span>
<span class="empty" bo-if="robotInfo.teams.length > 0">
<span ng-repeat="team in robotInfo.teams"
data-title="Team {{ team.name }}" bs-tooltip>
<span class="anchor" is-only-text="!organization.is_admin" href="/organization/{{ organization.name }}/teams/{{ team.name }}">
<span class="avatar" size="24" data="team.avatar"></span>
</span>
</span>
</td>
<td>
<span class="empty" bo-if="robotInfo.repositories.length == 0">
</span>
</span>
</td>
<td>
<span class="empty" ng-if="robotInfo.repositories.length == 0">
<a is-only-text="!organization.is_admin" ng-click="setPermissions(robotInfo)">
No repositories
</span>
</a>
</span>
<span class="member-perm-summary" bo-if="robotInfo.repositories.length > 0">
<span ng-click="showPermissions(robotInfo)">
<i class="fa"
ng-class="robotInfo.showing_permissions ? 'fa-caret-down' : 'fa-caret-right'"
data-title="View Permissions List" bs-tooltip></i>
</span>
<a class="hidden-xs" is-only-text="!organization.is_admin"
ng-click="showPermissions(robotInfo)">
<span bo-text="robotInfo.repositories.length"></span>
<span bo-if="robotInfo.repositories.length == 1">repository</span>
<span bo-if="robotInfo.repositories.length > 1">repositories</span>
</a>
<span class="visible-xs">
<span bo-text="robotInfo.repositories.length"></span>
<span bo-if="robotInfo.repositories.length == 1">repository</span>
<span bo-if="robotInfo.repositories.length > 1">repositories</span>
</span>
<span class="member-perm-summary" ng-if="robotInfo.repositories.length > 0">
<a is-only-text="!organization.is_admin" ng-click="setPermissions(robotInfo)">
{{ robotInfo.repositories.length }}
<span ng-if="robotInfo.repositories.length == 1">repository</span>
<span ng-if="robotInfo.repositories.length > 1">repositories</span>
</a>
</span>
</td>
<td class="options-col">
<span class="cor-options-menu">
<span class="cor-option" option-click="showRobot(robotInfo)">
<i class="fa fa-key"></i> View Credentials
</span>
</td>
<td class="options-col">
<span class="cor-options-menu">
<span class="cor-option" option-click="showRobot(robotInfo)">
<i class="fa fa-key"></i> View Credentials
</span>
<span class="cor-option" option-click="askDeleteRobot(robotInfo)">
<i class="fa fa-times"></i> Delete Robot {{ robotInfo.name }}
</span>
<span class="cor-option" option-click="setPermissions(robotInfo)">
<i class="fa fa-hdd-o"></i> Set Repository Permissions
</span>
</td>
</tr>
<tr ng-if="robotInfo.showing_permissions">
<td class="permissions-display-row" colspan="4">
<span class="cor-loader" ng-if="robotInfo.loading_permissions"></span>
<div class="permissions-table-wrapper">
<table class="permissions-table" ng-if="!robotInfo.loading_permissions">
<thead>
<td>Repository</td>
<td>Permission</td>
</thead>
<tr ng-repeat="permission in robotInfo.permissions">
<td>
<span class="repo-icon repo-circle no-background" repo="permission.repository"></span>
<a ng-href="/repository/{{ getPrefix(robotInfo.name) }}/{{ permission.repository.name }}?tab=settings">{{ getPrefix(robotInfo.name) }}/{{ permission.repository.name }}</a>
</td>
<td>
<div class="btn-group btn-group-sm">
<span class="role-group"
current-role="permission.role"
roles="repoRoles"
read-only="true"></span>
</div>
</td>
</tr>
</table>
</div>
</td>
</tr>
</tbody>
<span class="cor-option" option-click="askDeleteRobot(robotInfo)">
<i class="fa fa-times"></i> Delete Robot {{ robotInfo.name }}
</span>
</span>
</td>
</tr>
</table>
</div>
<!-- Set repo permissions dialog -->
<div class="set-repo-permissions-dialog" info="setRepoPermissionsInfo"
permissions-set="handlePermissionsSet(info, repositories)"></div>
<div class="create-robot-dialog" info="createRobotInfo" robot-created="robotCreated()"></div>
<div class="robot-credentials-dialog" info="robotDisplayInfo"></div>
</div>

35
static/directives/set-repo-permissions-dialog.html Normal file
View file

@ -0,0 +1,35 @@
<div class="set-repo-permissions-dialog-element">
<div class="modal fade co-dialog wider">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" ng-click="hide()" aria-hidden="true">&times;</button>
<h4 class="modal-title">
Set permissions for <i class="fa {{ info.entityIcon }}"></i> {{ info.entityName }}
</h4>
</div> <!-- /.model-header -->
<div class="modal-body" ng-show="working">
<div class="cor-loader"></div>
</div>
<div class="modal-body co-modal-body-scrollable" ng-show="!working" style="padding-bottom: 210px;">
<div class="set-repo-permissions"
namespace="context.info.namespace"
entity-name="context.info.entityName"
entity-kind="context.info.entityKind"
has-changed-repositories="context.hasChangedRepositories"
has-checked-repositories="context.hasCheckedRepositories"
setting-permissions="settingPermissions()"
permissions-set="permissionsSetComplete(repositories)"
set-permissions="setPermissionsCounter"
ng-if="context.info.namespace && context.info.entityName && context.info.entityKind">
</div>
</div> <!-- /.modal-body -->
<div class="modal-footer" ng-show="!working">
<button type="button" class="btn btn-primary" ng-click="setPermissions()"
ng-show="context.hasChangedRepositories">Update permissions</button>
<button type="button" class="btn btn-default" ng-click="hide()">Close</button>
</div> <!-- /.footer-body -->
</div>
</div>
</div>
</div>

69
static/directives/set-repo-permissions.html Normal file
View file

@ -0,0 +1,69 @@
<div class="set-repo-permissions-element">
<span class="co-filter-box">
<span class="filter-message" ng-if="options.filter">
Showing {{ orderedRepositories.entries.length }} of {{ repositories.length }} repositories
</span>
<input class="form-control" type="text" ng-model="options.filter" placeholder="Filter Repositories...">
</span>
<label>
Select repositories in
<span class="avatar" size="16" data="namespaceInfo.avatar"></span>
{{ namespace }}:
</label>
<table class="co-table">
<thead>
<td class="checkbox-col checkbox-menu-col">
<span class="cor-checkable-menu" controller="checkedRepos">
<div class="cor-checkable-menu-item" item-filter="allRepositoriesFilter(item)">
<i class="fa fa-check-square-o"></i>All Repositories
</div>
<div class="cor-checkable-menu-item" item-filter="noRepositoriesFilter(item)">
<i class="fa fa-square-o"></i>No Repositories
</div>
<div class="cor-checkable-menu-item" item-filter="missingPermsRepositoriesFilter(item)">
<i class="fa fa-circle-o"></i>Missing Permissions
</div>
</span>
</td>
<td ng-class="TableService.tablePredicateClass('name', options.predicate, options.reverse)">
<a ng-click="TableService.orderBy('name', options)">Repository Name</a>
</td>
<td>Permission</td>
<td ng-class="TableService.tablePredicateClass('last_modified_datetime', options.predicate, options.reverse)">
<a ng-click="TableService.orderBy('last_modified_datetime', options)">Last Updated</a>
</td>
</thead>
<tr class="co-checkable-row"
ng-repeat="repo in orderedRepositories.visibleEntries"
ng-class="checkedRepos.isChecked(repo, checkedRepos.checked) ? 'checked' : ''"
bindonce>
<td class="offset-check-col">
<span class="cor-checkable-item" controller="checkedRepos" item="repo"></span>
</td>
<td>
<i class="fa fa-hdd-o"></i>
<span bo-text="repo.name"></span>
</td>
<td>
<span class="role-group small" current-role="repo.permission"
roles="repoRolesOrNone"
role-changed="setRole(role, repo)"></span>
</td>
<td>
<span ng-if="repo.last_modified">
{{ repo.last_modified * 1000 | amCalendar }}
</span>
<span class="empty" ng-if="!repo.last_modified">(Empty Repository)</span>
</td>
</tr>
</table>
<div class="empty" ng-if="!orderedRepositories.entries.length"
style="margin-top: 20px;">
<div class="empty-primary-msg">No matching repositories found.</div>
<div class="empty-secondary-msg">Try expanding your filtering terms.</div>
</div>
</div>

149
static/directives/teams-manager.html
View file

@ -1,6 +1,14 @@
<div class="teams-manager-element">
<div class="feedback-bar" feedback="feedback"></div>
<div class="manager-header" header-title="Teams and Membership">
<div class="tab-header-controls visible-xs">
<button class="btn btn-primary"
ng-show="organization.is_admin"
ng-click="askCreateTeam()">
<i class="fa fa-plus" style="margin-right: 4px;"></i> Create New Team
</button>
</div>
<div class="tab-header-controls hidden-xs">
<div class="btn-group btn-group-sm" ng-show="organization.is_admin">
<button class="btn"
@ -17,76 +25,100 @@
<!-- Teams List -->
<div ng-show="!showingMembers">
<div class="row" style="margin-left: 0px; margin-right: 0px;">
<button class="btn btn-primary hidden-xs"
ng-show="organization.is_admin"
style="margin-bottom: 10px; float: right;"
ng-click="askCreateTeam()">
<i class="fa fa-plus" style="margin-right: 4px;"></i> Create New Team
</button>
</div>
<button class="btn btn-primary hidden-xs"
ng-show="organization.is_admin"
style="margin-bottom: 10px; "
ng-click="askCreateTeam()">
<i class="fa fa-plus" style="margin-right: 4px;"></i> Create New Team
</button>
<div class="row hidden-xs">
<div class="col-sm-7 col-md-8 header-col">
<span class="header-text">Team Summary</span>
</div>
<div class="col-md-4 col-sm-5 header-col" ng-show="organization.is_admin">
<span class="header-text">Team Permissions</span>
<i class="info-icon fa fa-info-circle" data-placement="bottom" data-original-title="" data-title=""
data-content="Global permissions for the team and its members<br><br><dl><dt>Member</dt><dd>Permissions are assigned on a per repository basis</dd><dt>Creator</dt><dd>A team can create its own repositories</dd><dt>Admin</dt><dd>A team has full control of the organization</dd></dl>"
data-html="true"
data-trigger="hover"
bs-popover></i>
</div>
</div>
<span class="co-filter-box">
<span class="filter-message" ng-if="options.filter">
Showing {{ orderedTeams.entries.length }} of {{ teams.length }} teams
</span>
<input class="form-control" type="text" ng-model="options.filter" placeholder="Filter Teams...">
</span>
<div class="team-listing" ng-repeat="team in orderedTeams">
<div id="team-{{team.name}}" class="row">
<div class="col-sm-7 col-md-8">
<div class="team-title">
<span class="avatar" data="team.avatar" size="30"></span>
<span ng-show="team.can_view">
<a href="/organization/{{ organization.name }}/teams/{{ team.name }}">{{ team.name }}</a>
</span>
<span ng-show="!team.can_view">
{{ team.name }}
</span>
</div>
<table class="co-table" style="margin-top: 10px;">
<thead>
<td ng-class="TableService.tablePredicateClass('name', options.predicate, options.reverse)">
<a ng-click="TableService.orderBy('name', options)">Team Name</a>
</td>
<td ng-class="TableService.tablePredicateClass('member_count', options.predicate, options.reverse)">
<a ng-click="TableService.orderBy('member_count', options)">Members</a>
</td>
<td class="hidden-xs" ng-class="TableService.tablePredicateClass('repo_count', options.predicate, options.reverse)">
<a ng-click="TableService.orderBy('repo_count', options)">Repositories</a>
</td>
<td ng-class="TableService.tablePredicateClass('role_index', options.predicate, options.reverse)">
<a ng-click="TableService.orderBy('role_index', options)">Team Role</a>
<div class="team-description markdown-view" content="team.description" first-line-only="true"></div>
<i class="info-icon fa fa-info-circle" data-placement="bottom" data-original-title="" data-title=""
data-content="Global permissions for the team and its members<br><br><dl><dt>Member</dt><dd>Permissions are assigned on a per repository basis</dd><dt>Creator</dt><dd>A team can create its own repositories</dd><dt>Admin</dt><dd>A team has full control of the organization</dd></dl>"
data-html="true"
data-trigger="hover"
bs-popover></i>
</td>
<td class="options-col"></td>
</thead>
<div class="team-member-list hidden-xs" ng-if="members[team.name]">
<div class="cor-loader" ng-if="!members[team.name].members"></div>
<span class="team-member"
ng-repeat="member in members[team.name].members | orderBy:'is_robot' | limitTo: 20">
<span data-title="{{ member.name }}" bs-tooltip>
<a href="/user/{{ member.name }}" ng-if="!member.is_robot">
<span class="avatar" data="member.avatar" size="26"></span>
</a>
<i class="fa ci-robot fa-lg" ng-if="member.is_robot"></i>
</span>
</span>
<span class="team-member-more"
ng-if="members[team.name].members.length > 20">+ {{ members[team.name].members.length - 20 }} more team members.</span>
<span class="team-member-more"
ng-if="members[team.name].members && !members[team.name].members.length">(Empty Team)</span>
</div>
</div>
<tr class="co-checkable-row"
ng-repeat="team in orderedTeams.visibleEntries"
bindonce>
<td style="white-space: nowrap;">
<span class="avatar" data="team.avatar" size="24"></span>
<span bo-show="team.can_view">
<a href="/organization/{{ organization.name }}/teams/{{ team.name }}"><span bo-text="team.name"></span></a>
</span>
<span bo-show="!team.can_view" bo-text="team.name"></span>
</td>
<td>
<span bo-show="team.can_view">
<a href="/organization/{{ organization.name }}/teams/{{ team.name }}"><span bo-text="team.member_count"></span> <span class="hidden-xs">member<span bo-if="team.member_count != 1">s</span></span></a>
</span>
<span bo-show="!team.can_view">
<span bo-text="team.member_count"></span> <span class="hidden-xs">member<span bo-if="team.member_count != 1">s</span></span>
</span>
</td>
<td class="hidden-xs">
<span class="empty" ng-if="team.repo_count == 0">
<a is-only-text="!organization.is_admin" ng-click="setRepoPermissions(team.name)">
No repositories
</a>
</span>
<div class="col-sm-5 col-md-4 control-col" ng-show="organization.is_admin">
<span class="member-perm-summary" ng-if="team.repo_count > 0">
<a is-only-text="!organization.is_admin" ng-click="setRepoPermissions(team.name)">
{{ team.repo_count }}
<span ng-if="team.repo_count == 1">repository</span>
<span ng-if="team.repo_count > 1">repositories</span>
</a>
</span>
</td>
<td>
<span class="role-group" current-role="team.role" pull-left="true"
role-changed="setRole(role, team.name)" roles="teamRoles"></span>
<span class="cor-options-menu">
</td>
<td>
<span class="cor-options-menu" ng-show="organization.is_admin">
<span class="cor-option" option-click="viewTeam(team.name)">
<i class="fa fa-user"></i> Manage Team Members
</span>
<span class="cor-option" option-click="setRepoPermissions(team.name)">
<i class="fa fa-hdd-o"></i> Set Repository Permissions
</span>
<span class="cor-option" option-click="askDeleteTeam(team.name)">
<i class="fa fa-times"></i> Delete Team {{ team.name }}
</span>
</span>
</div>
</div>
</td>
</tr>
</table>
<div class="empty" ng-if="!orderedTeams.entries.length"
style="margin-top: 20px;">
<div class="empty-primary-msg">No matching teams found.</div>
<div class="empty-secondary-msg">Try expanding your filtering terms.</div>
</div>
</div>
@ -149,8 +181,13 @@
</table>
</div>
<!-- Create team dialog -->
<div class="create-team-dialog" info="createTeamInfo" team-created="handleTeamCreated(team)"></div>
<!-- Set repo permissions dialog -->
<div class="set-repo-permissions-dialog" info="setRepoPermissionsInfo"
permissions-set="handlePermissionsSet(info, repositories)"></div>
<!-- Remove member confirm -->
<div class="cor-confirm-dialog"
dialog-context="removeMemberInfo"