selectionType="single"
(fetchData)="getRoles()"
(updateSelection)="updateSelection($event)">
- <div class="table-actions">
- <div class="btn-group" dropdown>
- <button type="button"
- class="btn btn-sm btn-primary"
- *ngIf="permission.create && (
- permission.update && !selection.hasSingleSelection ||
- !permission.update)"
- routerLink="/user-management/roles/add">
- <i class="fa fa-fw fa-plus"></i>
- <span i18n>Add</span>
- </button>
- <button type="button"
- class="btn btn-sm btn-primary"
- [ngClass]="{'disabled': !selection.hasSelection || selection.first().system}"
- *ngIf="permission.update && (!permission.create || selection.hasSingleSelection)"
- routerLink="/user-management/roles/edit/{{ selection.first()?.name }}">
- <i class="fa fa-fw fa-pencil"></i>
- <span i18n>Edit</span>
- </button>
- <button type="button"
- class="btn btn-sm btn-primary"
- [ngClass]="{'disabled': !selection.hasSelection || selection.first().system}"
- *ngIf="permission.delete && !permission.create && !permission.update"
- (click)="deleteRoleModal()">
- <i class="fa fa-fw fa-trash-o"></i>
- <span i18n>Delete</span>
- </button>
- <button type="button"
- dropdownToggle
- class="btn btn-sm btn-primary dropdown-toggle dropdown-toggle-split"
- *ngIf="((permission.create?1:0) + (permission.update?1:0) + (permission.delete?1:0)) > 1">
- <span class="caret"></span>
- <span class="sr-only"></span>
- </button>
- <ul *dropdownMenu class="dropdown-menu" role="menu">
- <li role="menuitem"
- *ngIf="permission.create">
- <a class="dropdown-item" routerLink="/user-management/roles/add">
- <i class="fa fa-fw fa-plus"></i>
- <span i18n>Add</span>
- </a>
- </li>
- <li role="menuitem"
- *ngIf="permission.update"
- [ngClass]="{'disabled': !selection.hasSingleSelection || selection.first().system}">
- <a class="dropdown-item" routerLink="/user-management/roles/edit/{{ selection.first()?.name}}">
- <i class="fa fa-fw fa-pencil"></i>
- <span i18n>Edit</span>
- </a>
- </li>
- <li role="menuitem"
- *ngIf="permission.delete"
- [ngClass]="{'disabled': !selection.hasSingleSelection || selection.first().system}">
- <a class="dropdown-item" (click)="deleteRoleModal()">
- <i class="fa fa-fw fa-trash-o"></i>
- <span i18n>Delete</span>
- </a>
- </li>
- </ul>
- </div>
- </div>
+ <cd-table-actions class="table-actions"
+ [permission]="permission"
+ [selection]="selection"
+ [tableActions]="tableActions">
+ </cd-table-actions>
<cd-role-details cdTableDetail
[selection]="selection"
[scopes]="scopes">
import { HttpClientTestingModule } from '@angular/common/http/testing';
import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { By } from '@angular/platform-browser';
import { RouterTestingModule } from '@angular/router/testing';
import { ToastModule } from 'ng2-toastr';
import { TabsModule } from 'ngx-bootstrap';
-import { configureTestBed } from '../../../../testing/unit-test-helper';
+import { configureTestBed, PermissionHelper } from '../../../../testing/unit-test-helper';
+import { TableActionsComponent } from '../../../shared/datatable/table-actions/table-actions.component';
import { SharedModule } from '../../../shared/shared.module';
import { RoleDetailsComponent } from '../role-details/role-details.component';
import { UserTabsComponent } from '../user-tabs/user-tabs.component';
beforeEach(() => {
fixture = TestBed.createComponent(RoleListComponent);
component = fixture.componentInstance;
- fixture.detectChanges();
});
it('should create', () => {
+ fixture.detectChanges();
expect(component).toBeTruthy();
});
+
+ describe('show action buttons and drop down actions depending on permissions', () => {
+ let tableActions: TableActionsComponent;
+ let scenario: { fn; empty; single };
+ let permissionHelper: PermissionHelper;
+
+ const getTableActionComponent = (): TableActionsComponent => {
+ fixture.detectChanges();
+ return fixture.debugElement.query(By.directive(TableActionsComponent)).componentInstance;
+ };
+
+ beforeEach(() => {
+ permissionHelper = new PermissionHelper(component.permission, () =>
+ getTableActionComponent()
+ );
+ scenario = {
+ fn: () => tableActions.getCurrentButton().name,
+ single: 'Edit',
+ empty: 'Add'
+ };
+ });
+
+ describe('with all', () => {
+ beforeEach(() => {
+ tableActions = permissionHelper.setPermissionsAndGetActions(1, 1, 1);
+ });
+
+ it(`shows 'Edit' for single selection else 'Add' as main action`, () =>
+ permissionHelper.testScenarios(scenario));
+
+ it('shows all actions', () => {
+ expect(tableActions.tableActions.length).toBe(3);
+ expect(tableActions.tableActions).toEqual(component.tableActions);
+ });
+ });
+
+ describe('with read, create and update', () => {
+ beforeEach(() => {
+ tableActions = permissionHelper.setPermissionsAndGetActions(1, 1, 0);
+ });
+
+ it(`shows 'Edit' for single selection else 'Add' as main action`, () =>
+ permissionHelper.testScenarios(scenario));
+
+ it(`shows 'Add' and 'Edit' action`, () => {
+ expect(tableActions.tableActions.length).toBe(2);
+ component.tableActions.pop();
+ expect(tableActions.tableActions).toEqual(component.tableActions);
+ });
+ });
+
+ describe('with read, create and delete', () => {
+ beforeEach(() => {
+ tableActions = permissionHelper.setPermissionsAndGetActions(1, 0, 1);
+ });
+
+ it(`shows 'Delete' for single selection else 'Add' as main action`, () => {
+ scenario.single = 'Delete';
+ permissionHelper.testScenarios(scenario);
+ });
+
+ it(`shows 'Add' and 'Delete' action`, () => {
+ expect(tableActions.tableActions.length).toBe(2);
+ expect(tableActions.tableActions).toEqual([
+ component.tableActions[0],
+ component.tableActions[2]
+ ]);
+ });
+ });
+
+ describe('with read, edit and delete', () => {
+ beforeEach(() => {
+ tableActions = permissionHelper.setPermissionsAndGetActions(0, 1, 1);
+ });
+
+ it(`shows always 'Edit' as main action`, () => {
+ scenario.empty = 'Edit';
+ permissionHelper.testScenarios(scenario);
+ });
+
+ it(`shows 'Edit' and 'Delete' action`, () => {
+ expect(tableActions.tableActions.length).toBe(2);
+ expect(tableActions.tableActions).toEqual([
+ component.tableActions[1],
+ component.tableActions[2]
+ ]);
+ });
+ });
+
+ describe('with read and create', () => {
+ beforeEach(() => {
+ tableActions = permissionHelper.setPermissionsAndGetActions(1, 0, 0);
+ });
+
+ it(`shows always 'Add' as main action`, () => {
+ scenario.single = 'Add';
+ permissionHelper.testScenarios(scenario);
+ });
+
+ it(`shows only 'Add' action`, () => {
+ expect(tableActions.tableActions.length).toBe(1);
+ expect(tableActions.tableActions).toEqual([component.tableActions[0]]);
+ });
+ });
+
+ describe('with read and update', () => {
+ beforeEach(() => {
+ tableActions = permissionHelper.setPermissionsAndGetActions(0, 1, 0);
+ });
+
+ it(`shows always 'Edit' as main action`, () => {
+ scenario.empty = 'Edit';
+ permissionHelper.testScenarios(scenario);
+ });
+
+ it(`shows only 'Edit' action`, () => {
+ expect(tableActions.tableActions.length).toBe(1);
+ expect(tableActions.tableActions).toEqual([component.tableActions[1]]);
+ });
+ });
+
+ describe('with read and delete', () => {
+ beforeEach(() => {
+ tableActions = permissionHelper.setPermissionsAndGetActions(0, 0, 1);
+ });
+
+ it(`shows always 'Delete' as main action`, () => {
+ scenario.single = 'Delete';
+ scenario.empty = 'Delete';
+ permissionHelper.testScenarios(scenario);
+ });
+
+ it(`shows only 'Delete' action`, () => {
+ expect(tableActions.tableActions.length).toBe(1);
+ expect(tableActions.tableActions).toEqual([component.tableActions[2]]);
+ });
+ });
+
+ describe('with only read', () => {
+ beforeEach(() => {
+ tableActions = permissionHelper.setPermissionsAndGetActions(0, 0, 0);
+ });
+
+ it('shows no main action', () => {
+ permissionHelper.testScenarios({
+ fn: () => tableActions.getCurrentButton(),
+ single: undefined,
+ empty: undefined
+ });
+ });
+
+ it('shows no actions', () => {
+ expect(tableActions.tableActions.length).toBe(0);
+ expect(tableActions.tableActions).toEqual([]);
+ });
+ });
+ });
});
import { EmptyPipe } from '../../../shared/empty.pipe';
import { CellTemplate } from '../../../shared/enum/cell-template.enum';
import { NotificationType } from '../../../shared/enum/notification-type.enum';
+import { CdTableAction } from '../../../shared/models/cd-table-action';
import { CdTableColumn } from '../../../shared/models/cd-table-column';
import { CdTableSelection } from '../../../shared/models/cd-table-selection';
import { Permission } from '../../../shared/models/permissions';
})
export class RoleListComponent implements OnInit {
permission: Permission;
+ tableActions: CdTableAction[];
columns: CdTableColumn[];
roles: Array<any>;
scopes: Array<string>;
private notificationService: NotificationService
) {
this.permission = this.authStorageService.getPermissions().user;
+ const addAction: CdTableAction = {
+ permission: 'create',
+ icon: 'fa-plus',
+ routerLink: () => '/user-management/roles/add',
+ name: 'Add'
+ };
+ const editAction: CdTableAction = {
+ permission: 'update',
+ icon: 'fa-pencil',
+ disable: () => !this.selection.hasSingleSelection || this.selection.first().system,
+ routerLink: () =>
+ this.selection.first() && `/user-management/roles/edit/${this.selection.first().name}`,
+ name: 'Edit'
+ };
+ const deleteAction: CdTableAction = {
+ permission: 'delete',
+ icon: 'fa-trash-o',
+ disable: () => !this.selection.hasSingleSelection || this.selection.first().system,
+ click: () => this.deleteRoleModal(),
+ name: 'Delete'
+ };
+ this.tableActions = [addAction, editAction, deleteAction];
}
ngOnInit() {
projects / ceph.git / commitdiff