Sdk ngrx

applications/home/src/app/app.module.ts

@@ -10,6 +10,7 @@ import { RouterModule } from '@angular/router';
 import { MfRouterModule, redirectRoute } from './router';
 import { LocaleModule } from '@meteo/core';
 import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { ConductorModule } from '@lucca-front-sdk/ng/ngrx';
 
 @NgModule({
 	declarations: [
@@ -21,9 +22,10 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 		ForecastModule,
 		RouterModule.forRoot(redirectRoute),
 		MfRouterModule,
-		StoreModule.forRoot({}),
-		EffectsModule.forRoot([]),
-		StoreDevtoolsModule.instrument({}),
+		StoreDevtoolsModule.instrument({
+			name: 'meteo-fiable',
+		}),
+		ConductorModule.forRoot(),
 		LocaleModule,
 		BrowserAnimationsModule,
 	],

applications/home/src/app/forecast/components/forecast.component.html

@@ -4,4 +4,4 @@
 </div>
 <mf-timeline></mf-timeline>
 
-<mf-forecast-meta [forecast]="forecast$ | async"></mf-forecast-meta>
+<mf-forecast-meta [forecast]="forecast$ | async"></mf-forecast-meta>

applications/home/src/app/forecast/components/forecast.component.ts

@@ -1,45 +1,29 @@
 import { Component, OnInit } from '@angular/core';
 import { Observable, combineLatest } from 'rxjs';
-import { delay } from 'rxjs/operators';
-import { Moment } from 'moment';
 
-import { Store } from '@ngrx/store';
-import { IGmapGeocode, IForecast, Forecast, Weather } from '@meteo/models';
-import { ILocationStore, IDateStore } from '@meteo/store';
+import { Store, select } from '@ngrx/store';
+import { IForecast } from '@meteo/models';
+import { selectCurrentForecast } from '@meteo/store';
 
 @Component({
 	selector: 'mf-forecast',
 	templateUrl: 'forecast.component.html',
 	styleUrls: ['forecast.component.scss'],
 })
 export class ForecastComponent implements OnInit {
-	location$: Observable<IGmapGeocode>;
-	date$: Observable<Moment>;
 	forecast$: Observable<IForecast>;
 	constructor(
-		private store$: Store<ILocationStore & IDateStore>,
+		private store$: Store<any>,
 	) {}
 	ngOnInit() {
 		this.initObs();
 	}
 	initObs() {
-		this.initStoreObs();
 		this.initForecastObs();
 	}
-	initStoreObs() {
-		this.location$ = this.store$.select(s => s.location).pipe(delay(0));
-		this.date$ = this.store$.select(s => s.date).pipe(delay(0));
-	}
 	initForecastObs() {
-		this.forecast$ = combineLatest(
-			this.location$,
-			this.date$,
-			(geocode, date) => {
-				if (!!geocode && !!date) {
-					return new Forecast(geocode, date, Weather.sunny);
-				}
-				return undefined;
-			}
-		)
+		this.forecast$ = this.store$.pipe(
+			select(selectCurrentForecast),
+		);
 	}
 }

applications/home/src/app/forecast/components/timeline/timeline.component.ts

@@ -1,53 +1,25 @@
 import { Component, OnInit } from '@angular/core';
 import { Observable, combineLatest } from 'rxjs';
-import { delay } from 'rxjs/operators';
-import * as moment from 'moment';
 
-import { Store } from '@ngrx/store';
-import { IGmapGeocode, IForecast, Forecast, Weather } from '@meteo/models';
-import { ILocationStore, IDateStore } from '@meteo/store';
-const timeline = [
-	{ d: -1, weather: Weather.rainy  },
-	{ d: 0, weather: Weather.sunny },
-	{ d: 1, weather: Weather.sunny  },
-	{ d: 2, weather: Weather.cloudy },
-	{ d: 3, weather: undefined },
-	{ d: 4, weather: undefined },
-	{ d: 5, weather: undefined },
-];
+import { Store, select } from '@ngrx/store';
+import { IForecast } from '@meteo/models';
+import { selectForecasts } from '@meteo/store';
 @Component({
 	selector: 'mf-timeline',
 	templateUrl: 'timeline.component.html',
 	styleUrls: ['timeline.component.scss'],
 })
 export class TimelineComponent implements OnInit {
-	location$: Observable<IGmapGeocode>;
-	date$: Observable<moment.Moment>;
 	timeline$: Observable<IForecast[]>;
 	constructor(
-		private store$: Store<ILocationStore & IDateStore>,
+		private store$: Store<any>,
 	) {}
 	ngOnInit() {
-		this.initObs();
-	}
-	initObs() {
-		this.initStoreObs();
 		this.initTimelineObs();
 	}
-	initStoreObs() {
-		this.location$ = this.store$.select(s => s.location).pipe(delay(0));
-		this.date$ = this.store$.select(s => s.date).pipe(delay(0));
-	}
 	initTimelineObs() {
-		this.timeline$ = combineLatest(
-			this.location$,
-			this.date$,
-			(geocode, date) => {
-				if (!!geocode && !!date) {
-					return timeline.map(t => new Forecast(geocode, moment(date).add(t.d, 'days'), t.weather));
-				}
-				return [];
-			}
+		this.timeline$ = this.store$.pipe(
+			select(selectForecasts),
 		);
 	}
 }

applications/home/src/app/forecast/forecast.module.ts

@@ -1,15 +1,16 @@
 import { NgModule } from '@angular/core';
 import { CommonModule } from '@angular/common';
 
-import { LocationStoreModule, DateStoreModule } from '@meteo/store';
+import { ForecastStoreModule } from '@meteo/store';
+import { ConductorModule } from '@lucca-front-sdk/ng/ngrx';
 
 import {
 	ForecastComponent,
 	ForecastDetailComponent,
 	TimelineComponent,
 	TimelineForecastComponent,
 } from './components';
-import { ForecastMetaModule } from './components/meta/forecast-meta.module';
+import { ForecastMetaModule } from './meta/index';
 
 
 @NgModule({
@@ -27,9 +28,9 @@ import { ForecastMetaModule } from './components/meta/forecast-meta.module';
 	],
 	imports: [
 		CommonModule,
-		LocationStoreModule,
-		DateStoreModule,
+		ForecastStoreModule,
 		ForecastMetaModule,
+		ConductorModule,
 	],
 })
 export class ForecastModule { }

applications/home/src/app/forecast/meta/index.ts

@@ -0,0 +1,2 @@
+export * from './forecast-meta.component';
+export * from './forecast-meta.module';

applications/home/src/app/form/components/form.component.ts

@@ -8,9 +8,10 @@ import * as moment from 'moment';
 import { Store } from '@ngrx/store';
 import { Form, NgForm } from '@angular/forms';
 
-import { IGmapGeocode, IForecast, Forecast } from '@meteo/models';
+import { IGmapGeocode } from '@meteo/models';
 import { GmapService } from '@meteo/core';
 import { SetAdressCmd, SetDateCmd, ILocationStore, IDateStore } from '@meteo/store';
+import { Conductor } from '@lucca-front-sdk/ng/ngrx';
 
 @Component({
 	selector: 'mf-form',
@@ -32,6 +33,7 @@ export class MfFormComponent implements OnInit, OnDestroy {
 	constructor(
 		private gmapService: GmapService,
 		private store$: Store<ILocationStore & IDateStore>,
+		private conductor: Conductor,
 	) {}
 
 	ngOnInit() {
@@ -45,8 +47,14 @@ export class MfFormComponent implements OnInit, OnDestroy {
 	}
 	submit() {
 		if (this.form.valid) {
-			this.store$.dispatch(new SetAdressCmd(this.model.address));
-			this.store$.dispatch(new SetDateCmd(this.model.date));
+			this.conductor.dispatch(new SetAdressCmd(this.model.address))
+			.subscribe(c => {
+				console.log(`${c.correlationId} - ${c.type}`);
+			});
+			this.conductor.dispatch(new SetDateCmd(this.model.date))
+			.subscribe(c => {
+				console.log(`${c.correlationId} - ${c.type}`);
+			});
 		}
 	}
 	searchAddresses(clue = '') {

applications/home/src/app/form/form.module.ts

@@ -9,6 +9,7 @@ import { LocationStoreModule, DateStoreModule } from '@meteo/store';
 import {
 	MfFormComponent,
 } from './components';
+import { ConductorModule } from '@lucca-front-sdk/ng/ngrx';
 
 
 @NgModule({
@@ -28,6 +29,7 @@ import {
 		LocationStoreModule,
 		DateStoreModule,
 		GmapModule,
+		ConductorModule,
 	],
 	providers: [
 	],

applications/home/src/app/router/router.trigger.ts

@@ -1,58 +1,61 @@
 import { Injectable } from '@angular/core';
-import { merge } from 'rxjs';
+import { merge, of } from 'rxjs';
 import { debounceTime, withLatestFrom, tap, map } from 'rxjs/operators';
-import { MfActions, AAction, AEvent } from '@meteo/core';
 import { IGmapGeocode } from '@meteo/models';
 import { Moment } from 'moment';
 import { SetDateEvt, SetGeocodeEvt, ILocationStore, IDateStore } from '@meteo/store';
 import { Router, ActivatedRoute } from '@angular/router';
 import { Store } from '@ngrx/store';
-import { Effect } from '@ngrx/effects';
+import { Effect, Actions } from '@ngrx/effects';
+import { ofPending, ofSuccess, AEvent, ACommand, callAndFollow, correlated, ofComplete, complete, IAction } from '@lucca-front-sdk/ng/ngrx';
 
-class UpdateUrlAction extends AAction<void> {
-	constructor(location?: IGmapGeocode, date?: Moment) {
-		super(
-			'[norm] update url',
-			undefined,
-			{ location: location, date: date }
-		);
-	}
+class UpdateUrlCmd extends ACommand<{ location: IGmapGeocode, date: Moment, }> {
+	static TYPE = '[cmd] update url';
 }
-class UpdateUrlEvt extends AEvent<void> {
-	constructor() {
-		super('[evt] update url');
-	}
+
+class UpdateUrlEvt extends AEvent<{ location: IGmapGeocode, date: Moment, }> {
+	static TYPE = '[evt] update url';
 }
 @Injectable()
 export class RouterTrigger {
-	locUpdated = this.actions$.of(new SetGeocodeEvt());
-	dateUpdated = this.actions$.of(new SetDateEvt());
+	locUpdated = this.actions$.pipe(
+		ofSuccess(SetGeocodeEvt)
+	);
+	dateUpdated = this.actions$.pipe(
+		ofSuccess(SetDateEvt),
+	);
 
 	updateUrlTrigger = merge(
 		this.locUpdated,
 		this.dateUpdated,
 	).pipe(
 		debounceTime(500),
 		withLatestFrom(this.store$.select(s => s.location), this.store$.select(s => s.date)),
+		tap(x => console.log(x))
 	);
 
-	@Effect() updateUrlHandler = this.updateUrlTrigger
-		.pipe(map(([action, location, date]) => new UpdateUrlAction(location, date)));
+	@Effect() trigger = this.updateUrlTrigger
+		.pipe(map(([action, location, date]) => new UpdateUrlCmd({location: location, date: date})));
 
-	@Effect() updateUrlEvt = this.actions$.of(new UpdateUrlAction())
-		.pipe(
-			tap(a => {
-				const params = {
-					date: a.payload.date.format('YYYY-MM-DD'),
-					place: a.payload.location.place_id,
-				};
-				this.router.navigate([], { queryParams: params, replaceUrl: true, relativeTo: this.route });
-			}),
-			map(a => new UpdateUrlEvt()),
-		);
+	@Effect() handler = this.actions$.pipe(
+		ofPending(UpdateUrlCmd),
+		callAndFollow(p => {
+			const params = {
+				date: p.date.format('YYYY-MM-DD'),
+				place: p.location.place_id,
+			};
+			this.router.navigate([], { queryParams: params, replaceUrl: true, relativeTo: this.route });
+			return of(p);
+		}, UpdateUrlEvt),
+	);
 
+	@Effect() complete = this.actions$.pipe(
+		correlated(UpdateUrlCmd),
+		ofComplete(UpdateUrlEvt),
+		complete(UpdateUrlCmd),
+		);
 	constructor(
-		private actions$: MfActions,
+		private actions$: Actions<IAction>,
 		private router: Router,
 		private route: ActivatedRoute,
 		private store$: Store<ILocationStore & IDateStore>,

applications/home/src/theming/_commons.override.scss

@@ -19,11 +19,11 @@ $commons: (
 // 		"size": 14px
 // 	),
 	"elevations": (
-		"1":	"0 1px 3px #{rgba($global-shadow-color, 0.12)}, 0 1px 2px #{rgba($global-shadow-color, 0.12)}",
-		"2":	"0 3px 6px #{rgba($global-shadow-color, 0.16)}, 0 3px 6px #{rgba($global-shadow-color, 0.16)}",
-		"3":	"0 10px 20px #{rgba($global-shadow-color, 0.19)}, 0 6px 6px #{rgba($global-shadow-color, 0.23)}",
-		"4":	"0 1px 2px #{rgba($global-shadow-color, 0.05)}, 0 2px 20px #{rgba($global-shadow-color, 0.2)}",
-		"5":	"0 2px 4px #{rgba($global-shadow-color, 0.05)}, 0 4px 40px #{rgba($global-shadow-color, 0.2)}"
+		"elevation-1":	"0 1px 3px #{rgba($global-shadow-color, 0.12)}, 0 1px 2px #{rgba($global-shadow-color, 0.12)}",
+		"elevation-2":	"0 3px 6px #{rgba($global-shadow-color, 0.16)}, 0 3px 6px #{rgba($global-shadow-color, 0.16)}",
+		"elevation-3":	"0 10px 20px #{rgba($global-shadow-color, 0.19)}, 0 6px 6px #{rgba($global-shadow-color, 0.23)}",
+		"elevation-4":	"0 1px 2px #{rgba($global-shadow-color, 0.05)}, 0 2px 20px #{rgba($global-shadow-color, 0.2)}",
+		"elevation-5":	"0 2px 4px #{rgba($global-shadow-color, 0.05)}, 0 4px 40px #{rgba($global-shadow-color, 0.2)}"
 	),
 // 	"border": (
 // 		"radius": 2px

libraries/core/src/lib/index.ts

@@ -1,3 +1,2 @@
-export * from './store/index';
 export * from './gmap/index';
 export * from './locale/index';