feat(data): use data provider for list and detail view

src/app/modules/data/detail/data-detail.component.ts

@@ -14,29 +14,21 @@
  */
 import {Component} from '@angular/core';
 import {ActivatedRoute} from '@angular/router';
-import {SCThingOriginType, SCThings, SCThingType} from '@openstapps/core';
+import {SCThing} from '@openstapps/core';
+import {DataProvider, DataScope} from '../data.provider';
 
 @Component({
   selector: 'stapps-data-detail',
   templateUrl: 'data-detail.html',
 })
 export class DataDetailComponent {
-  item: SCThings;
-  constructor(private route: ActivatedRoute) {
-    this.item = {
-      categories: ['main dish'],
-      name: 'Demo-Name',
-      origin: {
-        indexed: '2018-09-11T12:30:00Z',
-        name: 'Dummy',
-        type: SCThingOriginType.Remote,
-      },
-      type: SCThingType.Dish,
-      uid: '',
-    };
+  dataProvider: DataProvider;
+  item: SCThing;
+  constructor(private route: ActivatedRoute, dataProvider: DataProvider) {
+    this.dataProvider = dataProvider;
   }
-  ngOnInit() {
-    this.item.uid = this.route.snapshot.paramMap.get('uid') || '';
-    this.item.description = 'Demo Beschreibung für das Item mit der UID ' + this.item.uid;
+  async ngOnInit() {
+    const uid = this.route.snapshot.paramMap.get('uid') || '';
+    this.item = (await this.dataProvider.get(uid, DataScope.Remote));
   }
 }

src/app/modules/data/detail/data-detail.html

@@ -8,7 +8,7 @@
   </ion-toolbar>
 </ion-header>
 
-<ion-content padding>
+<ion-content padding *ngIf="item">
   <stapps-data-list-item [item]="item"></stapps-data-list-item>
 
   <div [ngSwitch]="item.type">
@@ -18,4 +18,4 @@
       <p *ngIf="item.description">{{item.description}}</p>
     </span>
   </div>
-</ion-content>
+</ion-content>