break purchase-history into solo components

src/app/bc-info/purchase-history/purchase-history.component.html

@@ -0,0 +1,24 @@
+<div id="tx-history">
+    <div *ngFor="let transfer of lastTransfers; index as i" class="card">
+        <div class="card-header">
+            <small>{{transfer.timestamp}}</small>
+
+            <span style="float: right;">                            
+                <button style="margin-right: 5px" class="btn btn-secondary btn-sm">
+                    Data
+                </button>
+                <button style="margin-right: 5px" class="btn btn-sm" (click)="transfer.expanded = !transfer.expanded">
+                    <i [class]="transfer.expanded ? 'icon-arrow-up' : 'icon-arrow-down'"></i>
+                </button>
+            </span>
+            
+        </div>
+
+        <div [class]="transfer.expanded ? '' : 'collapse'">
+            <div class="card-body">
+                Extent: {{transfer.extent}}
+                Amount: {{transfer.amount}}
+            </div>
+        </div>
+    </div>
+</div>

src/app/bc-info/purchase-history/purchase-history.component.ts

@@ -0,0 +1,20 @@
+import { Component, OnInit } from '@angular/core'
+import { BcInfoService } from '../bc-info.service'
+import {Purchase} from './purchase/purchase.component'
+
+
+@Component({
+    selector: 'purchase-history',
+    templateUrl: 'purchase-history.component.html',
+})
+export class PurchaseHistory implements OnInit {
+    lastPurchases: Array<Purchase>;
+
+    constructor(bcInfoService: BcInfoService) {
+
+    }
+    
+    ngOnInit(): void {
+        throw new Error('Method not implemented.');
+    }
+}

src/app/bc-info/purchase-history/purchase/purchase.component.html

@@ -0,0 +1,22 @@
+<div class="card">
+
+    <div class="card-header">
+        <small>{{timestamp}}</small>
+        <span style="float: right;">                            
+            <button style="margin-right: 5px" class="btn btn-secondary btn-sm">
+                Data
+            </button>
+            <button style="margin-right: 5px" class="btn btn-sm" (click)="expanded = !expanded">
+                <i [class]="expanded ? 'icon-arrow-up' : 'icon-arrow-down'"></i>
+            </button>
+        </span>        
+    </div>
+
+    <div [class]="expanded ? '' : 'collapse'">
+        <div class="card-body">
+            Extent: {{extent}}
+            Amount: {{amount}}
+        </div>
+    </div>
+
+</div>

src/app/bc-info/purchase-history/purchase/purchase.component.ts

@@ -0,0 +1,20 @@
+import { Component } from '@angular/core'
+import {Extent} from 'ol/extent'
+import {BcInfoService} from '../../bc-info.service'
+
+@Component({
+    selector: 'purchase',
+    templateUrl: 'purchase.component.html',
+})
+export class Purchase {
+    hash: string;    
+    timestamp: string;
+    extent: Extent;
+    amount: number;  
+    expanded: boolean = false;
+    loadingData: boolean = false;
+
+    constructor(bcInfoService: BcInfoService){
+
+    }
+}