{{ 'security.authenticationRequired.description' | translate }}
7 | ` 8 | }) 9 | export class AuthenticationRequiredComponent {} 10 | -------------------------------------------------------------------------------- /ui/src/app/security/component/feature-disabled.component.spec.ts: -------------------------------------------------------------------------------- 1 | import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing'; 2 | import {FormsModule} from '@angular/forms'; 3 | import {ClarityModule} from '@clr/angular'; 4 | import {RouterTestingModule} from '@angular/router/testing'; 5 | import {BrowserAnimationsModule} from '@angular/platform-browser/animations'; 6 | import {SecurityServiceMock} from '../../tests/api/security.service.mock'; 7 | import {AboutServiceMock} from '../../tests/api/about.service.mock'; 8 | import {AppServiceMock} from '../../tests/api/app.service.mock'; 9 | import {NotificationServiceMock} from '../../tests/service/notification.service.mock'; 10 | import {FeatureDisabledComponent} from './feature-disabled.component'; 11 | import {TranslateTestingModule} from 'ngx-translate-testing'; 12 | import TRANSLATIONS from '../../../assets/i18n/en.json'; 13 | 14 | describe('security/component/feature-disabled.component.ts', () => { 15 | let component: FeatureDisabledComponent; 16 | let fixture: ComponentFixture{{ 'security.featureDisabled.description' | translate }}
7 | ` 8 | }) 9 | export class FeatureDisabledComponent {} 10 | -------------------------------------------------------------------------------- /ui/src/app/security/component/roles-missing.component.spec.ts: -------------------------------------------------------------------------------- 1 | import {ComponentFixture, TestBed, waitForAsync} from '@angular/core/testing'; 2 | import {FormsModule} from '@angular/forms'; 3 | import {ClarityModule} from '@clr/angular'; 4 | import {RouterTestingModule} from '@angular/router/testing'; 5 | import {BrowserAnimationsModule} from '@angular/platform-browser/animations'; 6 | import {SecurityServiceMock} from '../../tests/api/security.service.mock'; 7 | import {AboutServiceMock} from '../../tests/api/about.service.mock'; 8 | import {AppServiceMock} from '../../tests/api/app.service.mock'; 9 | import {NotificationServiceMock} from '../../tests/service/notification.service.mock'; 10 | import {RolesMissingComponent} from './roles-missing.component'; 11 | import {TranslateTestingModule} from 'ngx-translate-testing'; 12 | import TRANSLATIONS from '../../../assets/i18n/en.json'; 13 | 14 | describe('security/component/roles-missing.component.ts', () => { 15 | let component: RolesMissingComponent; 16 | let fixture: ComponentFixture{{ 'security.rolesMissing.description' | translate }}
7 | ` 8 | }) 9 | export class RolesMissingComponent {} 10 | -------------------------------------------------------------------------------- /ui/src/app/security/directive/role.directive.ts: -------------------------------------------------------------------------------- 1 | import {AfterViewInit, Directive, ElementRef, Input, Renderer2} from '@angular/core'; 2 | import get from 'lodash.get'; 3 | import {AboutService} from '../../shared/api/about.service'; 4 | import {SecurityService} from '../service/security.service'; 5 | 6 | @Directive({ 7 | selector: '[appRole]' 8 | }) 9 | export class RoleDirective implements AfterViewInit { 10 | @Input() 11 | public grantedRole: string[]; 12 | 13 | @Input() 14 | public appRole: string[]; 15 | 16 | @Input() 17 | public appFeature: string; 18 | 19 | private existingDisplayPropertyValue: string; 20 | 21 | constructor( 22 | private aboutService: AboutService, 23 | private securityService: SecurityService, 24 | private elem: ElementRef, 25 | private renderer: Renderer2 26 | ) {} 27 | 28 | private async checkRoles() { 29 | if (this.appFeature) { 30 | const features = this.appFeature.split(','); 31 | if (this.appFeature) { 32 | const result = await Promise.all([...features.map(feature => this.aboutService.isFeatureEnabled(feature))]); 33 | const featureEnabled = result.filter(item => item === true).length > 0; 34 | this.checkRoleAccess(featureEnabled); 35 | } 36 | } else { 37 | this.checkRoleAccess(true); 38 | } 39 | } 40 | 41 | private async checkRoleAccess(featureEnabled: boolean) { 42 | const hasRoleAccess = await this.securityService.canAccess(this.appRole); 43 | if (!featureEnabled || !hasRoleAccess) { 44 | this.renderer.setStyle(this.elem.nativeElement, 'display', 'none'); 45 | } else { 46 | if (this.existingDisplayPropertyValue) { 47 | this.renderer.setStyle(this.elem.nativeElement, 'display', this.existingDisplayPropertyValue); 48 | } else { 49 | this.renderer.removeStyle(this.elem.nativeElement, 'display'); 50 | } 51 | } 52 | } 53 | 54 | ngAfterViewInit(): void { 55 | this.existingDisplayPropertyValue = this.elem.nativeElement.style.display; 56 | this.checkRoles(); 57 | } 58 | } 59 | -------------------------------------------------------------------------------- /ui/src/app/security/security-routing.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {Routes, RouterModule} from '@angular/router'; 3 | import {FeatureDisabledComponent} from './component/feature-disabled.component'; 4 | import {RolesMissingComponent} from './component/roles-missing.component'; 5 | import {AuthenticationRequiredComponent} from './component/authentication-required.component'; 6 | 7 | const routes: Routes = [ 8 | { 9 | path: 'feature-disabled', 10 | component: FeatureDisabledComponent 11 | }, 12 | { 13 | path: 'roles-missing', 14 | component: RolesMissingComponent 15 | }, 16 | { 17 | path: 'authentication-required', 18 | component: AuthenticationRequiredComponent 19 | } 20 | ]; 21 | 22 | @NgModule({ 23 | imports: [RouterModule.forChild(routes)], 24 | exports: [RouterModule] 25 | }) 26 | export class SecurityRoutingModule {} 27 | -------------------------------------------------------------------------------- /ui/src/app/security/security.module.ts: -------------------------------------------------------------------------------- 1 | import {NgModule} from '@angular/core'; 2 | import {CommonModule} from '@angular/common'; 3 | import {StoreModule} from '@ngrx/store'; 4 | import {EffectsModule} from '@ngrx/effects'; 5 | import {RoleDirective} from './directive/role.directive'; 6 | import {ClarityModule} from '@clr/angular'; 7 | import {SharedModule} from '../shared/shared.module'; 8 | import {RolesMissingComponent} from './component/roles-missing.component'; 9 | import {FeatureDisabledComponent} from './component/feature-disabled.component'; 10 | import {AuthenticationRequiredComponent} from './component/authentication-required.component'; 11 | import {SecurityRoutingModule} from './security-routing.module'; 12 | import {SecurityGuard} from './support/security.guard'; 13 | import {HTTP_INTERCEPTORS} from '@angular/common/http'; 14 | import * as fromSecurity from './store/security.reducer'; 15 | import {SecurityEffect} from './store/security.effect'; 16 | import {SecurityInterceptor} from './support/security.interceptor'; 17 | import {TranslateModule} from '@ngx-translate/core'; 18 | 19 | @NgModule({ 20 | declarations: [RoleDirective, RolesMissingComponent, FeatureDisabledComponent, AuthenticationRequiredComponent], 21 | imports: [ 22 | CommonModule, 23 | ClarityModule, 24 | SharedModule, 25 | SecurityRoutingModule, 26 | TranslateModule, 27 | StoreModule.forFeature(fromSecurity.securityFeatureKey, fromSecurity.reducer), 28 | EffectsModule.forFeature([SecurityEffect]) 29 | ], 30 | providers: [ 31 | SecurityGuard, 32 | { 33 | provide: HTTP_INTERCEPTORS, 34 | useClass: SecurityInterceptor, 35 | multi: true 36 | } 37 | ], 38 | exports: [RoleDirective] 39 | }) 40 | export class SecurityModule {} 41 | -------------------------------------------------------------------------------- /ui/src/app/security/store/security.action.ts: -------------------------------------------------------------------------------- 1 | import {createAction, props} from '@ngrx/store'; 2 | 3 | export const loaded = createAction( 4 | '[Security] Loaded', 5 | props<{enabled: boolean; authenticated: boolean; username: string; roles: string[]}>() 6 | ); 7 | export const logout = createAction('[Security] Logout'); 8 | export const unauthorised = createAction('[Security] Unauthorised'); 9 | -------------------------------------------------------------------------------- /ui/src/app/security/store/security.effect.spec.ts: -------------------------------------------------------------------------------- 1 | import {TestBed, waitForAsync} from '@angular/core/testing'; 2 | import {provideMockActions} from '@ngrx/effects/testing'; 3 | import {cold} from 'jasmine-marbles'; 4 | import {Router} from '@angular/router'; 5 | import {Action} from '@ngrx/store'; 6 | import {Observable, of} from 'rxjs'; 7 | import * as SecurityAction from './security.action'; 8 | import {SecurityEffect} from './security.effect'; 9 | 10 | describe('Security Effect', () => { 11 | let effects: SecurityEffect; 12 | let actions$: Observable{{logs}}{{ 'tasks.cleanup.selectContent' | translate }}
8 |35 | Please keep in mind that you are most likely still logged in with your oauth provider. Therefore, going to 36 | the main Dashboard URL will log you back in, unless you also log out from your oauth provider. 37 |
38 |