Add account object interface.

Add new vcard parser.

src/app/_models/account.spec.ts

@@ -0,0 +1,7 @@
+import { Account } from './account';
+
+describe('Account', () => {
+  it('should create an instance', () => {
+    expect(new Account()).toBeTruthy();
+  });
+});

src/app/_models/account.ts

@@ -0,0 +1,52 @@
+export interface AccountDetails {
+  date_registered: number;
+  gender: string;
+  identities: {
+    evm: {
+      'bloxberg:8996': string[];
+      'oldchain:1': string[];
+    }
+  };
+  location: {
+    area_name: string;
+  };
+  products: string[];
+  vcard: {
+    email: [{
+      value: string;
+    }];
+    fn: [{
+      value: string;
+    }];
+    n: [{
+      value: string[];
+    }];
+    tel: [{
+      meta: {
+        TYP: string[];
+      },
+      value: string;
+    }],
+    version: [{
+      value: string;
+    }];
+  };
+}
+
+export interface Signature {
+  algo: string;
+  data: string;
+  digest: string;
+  engine: string;
+}
+
+export interface Meta {
+  data: AccountDetails;
+  id: string;
+  signature: Signature;
+}
+
+export interface MetaResponse {
+  id: string;
+  m: Meta;
+}

src/app/_models/index.ts

@@ -1,3 +1,4 @@
 export * from '@app/_models/transaction';
 export * from '@app/_models/settings';
 export * from '@app/_models/user';
+export * from '@app/_models/account';

src/app/_services/user.service.ts

@@ -5,7 +5,7 @@ import {environment} from '@src/environments/environment';
 import {first} from 'rxjs/operators';
 import {AccountIndex, MutableKeyStore, MutablePgpKeyStore, PGPSigner, Signer} from '@app/_helpers';
 import {ArgPair, Envelope, Syncable, User} from 'cic-client-meta';
-import {parse} from '@src/assets/js/parse-vcard';
+const vCard = require('vcard-parser');
 
 @Injectable({
   providedIn: 'root'
@@ -16,6 +16,7 @@ export class UserService {
   signer: Signer = new PGPSigner(this.keystore);
   accountIndexQuery = new AccountIndex(environment.contractAddress);
 
+  accountsMeta = [];
   accounts: any = [];
   private accountsList = new BehaviorSubject<any>(this.accounts);
   accountsSubject = this.accountsList.asObservable();
@@ -155,8 +156,10 @@ export class UserService {
     const accountAddresses = await this.accountIndexQuery.last(await this.accountIndexQuery.totalAccounts());
     for (const accountAddress of accountAddresses.slice(offset, offset + limit)) {
       this.getAccountDetailsFromMeta(await User.toKey(accountAddress)).pipe(first()).subscribe(res => {
-        const accountInfo = Envelope.fromJSON(JSON.stringify(res)).unwrap().m.data;
-        accountInfo.vcard = parse(atob(accountInfo.vcard));
+        const account = Envelope.fromJSON(JSON.stringify(res)).unwrap();
+        this.accountsMeta.push(account);
+        const accountInfo = account.m.data;
+        accountInfo.vcard = vCard.parse(atob(accountInfo.vcard));
         this.accounts.push(accountInfo);
         this.accountsList.next(this.accounts);
       });

src/app/pages/accounts/accounts.component.html

@@ -54,12 +54,12 @@
                      matSortDirection="desc" matSortDisableClear>
             <ng-container matColumnDef="name">
               <mat-header-cell *matHeaderCellDef mat-sort-header> NAME </mat-header-cell>
-              <mat-cell *matCellDef="let user"> {{user?.vcard.fn}} </mat-cell>
+              <mat-cell *matCellDef="let user"> {{user?.vcard.fn[0].value}} </mat-cell>
             </ng-container>
 
             <ng-container matColumnDef="phone">
               <mat-header-cell *matHeaderCellDef mat-sort-header> PHONE NUMBER </mat-header-cell>
-              <mat-cell *matCellDef="let user"> {{user?.vcard.tel[0].value[0]}} </mat-cell>
+              <mat-cell *matCellDef="let user"> {{user?.vcard.tel[0].value}} </mat-cell>
             </ng-container>
 
             <ng-container matColumnDef="created">

src/app/pages/accounts/accounts.component.ts

@@ -14,7 +14,7 @@ import {Router} from '@angular/router';
 export class AccountsComponent implements OnInit {
   dataSource: MatTableDataSource<any>;
   accounts: any[] = [];
-  displayedColumns = ['name', 'phone', 'created', 'balance', 'type', 'status', 'location', 'failedPinAttempts', 'select'];
+  displayedColumns = ['name', 'phone', 'created', 'location', 'select'];
   initialSelection = [];
   allowMultiSelect = true;
   selection: SelectionModel<any>;