From aa33d7c5cdab5937010e2268acc6128da49f1d60 Mon Sep 17 00:00:00 2001
From: Kai Moritz <kai@juplo.de>
Date: Sun, 5 Jul 2020 13:46:52 +0200
Subject: [PATCH] WIP: Extract interaction with store into service

---
 src/app/vorgang.service.spec.ts      |  3 +--
 src/app/vorgang.service.ts           | 12 ++++++++++--
 src/app/vorgang/vorgang.component.ts | 10 ++++++----
 3 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/src/app/vorgang.service.spec.ts b/src/app/vorgang.service.spec.ts
index 72b694d..240bb33 100644
--- a/src/app/vorgang.service.spec.ts
+++ b/src/app/vorgang.service.spec.ts
@@ -1,8 +1,7 @@
-import { TestBed, getTestBed } from '@angular/core/testing';
+import { TestBed } from '@angular/core/testing';
 import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
 
 import { VorgangService } from './vorgang.service';
-import { Vorgang } from './vorgang';
 
 describe('VorgangService', () => {
   let service: VorgangService;
diff --git a/src/app/vorgang.service.ts b/src/app/vorgang.service.ts
index 3d433e7..b68958b 100644
--- a/src/app/vorgang.service.ts
+++ b/src/app/vorgang.service.ts
@@ -1,8 +1,10 @@
 import { Injectable } from '@angular/core';
 import { HttpClient, HttpHeaders } from '@angular/common/http';
 import { Observable, of, EMPTY } from 'rxjs';
-import { catchError, tap } from 'rxjs/operators';
+import { catchError, map, tap } from 'rxjs/operators';
+import { select, Store } from '@ngrx/store';
 import { Vorgang } from './vorgang';
+import { State } from './reducers/vorgang';
 
 
 @Injectable({
@@ -18,7 +20,9 @@ export class VorgangService {
     })
   };
 
-  constructor(private http: HttpClient) { }
+  constructor(
+    private http: HttpClient,
+    private store: Store<{ vorgang: State }>) { }
 
   /** POST: Einen neuen Vorgang erzeugen */
   create(vorgang: Vorgang): Observable<Vorgang> {
@@ -37,6 +41,10 @@ export class VorgangService {
     return this.gpsUrl + vbId + '/save';
   }
 
+  Observable<number> observe() {
+    return this.store.pipe(select('vorgang'), map(vorgang => vorgang.counter));
+  }
+
   /**
    * Handle Http operation that failed.
    * Let the app continue.
diff --git a/src/app/vorgang/vorgang.component.ts b/src/app/vorgang/vorgang.component.ts
index ac50408..587ebd4 100644
--- a/src/app/vorgang/vorgang.component.ts
+++ b/src/app/vorgang/vorgang.component.ts
@@ -1,8 +1,8 @@
 import { Component, OnInit } from '@angular/core';
 import { Observable } from 'rxjs';
-import { Store, select } from '@ngrx/store';
+import { Store } from '@ngrx/store';
 import { increment, decrement, reset } from '../actions/vorgang';
-import { map } from 'rxjs/operators';
+import { VorgangService } from '../vorgang.service';
 import { State } from '../reducers';
 
 @Component({
@@ -14,8 +14,10 @@ export class VorgangComponent implements OnInit {
 
   vorgang$: Observable<number>;
 
-  constructor(private store: Store<{ vorgang: State }>) {
-    this.vorgang$ = store.pipe(select('vorgang'), map(vorgang => vorgang.counter));
+  constructor(
+    private store: Store<{ vorgang: State }>,
+    private service: VorgangService) {
+    this.vorgang$ = service.observe();
   }
 
   ngOnInit(): void {
-- 
2.20.1