module refactor

src/app/app-routing.module.ts

@@ -6,11 +6,11 @@ import { Routes, RouterModule } from '@angular/router';
 const routes: Routes = [
   {
     path: '',
-    loadChildren: () => import('../modules/pool/pool.module').then(m => m.PoolModule)
+    loadChildren: () => import('../modules/layout/layout.module').then(m => m.LayoutModule)
   },
   {
     path: '**',
-    loadChildren: () => import('../modules/pool/pool.module').then(m => m.PoolModule)
+    loadChildren: () => import('../modules/layout/layout.module').then(m => m.LayoutModule)
   }
 ];
 

src/modules/layout/components/layout/layout.component.html

@@ -1,7 +1,7 @@
 <div id="nav">
     <img src="../../assets/images/logo.png" alt="TFTPaths">
 </div>
-<app-home></app-home>
+<<router-outlet></router-outlet>>
 <div id="footer">
 
 </div>

src/modules/layout/layout-routing.module.ts

@@ -0,0 +1,23 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+import { LayoutComponent } from './components/layout/layout.component';
+
+
+const routes: Routes = [
+  { path: '',
+    component: LayoutComponent,
+    children: [
+      {
+        path: '',
+        loadChildren: () => import('../pool/pool.module').then(m => m.PoolModule)
+      }
+    ]
+  },
+  { path: '**', component: LayoutComponent, pathMatch: 'full' }
+];
+
+@NgModule({
+  imports: [RouterModule.forChild(routes)],
+  exports: [RouterModule]
+})
+export class LayoutRoutingModule { }

src/modules/layout/layout.module.ts

@@ -0,0 +1,19 @@
+import { NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+
+import { LayoutComponent } from './components/layout/layout.component';
+import { PoolModule } from '../pool/pool.module';
+import { LayoutRoutingModule } from './layout-routing.module';
+
+@NgModule({
+  declarations: [
+    LayoutComponent
+  ],
+  imports: [
+    CommonModule,
+    LayoutRoutingModule,
+    PoolModule
+  ]
+})
+
+export class LayoutModule { }

src/modules/pool/components/pool/pool.component.ts

@@ -13,12 +13,12 @@ import { DataToShare } from 'src/models/dataToShare';
 
 
 @Component({
-  selector: 'app-home',
+  selector: 'app-pool',
-  templateUrl: './home.component.html',
+  templateUrl: './pool.component.html',
-  styleUrls: ['./home.component.scss']
+  styleUrls: ['./pool.component.scss']
 })
 
-export class HomeComponent implements OnInit, OnDestroy {
+export class PoolComponent implements OnInit, OnDestroy {
   formFilters: FormGroup;
   bonusesPool: Bonus[] = [];
   champions: Champion[] = [];

src/modules/pool/pool-routing.module.ts

@@ -1,11 +1,11 @@
 import { NgModule } from '@angular/core';
 import { Routes, RouterModule } from '@angular/router';
-import { LayoutComponent } from 'src/modules/pool/components/layout/layout.component';
+import { PoolComponent } from './components/pool/pool.component';
 
 
 const routes: Routes = [
-  { path: '', component: LayoutComponent, pathMatch: 'full' },
+  { path: '', component: PoolComponent, pathMatch: 'full' },
-  { path: '**', component: LayoutComponent, pathMatch: 'full' }
+  { path: '**', component: PoolComponent, pathMatch: 'full' }
 ];
 
 @NgModule({

src/modules/pool/pool.module.ts

@@ -6,13 +6,11 @@ import { ReactiveFormsModule } from '@angular/forms';
 
 import { PoolService } from 'src/modules/pool/services/pool.service';
 
-import { LayoutComponent } from './components/layout/layout.component';
+import { PoolComponent } from './components/pool/pool.component';
-import { HomeComponent } from './components/home/home.component';
 
 @NgModule({
   declarations: [
-    LayoutComponent,
+    PoolComponent
-    HomeComponent
   ],
   imports: [
     CommonModule,

src/modules/pool/services/pool.service.ts

@@ -152,9 +152,11 @@ export class PoolService {
    * Update role pool
    */
   updatePool() {
+    let pool = [];
     this.championsPool.forEach(champion => {
-      this.rolesPool = _.union(this.rolesPool, champion.roles);
+      pool = _.union(this.rolesPool, champion.roles);
     });
+    this.rolesPool = pool;
   }
 
   /**

src/shared/constants.ts

@@ -20,6 +20,7 @@ export class Constants {
     public static championName = 'name';
 
     public static roles = traits.map(trait => trait.name);
+
     public static bonuses: Bonus [] = traits.reduce((previous, current)  => {
         current.sets.forEach(set => {
             previous.push({