grassrootseconomics/cic-staff-client
8
0
Fork 0
Code Issues 26 Pull Requests Projects Releases Wiki Activity

Refactor mappings to handle object type.

Browse Source
This commit is contained in:
Spencer Ofwiti 2021-06-18 14:03:29 +03:00
parent c4c8a6d13f
commit de83b89580
8 changed files with 1013 additions and 1228 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1984
src/app/_helpers/mock-backend.ts
View File

File diff suppressed because it is too large Load Diff

26
src/app/_models/mappings.ts
View File

@ -12,29 +12,5 @@ interface Action {
user: string;
}
/** Area name object interface */
interface AreaName {
/** Locations that map to that area name. */
locations: Array<string>;
/** Name of area */
name: string;
}
/** Area type object interface */
interface AreaType {
/** Areas that map to that area type. */
area: Array<string>;
/** Type of area */
name: string;
}
/** Category object interface */
interface Category {
/** Business category */
name: string;
/** Products that map to that category. */
products: Array<string>;
}
/** @exports */
export { Action, AreaName, AreaType, Category };
export { Action };

48
src/app/_services/location.service.ts
View File

@ -1,5 +1,5 @@
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { BehaviorSubject, Observable } from 'rxjs';
import { environment } from '@src/environments/environment';
import { first } from 'rxjs/operators';
import { HttpClient } from '@angular/common/http';
@ -8,21 +8,51 @@ import { HttpClient } from '@angular/common/http';
providedIn: 'root',
})
export class LocationService {
areaNames: object = {};
private areaNamesList: BehaviorSubject<object> = new BehaviorSubject<object>(this.areaNames);
areaNamesSubject: Observable<object> = this.areaNamesList.asObservable();
areaTypes: object = {};
private areaTypesList: BehaviorSubject<object> = new BehaviorSubject<object>(this.areaTypes);
areaTypesSubject: Observable<object> = this.areaTypesList.asObservable();
constructor(private httpClient: HttpClient) {}
getAreaNames(): Observable<any> {
return this.httpClient.get(`${environment.cicMetaUrl}/areanames`);
getAreaNames(): void {
this.httpClient
.get(`${environment.cicMetaUrl}/areanames`)
.pipe(first())
.subscribe((res: object) => this.areaNamesList.next(res));
}
getAreaNameByLocation(location: string): Observable<any> {
return this.httpClient.get(`${environment.cicMetaUrl}/areanames/${location.toLowerCase()}`);
getAreaNameByLocation(location: string, areaNames: object): string {
const keywords = location.toLowerCase().split(' ');
for (const keyword of keywords) {
const queriedAreaName: string = Object.keys(areaNames).find((key) =>
areaNames[key].includes(keyword)
);
if (queriedAreaName) {
return queriedAreaName;
}
}
}
getAreaTypes(): Observable<any> {
return this.httpClient.get(`${environment.cicMetaUrl}/areatypes`).pipe(first());
getAreaTypes(): void {
this.httpClient
.get(`${environment.cicMetaUrl}/areatypes`)
.pipe(first())
.subscribe((res: object) => this.areaTypesList.next(res));
}
getAreaTypeByArea(area: string): Observable<any> {
return this.httpClient.get(`${environment.cicMetaUrl}/areatypes/${area.toLowerCase()}`);
getAreaTypeByArea(area: string, areaTypes: object): string {
const keywords = area.toLowerCase().split(' ');
for (const keyword of keywords) {
const queriedAreaType: string = Object.keys(areaTypes).find((key) =>
areaTypes[key].includes(keyword)
);
if (queriedAreaType) {
return queriedAreaType;
}
}
}
}

3
src/app/_services/token.service.ts
View File

@ -1,7 +1,6 @@
import { Injectable } from '@angular/core';
import { CICRegistry } from '@cicnet/cic-client';
import { TokenRegistry } from '@app/_eth';
import { HttpClient } from '@angular/common/http';
import { RegistryService } from '@app/_services/registry.service';
import { Token } from '@app/_models';
import { BehaviorSubject, Observable, Subject } from 'rxjs';
@ -19,7 +18,7 @@ export class TokenService {
tokensSubject: Observable<Array<Token>> = this.tokensList.asObservable();
load: BehaviorSubject<any> = new BehaviorSubject<any>(false);
constructor(private httpClient: HttpClient) {}
constructor() {}
async init(): Promise<void> {
this.registry = await RegistryService.getRegistry();

23
src/app/_services/user.service.ts
View File

@ -36,6 +36,10 @@ export class UserService {
private actionsList: BehaviorSubject<any> = new BehaviorSubject<any>(this.actions);
actionsSubject: Observable<Array<any>> = this.actionsList.asObservable();
categories: object = {};
private categoriesList: BehaviorSubject<object> = new BehaviorSubject<object>(this.categories);
categoriesSubject: Observable<object> = this.categoriesList.asObservable();
constructor(
private httpClient: HttpClient,
private loggingService: LoggingService,
@ -244,12 +248,23 @@ export class UserService {
return;
}
getCategories(): Observable<any> {
return this.httpClient.get(`${environment.cicMetaUrl}/categories`);
getCategories(): void {
this.httpClient
.get(`${environment.cicMetaUrl}/categories`)
.pipe(first())
.subscribe((res: object) => this.categoriesList.next(res));
}
getCategoryByProduct(product: string): Observable<any> {
return this.httpClient.get(`${environment.cicMetaUrl}/categories/${product.toLowerCase()}`);
getCategoryByProduct(product: string, categories: object): string {
const keywords = product.toLowerCase().split(' ');
for (const keyword of keywords) {
const queriedCategory: string = Object.keys(categories).find((key) =>
categories[key].includes(keyword)
);
if (queriedCategory) {
return queriedCategory;
}
}
}
getAccountTypes(): Observable<any> {

72
src/app/pages/accounts/account-details/account-details.component.html
View File

@ -113,24 +113,6 @@
</mat-form-field>
</div>
<div class="col-md-6 col-lg-4">
<mat-form-field appearance="outline">
<mat-label>Age: </mat-label>
<input
matInput
type="text"
id="age"
placeholder="{{ account?.age }}"
value="{{ account?.age }}"
formControlName="age"
[errorStateMatcher]="matcher"
/>
<mat-error *ngIf="submitted && accountInfoFormStub.age.errors"
>Age is required.</mat-error
>
</mat-form-field>
</div>
<div class="col-md-6 col-lg-4">
<mat-form-field appearance="outline">
<mat-label> ACCOUNT TYPE: </mat-label>
@ -150,24 +132,6 @@
</mat-form-field>
</div>
<div class="col-md-6 col-lg-4">
<mat-form-field appearance="outline">
<mat-label>Bio: </mat-label>
<input
matInput
type="text"
id="bio"
placeholder="{{ account?.products }}"
value="{{ account?.products }}"
formControlName="bio"
[errorStateMatcher]="matcher"
/>
<mat-error *ngIf="submitted && accountInfoFormStub.bio.errors"
>Bio is required.</mat-error
>
</mat-form-field>
</div>
<div class="col-md-6 col-lg-4">
<mat-form-field appearance="outline">
<mat-label> GENDER: </mat-label>
@ -187,6 +151,42 @@
</mat-form-field>
</div>
<div class="col-md-6 col-lg-4">
<mat-form-field appearance="outline">
<mat-label>Age: </mat-label>
<input
matInput
type="text"
id="age"
placeholder="{{ account?.age }}"
value="{{ account?.age }}"
formControlName="age"
[errorStateMatcher]="matcher"
/>
<mat-error *ngIf="submitted && accountInfoFormStub.age.errors"
>Age is required.</mat-error
>
</mat-form-field>
</div>
<div class="col-md-6 col-lg-4">
<mat-form-field appearance="outline">
<mat-label>Bio: </mat-label>
<input
matInput
type="text"
id="bio"
placeholder="{{ account?.products }}"
value="{{ account?.products }}"
formControlName="bio"
[errorStateMatcher]="matcher"
/>
<mat-error *ngIf="submitted && accountInfoFormStub.bio.errors"
>Bio is required.</mat-error
>
</mat-form-field>
</div>
<div class="col-md-6 col-lg-4">
<mat-form-field appearance="outline">
<mat-label> BUSINESS CATEGORY: </mat-label>

64
src/app/pages/accounts/account-details/account-details.component.ts
View File

@ -23,7 +23,7 @@ import { copyToClipboard, CustomErrorStateMatcher, exportCsv } from '@app/_helpe
import { MatSnackBar } from '@angular/material/snack-bar';
import { add0x, strip0x } from '@src/assets/js/ethtx/dist/hex';
import { environment } from '@src/environments/environment';
import { AccountDetails, AreaName, AreaType, Category, Transaction } from '@app/_models';
import { AccountDetails, Transaction } from '@app/_models';
@Component({
selector: 'app-account-details',
@ -52,9 +52,9 @@ export class AccountDetailsComponent implements OnInit {
accountStatus: any;
accounts: Array<AccountDetails> = [];
accountsType: string = 'all';
categories: Array<Category>;
areaNames: Array<AreaName>;
areaTypes: Array<AreaType>;
categories: Array<string>;
areaNames: Array<string>;
areaTypes: Array<string>;
transaction: any;
transactions: Array<Transaction>;
transactionsType: string = 'all';
@ -115,27 +115,21 @@ export class AccountDetailsComponent implements OnInit {
this.account = res;
this.cdr.detectChanges();
this.loggingService.sendInfoLevelMessage(this.account);
this.locationService
.getAreaNameByLocation(this.account.location.area_name)
.pipe(first())
.subscribe((response) => {
this.area = response;
this.cdr.detectChanges();
this.locationService
.getAreaTypeByArea(this.area)
.pipe(first())
.subscribe((result) => {
this.areaType = result;
this.cdr.detectChanges();
});
});
this.userService
.getCategoryByProduct(this.account.products[0])
.pipe(first())
.subscribe((response) => {
this.category = response;
this.locationService.areaNamesSubject.subscribe((response) => {
this.area = this.locationService.getAreaNameByLocation(
this.account.location.area_name,
response
);
this.cdr.detectChanges();
this.locationService.areaTypesSubject.subscribe((result) => {
this.areaType = this.locationService.getAreaTypeByArea(this.area, result);
this.cdr.detectChanges();
});
});
this.userService.categoriesSubject.subscribe((result) => {
this.category = this.userService.getCategoryByProduct(this.account.products[0], result);
this.cdr.detectChanges();
});
const fullName = this.account.vcard?.fn[0].value.split(' ');
this.accountInfoForm.patchValue({
firstName: fullName[0].split(',')[0],
@ -174,18 +168,18 @@ export class AccountDetailsComponent implements OnInit {
this.transactions = transactions;
this.cdr.detectChanges();
});
this.userService
.getCategories()
.pipe(first())
.subscribe((res) => (this.categories = res));
this.locationService
.getAreaNames()
.pipe(first())
.subscribe((res) => (this.areaNames = res));
this.locationService
.getAreaTypes()
.pipe(first())
.subscribe((res) => (this.areaTypes = res));
this.userService.getCategories();
this.userService.categoriesSubject.subscribe((res) => {
this.categories = Object.keys(res);
});
this.locationService.getAreaNames();
this.locationService.areaNamesSubject.subscribe((res) => {
this.areaNames = Object.keys(res);
});
this.locationService.getAreaTypes();
this.locationService.areaTypesSubject.subscribe((res) => {
this.areaTypes = Object.keys(res);
});
this.userService
.getAccountTypes()
.pipe(first())

21
src/app/pages/accounts/create-account/create-account.component.ts
View File

@ -3,7 +3,6 @@ import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { LocationService, UserService } from '@app/_services';
import { CustomErrorStateMatcher } from '@app/_helpers';
import { first } from 'rxjs/operators';
import { AreaName, Category } from '@app/_models';
@Component({
selector: 'app-create-account',
@ -15,8 +14,8 @@ export class CreateAccountComponent implements OnInit {
createForm: FormGroup;
matcher: CustomErrorStateMatcher = new CustomErrorStateMatcher();
submitted: boolean = false;
categories: Array<Category>;
areaNames: Array<AreaName>;
categories: Array<string>;
areaNames: Array<string>;
accountTypes: Array<string>;
genders: Array<string>;
@ -40,14 +39,14 @@ export class CreateAccountComponent implements OnInit {
referrer: ['', Validators.required],
businessCategory: ['', Validators.required],
});
this.userService
.getCategories()
.pipe(first())
.subscribe((res) => (this.categories = res));
this.locationService
.getAreaNames()
.pipe(first())
.subscribe((res) => (this.areaNames = res));
this.userService.getCategories();
this.userService.categoriesSubject.subscribe((res) => {
this.categories = Object.keys(res);
});
this.locationService.getAreaNames();
this.locationService.areaNamesSubject.subscribe((res) => {
this.areaNames = Object.keys(res);
});
this.userService
.getAccountTypes()
.pipe(first())