Modularize the pages

src/app/app-routing.module.ts

@@ -1,37 +1,34 @@
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
-import { ClickAndCollectComponent } from './pages/click-and-collect/click-and-collect.component';
-import { DeliveryComponent } from './pages/delivery/delivery.component';
 import { ProfileComponent } from './pages/profile/profile.component';
-import { ReturnsComponent } from './pages/returns/returns.component';
-import { PrivacyPolicyComponent } from './pages/privacy-policy/privacy-policy.component';
-import { ImprintComponent } from './pages/imprint/imprint.component';
+import { PrivacyPolicyComponent } from './privacy-policy/pages/privacy-policy/privacy-policy.component';
+import { ImprintComponent } from './imprint/pages/imprint/imprint.component';
 
 const routes: Routes = [
-  {
-    path: 'returns',
-    component: ReturnsComponent,
-  },
-  {
-    path: 'click-and-collect',
-    component: ClickAndCollectComponent,
-  },
-  {
-    path: 'delivery',
-    component: DeliveryComponent,
-  },
+  // {
+  //   path: 'returns',
+  //   component: ReturnsComponent,
+  // },
+  // {
+  //   path: 'click-and-collect',
+  //   component: ClickAndCollectComponent,
+  // },
+  // {
+  //   path: 'delivery',
+  //   component: DeliveryComponent,
+  // },
   {
     path: 'profile',
-    component: ProfileComponent,
-  },
-  {
-    path: 'about-us',
-    component: ImprintComponent,
-  },
-  {
-    path: 'privacy-statement',
-    component: PrivacyPolicyComponent,
+    component: ProfileComponent, // TODO Place into module.
   },
+  // {
+  //   path: 'about-us',
+  //   component: ImprintComponent,
+  // },
+  // {
+  //   path: 'privacy-statement',
+  //   component: PrivacyPolicyComponent,
+  // },
 ];
 
 @NgModule({

src/app/app.module.ts

@@ -1,5 +1,4 @@
 import { BrowserModule } from '@angular/platform-browser';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { ScrollingModule } from '@angular/cdk/scrolling';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { NgModule } from '@angular/core';
@@ -30,10 +29,6 @@ import { MaterialDesignVCLIconAliasResolverService } from './shared/icon-resolve
 
 import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
-import { ClickAndCollectComponent } from './pages/click-and-collect/click-and-collect.component';
-import { DeliveryComponent } from './pages/delivery/delivery.component';
-import { ProfileComponent } from './pages/profile/profile.component';
-import { ReturnsComponent } from './pages/returns/returns.component';
 import { ServiceTeaserComponent } from './components/service-teaser/service-teaser.component';
 import { PromotionBarComponent } from './components/promotion-bar/promotion-bar.component';
 import { NavigationComponent } from './components/navigation/navigation.component';
@@ -54,8 +49,6 @@ import { CartLayerItemComponent } from './components/cart-layer-item/cart-layer-
 import { CartLayerContentsComponent } from './components/cart-layer-contents/cart-layer-contents.component';
 import { MenuLayerContentComponent } from './components/top-bar/menu-layer-content/menu-layer-content.component';
 import { MenuLayerTitleComponent } from './components/top-bar/menu-layer-title/menu-layer-title.component';
-import { PrivacyPolicyComponent } from './pages/privacy-policy/privacy-policy.component';
-import { ImprintComponent } from './pages/imprint/imprint.component';
 import { HoverColorPickerDirective } from './directives/hover-color-picker-directive.service';
 import { GraphQLModule } from './graphql.module';
 import { ProductsModule } from './products/products.module';
@@ -83,10 +76,6 @@ const vclModules = [
 @NgModule({
   declarations: [
     AppComponent,
-    ClickAndCollectComponent,
-    DeliveryComponent,
-    ProfileComponent,
-    ReturnsComponent,
     ServiceTeaserComponent,
     PromotionBarComponent,
     NavigationComponent,
@@ -101,8 +90,6 @@ const vclModules = [
     MenuLayerContentComponent,
     MenuLayerTitleComponent,
     CookiePreferenceComponent,
-    PrivacyPolicyComponent,
-    ImprintComponent,
     HoverColorPickerDirective,
   ],
   imports: [
@@ -125,7 +112,7 @@ const vclModules = [
     OverlayModule,
     ScrollingModule,
     ...vclModules,
-    SharedModule
+    SharedModule,
   ],
   exports: [TranslateModule],
   providers: [

src/app/click-and-collect/click-and-collect.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { ClickAndCollectComponent } from './pages/click-and-collect/click-and-collect.component';
+import { RouterModule, Routes } from '@angular/router';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: ClickAndCollectComponent,
+  },
+];
+
+@NgModule({
+  declarations: [ClickAndCollectComponent],
+  imports: [CommonModule, RouterModule.forChild(routes)],
+})
+export class ClickAndCollectModule {}

src/app/pages/click-and-collect/click-and-collect.component.ts → src/app/click-and-collect/pages/click-and-collect/click-and-collect.component.ts

@@ -1,17 +1,14 @@
 import { Component, OnInit } from '@angular/core';
-import { CartService } from 'src/app/services/cart.service';
 import { ScreenService } from 'src/app/services/screen.service';
 
 @Component({
   selector: 'app-click-and-collect',
   templateUrl: './click-and-collect.component.html',
   styleUrls: ['./click-and-collect.component.scss'],
 })
-export class ClickAndCollectComponent implements OnInit {
+export class ClickAndCollectComponent {
   constructor(private displayService: ScreenService) {}
 
-  ngOnInit(): void {}
-
   screenWidth() {
     return this.displayService.getScreenSize();
   }

src/app/delivery/delivery.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { DeliveryComponent } from './pages/delivery/delivery.component';
+import { RouterModule, Routes } from '@angular/router';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: DeliveryComponent,
+  },
+];
+
+@NgModule({
+  declarations: [DeliveryComponent],
+  imports: [CommonModule, RouterModule.forChild(routes)],
+})
+export class DeliveryModule {}

src/app/pages/delivery/delivery.component.ts → src/app/delivery/pages/delivery/delivery.component.ts

@@ -7,11 +7,9 @@ import { ScreenService } from 'src/app/services/screen.service';
   templateUrl: './delivery.component.html',
   styleUrls: ['./delivery.component.scss'],
 })
-export class DeliveryComponent implements OnInit {
+export class DeliveryComponent {
   constructor(private displayService: ScreenService) {}
 
-  ngOnInit(): void {}
-
   public screenWidth() {
     return this.displayService.getScreenSize();
   }

src/app/imprint/imprint.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { ImprintComponent } from './pages/imprint/imprint.component';
+import { RouterModule, Routes } from '@angular/router';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: ImprintComponent,
+  },
+];
+
+@NgModule({
+  declarations: [ImprintComponent],
+  imports: [CommonModule, RouterModule.forChild(routes)],
+})
+export class ImprintModule {}

src/app/pages/imprint/imprint.component.ts → src/app/imprint/pages/imprint/imprint.component.ts

@@ -3,13 +3,8 @@ import { Component, OnInit } from '@angular/core';
 @Component({
   selector: 'app-imprint',
   templateUrl: './imprint.component.html',
-  styleUrls: ['./imprint.component.scss']
+  styleUrls: ['./imprint.component.scss'],
 })
-export class ImprintComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
+export class ImprintComponent {
+  constructor() {}
 }

src/app/pages/privacy-policy/privacy-policy.component.ts → src/app/privacy-policy/pages/privacy-policy/privacy-policy.component.ts

@@ -3,13 +3,8 @@ import { Component, OnInit } from '@angular/core';
 @Component({
   selector: 'app-privacy-policy',
   templateUrl: './privacy-policy.component.html',
-  styleUrls: ['./privacy-policy.component.scss']
+  styleUrls: ['./privacy-policy.component.scss'],
 })
-export class PrivacyPolicyComponent implements OnInit {
-
-  constructor() { }
-
-  ngOnInit(): void {
-  }
-
+export class PrivacyPolicyComponent {
+  constructor() {}
 }

src/app/privacy-policy/privacy-statement.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { RouterModule, Routes } from '@angular/router';
+import { PrivacyPolicyComponent } from './pages/privacy-policy/privacy-policy.component';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: PrivacyPolicyComponent,
+  },
+];
+
+@NgModule({
+  declarations: [PrivacyPolicyComponent],
+  imports: [CommonModule, RouterModule.forChild(routes)],
+})
+export class PrivacyPolicyModule {}

src/app/returns/returns.module.ts

@@ -0,0 +1,17 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { RouterModule, Routes } from '@angular/router';
+import { ReturnsComponent } from './pages/returns/returns.component';
+
+const routes: Routes = [
+  {
+    path: '',
+    component: ReturnsComponent,
+  },
+];
+
+@NgModule({
+  declarations: [ReturnsComponent],
+  imports: [CommonModule, RouterModule.forChild(routes)],
+})
+export class ReturnsModule {}