Merge branch 'master' into dependabot/npm_and_yarn/frontend/postcss-a…

…nd-angular-devkit/build-angular-8.4.31

backend/actions/block_detail.js

@@ -12,6 +12,40 @@ app.use((req, res, next) => {
   next();
 });
 
+app.get('/api/block/height/:height', async (req, res) => {
+  const height = req.params.height;
+
+  try {
+    const blockHash = await rest.block.height(height);
+    const block = await rest.block.get(blockHash);
+    const status = await rest.block.status(blockHash);
+    if (!block || !status) {
+      res.status(404).send('Block not found.');
+      return;
+    }
+    const tip = await rest.block.tip.height();
+    res.json({
+      blockHash: block.id,
+      confirmations: tip - block.height,
+      ntx: block.tx_count,
+      height: block.height,
+      timestamp: block.time,
+      proof: block.signature,
+      sizeBytes: block.size,
+      version: block.features,
+      merkleRoot: block.merkle_root,
+      immutableMerkleRoot: block.im_merkle_root,
+      previousBlock: block.previousblockhash,
+      nextBlock: status.next_best
+    });
+  } catch (err) {
+    logger.error(
+      `Error retrieving information for block  - height = ${height}. Error Message - ${err.message}`
+    );
+    res.status(503).send('Service Temporary Unavailable');
+  }
+});
+
 app.get('/api/block/:blockHash', async (req, res) => {
   const blockHash = req.params.blockHash;
 

backend/actions/color_list.js

@@ -0,0 +1,25 @@
+const app = require('../app.js');
+const rest = require('../libs/rest');
+const logger = require('../libs/logger');
+
+app.use((req, res, next) => {
+  res.header('Access-Control-Allow-Origin', '*');
+  res.header(
+    'Access-Control-Allow-Headers',
+    'Origin, X-Requested-With, Content-Type, Accept'
+  );
+  next();
+});
+
+app.get('/api/colors', async (req, res) => {
+  const lastSeenColorId = req.query.lastSeenColorId;
+
+  try {
+    const colors = await rest.color.list(lastSeenColorId);
+    console.log(colors);
+    res.json({ colors: colors });
+  } catch (err) {
+    logger.error(`Error retrieving colors. Error Message - ${err.message}`);
+    res.status(500).send(`Error Retrieving Blocks`);
+  }
+});

backend/libs/rest.js

@@ -148,6 +148,20 @@ const block = {
 };
 
 const color = {
+  list: async lastSeenColorId => {
+    let url;
+    if (lastSeenColorId) {
+      url = `${baseUrl}/colors/${lastSeenColorId}`;
+    } else {
+      url = `${baseUrl}/colors`;
+    }
+    const response = await fetch(url, { agent: agentSelector });
+    if (response.ok) {
+      return response.json();
+    } else {
+      throw new Error(`failed to fetch API ${url}`);
+    }
+  },
   get: async colorId => {
     const url = `${baseUrl}/color/${colorId}`;
     const response = await fetch(url, { agent: agentSelector });

backend/server.js

@@ -2,6 +2,7 @@ const app = require('./app.js');
 require('./actions/block_detail.js');
 require('./actions/block_list.js');
 require('./actions/color_detail.js');
+require('./actions/color_list.js');
 require('./actions/transaction_detail.js');
 require('./actions/transaction_list.js');
 require('./actions/address_detail.js');

frontend/src/app/address/address.page.ts

@@ -1,9 +1,10 @@
 import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute } from '@angular/router';
-import { NavController } from '@ionic/angular';
+import { NavController, ToastController } from '@ionic/angular';
 
 import { BackendService } from '../backend.service';
 import { AppConst } from '../app.const';
+import Helper from '../app.helper';
 
 @Component({
   selector: 'app-address',
@@ -34,6 +35,7 @@ export class AddressPage implements OnInit {
   constructor(
     private activatedRoute: ActivatedRoute,
     private navCtrl: NavController,
+    private toastController: ToastController,
     private backendService: BackendService
   ) {}
 
@@ -56,24 +58,7 @@ export class AddressPage implements OnInit {
   }
 
   copyAddress() {
-    const textArea = document.createElement('textarea');
-    textArea.value = this.address;
-
-    document.body.appendChild(textArea);
-    textArea.focus();
-    textArea.select();
-
-    try {
-      document.execCommand('copy');
-      this.copied = true;
-      setTimeout(() => {
-        this.copied = false;
-      }, 800);
-    } catch (err) {
-      console.error('Fallback: Oops, unable to copy', err);
-    }
-
-    document.body.removeChild(textArea);
+    Helper.copy(this.toastController, this.address);
   }
 
   onNextPage() {

frontend/src/app/app-routing.module.ts

@@ -13,6 +13,11 @@ const routes: Routes = [
     loadChildren: () =>
       import('./blocks/blocks.module').then(m => m.BlocksPageModule)
   },
+  {
+    path: 'block/height/:height',
+    loadChildren: () =>
+      import('./block/block.module').then(m => m.BlockPageModule)
+  },
   {
     path: 'block/:hash',
     loadChildren: () =>
@@ -25,6 +30,11 @@ const routes: Routes = [
         m => m.BlockRawdataPageModule
       )
   },
+  {
+    path: 'colors',
+    loadChildren: () =>
+      import('./colors/colors.module').then(m => m.ColorsPageModule)
+  },
   {
     path: 'color/:colorId',
     loadChildren: () =>

frontend/src/app/app.component.spec.ts

@@ -51,25 +51,29 @@ describe('AppComponent', () => {
     await fixture.detectChanges();
     const app = fixture.nativeElement;
     const menuItems = app.querySelectorAll('ion-label');
-    expect(menuItems.length).toEqual(3);
+    expect(menuItems.length).toEqual(4);
     expect(menuItems[0].textContent).toContain('Blocks');
     expect(menuItems[1].textContent).toContain('Txns');
-    expect(menuItems[2].textContent).toContain('Tracking Validation');
+    expect(menuItems[2].textContent).toContain('Colors');
+    expect(menuItems[3].textContent).toContain('Tracking Validation');
   });
 
   it('should have urls', async () => {
     const fixture = await TestBed.createComponent(AppComponent);
     await fixture.detectChanges();
     const app = fixture.nativeElement;
     const menuItems = app.querySelectorAll('ion-item');
-    expect(menuItems.length).toEqual(3);
+    expect(menuItems.length).toEqual(4);
     expect(menuItems[0].getAttribute('ng-reflect-router-link')).toEqual(
       '/blocks'
     );
     expect(menuItems[1].getAttribute('ng-reflect-router-link')).toEqual(
       '/tx/recent'
     );
     expect(menuItems[2].getAttribute('ng-reflect-router-link')).toEqual(
+      '/colors'
+    );
+    expect(menuItems[3].getAttribute('ng-reflect-router-link')).toEqual(
       '/material_tracking_validation'
     );
   });

frontend/src/app/app.component.ts

@@ -21,6 +21,10 @@ export class AppComponent implements OnInit {
       title: 'Txns',
       url: '/tx/recent'
     },
+    {
+      title: 'Colors',
+      url: '/colors'
+    },
     {
       title: 'Tracking Validation',
       url: '/material_tracking_validation'

frontend/src/app/app.helper.ts

@@ -0,0 +1,16 @@
+import { Component, Injectable } from '@angular/core';
+import { ToastController } from '@ionic/angular';
+
+export default class Helper {
+  static async copy(toastController: ToastController, text: string) {
+    navigator.clipboard.writeText(text);
+    const toast = await toastController.create({
+      message: 'Copied',
+      color: 'dark',
+      position: 'middle',
+      duration: 1000,
+      animated: true
+    });
+    toast.present();
+  }
+}

frontend/src/app/backend.service.ts

@@ -30,6 +30,10 @@ export class BackendService {
     return this.http.get(`${this.backendUrl}/api/block/${blockHash}`);
   }
 
+  getBlockByHeight(height: number): Observable<any> {
+    return this.http.get(`${this.backendUrl}/api/block/height/${height}`);
+  }
+
   getRawBlock(blockHash: string): Observable<any> {
     return this.http.get(`${this.backendUrl}/api/block/${blockHash}/raw`);
   }
@@ -76,6 +80,16 @@ export class BackendService {
     return this.http.get(`${this.backendUrl}/api/tx/${query}/get`);
   }
 
+  getColors(lastSeenColorId?: string): Observable<any> {
+    return this.http.get(`${this.backendUrl}/api/colors`, {
+      params: new HttpParams({
+        fromObject: {
+          lastSeenColorId: (lastSeenColorId || '').toString()
+        }
+      })
+    });
+  }
+
   getColor(colorId: string, lastSeenTxid?: string): Observable<any> {
     return this.http.get(`${this.backendUrl}/api/color/${colorId}`, {
       params: new HttpParams({

frontend/src/app/block-rawdata/block-rawdata.page.html

@@ -12,16 +12,8 @@
       <ion-icon name="copy-outline" color="primary" id="copy-icon"></ion-icon>
       Copy Raw Data
     </ion-button>
-    <b *ngIf="copied" id="copied-text">Copied !</b>
   </div>
   <div class="ion-padding ion-margin" id="copy-content">
     <p id="myInput" class="text-color">{{ blockRawData }}</p>
   </div>
-  <div class="ion-text-center block-md">
-    <ion-button (click)="copyBlockRawData()">
-      <ion-icon name="copy-outline" color="primary" id="copy-icon"></ion-icon>
-      Copy Raw Data </ion-button
-    ><br />
-    <b *ngIf="copied" id="copied-text-md">Copied !</b>
-  </div>
 </ion-content>

frontend/src/app/block-rawdata/block-rawdata.page.spec.ts

@@ -1,5 +1,5 @@
 import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
-import { IonicModule } from '@ionic/angular';
+import { IonicModule, NavParams } from '@ionic/angular';
 
 import { BlockRawdataPage } from './block-rawdata.page';
 import { HttpClientTestingModule } from '@angular/common/http/testing';
@@ -11,7 +11,8 @@ describe('BlockRawdataPage', () => {
   beforeEach(waitForAsync(() => {
     TestBed.configureTestingModule({
       declarations: [BlockRawdataPage],
-      imports: [IonicModule.forRoot(), HttpClientTestingModule]
+      imports: [IonicModule.forRoot(), HttpClientTestingModule],
+      providers: [NavParams]
     }).compileComponents();
 
     fixture = TestBed.createComponent(BlockRawdataPage);

frontend/src/app/block-rawdata/block-rawdata.page.ts

@@ -1,24 +1,25 @@
 import { Component, OnInit, Input } from '@angular/core';
-import { NavParams, ModalController } from '@ionic/angular';
+import { NavParams, ModalController, ToastController } from '@ionic/angular';
 import { HttpClient } from '@angular/common/http';
 
 import { BackendService } from '../backend.service';
+import Helper from '../app.helper';
 
 @Component({
   selector: 'app-block-rawdata',
   templateUrl: './block-rawdata.page.html',
   styleUrls: ['./block-rawdata.page.scss'],
-  providers: [BackendService, NavParams]
+  providers: [BackendService]
 })
 export class BlockRawdataPage implements OnInit {
   @Input() blockHash: string;
   blockRawData = '';
-  copied = false;
 
   constructor(
     private navParams: NavParams,
     private httpClient: HttpClient,
     private modalCtrl: ModalController,
+    private toastController: ToastController,
     private backendService: BackendService
   ) {}
 
@@ -40,24 +41,7 @@ export class BlockRawdataPage implements OnInit {
   }
 
   copyBlockRawData() {
-    const textArea = document.createElement('textarea');
-    textArea.value = this.blockRawData;
-
-    document.body.appendChild(textArea);
-    textArea.focus();
-    textArea.select();
-
-    try {
-      document.execCommand('copy');
-      this.copied = true;
-      setTimeout(() => {
-        this.copied = false;
-      }, 800);
-    } catch (err) {
-      console.error('Fallback: Oops, unable to copy', err);
-    }
-
-    document.body.removeChild(textArea);
+    Helper.copy(this.toastController, this.blockRawData);
   }
 
   dismiss() {