From: Stephan Müller Date: Tue, 11 Sep 2018 09:01:13 +0000 (+0200) Subject: mgr/dashboard: Use table actions component for roles X-Git-Tag: v14.0.1~239^2 X-Git-Url: http://git.apps.os.sepia.ceph.com/?a=commitdiff_plain;h=refs%2Fpull%2F23779%2Fhead;p=ceph.git mgr/dashboard: Use table actions component for roles Signed-off-by: Stephan Müller --- diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/auth/role-list/role-list.component.html b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/role-list/role-list.component.html index 847e84ca91e53..75331794fc40f 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/core/auth/role-list/role-list.component.html +++ b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/role-list/role-list.component.html @@ -7,67 +7,11 @@ selectionType="single" (fetchData)="getRoles()" (updateSelection)="updateSelection($event)"> -
-
- - - - - -
-
+ + diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/auth/role-list/role-list.component.spec.ts b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/role-list/role-list.component.spec.ts index cc47b8486d196..490508f8ec1cf 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/core/auth/role-list/role-list.component.spec.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/role-list/role-list.component.spec.ts @@ -1,11 +1,13 @@ 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'; @@ -29,10 +31,167 @@ describe('RoleListComponent', () => { 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([]); + }); + }); + }); }); diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/auth/role-list/role-list.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/role-list/role-list.component.ts index c9dffee279cc5..dcb43df514a4f 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/core/auth/role-list/role-list.component.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/role-list/role-list.component.ts @@ -9,6 +9,7 @@ import { DeletionModalComponent } from '../../../shared/components/deletion-moda 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'; @@ -22,6 +23,7 @@ import { NotificationService } from '../../../shared/services/notification.servi }) export class RoleListComponent implements OnInit { permission: Permission; + tableActions: CdTableAction[]; columns: CdTableColumn[]; roles: Array; scopes: Array; @@ -38,6 +40,28 @@ export class RoleListComponent implements OnInit { 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() {