From f363afdb551b663a3e16d934dc67d2a2a5f466b0 Mon Sep 17 00:00:00 2001
From: Max Ehrlicher-Schmidt <maxes2000@t-online.de>
Date: Sat, 19 Sep 2020 14:05:20 +0200
Subject: [PATCH] Implement bikesService

---
 src/app/pages/tables/bikes/bikes.component.ts | 24 ++++---------------
 src/app/services/bikes.service.ts             | 14 ++++++++++-
 2 files changed, 18 insertions(+), 20 deletions(-)

diff --git a/src/app/pages/tables/bikes/bikes.component.ts b/src/app/pages/tables/bikes/bikes.component.ts
index 16c38db..655ecf7 100644
--- a/src/app/pages/tables/bikes/bikes.component.ts
+++ b/src/app/pages/tables/bikes/bikes.component.ts
@@ -1,33 +1,19 @@
 import { Component, OnInit } from '@angular/core';
-import { DeepExtractTypeSkipArrays } from 'ts-deep-extract-types';
-import { GetCargoBikesGQL, GetCargoBikesQuery } from '../../../../generated/graphql';
-
-type CargoBikeResult = DeepExtractTypeSkipArrays<GetCargoBikesQuery, ["cargoBikes"]>;
+import { BikesService, CargoBikeResult } from 'src/app/services/bikes.service';
 
 @Component({
   selector: 'app-bikes',
   templateUrl: './bikes.component.html',
   styleUrls: ['./bikes.component.scss'],
 })
-export class BikesComponent implements OnInit {
+export class BikesComponent {
   displayedColumns: string[] = ['id', 'name', 'weight', 'symbol'];
   
   bikes: CargoBikeResult[];
 
-  constructor(private bikesGQL: GetCargoBikesGQL) {
-    this.bikesGQL.watch().valueChanges.subscribe((result) => {
-      this.bikes = result.data.cargoBikes;
-    });
-  }
+  constructor(private bikesService: BikesService) {
+    bikesService.bikes.subscribe(bikes => this.bikes = bikes);
 
-  onTableInput(element) {
-    //element.weight += 1;
-    console.log(element);
+    bikesService.loadBikes();
   }
-
-  onFocus(event) {
-    console.log(event);
-  }
-
-  ngOnInit(): void {}
 }
diff --git a/src/app/services/bikes.service.ts b/src/app/services/bikes.service.ts
index 6bb9a7d..379ee9c 100644
--- a/src/app/services/bikes.service.ts
+++ b/src/app/services/bikes.service.ts
@@ -1,9 +1,21 @@
 import { Injectable } from '@angular/core';
+import { BehaviorSubject } from 'rxjs';
+import { GetCargoBikesGQL, GetCargoBikesQuery } from 'src/generated/graphql';
+import { DeepExtractTypeSkipArrays } from 'ts-deep-extract-types';
+
+export type CargoBikeResult = DeepExtractTypeSkipArrays<GetCargoBikesQuery, ["cargoBikes"]>;
 
 @Injectable({
   providedIn: 'root'
 })
 export class BikesService {
+  bikes: BehaviorSubject<CargoBikeResult[]> = new BehaviorSubject([]);
+
+  constructor(private bikesGQL: GetCargoBikesGQL) { }
 
-  constructor() { }
+  loadBikes() {
+    this.bikesGQL.watch().valueChanges.subscribe((result) => {
+      this.bikes.next(result.data.cargoBikes);
+    });
+  }
 }