create db completion service and mock data

src/app/charts/device-chart/device-chart.component.ts

@@ -20,9 +20,10 @@ export class DeviceChartComponent implements OnInit {
   ngOnInit(): void { }
 
   ngAfterViewInit(): void {
-    // TODO switch to deviceService
     this.deviceService.getAll().subscribe(
       device => {
+        console.log("device", device);
+
         // Get StateType and convert to string 
         const stateType: Device.StateType = Device.getStateType(device);
         const state: string = Device.stateTypeToString(stateType);

src/app/completion.ts

@@ -0,0 +1,6 @@
+export interface Completion {
+  completion: number;
+  globalBytes: number;
+  needBytes: number;
+  needDeletes: number;
+}

src/app/mocks/mock-db-completion.ts

@@ -0,0 +1,24 @@
+export const dbCompletion =
+    [
+        {
+            "device": "YZJBJFX-RDBL7WY-6ZGKJ2D-4MJB4E7-ZATSDUY-LD6Y3L3-MLFUYWE-AEMXJAC",
+            "completion": 100,
+            "globalBytes": 156793013575,
+            "needBytes": 0,
+            "needDeletes": 0
+        },
+        {
+            "completion": 80,
+            "globalBytes": 3013575,
+            "needBytes": 100,
+            "needDeletes": 0
+        }
+    ]
+/*
+{
+  "completion": 100,
+  "globalBytes": 156793013575,
+  "needBytes": 0,
+  "needDeletes": 0
+}
+*/

src/app/services/db-completion.service.spec.ts

@@ -0,0 +1,16 @@
+import { TestBed } from '@angular/core/testing';
+
+import { DbCompletionService } from './db-completion.service';
+
+describe('DbCompletionService', () => {
+  let service: DbCompletionService;
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({});
+    service = TestBed.inject(DbCompletionService);
+  });
+
+  it('should be created', () => {
+    expect(service).toBeTruthy();
+  });
+});

src/app/services/db-completion.service.ts

@@ -0,0 +1,43 @@
+import { Injectable } from '@angular/core';
+import { HttpClient, HttpParams } from '@angular/common/http';
+import { environment } from 'src/environments/environment';
+import { apiURL, apiRetry } from '../api-utils';
+import { Completion } from '../completion';
+import { retry, map } from 'rxjs/operators';
+import { Observable } from 'rxjs';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class DbCompletionService {
+  private dbStatusUrl = environment.production ? apiURL + 'rest/db/completion' : 'api/dbCompletion';
+
+  constructor(private http: HttpClient) { }
+
+  getDeviceCompletion(id: string): Observable<Completion> {
+    let httpOptions: { params: HttpParams };
+    if (id) {
+      httpOptions = {
+        params: new HttpParams().set('device', id)
+      };
+    } else { }
+
+    return this.http
+      .get<Completion>(this.dbStatusUrl, httpOptions)
+      .pipe(
+        retry(apiRetry),
+        map(res => {
+          // Remove from array in developement
+          // in-memory-web-api returns arrays
+          if (!environment.production) {
+            const a: any = res as any;
+            if (a.length > 0) {
+              res = res[0];
+            }
+          }
+          return res;
+        })
+      );
+
+  }
+}

src/app/services/db-status.service.ts

@@ -15,7 +15,7 @@ import Folder from '../folder'
 export class DbStatusService {
   private dbStatusUrl = environment.production ? apiURL + 'rest/db/status' : 'api/dbStatus';
 
-  constructor(private http: HttpClient, private cookieService: CookieService) { }
+  constructor(private http: HttpClient) { }
 
   getFolderStatus(id: string): Observable<Folder.Status> {
     let httpOptions: { params: HttpParams };

src/app/services/device.service.ts

@@ -3,6 +3,7 @@ import Device from '../device';
 import { Observable } from 'rxjs';
 import { SystemConfigService } from './system-config.service';
 import { SystemConnectionsService } from './system-connections.service';
+import { DbCompletionService } from './db-completion.service';
 
 @Injectable({
   providedIn: 'root'
@@ -11,7 +12,8 @@ export class DeviceService {
   private devices: Device[];
   constructor(
     private systemConfigService: SystemConfigService,
-    private systemConnectionsService: SystemConnectionsService
+    private systemConnectionsService: SystemConnectionsService,
+    private dbCompletionService: DbCompletionService
   ) { }
 
   getAll(): Observable<Device> {
@@ -40,9 +42,16 @@ export class DeviceService {
                 connections => {
                   // TODO: check connection and request total
                   this.devices.forEach(device => {
-                    observer.next(device);
+                    // TODO make this synchronous
+                    this.dbCompletionService.getDeviceCompletion(device.deviceID).subscribe(
+                      c => {
+                        device.completion = c.completion;
+                        observer.next(device);
+                      });
+
+                    //TODO complete observer when finished
+                    // observer.complete();
                   });
-                  observer.complete();
                 }
               );
 

src/app/services/in-memory-config-data.service.ts

@@ -2,13 +2,14 @@ import { Injectable } from '@angular/core';
 import { config } from '../mocks/mock-config'
 import { dbStatus } from '../mocks/mock-db-status'
 import { connections } from '../mocks/mock-connections'
+import { dbCompletion } from '../mocks/mock-db-completion'
 
 @Injectable({
   providedIn: 'root'
 })
 export class InMemoryConfigDataService {
   createDb() {
-    return { config, dbStatus, connections };
+    return { config, dbStatus, connections, dbCompletion };
   }
 
   constructor() { }

src/app/services/system-config.service.ts

@@ -59,10 +59,9 @@ export class SystemConfigService {
     return folderObservable;
   }
 
-  // TODO switch to devices
   getDevices(): Observable<Device[]> {
     const deviceObserverable: Observable<Device[]> = new Observable((observer) => {
-      if (this.folders) {
+      if (this.devices) {
         observer.next(this.devices);
       } else {
         let t = setInterval(() => {