From 9d9e093e1d200d642791c8ed744695228a12175c Mon Sep 17 00:00:00 2001 From: =?utf8?q?Stephan=20M=C3=BCller?= Date: Mon, 10 Sep 2018 15:28:05 +0200 Subject: [PATCH] mgr/dashboard: Use table actions component for users MIME-Version: 1.0 Content-Type: text/plain; charset=utf8 Content-Transfer-Encoding: 8bit Signed-off-by: Stephan Müller --- .../auth/user-list/user-list.component.html | 66 +------ .../user-list/user-list.component.spec.ts | 162 +++++++++++++++++- .../auth/user-list/user-list.component.ts | 22 +++ 3 files changed, 188 insertions(+), 62 deletions(-) diff --git a/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-list/user-list.component.html b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-list/user-list.component.html index 817cca4729b..89ed21be833 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-list/user-list.component.html +++ b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-list/user-list.component.html @@ -7,67 +7,11 @@ selectionType="single" (fetchData)="getUsers()" (updateSelection)="updateSelection($event)"> -
-
- - - - - -
-
+ + { beforeEach(() => { fixture = TestBed.createComponent(UserListComponent); 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/user-list/user-list.component.ts b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-list/user-list.component.ts index 37a3d77486a..5fd4abeb3d0 100644 --- a/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-list/user-list.component.ts +++ b/src/pybind/mgr/dashboard/frontend/src/app/core/auth/user-list/user-list.component.ts @@ -6,6 +6,7 @@ import { UserService } from '../../../shared/api/user.service'; import { DeletionModalComponent } from '../../../shared/components/deletion-modal/deletion-modal.component'; import { EmptyPipe } from '../../../shared/empty.pipe'; 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 @@ export class UserListComponent implements OnInit { userRolesTpl: TemplateRef; permission: Permission; + tableActions: CdTableAction[]; columns: CdTableColumn[]; users: Array; selection = new CdTableSelection(); @@ -36,6 +38,26 @@ export class UserListComponent implements OnInit { private authStorageService: AuthStorageService ) { this.permission = this.authStorageService.getPermissions().user; + const addAction: CdTableAction = { + permission: 'create', + icon: 'fa-plus', + routerLink: () => '/user-management/users/add', + name: 'Add' + }; + const editAction: CdTableAction = { + permission: 'update', + icon: 'fa-pencil', + routerLink: () => + this.selection.first() && `/user-management/users/edit/${this.selection.first().username}`, + name: 'Edit' + }; + const deleteAction: CdTableAction = { + permission: 'delete', + icon: 'fa-trash-o', + click: () => this.deleteUserModal(), + name: 'Delete' + }; + this.tableActions = [addAction, editAction, deleteAction]; } ngOnInit() { -- 2.39.5