create bars component and bars service in order to fetch all bars in mongoDB

src/app/app.module.ts

@@ -18,13 +18,14 @@ import { APP_ROUTING } from './app.routing';
 import { StoreModule } from '@ngrx/store';
 import { EffectsModule } from '@ngrx/effects';
 import { StoreDevtoolsModule } from '@ngrx/store-devtools';
+
+// others
 import { environment } from 'src/environments/environment';
 import { reducersMap } from './share/store';
 import { AuthEffects } from './share/store/effects/auth.effects';
-import { WelcomeComponent } from './components/welcome/welcome.component';
 
 @NgModule({
-  declarations: [AppComponent, WelcomeComponent],
+  declarations: [AppComponent],
   imports: [
 		BrowserModule,
 		BrowserAnimationsModule,

src/app/app.routing.ts

 import { Route } from "@angular/router";
+import { BarsComponent } from "./components/bars/bars.component";
 import { SigninComponent } from "./components/signin/signin.component";
 import { SignupComponent } from "./components/signup/signup.component";
 import { WelcomeComponent } from "./components/welcome/welcome.component";
@@ -9,9 +10,9 @@ export const APP_ROUTING: Route[] = [
 	{ path: 'welcome', canActivate: [AlreadyLoggedInGuard], component: WelcomeComponent },
 	{ path: 'photos', canActivate: [AuthGuard], loadChildren: () => import('./photos/photos.module').then(m => m.PhotosModule) },
 	{ path: 'profile', canActivate: [AuthGuard], loadChildren: () => import('./profile/profile.module').then(m => m.ProfileModule) },
-	// { path: 'bars', canActivate: [AuthGuard], loadChildren: () => import('./bars/bars.module').then(m => m.BarsModule) },
+	{ path: 'bars', canActivate: [AuthGuard], component: BarsComponent },
 	{ path: 'signup', canActivate: [AlreadyLoggedInGuard], component: SignupComponent },
 	{ path: 'signin', canActivate: [AlreadyLoggedInGuard], component: SigninComponent },
-	{ path: '', redirectTo: 'welcome', pathMatch: 'full' },
-	{ path: '**', redirectTo: 'welcome', pathMatch: 'full' },
+	{ path: '', redirectTo: '', pathMatch: 'full' },
+	{ path: '**', redirectTo: '', pathMatch: 'full' },
 ];
\ No newline at end of file

src/app/components/bars/bars.component.html

+<p>bars works!</p>
+<p>
+	<button mat-raised-button routerLink="/profile" color="primary">profile</button>
+	<button mat-raised-button routerLink="/photos" color="accent">photos</button>
+</p>
\ No newline at end of file

src/app/components/bars/bars.component.ts

+import { Component, OnInit } from '@angular/core';
+
+@Component({
+  selector: 'app-bars',
+  templateUrl: './bars.component.html',
+  styleUrls: ['./bars.component.css']
+})
+export class BarsComponent implements OnInit {
+
+  constructor() {}
+
+  ngOnInit(): void {}
+
+}

src/app/photos/photos.component.ts

@@ -22,8 +22,6 @@ export class PhotosComponent implements OnInit {
 		private notificationService: NotificationService
 	) {
 		this.swUpdate.available.subscribe((version) => {
-			console.log(version);
-
 			if (version) {
 				this.swUpdate.activateUpdate().then(() => {
 					window.location.reload();

src/app/profile/profile.component.html

-<p>profile works!</p>
+<p>profile works!</p>
\ No newline at end of file
+<p>
+	<button mat-raised-button routerLink="/bars" color="primary">Liste des bars</button>
+	<button mat-raised-button routerLink="/photos" color="accent">photos</button>
+</p>
\ No newline at end of file

src/app/profile/profile.component.ts

@@ -19,7 +19,6 @@ export class ProfileComponent implements OnInit {
   ngOnInit(): void {
 		this.currentUser$ = this.store.pipe(select(userAuthSelector));
 		this.store.dispatch(new TryFetchCurrentUser());
-		console.log('finishing init');
 	}
 
 }

src/app/share/components/topbar/topbar.component.html

 <mat-toolbar *ngIf="isLoggedIn$ | async" color="primary" fxLayoutGap="15px">
-	<span routerLink="/">Mon logo</span>
+	<span routerLink="/welcome">Mon logo</span>
 	<!-- <span *ngIf="!(isLoggedIn$ | async)" fxLayoutGap="15px" fxLayout="row" fxLayoutAlign="center center">
 		<mat-icon class="link" routerLink="/signin">login</mat-icon>
 		<mat-icon class="link" routerLink="/signup">launch</mat-icon>

src/app/share/modules/core.module.ts

@@ -21,10 +21,14 @@ import { TopbarComponent } from '../components/topbar/topbar.component';
 // Interceptors
 import { AuthInterceptor } from '../interceptors/auth.interceptor';
 import { ReactiveFormsModule } from '@angular/forms';
+import { WelcomeComponent } from 'src/app/components/welcome/welcome.component';
+import { BarsComponent } from 'src/app/components/bars/bars.component';
 
 const COMPONENTS = [
 	SignupComponent,
 	SigninComponent,
+	WelcomeComponent,
+	BarsComponent,
 	TopbarComponent
 ];
 

src/app/share/services/bars.service.ts

+import { Injectable } from '@angular/core';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class BarsService {
+
+  constructor() { }
+}

src/app/share/store/effects/auth.effects.ts

@@ -15,7 +15,7 @@ import { HttpErrorResponse } from "@angular/common/http";
 
 @Injectable()
 export class AuthEffects {
-	private subscription: Subscription;
+	private subscription: Subscription = null;
 
 	constructor(
 		private actions$: Actions,
@@ -52,7 +52,6 @@ export class AuthEffects {
 	 	exhaustMap((credentials: { email: string, password: string}) =>
 		 	this.authService.signin(credentials).pipe(
 				map((token: string) => {
-					console.log('try signinsuccess');
 					return new SigninSuccess(token)
 				}),
 				catchError((error: HttpErrorResponse) => {
@@ -79,16 +78,16 @@ export class AuthEffects {
 		map((action: SigninSuccess) => action.payload),
 		tap((token: string) => {
 			localStorage.setItem('jwt', token);
-			
-			if (!this.subscription) {
+
+			if (this.subscription === null) {
 				this.subscription = this.authService.initRefreshToken().subscribe();
 				this.router.navigate(['/profile']);
 			}
 		}),
 	);
 
-	// Si on a pas de token, on a pas demander un refresh_token au back_end.
-	// On utilise donc le store dans l'effet pour vérifier (withLatestFrom)
+	// Si on a pas de token, on ne va pas demandé un refresh_token au back_end.
+	// On utilise donc le store dans l'effet pour le vérifier (withLatestFrom)
 	@Effect()
 	tryRefreshToken$ = this.actions$.pipe(
 		ofType(AuthActionsTypes.TRY_REFRESH_TOKEN),
@@ -100,6 +99,7 @@ export class AuthEffects {
 					catchError((err: any) => {
 						if(this.subscription) {
 							this.subscription.unsubscribe();
+							this.subscription = null;
 						}
 						localStorage.removeItem('jwt');