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.
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:
-
AppRoutingModule: add this in the Routes:
{path: 'access-denied', component: AccessDeniedPageComponent},
-
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) {
-
Add this import the AppModule:
AccessDeniedPageModule
-
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/"
}
-
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 {}