wbrawner/twigs-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Migrate budgets backend calls to promise api

Browse source
This commit is contained in:
William Brawner 2022-11-09 03:16:23 +00:00
parent e11ffb741f
commit 170214c1ca
8 changed files with 82 additions and 137 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
src/app/budgets/add-edit-budget/add-edit-budget.component.ts
View file

@ -3,6 +3,7 @@ import { Budget } from '../budget';
import { AppComponent } from 'src/app/app.component';
import { User, UserPermission, Permission } from 'src/app/users/user';
import { TWIGS_SERVICE, TwigsService } from 'src/app/shared/twigs.service';
import { Router } from '@angular/router';
@Component({
selector: 'app-add-edit-budget',
@ -19,6 +20,7 @@ export class AddEditBudgetComponent {
constructor(
private app: AppComponent,
private router: Router,
@Inject(TWIGS_SERVICE) private twigsService: TwigsService,
) {
this.app.setTitle(this.title)
@ -27,11 +29,11 @@ export class AddEditBudgetComponent {
}
save(): void {
let observable;
let promise: Promise<Budget>;
this.isLoading = true;
if (this.create) {
// This is a new budget, save it
observable = this.twigsService.createBudget(
promise = this.twigsService.createBudget(
this.budget.id,
this.budget.name,
this.budget.description,
@ -39,10 +41,10 @@ export class AddEditBudgetComponent {
);
} else {
// This is an existing budget, update it
observable = this.twigsService.updateBudget(this.budget.id, this.budget);
promise = this.twigsService.updateBudget(this.budget.id, this.budget);
}
// TODO: Check if it was actually successful or not
observable.subscribe(val => {
promise.then(_ => {
this.app.goBack();
});
}
@ -50,8 +52,8 @@ export class AddEditBudgetComponent {
delete(): void {
this.isLoading = true;
this.twigsService.deleteBudget(this.budget.id)
.subscribe(() => {
this.app.goBack();
.then(() => {
this.router.navigateByUrl("/budgets");
});
}

9
src/app/budgets/budget-details/budget-details.component.ts
View file

@ -82,7 +82,7 @@ export class BudgetDetailsComponent implements OnInit, OnDestroy, Actionable {
getBudget() {
const id = this.route.snapshot.paramMap.get('id');
this.twigsService.getBudget(id)
.subscribe(budget => {
.then(budget => {
this.app.setTitle(budget.name)
this.budget = budget;
this.getBalance();
@ -115,9 +115,10 @@ export class BudgetDetailsComponent implements OnInit, OnDestroy, Actionable {
getBalance(): void {
const id = this.route.snapshot.paramMap.get('id');
this.twigsService.getBudgetBalance(id, this.from, this.to).subscribe(balance => {
this.budgetBalance = balance;
});
this.twigsService.getBudgetBalance(id, this.from, this.to)
.then(balance => {
this.budgetBalance = balance;
});
}
getTransactions(): void {

19
src/app/budgets/budget.component.ts
View file

@ -32,16 +32,17 @@ export class BudgetsComponent implements OnInit {
this.app.setTitle('Budgets')
this.loggedIn = true;
this.loading = true;
this.twigsService.getBudgets().subscribe(
budgets => {
console.log(budgets)
this.budgets = budgets;
this.twigsService.getBudgets()
.then(
budgets => {
console.log(budgets)
this.budgets = budgets;
this.loading = false;
})
.catch(error => {
console.log(error)
this.loading = false;
},
error => {
this.loading = false;
}
);
});
},
error => {
this.loading = false;

2
src/app/budgets/edit-budget/edit-budget.component.ts
View file

@ -20,7 +20,7 @@ export class EditBudgetComponent implements OnInit {
ngOnInit(): void {
const id = this.route.snapshot.paramMap.get('id');
this.twigsService.getBudget(id)
.subscribe(budget => {
.then(budget => {
this.budget = budget;
});
}

104
src/app/shared/twigs.http.service.ts
View file

@ -18,7 +18,6 @@ export class TwigsHttpService implements TwigsService {
withCredentials: true
};
private apiUrl = environment.apiUrl;
private budgets: BehaviorSubject<Budget[]> = new BehaviorSubject(null);
constructor(
private http: HttpClient,
@ -55,57 +54,30 @@ export class TwigsHttpService implements TwigsService {
}
// Budgets
getBudgets(): Observable<Budget[]> {
this.http.get<Budget[]>(this.apiUrl + '/budgets', this.options)
.subscribe(budgets => {
this.budgets.next(budgets);
});
return this.budgets;
getBudgets(): Promise<Budget[]> {
const url = new URL('/api/budgets', this.apiUrl)
return this.request(url, HttpMethod.GET)
}
getBudgetBalance(
id: string,
from?: Date,
to?: Date
): Observable<number> {
let httpParams = new HttpParams();
): Promise<number> {
const url = new URL('/api/transactions/sum')
url.searchParams.set('budgetId', 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?budgetId=${id}`, { ...this.options, ...params })
.pipe(map(obj => obj.balance));
return this.request(url, HttpMethod.GET).then((res: any) => res.balance)
}
getBudget(id: string): Observable<Budget> {
return new Observable(emitter => {
var cachedBudget: Budget
if (this.budgets.value) {
cachedBudget = this.budgets.value.find(budget => {
return budget.id === id;
});
}
if (cachedBudget) {
emitter.next(cachedBudget);
emitter.complete();
} else {
this.http.get<Budget>(`${this.apiUrl}/budgets/${id}`, this.options)
.subscribe(budget => {
var oldBudgets = JSON.parse(JSON.stringify(this.budgets.value));
if (!oldBudgets) {
oldBudgets = [];
}
oldBudgets.push(budget);
oldBudgets.sort();
this.budgets.next(oldBudgets);
emitter.next(budget);
emitter.complete();
})
}
})
getBudget(id: string): Promise<Budget> {
const url = new URL(`/api/budgets/${id}`, this.apiUrl)
return this.request(url, HttpMethod.GET)
}
createBudget(
@ -113,8 +85,9 @@ export class TwigsHttpService implements TwigsService {
name: string,
description: string,
users: UserPermission[],
): Observable<Budget> {
const params = {
): Promise<Budget> {
const url = new URL('/api/budgets', this.apiUrl)
const body = {
'id': id,
'name': name,
'description': description,
@ -125,19 +98,12 @@ export class TwigsHttpService implements TwigsService {
};
})
};
return this.http.post<Budget>(this.apiUrl + '/budgets', params, this.options)
.pipe(map(budget => {
var updatedBudgets = JSON.parse(JSON.stringify(this.budgets.value));
updatedBudgets.push(budget);
updatedBudgets.sort();
this.budgets.next(updatedBudgets);
return budget
}))
return this.request(url, HttpMethod.POST, body)
}
updateBudget(id: string, changes: object): Observable<Budget> {
let budget = changes as Budget;
const params = {
updateBudget(id: string, budget: Budget): Promise<Budget> {
const url = new URL(`/api/budgets/${id}`, this.apiUrl)
const body = {
'name': budget.name,
'description': budget.description,
'users': budget.users.map(userPermission => {
@ -147,32 +113,12 @@ export class TwigsHttpService implements TwigsService {
};
})
};
return this.http.put<Budget>(`${this.apiUrl}/budgets/${id}`, params, this.options)
.pipe(map(budget => {
var updatedBudgets: Budget[] = JSON.parse(JSON.stringify(this.budgets.value));
var index = updatedBudgets.findIndex(oldBudget => oldBudget.id === id);
if (index > -1) {
updatedBudgets.splice(index, 1);
}
updatedBudgets.push(budget);
updatedBudgets.sort();
this.budgets.next(updatedBudgets);
return budget
}));
return this.request(url, HttpMethod.PUT, body)
}
deleteBudget(id: String): Observable<void> {
return this.http.delete<void>(`${this.apiUrl}/budgets/${id}`, this.options)
.pipe(map(() => {
var updatedBudgets: Budget[] = JSON.parse(JSON.stringify(this.budgets.value));
var index = updatedBudgets.findIndex(oldBudget => oldBudget.id === id);
if (index > -1) {
updatedBudgets.splice(index, 1);
}
updatedBudgets.sort();
this.budgets.next(updatedBudgets);
return;
}));
deleteBudget(id: String): Promise<void> {
const url = new URL(`/api/budgets/${id}`, this.apiUrl)
return this.request(url, HttpMethod.DELETE)
}
// Categories
@ -328,6 +274,10 @@ export class TwigsHttpService implements TwigsService {
body: jsonBody
})
if (res.status === 204) {
// No content
return
}
return res.json()
}
}

49
src/app/shared/twigs.local.service.ts
View file

@ -56,31 +56,24 @@ export class TwigsLocalService implements TwigsService {
}
// Budgets
getBudgets(): Observable<Budget[]> {
return new Observable(subscriber => {
subscriber.next(this.budgets);
subscriber.complete();
});
getBudgets(): Promise<Budget[]> {
return Promise.resolve(this.budgets)
}
getBudgetBalance(id: string, from?: Date, to?: Date): Observable<number> {
return new Observable(emitter => {
emitter.next(200);
emitter.complete()
})
getBudgetBalance(id: string, from?: Date, to?: Date): Promise<number> {
return Promise.resolve(200)
}
getBudget(id: string): Observable<Budget> {
return new Observable(subscriber => {
getBudget(id: string): Promise<Budget> {
return new Promise((resolve, reject) => {
const budget = this.budgets.filter(it => {
return it.id === id;
})[0];
if (budget) {
subscriber.next(budget);
resolve(budget);
} else {
subscriber.error('No budget found for given id');
reject('No budget found for given id');
}
subscriber.complete();
});
}
@ -89,21 +82,20 @@ export class TwigsLocalService implements TwigsService {
name: string,
description: string,
users: UserPermission[],
): Observable<Budget> {
return new Observable(subscriber => {
): Promise<Budget> {
return new Promise((resolve, reject) => {
const budget = new Budget();
budget.name = name;
budget.description = description;
budget.users = users;
budget.id = id;
this.budgets.push(budget);
subscriber.next(budget);
subscriber.complete();
resolve(budget);
});
}
updateBudget(id: string, changes: object): Observable<Budget> {
return new Observable(subscriber => {
updateBudget(id: string, budget: Budget): Promise<Budget> {
return new Promise((resolve, reject) => {
const budget = this.budgets.filter(it => {
return it.id === id;
})[0];
@ -111,7 +103,7 @@ export class TwigsLocalService implements TwigsService {
const index = this.budgets.indexOf(budget);
this.updateValues(
budget,
changes,
budget,
[
'name',
'description',
@ -119,25 +111,24 @@ export class TwigsLocalService implements TwigsService {
]
);
this.budgets[index] = budget;
subscriber.next(budget);
resolve(budget);
} else {
subscriber.error('No budget found for given id');
reject('No budget found for given id');
}
subscriber.complete();
});
}
deleteBudget(id: string): Observable<void> {
return new Observable(subscriber => {
deleteBudget(id: string): Promise<void> {
return new Promise((resolve, reject) => {
const budget = this.budgets.filter(it => {
return budget.id === id;
})[0];
if (budget) {
const index = this.budgets.indexOf(budget);
delete this.budgets[index];
subscriber.complete();
resolve();
} else {
subscriber.error('No budget found for given id');
reject('No budget found for given id');
}
});
}

12
src/app/shared/twigs.service.ts
View file

@ -12,17 +12,17 @@ export interface TwigsService {
logout(): Promise<void>;
// Budgets
getBudgets(): Observable<Budget[]>;
getBudget(id: string): Observable<Budget>;
getBudgetBalance(id: string, from?: Date, to?: Date): Observable<number>;
getBudgets(): Promise<Budget[]>;
getBudget(id: string): Promise<Budget>;
getBudgetBalance(id: string, from?: Date, to?: Date): Promise<number>;
createBudget(
id: string,
name: string,
description: string,
users: UserPermission[],
): Observable<Budget>;
updateBudget(id: string, changes: object): Observable<Budget>;
deleteBudget(id: string): Observable<void>;
): Promise<Budget>;
updateBudget(id: string, budget: Budget): Promise<Budget>;
deleteBudget(id: string): Promise<void>;
// Categories
getCategories(budgetId?: string, count?: number): Observable<Category[]>;

8
src/app/users/user.ts
View file

@ -29,8 +29,8 @@ export class UserPermission {
}
export enum Permission {
READ,
WRITE,
MANAGE,
OWNER
READ = "READ",
WRITE = "WRITE",
MANAGE = "MANAGE",
OWNER = "OWNER"
}