Commit new Xero Interface

This commit is contained in:
Rene V. Vergara A. 2022-08-20 09:14:04 -05:00
commit ebd62fc176
5 changed files with 86 additions and 47 deletions

View file

@ -64,7 +64,7 @@ export class SettingsComponent implements OnInit {
xeroService.getXeroConfig();
this.clientIdUpdate.subscribe(clientId => {
this.clientId = clientId;
this.xeroLink = `https://login.xero.com/identity/connect/authorize?response_type=code&client_id=${this.clientId}&redirect_uri=http%3A%2F%2Flocalhost%3A4200%2Ftest&scope=accounting.transactions offline_access&state=1234`
this.xeroLink = `https://login.xero.com/identity/connect/authorize?response_type=code&client_id=${this.clientId}&redirect_uri=http%3A%2F%2Flocalhost%3A4200%2Ftest&scope=accounting.transactions offline_access&state=${this.owner.address.substring(0, 6)}`
});
}

View file

@ -12,7 +12,7 @@ var Buffer = require('buffer/').Buffer;
export class XeroService {
beUrl = ConfigData.Be_URL;
clientId: string = '';
clientSecret: string = '';
//clientSecret: string = '';
xeroToken: any = {
accessToken: '',
refreshToken: '',
@ -21,10 +21,10 @@ export class XeroService {
tokenType: ''
};
private _clientIdUpdated: BehaviorSubject<string> = new BehaviorSubject(this.clientId);
private _clientSecretUpdated: BehaviorSubject<string> = new BehaviorSubject(this.clientSecret);
//private _clientSecretUpdated: BehaviorSubject<string> = new BehaviorSubject(this.clientSecret);
private _tokenUpdated: BehaviorSubject<any> = new BehaviorSubject(this.xeroToken);
public readonly clientIdUpdate: Observable<string> = this._clientIdUpdated.asObservable();
public readonly clientSecretUpdate: Observable<string> = this._clientSecretUpdated.asObservable();
//public readonly clientSecretUpdate: Observable<string> = this._clientSecretUpdated.asObservable();
public readonly tokenUpdate: Observable<any> = this._tokenUpdated.asObservable();
private reqHeaders: HttpHeaders;
@ -42,9 +42,9 @@ export class XeroService {
obs.subscribe(xeroDataResponse => {
if (xeroDataResponse.status == 200) {
this.clientId = xeroDataResponse.body!.xeroConfig.clientId;
this.clientSecret = xeroDataResponse.body!.xeroConfig.clientSecret;
//this.clientSecret = xeroDataResponse.body!.xeroConfig.clientSecret;
this._clientIdUpdated.next(Object.assign({}, this).clientId);
this._clientSecretUpdated.next(Object.assign({}, this).clientSecret);
//this._clientSecretUpdated.next(Object.assign({}, this).clientSecret);
} else {
console.log('No config in DB!');
}
@ -53,21 +53,9 @@ export class XeroService {
return obs;
}
getXeroAccessToken(code: string){
this.getXeroConfig().subscribe(xeroDataResponse => {
console.log('XAT: '+this.clientId);
var xeroAuth = 'Basic ' + Buffer.from(`${this.clientId}:${this.clientSecret}`).toString('base64');
var xeroHeaders = new HttpHeaders().set('Authorization', xeroAuth).append('Content-Type', 'application/x-www-form-urlencoded');
let obs = this.http.post('https://identity.xero.com/connect/token', `grant_type=authorization_code&code=${code}&redirect_uri=http://localhost:4200/test` , {headers: xeroHeaders, observe: 'response'})
obs.subscribe(tokenData => {
if (tokenData.status == 200) {
console.log(tokenData.body!);
this.xeroToken = tokenData.body!;
this._tokenUpdated.next(Object.assign({}, this).xeroToken);
} else {
console.log('Error: '+tokenData.status);
}
});
});
getXeroAccessToken(code: string, address: string){
const params = new HttpParams().append('code', code).append('address', address);
let obs = this.http.get(this.beUrl + 'api/xerotoken' , {headers: this.reqHeaders, params: params, observe: 'response'})
return obs;
}
}

View file

@ -0,0 +1,3 @@
.text {
font-family: 'Spartan', sans-serif;
}

View file

@ -1 +1,6 @@
<p>test works!</p>
<div *ngIf="!flag" align="center" class="text">
<h1>Connecting to Xero...</h1>
</div>
<div *ngIf="flag" align="center" class="text">
<h1>Connected to Xero!</h1>
</div>

View file

@ -1,13 +1,21 @@
import { Component, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { HttpClient, HttpParams, HttpHeaders } from '@angular/common/http';
import { Router, ActivatedRoute } from '@angular/router';
import { UserService } from '../user.service';
import { XeroService } from '../xero.service';
import { Owner } from '../owner.model';
import { Observable } from 'rxjs';
import { XeroService } from '../xero.service';
var Buffer = require('buffer/').Buffer;
function sleep(ms:number) {
return new Promise(resolve => setTimeout(resolve, ms));
}
async function redirect(r: Router) {
await sleep(2000);
r.navigate(['/shop']);
}
@Component({
selector: 'app-xeroreg',
templateUrl: './xeroreg.component.html',
@ -16,38 +24,73 @@ var Buffer = require('buffer/').Buffer;
export class XeroRegComponent implements OnInit {
public owner:Owner = {
address: '',
name: '',
currency: '',
tax: false,
taxValue:0,
vat: false,
vatValue: 0,
first: '',
last: '',
email: '',
street: '',
city: '',
state: '',
postal: '',
phone: '',
paid: false,
website: '',
country: '',
zats: false,
invoices: false,
expiration: new Date(Date.now()).toISOString(),
payconf: false,
viewkey: ''
};
public ownerUpdate:Observable<Owner>;
public flag: boolean = false;
clientId: string = '';
clientSecret: string = '';
xeroToken: any;
clientIdUpdate: Observable<string>;
clientSecretUpdate: Observable<string>;
tokenUpdate: Observable<any>;
constructor(
public xeroService: XeroService,
public userService: UserService,
private router: Router,
private activatedRoute: ActivatedRoute
) {
this.tokenUpdate = xeroService.tokenUpdate;
this.clientIdUpdate = xeroService.clientIdUpdate;
xeroService.getXeroConfig();
this.clientIdUpdate.subscribe(clientId => {
this.clientId = clientId;
});
this.clientSecretUpdate = xeroService.clientSecretUpdate;
this.clientSecretUpdate.subscribe(clientSecret => {
this.clientSecret = clientSecret;
this.ownerUpdate = userService.ownerUpdate;
this.ownerUpdate.subscribe((owner) => {
this.owner = owner;
});
this.userService.findUser();
}
ngOnInit(): void {
this.activatedRoute.queryParams.subscribe((params) => {
console.log(params);
this.xeroService.getXeroAccessToken(params.code)
this.tokenUpdate.subscribe(token => {
console.log(token);
this.xeroToken = token;
}
ngAfterViewInit(): void {
this.ownerUpdate.subscribe((owner) => {
this.owner = owner;
this.activatedRoute.queryParams.subscribe((params) => {
console.log(params);
if (params.state === this.owner.address.substring(0,6)) {
this.xeroService.getXeroAccessToken(params.code, this.owner.address).subscribe(tokenData => {
if (tokenData.status == 200) {
console.log(tokenData.body!);
this.flag = true;
redirect(this.router);
} else {
console.log('Error: '+tokenData.status);
this.flag = false;
}
});
} else {
console.log('Error: State mismatch');
}
});
});
}