Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Browse files
Browse the repository at this point in the history
* refactor(project): remove old permission implementation * chore(deps): add cdk overlay * style: use mat-menu style in cdk overlay * feat(resource): display resource's and user's permissions * test(permission-info): init tests * refactor(pipe): format code * test(permission): improve tests * test(pipe): add test and fix pipe * style(permission-info): open box below button * feat(permission-info): consider project admin permissions * refactor(permission-info): clean up code * test(permission-info): more tests * test(permission-info): test all permissions from test-data
- Loading branch information
1 parent
a2cf6e0
commit 13a3a49
Showing
14 changed files
with
518 additions
and
15 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file was deleted.
Oops, something went wrong.
27 changes: 27 additions & 0 deletions
27
src/app/main/pipes/string-transformation/title-from-camel-case.pipe.spec.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| import { TitleFromCamelCasePipe } from './title-from-camel-case.pipe'; | ||
| import { waitForAsync, TestBed } from '@angular/core/testing'; | ||
|
|
||
| describe('TitleFromCamelCasePipe', () => { | ||
| let pipe: TitleFromCamelCasePipe; | ||
| let textToBeTransformed: string; | ||
|
|
||
| beforeEach(waitForAsync(() => { | ||
|
|
||
| TestBed.configureTestingModule({}); | ||
|
|
||
| pipe = new TitleFromCamelCasePipe(); | ||
|
|
||
| textToBeTransformed = 'HowTheCamelGotItsHump'; | ||
| })); | ||
|
|
||
| it('create an instance', () => { | ||
| expect(pipe).toBeTruthy(); | ||
| }); | ||
|
|
||
| it('should return "How The Camel Got Its Hump"', () => { | ||
| const transformedText = pipe.transform(textToBeTransformed); | ||
| expect(transformedText).toEqual('How The Camel Got Its Hump'); | ||
| }); | ||
|
|
||
|
|
||
| }); |
13 changes: 13 additions & 0 deletions
13
src/app/main/pipes/string-transformation/title-from-camel-case.pipe.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,13 @@ | ||
| import { Pipe, PipeTransform } from '@angular/core'; | ||
|
|
||
| @Pipe({ | ||
| name: 'titleFromCamelCase' | ||
| }) | ||
| export class TitleFromCamelCasePipe implements PipeTransform { | ||
|
|
||
| transform(value: string): string { | ||
| const title = value.replace(/([A-Z]+)/g, ' $1').replace(/([A-Z][a-z])/g, '$1'); | ||
| return title.trim(); | ||
| } | ||
|
|
||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
52 changes: 52 additions & 0 deletions
52
src/app/workspace/resource/permission-info/permission-info.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,52 @@ | ||
| <button | ||
| mat-icon-button | ||
| class="permissions" | ||
| matTooltip="Resource permissions" | ||
| matTooltipPosition="above" | ||
| cdkOverlayOrigin | ||
| #infoButton="cdkOverlayOrigin" | ||
| (click)="toggleMenu()"> | ||
| <mat-icon>lock</mat-icon> | ||
| </button> | ||
|
|
||
| <ng-template cdkConnectedOverlay | ||
| [cdkConnectedOverlayBackdropClass]="'cdk-overlay-transparent-backdrop'" | ||
| [cdkConnectedOverlayHasBackdrop]="true" | ||
| [cdkConnectedOverlayScrollStrategy]="scrollStrategy" | ||
| [cdkConnectedOverlayPositions]="infoBoxPositions" | ||
| [cdkConnectedOverlayOrigin]="infoButton" | ||
| [cdkConnectedOverlayOpen]="isOpen" | ||
| (backdropClick)="isOpen = false"> | ||
| <div class="overlay-info-box"> | ||
| <table> | ||
| <tr> | ||
| <th class="first-col">Permissions</th> | ||
| <th *ngFor="let dp of defaultPermissions"> | ||
| <mat-icon [matTooltip]="dp.label" matTooltipPosition="above"> | ||
| {{dp.icon}} | ||
| </mat-icon> | ||
| </th> | ||
| </tr> | ||
| <ng-container *ngIf="hasPermissions && listOfPermissions.length"> | ||
| <tr *ngFor="let item of listOfPermissions" [class]="item.group.split(':')[1]"> | ||
| <td class="first-col">{{item.group.split(':')[1] | titleFromCamelCase}}</td> | ||
| <td *ngFor="let dp of defaultPermissions" [class]="'perm-' + dp.name"> | ||
| <mat-icon class="status" [class.checked]="getStatus(dp.name, item.restriction)" | ||
| [matTooltip]="dp.label" matTooltipPosition="above"> | ||
| {{getStatus(dp.name, item.restriction) ? 'radio_button_checked' : 'radio_button_unchecked'}} | ||
| </mat-icon> | ||
| </td> | ||
| </tr> | ||
| </ng-container> | ||
| <tr *ngIf="userHasPermission && userRestrictions" class="border-top LoggedInUser"> | ||
| <td class="first-col">Your permissions</td> | ||
| <td *ngFor="let dp of defaultPermissions" [class]="'perm-' + dp.name"> | ||
| <mat-icon class="status" [class.checked]="getStatus(dp.name, userRestrictions)" | ||
| [matTooltip]="dp.label" matTooltipPosition="above"> | ||
| {{getStatus(dp.name, userRestrictions) ? 'radio_button_checked' : 'radio_button_unchecked'}} | ||
| </mat-icon> | ||
| </td> | ||
| </tr> | ||
| </table> | ||
| </div> | ||
| </ng-template> |
41 changes: 41 additions & 0 deletions
41
src/app/workspace/resource/permission-info/permission-info.component.scss
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,41 @@ | ||
| @import "../../../../assets/style/config"; | ||
| @import "../../../../assets/style/mixins"; | ||
|
|
||
| .overlay-info-box { | ||
| background: white; | ||
| padding: 8px 16px; | ||
| @include mat-box-shadow(); | ||
|
|
||
| table { | ||
| border-collapse: collapse; | ||
|
|
||
| th, td { | ||
| min-width: 48px; | ||
| text-align: center; | ||
| vertical-align: middle; | ||
|
|
||
| .mat-icon { | ||
| margin-top: 3px; | ||
| } | ||
| } | ||
|
|
||
| .first-col { | ||
| padding-right: 16px; | ||
| text-align: left; | ||
| } | ||
|
|
||
| .border-top { | ||
| border-top: 1px solid black; | ||
| } | ||
| } | ||
|
|
||
| } | ||
|
|
||
| .status { | ||
| color: $warn; | ||
|
|
||
| &.checked { | ||
| color: $active; | ||
| } | ||
| } | ||
|
|
Oops, something went wrong.