Merge branch '1-front-creer-la-page-choix-des-bars' into 'master'

Resolve "[FRONT] Créer la page : choix des bars"

Closes #1

See merge request !1

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');
 			

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

+import { Actions, createEffect, ofType } from "@ngrx/effects";
+import { Injectable } from "@angular/core";
+import { catchError, map, mergeMap } from "rxjs/operators";
+import { EMPTY, of } from "rxjs";
+
+import { BarActionsTypes, FetchBarsFailed, FetchBarsSuccess } from "../actions/bar.actions";
+import { BarService } from "../../services/bar.service";
+import { Bar } from "../../models/bar.model";
+
+@Injectable()
+export class BarEffects {
+	constructor(
+		private actions$: Actions,
+		private barService: BarService
+	) {}
+
+	loadBars$ = createEffect(() => this.actions$.pipe(
+		ofType(BarActionsTypes.FETCH_BARS),
+		mergeMap(() => this.barService.getAll()
+			.pipe(
+				map((bars: Bar[]) => (new FetchBarsSuccess(bars))),
+				catchError(() => of(new FetchBarsFailed('failed fetching all bars')))
+			))
+	));
+}
\ No newline at end of file

src/app/share/store/index.ts

 import { ActionReducerMap } from "@ngrx/store";
 import { authReducer, AuthState } from "./reducers/auth.reducers";
+import { barReducer, BarState } from "./reducers/bar.reducers";
 
 export interface State {
 	auth: AuthState;
+	bars: BarState;
 }
 
 export const reducersMap: ActionReducerMap<State> = {
-	auth: authReducer
+	auth: authReducer,
+	bars: barReducer
 };
\ No newline at end of file

src/app/share/store/reducers/bar.reducers.ts

+import { Bar } from "../../models/bar.model";
+import { BarsActions, BarActionsTypes } from "../actions/bar.actions";
+
+export interface BarState {
+	bars: Bar[];
+	currentBar: Bar;
+	error: string;
+}
+
+const defaultBarState = {
+	bars: [],
+	currentBar: null,
+	error: '',
+}
+
+export function barReducer(state: BarState = defaultBarState, action: BarsActions): BarState {
+	switch (action.type) {
+
+		case BarActionsTypes.FETCH_BARS_SUCCESS: {
+			return {
+				...state,
+				bars: action.payload
+			};
+		}
+
+		case BarActionsTypes.FETCH_BARS_FAILED: {
+			return {
+				...state,
+				error: action.payload
+			};
+		}
+	}
+
+	return state;
+}
\ No newline at end of file

src/app/share/store/selectors/bar.selectors.ts

+import { createFeatureSelector, createSelector } from "@ngrx/store";
+import { BarState } from "../reducers/bar.reducers";
+
+export const baseSelector = createFeatureSelector('bars');
+
+export const allBarsSelector = createSelector(baseSelector, (barState: BarState) => barState?.bars);
+
+export const currentBarSelector = createSelector(baseSelector, (barState: BarState) => barState?.currentBar);
\ No newline at end of file

src/styles.css

@@ -2,7 +2,7 @@
 @import '~@angular/material/prebuilt-themes/deeppurple-amber.css';
 
 html, body { height: 100%; }
-body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; background-color: #f1f1f1; text-align: center;}
+body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; background-color: #f1f1f1; text-align: center; color: #222222}
 
 .link {
 	outline: 0;
@@ -20,11 +20,17 @@ body { margin: 0; font-family: Roboto, "Helvetica Neue", sans-serif; background-
 
 
 .column-container {
-	flex-direction: column;
+	flex-flow: column nowrap;
+	padding: 5px;
+}
+
+.row-container {
+	display: flex;
+	flex-flow: row nowrap;
 	padding: 5px;
 }
 
-.column-container > * {
+.column-container > *, .row-container > * {
 	margin: 5px;
 }