@next-level-integration/nli-access-denied

Access Denied Component

This component is for an access denied page to be re used in all the micro front end projects. In the case that the user does not have permission to access a particular page, the user will be redirected to this page.

How to use

Access Denied component: npm install @next-level-integration/nli-access-denied --save.

Create a wrapper component with a module file to import this module and then use that wrapper Component in routing to redirect. Classes to be added/updated are:

1. AppRoutingModule: add this in the Routes:

     {path: 'access-denied', component: AccessDeniedPageComponent},
   

2. Add this in the index.html

    const ACCESS_DENIED_ROUTE = "access-denied";
   

   Update the if condition in the funciton: getPositionWhereRoutingStarts(locationSplitArr){}

    if (locationSplitArr[i] === FIRST_STRING_OF_ROUTE
             || locationSplitArr[i] === ACCESS_DENIED_ROUTE) {
   

3. Add this import the AppModule:

    AccessDeniedPageModule
   

4. For translation:

   Update the function HttpLoaderFactory inside AppModule.ts with this line

   {prefix: "./lib/nli-access-denied/assets/i18n/", suffix: ".json"}
   

   Update the angular.json with this:

              {
                "glob": "**/*",
                "input": "./node_modules/@next-level-integration/nli-access-denied/assets",
                "output": "./lib/nli-access-denied/assets/"
              }
   

5. Create one folder access-denied-page in the pages folder. Add the wrapper module: component.ts, module.ts and component.html

   AccessDeniedPageComponent

    import {Component} from '@angular/core';
    
    @Component({
      selector: 'nli-access-denied-page',
      templateUrl: './access-denied-page.component.html',
    })
    export class AccessDeniedPageComponent  {}
   

   access-denied-page.component.html

    <nli-i18n [hidden]="true"></nli-i18n>
    <nli-show-access-denied></nli-show-access-denied>
   

   AccessDeniedPageModule

    import { NgModule } from '@angular/core';
    import { CommonModule } from '@angular/common';
    import {AccessDeniedPageComponent} from './access-denied-page.component';
    import {SharedModule} from '../../shared/shared.module';
    import {LibrariesModule} from '../../libraries.module';
    import {NliAccessDeniedModule} from '@next-level-integration/nli-access-denied';
    import {I18nModule} from '@next-level-integration-private/nli-i18n';
   
    @NgModule({
      imports: [
        CommonModule,
        LibrariesModule,
        NliAccessDeniedModule,
        I18nModule,
        SharedModule,
      ],
      declarations: [AccessDeniedPageComponent],
      exports: [],
    })
    export class AccessDeniedPageModule {}