initial "requisition-management" sub project with routing inclusion f…

…rom My Account

Dockerfile

@@ -4,6 +4,7 @@ COPY schematics /workspace/schematics/
 COPY package.json package-lock.json /workspace/
 RUN npm i --ignore-scripts
 COPY projects/organization-management/src/app /workspace/projects/organization-management/src/app/
+COPY projects/requisition-management/src/app /workspace/projects/requisition-management/src/app/
 COPY src /workspace/src/
 COPY tsconfig.app.json tsconfig-es5.app.json tsconfig.json ngsw-config.json browserslist angular.json /workspace/
 RUN npm run build:schematics && npm run synchronize-lazy-components -- --ci

angular.json

@@ -227,6 +227,52 @@
           }
         }
       }
+    },
+    "requisition-management": {
+      "projectType": "application",
+      "cli": {
+        "defaultCollection": "intershop-schematics"
+      },
+      "schematics": {
+        "intershop-schematics:page": {
+          "lazy": false
+        }
+      },
+      "root": "projects/requisition-management",
+      "sourceRoot": "projects/requisition-management/src",
+      "prefix": "ish",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "dist/requisition-management",
+            "index": "projects/requisition-management/src/index.html",
+            "main": "projects/requisition-management/src/main.ts",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "projects/requisition-management/tsconfig.app.json",
+            "aot": false,
+            "styles": ["src/styles/themes/default/style.scss"],
+            "assets": [
+              { "glob": "**/*", "input": "src/assets/", "output": "/assets/" }
+            ],
+            "scripts": [],
+            "fileReplacements": [
+              {
+                "replace": "src/environments/environment.ts",
+                "with": "src/environments/environment.local.ts"
+              }
+            ]
+          }
+        },
+        "serve": {
+          "builder": "@angular-devkit/build-angular:dev-server",
+          "options": {
+            "browserTarget": "requisition-management:build",
+            "disableHostCheck": true,
+            "host": "0.0.0.0"
+          }
+        }
+      }
     }
   },
   "defaultProject": "intershop-pwa",

jest.config.js

@@ -20,6 +20,7 @@ module.exports = {
   moduleNameMapper: {
     '^ish-(.*)$': '<rootDir>/src/app/$1',
     '^organization-management$': '<rootDir>/projects/organization-management/src/app/exports',
+    '^requisition-management$': '<rootDir>/projects/requisition-management/src/app/exports',
   },
   snapshotSerializers: [
     './src/jest-serializer/AngularHTMLSerializer.js',

projects/requisition-management/src/app.component.html

@@ -0,0 +1,21 @@
+<div class="container main-container">
+  <div class="d-flex py-2 border-bottom">
+    <a
+      *ngIf="user$ | async as user; else notLoggedIn"
+      class="text-uppercase"
+      routerLink="/logout"
+      [queryParams]="{ returnUrl: '/login?returnUrl=/requisition-management' }"
+      >{{ 'account.logout.link' | translate }}</a
+    >
+    <ng-template #notLoggedIn>
+      <a
+        class="text-uppercase"
+        routerLink="/login"
+        [queryParams]="{ returnUrl: '/login?returnUrl=/requisition-management' }"
+        >{{ 'account.login.link' | translate }}</a
+      >
+    </ng-template>
+  </div>
+
+  <router-outlet></router-outlet>
+</div>

projects/requisition-management/src/app.component.ts

@@ -0,0 +1,21 @@
+import { ChangeDetectionStrategy, Component, OnInit } from '@angular/core';
+import { Observable } from 'rxjs';
+
+import { AccountFacade } from 'ish-core/facades/account.facade';
+import { User } from 'ish-core/models/user/user.model';
+
+@Component({
+  selector: 'ish-requisition-management-root',
+  templateUrl: './app.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+// tslint:disable-next-line: component-creation-test
+export class AppComponent implements OnInit {
+  user$: Observable<User>;
+
+  constructor(private accountFacade: AccountFacade) {}
+
+  ngOnInit() {
+    this.user$ = this.accountFacade.user$;
+  }
+}

projects/requisition-management/src/app.module.ts

@@ -0,0 +1,47 @@
+import { NgModule } from '@angular/core';
+import { BrowserModule } from '@angular/platform-browser';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+import { RouterModule } from '@angular/router';
+
+import { CoreModule } from 'ish-core/core.module';
+import { AuthGuard } from 'ish-core/guards/auth.guard';
+import { LogoutGuard } from 'ish-core/guards/logout.guard';
+import { FormsSharedModule } from 'ish-shared/forms/forms.module';
+
+import { AppComponent } from './app.component';
+import { LoginComponent } from './login.component';
+
+@NgModule({
+  declarations: [AppComponent, LoginComponent],
+  imports: [
+    BrowserModule,
+    CoreModule,
+    FormsSharedModule,
+    NoopAnimationsModule,
+    RouterModule.forRoot([
+      {
+        path: 'login',
+        component: LoginComponent,
+      },
+      {
+        path: 'logout',
+        canActivate: [LogoutGuard],
+        component: LoginComponent,
+      },
+      {
+        path: 'requisition-management',
+        loadChildren: () => import('./app/requisition-management.module').then(m => m.RequisitionManagementModule),
+        canActivate: [AuthGuard],
+        canActivateChild: [AuthGuard],
+      },
+      {
+        path: '**',
+        redirectTo: 'requisition-management',
+        pathMatch: 'full',
+      },
+    ]),
+  ],
+  providers: [],
+  bootstrap: [AppComponent],
+})
+export class AppModule {}

projects/requisition-management/src/app/exports/index.ts

@@ -0,0 +1,5 @@
+// tslint:disable: no-barrel-files
+
+export { RequisitionManagementModule } from '../requisition-management.module';
+
+export { RequisitionManagementBreadcrumbService } from '../services/requisition-management-breadcrumb/requisition-management-breadcrumb.service';

projects/requisition-management/src/app/facades/requisition-management.facade.ts

@@ -0,0 +1,8 @@
+import { Injectable } from '@angular/core';
+import { Store } from '@ngrx/store';
+
+// tslint:disable:member-ordering
+@Injectable({ providedIn: 'root' })
+export class RequisitionManagementFacade {
+  constructor(private store: Store) {}
+}

projects/requisition-management/src/app/pages/approver/approver-page.component.html

@@ -0,0 +1,3 @@
+<h1>{{ 'account.requisitions.approvals' | translate }}</h1>
+
+<p>{{ 'account.requisitions.approvals.text' | translate }}</p>

projects/requisition-management/src/app/pages/approver/approver-page.component.spec.ts

@@ -0,0 +1,30 @@
+import { ComponentFixture, TestBed, async } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
+import { TranslateModule } from '@ngx-translate/core';
+
+import { ApproverPageComponent } from './approver-page.component';
+
+describe('Approver Page Component', () => {
+  let component: ApproverPageComponent;
+  let fixture: ComponentFixture<ApproverPageComponent>;
+  let element: HTMLElement;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [RouterTestingModule, TranslateModule.forRoot()],
+      declarations: [ApproverPageComponent],
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(ApproverPageComponent);
+    component = fixture.componentInstance;
+    element = fixture.nativeElement;
+  });
+
+  it('should be created', () => {
+    expect(component).toBeTruthy();
+    expect(element).toBeTruthy();
+    expect(() => fixture.detectChanges()).not.toThrow();
+  });
+});

projects/requisition-management/src/app/pages/approver/approver-page.component.ts

@@ -0,0 +1,8 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+@Component({
+  selector: 'ish-approver-page',
+  templateUrl: './approver-page.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class ApproverPageComponent {}

projects/requisition-management/src/app/pages/buyer/buyer-page.component.html

@@ -0,0 +1,3 @@
+<h1>{{ 'account.requisitions.requisitions' | translate }}</h1>
+
+<p>{{ 'account.requisitions.requisitions.text' | translate }}</p>

projects/requisition-management/src/app/pages/buyer/buyer-page.component.spec.ts

@@ -0,0 +1,30 @@
+import { ComponentFixture, TestBed, async } from '@angular/core/testing';
+import { RouterTestingModule } from '@angular/router/testing';
+import { TranslateModule } from '@ngx-translate/core';
+
+import { BuyerPageComponent } from './buyer-page.component';
+
+describe('Buyer Page Component', () => {
+  let component: BuyerPageComponent;
+  let fixture: ComponentFixture<BuyerPageComponent>;
+  let element: HTMLElement;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [RouterTestingModule, TranslateModule.forRoot()],
+      declarations: [BuyerPageComponent],
+    }).compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(BuyerPageComponent);
+    component = fixture.componentInstance;
+    element = fixture.nativeElement;
+  });
+
+  it('should be created', () => {
+    expect(component).toBeTruthy();
+    expect(element).toBeTruthy();
+    expect(() => fixture.detectChanges()).not.toThrow();
+  });
+});

projects/requisition-management/src/app/pages/buyer/buyer-page.component.ts

@@ -0,0 +1,8 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+
+@Component({
+  selector: 'ish-buyer-page',
+  templateUrl: './buyer-page.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class BuyerPageComponent {}

projects/requisition-management/src/app/pages/requisition-management-routing.module.ts

@@ -0,0 +1,21 @@
+import { NgModule } from '@angular/core';
+import { RouterModule, Routes } from '@angular/router';
+
+import { ApproverPageComponent } from './approver/approver-page.component';
+import { BuyerPageComponent } from './buyer/buyer-page.component';
+
+/**
+ * routes for the requisition management
+ *
+ * visible for testing
+ */
+export const routes: Routes = [
+  { path: 'approver', component: ApproverPageComponent },
+  { path: 'buyer', component: BuyerPageComponent },
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule],
+})
+export class RequisitionManagementRoutingModule {}

projects/requisition-management/src/app/requisition-management.module.ts

@@ -0,0 +1,14 @@
+import { NgModule } from '@angular/core';
+
+import { SharedModule } from 'ish-shared/shared.module';
+
+import { ApproverPageComponent } from './pages/approver/approver-page.component';
+import { BuyerPageComponent } from './pages/buyer/buyer-page.component';
+import { RequisitionManagementRoutingModule } from './pages/requisition-management-routing.module';
+import { RequisitionManagementStoreModule } from './store/requisition-management-store.module';
+
+@NgModule({
+  declarations: [ApproverPageComponent, BuyerPageComponent],
+  imports: [RequisitionManagementRoutingModule, RequisitionManagementStoreModule, SharedModule],
+})
+export class RequisitionManagementModule {}

projects/requisition-management/src/app/services/requisition-management-breadcrumb/requisition-management-breadcrumb.service.spec.ts

@@ -0,0 +1,88 @@
+import { Component, Type } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
+import { Route, Router } from '@angular/router';
+import { RouterTestingModule } from '@angular/router/testing';
+import { TranslateModule } from '@ngx-translate/core';
+
+import { CoreStoreModule } from 'ish-core/store/core/core-store.module';
+
+import { routes } from '../../pages/requisition-management-routing.module';
+
+import { RequisitionManagementBreadcrumbService } from './requisition-management-breadcrumb.service';
+
+// tslint:disable-next-line: no-any
+function adaptRoutes(rts: Route[], cmp: Type<any>): Route[] {
+  return rts.map(r => ({
+    ...r,
+    component: r.component && cmp,
+    children: r.children && adaptRoutes(r.children, cmp),
+  }));
+}
+
+describe('Requisition Management Breadcrumb Service', () => {
+  let requisitionManagementBreadcrumbService: RequisitionManagementBreadcrumbService;
+  let router: Router;
+
+  beforeEach(() => {
+    @Component({ template: 'dummy' })
+    class DummyComponent {}
+    TestBed.configureTestingModule({
+      declarations: [DummyComponent],
+      imports: [
+        CoreStoreModule.forTesting(['router', 'configuration']),
+        RouterTestingModule.withRoutes([
+          ...adaptRoutes(routes, DummyComponent),
+          { path: '**', component: DummyComponent },
+        ]),
+        TranslateModule.forRoot(),
+      ],
+    });
+    requisitionManagementBreadcrumbService = TestBed.inject(RequisitionManagementBreadcrumbService);
+    router = TestBed.inject(Router);
+    router.initialNavigation();
+  });
+
+  it('should be created', () => {
+    expect(requisitionManagementBreadcrumbService).toBeTruthy();
+  });
+
+  describe('breadcrumb$', () => {
+    describe('unrelated routes', () => {
+      it('should not report a breadcrumb for unrelated routes', done => {
+        router.navigateByUrl('/foobar');
+        requisitionManagementBreadcrumbService.breadcrumb$('/my-account').subscribe(fail, fail, fail);
+        setTimeout(done, 2000);
+      });
+    });
+
+    describe('requisition management routes', () => {
+      it('should set breadcrumb for requisitions list view', done => {
+        router.navigateByUrl('/buyer');
+        requisitionManagementBreadcrumbService.breadcrumb$('/my-account').subscribe(breadcrumbData => {
+          expect(breadcrumbData).toMatchInlineSnapshot(`
+            Array [
+              Object {
+                "key": "account.requisitions.requisitions",
+              },
+            ]
+          `);
+          done();
+        });
+      });
+
+      it('should set breadcrumb for requisitions list view', done => {
+        router.navigateByUrl('/approver');
+        requisitionManagementBreadcrumbService.breadcrumb$('/my-account').subscribe(breadcrumbData => {
+          expect(breadcrumbData).toMatchInlineSnapshot(`
+            Array [
+              Object {
+                "key": "account.requisitions.approvals",
+              },
+            ]
+          `);
+          done();
+        });
+      });
+    });
+  });
+});