OZG-106 add lazy loaded lib vorgang-detail

goofy-client/angular.json

@@ -363,6 +363,32 @@
           "style": "scss"
         }
       }
+    },
+    "vorgang-detail": {
+      "projectType": "library",
+      "root": "libs/vorgang-detail",
+      "sourceRoot": "libs/vorgang-detail/src",
+      "prefix": "goofy-client",
+      "architect": {
+        "lint": {
+          "builder": "@nrwl/linter:eslint",
+          "options": {
+            "lintFilePatterns": ["libs/vorgang-detail/src/**/*.ts"]
+          }
+        },
+        "test": {
+          "builder": "@nrwl/jest:jest",
+          "options": {
+            "jestConfig": "libs/vorgang-detail/jest.config.js",
+            "passWithNoTests": true
+          }
+        }
+      },
+      "schematics": {
+        "@schematics/angular:component": {
+          "style": "scss"
+        }
+      }
     }
   },
   "cli": {

goofy-client/apps/goofy/src/app/app.module.ts

@@ -4,17 +4,23 @@ import localeDe from '@angular/common/locales/de';
 import { LOCALE_ID, NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
-import { RouterModule } from '@angular/router';
+import { RouterModule, Routes } from '@angular/router';
 import { ApiRootModule } from '@goofy-client/api-root-shared';
 import { EnvironmentModule } from '@goofy-client/environment-shared';
 import { NavigationModule } from '@goofy-client/navigation';
 import { UiModule } from '@goofy-client/ui';
-import { VorgangModule } from '@goofy-client/vorgang';
 import { AppComponent } from './app.component';
 import { AppSharedModule } from '@goofy-client/app-shared'
 
 registerLocaleData(localeDe);
 
+const routes: Routes = [
+	{
+		path: '',
+		loadChildren: () => import('@goofy-client/vorgang').then(m => m.VorgangModule)
+	}
+];
+
 @NgModule({
 	declarations: [
 		AppComponent,
@@ -23,11 +29,10 @@ registerLocaleData(localeDe);
 		BrowserModule,
 		HttpClientModule,
 		BrowserAnimationsModule,
-		RouterModule,
+		RouterModule.forRoot(routes),
 		UiModule,
 		EnvironmentModule,
 		ApiRootModule,
-		VorgangModule,
 		NavigationModule,
 		AppSharedModule
 	],

goofy-client/jest.config.js

@@ -10,5 +10,6 @@ module.exports = {
     '<rootDir>/libs/navigation',
     '<rootDir>/libs/test-utils',
     '<rootDir>/libs/app-shared',
+    '<rootDir>/libs/vorgang-detail',
   ],
 };

goofy-client/libs/vorgang-detail/.eslintrc.json

+{ "extends": "../../.eslintrc.json", "ignorePatterns": ["!**/*"], "rules": {} }

goofy-client/libs/vorgang-detail/README.md

+# vorgang-detail
+
+This library was generated with [Nx](https://nx.dev).
+
+## Running unit tests
+
+Run `nx test vorgang-detail` to execute the unit tests.

goofy-client/libs/vorgang-detail/jest.config.js

+module.exports = {
+  displayName: 'vorgang-detail',
+  preset: '../../jest.preset.js',
+  setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts'],
+  globals: {
+    'ts-jest': {
+      tsConfig: '<rootDir>/tsconfig.spec.json',
+      stringifyContentPathRegex: '\\.(html|svg)$',
+      astTransformers: {
+        before: [
+          'jest-preset-angular/build/InlineFilesTransformer',
+          'jest-preset-angular/build/StripStylesTransformer',
+        ],
+      },
+    },
+  },
+  coverageDirectory: '../../coverage/libs/vorgang-detail',
+  snapshotSerializers: [
+    'jest-preset-angular/build/AngularNoNgAttributesSnapshotSerializer.js',
+    'jest-preset-angular/build/AngularSnapshotSerializer.js',
+    'jest-preset-angular/build/HTMLCommentSerializer.js',
+  ],
+};

goofy-client/libs/vorgang-detail/src/index.ts

+export * from './lib/vorgang-detail.module';

goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-container/vorgang-detail-container.component.html

+<p>vorgang-detail-container works!</p>

goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-container/vorgang-detail-container.component.spec.ts

+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { VorgangDetailContainerComponent } from './vorgang-detail-container.component';
+
+describe('VorgangDetailContainerComponent', () => {
+  let component: VorgangDetailContainerComponent;
+  let fixture: ComponentFixture<VorgangDetailContainerComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ VorgangDetailContainerComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(VorgangDetailContainerComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

goofy-client/libs/vorgang-detail/src/lib/vorgang-detail-container/vorgang-detail-container.component.ts

+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'goofy-client-vorgang-detail-container',
+  templateUrl: './vorgang-detail-container.component.html',
+  styleUrls: ['./vorgang-detail-container.component.scss']
+})
+export class VorgangDetailContainerComponent implements OnInit {
+
+  constructor() { }
+
+  ngOnInit(): void {
+  }
+
+}

goofy-client/libs/vorgang-detail/src/lib/vorgang-detail.module.spec.ts

+import { VorgangDetailModule } from './vorgang-detail.module';
+import { TestBed } from '@angular/core/testing';
+
+describe('VorgangDetailModule', () => {
+	beforeEach(() => {
+		TestBed.configureTestingModule({
+			imports: [VorgangDetailModule],
+		}).compileComponents();
+	});
+
+	it('should create', () => {
+		expect(VorgangDetailModule).toBeDefined();
+	});
+});

goofy-client/libs/vorgang-detail/src/lib/vorgang-detail.module.ts

+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { VorgangDetailContainerComponent } from './vorgang-detail-container/vorgang-detail-container.component';
+import { RouterModule, Routes } from '@angular/router';
+
+const routes: Routes = [
+	{
+		path: '',
+		component: VorgangDetailContainerComponent,
+	}
+];
+
+@NgModule({
+  imports: [
+  	CommonModule,
+		RouterModule.forChild(routes)
+	],
+  declarations: [VorgangDetailContainerComponent]
+})
+export class VorgangDetailModule {}

goofy-client/libs/vorgang-detail/src/test-setup.ts

+import 'jest-preset-angular';

goofy-client/libs/vorgang-detail/tsconfig.json

+{
+  "extends": "../../tsconfig.base.json",
+  "files": [],
+  "include": [],
+  "references": [
+    {
+      "path": "./tsconfig.lib.json"
+    },
+    {
+      "path": "./tsconfig.spec.json"
+    }
+  ]
+}

goofy-client/libs/vorgang-detail/tsconfig.lib.json

+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "target": "es2015",
+    "declaration": true,
+    "declarationMap": true,
+    "inlineSources": true,
+    "types": [],
+    "lib": ["dom", "es2018"]
+  },
+  "angularCompilerOptions": {
+    "skipTemplateCodegen": true,
+    "strictMetadataEmit": true,
+    "enableResourceInlining": true
+  },
+  "exclude": ["src/test-setup.ts", "**/*.spec.ts"],
+  "include": ["**/*.ts"]
+}

goofy-client/libs/vorgang-detail/tsconfig.spec.json

+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "../../dist/out-tsc",
+    "module": "commonjs",
+    "types": ["jest", "node"]
+  },
+  "files": ["src/test-setup.ts"],
+  "include": ["**/*.spec.ts", "**/*.d.ts"]
+}

goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.html

-<!-- <div class="main column" [routerLink]="['/vorgang/' + getVorgangUri()]"> -->
+<a [routerLink]="['/vorgang/' + getVorgangUri()]">
 	<div class="main column">
 		<div class="row">
 			<div class="status" [ngClass]="vorgang.status | lowercase">
@@ -25,3 +25,4 @@
 		<mat-icon>account_circle</mat-icon>
 		<div class="picture"></div>
 	</div>
+</a>

goofy-client/libs/vorgang/src/lib/vorgang-list-container/vorgang-list/vorgang-list-item/vorgang-list-item.component.scss

 @import "variables";
 
-:host {
+a {
 	display: flex;
 	height: 88px;
 	box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.08), inset 1px 0 0 rgba(0, 0, 0, 0.08), inset -1px 0 0 rgba(0, 0, 0, 0.08);

goofy-client/libs/vorgang/src/lib/vorgang.module.ts

@@ -18,7 +18,7 @@ const routes: Routes = [
 	},
 	{
 		path: 'vorgang/:id',
-		component: VorgangDetailComponent,
+		loadChildren: () => import('@goofy-client/vorgang-detail').then(m => m.VorgangDetailModule)
 	}
 ];
 
@@ -29,7 +29,7 @@ const routes: Routes = [
 		TechSharedModule,
 		ScrollingModule,
 		UiModule,
-		RouterModule.forRoot(routes)
+		RouterModule.forChild(routes)
 	],
 	declarations: [
 		VorgangListComponent,