import { Observable } from ‘rxjs/Observable‘;import { BehaviorSubject } from ‘rxjs/BehaviorSubject‘;import ‘rxjs/add/operator/pluck‘;import ‘rxjs/add/operator/distinctUntilChanged‘;import {User} from ‘./auth/shared/services/auth/auth.service‘;export interface State {  user: User;  [key: string]: any}const state: State = {  user: undefined};export class Store {  private subject = new BehaviorSubject<State>(state);  private store = this.subject.asObservable().distinctUntilChanged();  get value() {    return this.subject.value;  }  select<T>(name: string): Observable<T> {    return this.store.pluck(name);  }  set(name: string, state: any) {    this.subject.next({ ...this.value, [name]: state });  }}

import {Injectable} from ‘@angular/core‘;import {AngularFireAuth} from ‘angularfire2/auth‘;import {Store} from ‘store‘;import ‘rxjs/add/operator/do‘;export interface User {  uid: string;  email: string;  authenticated: boolean;}@Injectable()export class AuthService {  // handle on every auth state changes  auth$ = this.af.authState    .do(next => {      if (!next) {        this.store.set(‘user‘, null);        return;      }      const user = {        email: next.email,        uid: next.uid,        authenticated: true      };      this.store.set(‘user‘, user);    });  constructor(    private af: AngularFireAuth,    private store: Store  ) {  }  createUser(email: string, password: string) {    return this.af.auth.createUserWithEmailAndPassword(email, password);  }  loginUser(email: string, password: string) {    return this.af.auth.signInWithEmailAndPassword(email, password)  }}

import {Component, OnDestroy, OnInit} from ‘@angular/core‘;import {Store} from ‘store‘;import {AuthService} from ‘../../../auth/shared/services/auth/auth.service‘;import {Observable} from ‘rxjs/Observable‘;import {Subscription} from ‘rxjs/Subscription‘;import {User} from ‘firebase/app‘;@Component({  selector: ‘app-root‘,  styleUrls: [‘app.component.scss‘],  template: `    <div>      <h1>{{user$ | async | json}}</h1>      <div class="wrapper">        <router-outlet></router-outlet>      </div>    </div>  `})export class AppComponent implements OnInit, OnDestroy{  user$: Observable<User>;  subscription: Subscription;  constructor(    private store: Store,    private authService: AuthService  ) {}  ngOnInit() {    this.subscription = this.authService.auth$.subscribe();    this.user$ = this.store.select<User>(‘user‘);  }  ngOnDestroy() {    this.subscription.unsubscribe();  }}