Migrate categories backend calls to promise api
This commit is contained in:
parent
87092be0f9
commit
ec47fc130d
9 changed files with 92 additions and 105 deletions
|
@ -4,8 +4,6 @@ import { ActivatedRoute, Router } from '@angular/router';
|
|||
import { AppComponent } from 'src/app/app.component';
|
||||
import { Transaction } from 'src/app/transactions/transaction';
|
||||
import { Category } from 'src/app/categories/category';
|
||||
import { Observable } from 'rxjs';
|
||||
// import { Label } from 'ng2-charts';
|
||||
import { ChartDataset } from 'chart.js';
|
||||
import { TWIGS_SERVICE, TwigsService } from 'src/app/shared/twigs.service';
|
||||
import { Actionable } from '../../shared/actionable';
|
||||
|
@ -16,7 +14,6 @@ import { Actionable } from '../../shared/actionable';
|
|||
styleUrls: ['./budget-details.component.css']
|
||||
})
|
||||
export class BudgetDetailsComponent implements OnInit, OnDestroy, Actionable {
|
||||
|
||||
budget: Budget;
|
||||
public budgetBalance: number;
|
||||
public transactions: Transaction[];
|
||||
|
@ -132,43 +129,38 @@ export class BudgetDetailsComponent implements OnInit, OnDestroy, Actionable {
|
|||
.subscribe(transactions => this.transactions = <Transaction[]>transactions);
|
||||
}
|
||||
|
||||
getCategories(): void {
|
||||
this.twigsService.getCategories(this.budget.id).subscribe(categories => {
|
||||
const categoryBalances = new Map<string, number>();
|
||||
let categoryBalancesCount = 0;
|
||||
console.log(categories);
|
||||
for (const category of categories) {
|
||||
if (category.expense) {
|
||||
this.expenses.push(category);
|
||||
this.expectedExpenses += category.amount;
|
||||
} else {
|
||||
this.income.push(category);
|
||||
this.expectedIncome += category.amount;
|
||||
}
|
||||
this.twigsService.getCategoryBalance(category.id, this.from, this.to).subscribe(
|
||||
balance => {
|
||||
console.log(balance);
|
||||
if (category.expense) {
|
||||
this.actualExpenses += balance * -1;
|
||||
} else {
|
||||
this.actualIncome += balance;
|
||||
}
|
||||
categoryBalances.set(category.id, balance);
|
||||
categoryBalancesCount++;
|
||||
},
|
||||
error => { categoryBalancesCount++; },
|
||||
() => {
|
||||
// This weird workaround is to force the OnChanges callback to be fired.
|
||||
// Angular needs the reference to the object to change in order for it to
|
||||
// work.
|
||||
if (categoryBalancesCount === categories.length) {
|
||||
this.categoryBalances = categoryBalances;
|
||||
this.updateBarChart();
|
||||
}
|
||||
}
|
||||
);
|
||||
async getCategories() {
|
||||
const categories = await this.twigsService.getCategories(this.budget.id)
|
||||
const categoryBalances = new Map<string, number>();
|
||||
let categoryBalancesCount = 0;
|
||||
for (const category of categories) {
|
||||
if (category.expense) {
|
||||
this.expenses.push(category);
|
||||
this.expectedExpenses += category.amount;
|
||||
} else {
|
||||
this.income.push(category);
|
||||
this.expectedIncome += category.amount;
|
||||
}
|
||||
});
|
||||
try {
|
||||
const balance = await this.twigsService.getCategoryBalance(category.id, this.from, this.to)
|
||||
console.log(balance);
|
||||
if (category.expense) {
|
||||
this.actualExpenses += balance * -1;
|
||||
} else {
|
||||
this.actualIncome += balance;
|
||||
}
|
||||
categoryBalances.set(category.id, balance);
|
||||
if (categoryBalancesCount === categories.length - 1) {
|
||||
// This weird workaround is to force the OnChanges callback to be fired.
|
||||
// Angular needs the reference to the object to change in order for it to
|
||||
// work.
|
||||
this.categoryBalances = categoryBalances;
|
||||
this.updateBarChart();
|
||||
}
|
||||
} finally {
|
||||
categoryBalancesCount++;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
doAction(): void {
|
||||
|
|
|
@ -33,7 +33,7 @@ export class CategoriesComponent implements OnInit {
|
|||
}
|
||||
|
||||
getCategories(): void {
|
||||
this.twigsService.getCategories(this.budgetId).subscribe(categories => {
|
||||
this.twigsService.getCategories(this.budgetId).then(categories => {
|
||||
this.categories = categories;
|
||||
for (const category of this.categories) {
|
||||
this.getCategoryBalance(category).subscribe(balance => this.categoryBalances.set(category.id, balance));
|
||||
|
|
|
@ -45,7 +45,7 @@ export class CategoryDetailsComponent implements OnInit, OnDestroy, Actionable {
|
|||
getCategory(): void {
|
||||
const id = this.route.snapshot.paramMap.get('id');
|
||||
this.twigsService.getCategory(id)
|
||||
.subscribe(category => {
|
||||
.then(category => {
|
||||
category.amount /= 100;
|
||||
this.app.setTitle(category.title)
|
||||
this.category = category;
|
||||
|
|
|
@ -26,10 +26,10 @@ export class CategoryFormComponent implements OnInit {
|
|||
}
|
||||
|
||||
save(): void {
|
||||
let observable;
|
||||
let promise;
|
||||
if (this.create) {
|
||||
// This is a new category, save it
|
||||
observable = this.twigsService.createCategory(
|
||||
promise = this.twigsService.createCategory(
|
||||
this.currentCategory.id,
|
||||
this.budgetId,
|
||||
this.currentCategory.title,
|
||||
|
@ -39,7 +39,7 @@ export class CategoryFormComponent implements OnInit {
|
|||
);
|
||||
} else {
|
||||
// This is an existing category, update it
|
||||
observable = this.twigsService.updateCategory(
|
||||
promise = this.twigsService.updateCategory(
|
||||
this.currentCategory.id,
|
||||
{
|
||||
name: this.currentCategory.title,
|
||||
|
@ -50,13 +50,13 @@ export class CategoryFormComponent implements OnInit {
|
|||
}
|
||||
);
|
||||
}
|
||||
observable.subscribe(val => {
|
||||
promise.then(_ => {
|
||||
this.app.goBack();
|
||||
});
|
||||
}
|
||||
|
||||
delete(): void {
|
||||
this.twigsService.deleteCategory(this.currentCategory.id).subscribe(() => {
|
||||
this.twigsService.deleteCategory(this.currentCategory.id).then(() => {
|
||||
this.app.goBack();
|
||||
});
|
||||
}
|
||||
|
|
|
@ -28,7 +28,7 @@ export class EditCategoryComponent implements OnInit {
|
|||
getCategory(): void {
|
||||
const id = this.route.snapshot.paramMap.get('id');
|
||||
this.twigsService.getCategory(id)
|
||||
.subscribe(category => {
|
||||
.then(category => {
|
||||
category.amount /= 100;
|
||||
this.app.setTitle(category.title)
|
||||
this.category = category;
|
||||
|
|
|
@ -122,38 +122,38 @@ export class TwigsHttpService implements TwigsService {
|
|||
}
|
||||
|
||||
// Categories
|
||||
getCategories(budgetId: string, count?: number): Observable<Category[]> {
|
||||
const params = {
|
||||
params: new HttpParams()
|
||||
.set('budgetIds', `${budgetId}`)
|
||||
.set('archived', false)
|
||||
};
|
||||
return this.http.get<Category[]>(`${this.apiUrl}/categories`, Object.assign(params, this.options));
|
||||
getCategories(budgetId: string, count?: number): Promise<Category[]> {
|
||||
const url = new URL(`/api/categories`, this.apiUrl)
|
||||
url.searchParams.set('budgetIds', budgetId)
|
||||
url.searchParams.set('archived', 'false')
|
||||
return this.request(url, HttpMethod.GET);
|
||||
}
|
||||
|
||||
getCategory(id: string): Observable<Category> {
|
||||
return this.http.get<Category>(`${this.apiUrl}/categories/${id}`, this.options);
|
||||
getCategory(id: string): Promise<Category> {
|
||||
const url = new URL(`/api/categories/${id}`, this.apiUrl)
|
||||
return this.request(url, HttpMethod.GET);
|
||||
}
|
||||
|
||||
getCategoryBalance(
|
||||
async getCategoryBalance(
|
||||
id: string,
|
||||
from?: Date,
|
||||
to?: Date
|
||||
): Observable<number> {
|
||||
let httpParams = new HttpParams();
|
||||
): Promise<number> {
|
||||
const url = new URL(`/api/transactions/sum`, this.apiUrl)
|
||||
url.searchParams.set('categoryId', id)
|
||||
if (from) {
|
||||
httpParams = httpParams.set('from', from.toISOString());
|
||||
url.searchParams.set('from', from.toISOString());
|
||||
}
|
||||
if (to) {
|
||||
httpParams = httpParams.set('to', to.toISOString());
|
||||
url.searchParams.set('to', to.toISOString());
|
||||
}
|
||||
const params = { params: httpParams };
|
||||
return this.http.get<any>(`${this.apiUrl}/transactions/sum?categoryId=${id}`, { ...this.options, ...params })
|
||||
.pipe(map(obj => obj.balance));
|
||||
const res: any = await this.request(url, HttpMethod.GET);
|
||||
return res.balance;
|
||||
}
|
||||
|
||||
createCategory(id: string, budgetId: string, name: string, description: string, amount: number, isExpense: boolean): Observable<Category> {
|
||||
const params = {
|
||||
createCategory(id: string, budgetId: string, name: string, description: string, amount: number, isExpense: boolean): Promise<Category> {
|
||||
const url = new URL(`/api/categories`, this.apiUrl)
|
||||
const body = {
|
||||
'id': id,
|
||||
'title': name,
|
||||
'description': description,
|
||||
|
@ -161,15 +161,17 @@ export class TwigsHttpService implements TwigsService {
|
|||
'expense': isExpense,
|
||||
'budgetId': budgetId
|
||||
};
|
||||
return this.http.post<Category>(this.apiUrl + '/categories', params, this.options);
|
||||
return this.request(url, HttpMethod.POST, body);
|
||||
}
|
||||
|
||||
updateCategory(id: string, changes: object): Observable<Category> {
|
||||
return this.http.put<Category>(`${this.apiUrl}/categories/${id}`, changes, this.options);
|
||||
updateCategory(id: string, changes: object): Promise<Category> {
|
||||
const url = new URL(`/api/categories/${id}`, this.apiUrl)
|
||||
return this.request(url, HttpMethod.PUT, changes);
|
||||
}
|
||||
|
||||
deleteCategory(id: string): Observable<void> {
|
||||
return this.http.delete<void>(`${this.apiUrl}/categories/${id}`, this.options);
|
||||
deleteCategory(id: string): Promise<void> {
|
||||
const url = new URL(`/api/categories/${id}`, this.apiUrl)
|
||||
return this.request(url, HttpMethod.DELETE);
|
||||
}
|
||||
|
||||
// Transactions
|
||||
|
|
|
@ -134,31 +134,26 @@ export class TwigsLocalService implements TwigsService {
|
|||
}
|
||||
|
||||
// Categories
|
||||
getCategories(budgetId: string, count?: number): Observable<Category[]> {
|
||||
return new Observable(subscriber => {
|
||||
subscriber.next(this.categories.filter(category => {
|
||||
getCategories(budgetId: string, count?: number): Promise<Category[]> {
|
||||
return new Promise((resolve, reject) => {
|
||||
resolve(this.categories.filter(category => {
|
||||
return category.budgetId === budgetId;
|
||||
}));
|
||||
subscriber.complete();
|
||||
});
|
||||
}
|
||||
|
||||
getCategory(id: string): Observable<Category> {
|
||||
return new Observable(subscriber => {
|
||||
subscriber.next(this.findById(this.categories, id));
|
||||
subscriber.complete();
|
||||
getCategory(id: string): Promise<Category> {
|
||||
return new Promise((resolve, reject) => {
|
||||
resolve(this.findById(this.categories, id));
|
||||
});
|
||||
}
|
||||
|
||||
getCategoryBalance(id: string, from?: Date, to?: Date): Observable<number> {
|
||||
return new Observable(emitter => {
|
||||
emitter.next(20);
|
||||
emitter.complete()
|
||||
})
|
||||
getCategoryBalance(id: string, from?: Date, to?: Date): Promise<number> {
|
||||
return Promise.resolve(20);
|
||||
}
|
||||
|
||||
createCategory(id: string, budgetId: string, name: string, description: string, amount: number, isExpense: boolean): Observable<Category> {
|
||||
return Observable.create(subscriber => {
|
||||
createCategory(id: string, budgetId: string, name: string, description: string, amount: number, isExpense: boolean): Promise<Category> {
|
||||
return new Promise((resolve, reject) => {
|
||||
const category = new Category();
|
||||
category.title = name;
|
||||
category.description = description;
|
||||
|
@ -167,13 +162,12 @@ export class TwigsLocalService implements TwigsService {
|
|||
category.budgetId = budgetId;
|
||||
category.id = id;
|
||||
this.categories.push(category);
|
||||
subscriber.next(category);
|
||||
subscriber.complete();
|
||||
resolve(category);
|
||||
});
|
||||
}
|
||||
|
||||
updateCategory(id: string, changes: object): Observable<Category> {
|
||||
return new Observable(subscriber => {
|
||||
updateCategory(id: string, changes: object): Promise<Category> {
|
||||
return new Promise((resolve, reject) => {
|
||||
const category = this.findById(this.categories, id);
|
||||
if (category) {
|
||||
const index = this.categories.indexOf(category);
|
||||
|
@ -188,23 +182,22 @@ export class TwigsLocalService implements TwigsService {
|
|||
]
|
||||
);
|
||||
this.categories[index] = category;
|
||||
subscriber.next(category);
|
||||
resolve(category);
|
||||
} else {
|
||||
subscriber.error('No category found for given id');
|
||||
reject('No category found for given id');
|
||||
}
|
||||
subscriber.complete();
|
||||
});
|
||||
}
|
||||
|
||||
deleteCategory(id: string): Observable<void> {
|
||||
return new Observable(subscriber => {
|
||||
deleteCategory(id: string): Promise<void> {
|
||||
return new Promise((resolve, reject) => {
|
||||
const category = this.findById(this.categories, id);
|
||||
if (category) {
|
||||
const index = this.categories.indexOf(category);
|
||||
delete this.transactions[index];
|
||||
subscriber.complete();
|
||||
resolve();
|
||||
} else {
|
||||
subscriber.error('No category found for given id');
|
||||
reject('No category found for given id');
|
||||
}
|
||||
});
|
||||
}
|
||||
|
|
|
@ -25,12 +25,12 @@ export interface TwigsService {
|
|||
deleteBudget(id: string): Promise<void>;
|
||||
|
||||
// Categories
|
||||
getCategories(budgetId?: string, count?: number): Observable<Category[]>;
|
||||
getCategory(id: string): Observable<Category>;
|
||||
getCategoryBalance(id: string, from?: Date, to?: Date): Observable<number>;
|
||||
createCategory(id: string, budgetId: string, name: string, description: string, amount: number, isExpense: boolean): Observable<Category>;
|
||||
updateCategory(id: string, changes: object): Observable<Category>;
|
||||
deleteCategory(id: string): Observable<void>;
|
||||
getCategories(budgetId?: string, count?: number): Promise<Category[]>;
|
||||
getCategory(id: string): Promise<Category>;
|
||||
getCategoryBalance(id: string, from?: Date, to?: Date): Promise<number>;
|
||||
createCategory(id: string, budgetId: string, name: string, description: string, amount: number, isExpense: boolean): Promise<Category>;
|
||||
updateCategory(id: string, changes: object): Promise<Category>;
|
||||
deleteCategory(id: string): Promise<void>;
|
||||
|
||||
// Transactions
|
||||
getTransactions(
|
||||
|
|
|
@ -54,7 +54,7 @@ export class AddEditTransactionComponent implements OnInit, OnChanges {
|
|||
|
||||
updateCategories(change: MatRadioChange) {
|
||||
this.twigsService.getCategories(this.budgetId)
|
||||
.subscribe(newCategories => {
|
||||
.then(newCategories => {
|
||||
this.categories = newCategories.filter(category => category.expense === change.value)
|
||||
})
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue