Updates due to API version 1.6.0

CHANGELOG.md

@@ -3,9 +3,24 @@ All notable changes to this project will be documented in this file.
 
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/), and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
-## [2.2.0]
+## [2.3.0]
 
-## Added
+### Changed
+
+- Modified order to handle new `token` field.
+- Modified order service to query API using `token`.
+- Modified receipt component to use the new `token`.
+- Modified invoice component to use the new `token`.
+
+### Fixed
+
+- Receipt prompt textarea is now read-only.
+- Invoice prompt textarea is now read-only.
+- Button text color is now correct for Invoice and Receipt.
+
+## [2.2.0] - 2023-05-15
+
+### Added
 
 - New API calls for requesting language data for login page
 

src/app/invoice/invoice.component.ts

@@ -9,7 +9,6 @@ import { faCheck, faHourglass, faArrowUpRightFromSquare } from '@fortawesome/fre
 import { NotifierService } from '../notifier.service';
 
 import { LanguageService } from '../language.service';
-import { LanguageData } from '../language.model';
 
 var QRCode = require('easyqrcodejs');
 var URLSafeBase64 = require('urlsafe-base64');
@@ -26,6 +25,7 @@ export class InvoiceComponent implements OnInit {
 	faHourglass = faHourglass;
 	faArrowUpRightFromSquare = faArrowUpRightFromSquare;
 	orderId;
+	orderToken: string = '';
 	public orderUpdate: Observable<Order>;
 	public nameUpdate: Observable<string>;
 	name: string = '';
@@ -48,6 +48,7 @@ export class InvoiceComponent implements OnInit {
 		paid: false,
 		externalInvoice: '',
 		shortCode: '',
+		token: '',
 		lines: [
 			{
 				qty: 1,
@@ -98,33 +99,36 @@ export class InvoiceComponent implements OnInit {
 		private languageService : LanguageService
 	) {
 		this.orderId = this._ActiveRoute.snapshot.paramMap.get("orderId");
-		console.log('constructor - orderId -> ' + this.orderId);
+		this._ActiveRoute.queryParams.subscribe((params) => {
+			this.orderToken = params["token"];
+			receiptService.getOrderById(this.orderId!, this.orderToken!).subscribe(response => {
+				if (response.status == 200){
+					this.error = false;
+					if( response.body!.order.session.substring(0,1) == 'X') {
+						this.invString = response.body!.order.externalInvoice;
+						this.codeString = `zcash:${this.order.address}?amount=${this.order.totalZec.toFixed(8)}&memo=${URLSafeBase64.encode(Buffer.from('ZGo Order::'.concat(this.orderId!).concat(" Invoice: ").concat(this.invString)))}`; 
+					} else {
+						this.codeString = `zcash:${response.body!.order.address}?amount=${response.body!.order.totalZec.toFixed(8)}&memo=${URLSafeBase64.encode(Buffer.from('ZGo Order::'.concat(this.orderId!)))}`; 
+					}
+					var qrcode = new QRCode(document.getElementById("payment-qr"), {
+						text: this.codeString,
+						logo: "/assets/zcash.png",
+						width: 180,
+						height: 180,
+						logoWidth: 50,
+						logoHeight: 50,
+						correctLevel: QRCode.CorrectLevel.H
+					});
+					this.error = false;
+				} else {
+					this.error = true;
+					this.codeString = 'Test';
+				}
+			});
+		});
+		//console.log('constructor - orderId -> ' + this.orderId);
 		this.orderUpdate = receiptService.orderUpdate;
 		this.nameUpdate = receiptService.nameUpdate;
-		receiptService.getOrderById(this.orderId!).subscribe(response => {
-			if (response.status == 200){
-				this.error = false;
-				if( response.body!.order.session.substring(0,1) == 'X') {
-					this.invString = response.body!.order.externalInvoice;
-					this.codeString = `zcash:${this.order.address}?amount=${this.order.totalZec.toFixed(8)}&memo=${URLSafeBase64.encode(Buffer.from('ZGo Order::'.concat(this.orderId!).concat(" Invoice: ").concat(this.invString)))}`; 
-				} else {
-					this.codeString = `zcash:${response.body!.order.address}?amount=${response.body!.order.totalZec.toFixed(8)}&memo=${URLSafeBase64.encode(Buffer.from('ZGo Order::'.concat(this.orderId!)))}`; 
-				}
-				var qrcode = new QRCode(document.getElementById("payment-qr"), {
-					text: this.codeString,
-					logo: "/assets/zcash.png",
-					width: 180,
-					height: 180,
-					logoWidth: 50,
-					logoHeight: 50,
-					correctLevel: QRCode.CorrectLevel.H
-				});
-				this.error = false;
-			} else {
-				this.error = true;
-				this.codeString = 'Test';
-			}
-		});
 		this.orderUpdate.subscribe(order => {
 			this.order = order;
 			if ( order.session.substring(0,1) == 'W') {

src/app/listorders/listorders.component.css

@@ -129,8 +129,8 @@ img.icon{
 .minibutton {
 	font-family: 'Spartan', sans-serif;
 	font-size: 14px;
-	background:  #ff5722;
+	/*background:  #ff5722;*/
-	color: white;
+	/*color: white;*/
 	height: 24px;
 	line-height: 20px;
 	padding: 10px;

src/app/listorders/listorders.component.html

@@ -162,10 +162,10 @@
 							  padding-right: 20%;
 							  margin-top: 10px;">
 			<span>
-				<button mat-stroked-button class="minibutton" color="primary" (click)="invoice(order)">{{ vE.listordersInvoiceBtn }}</button>
+				<button mat-raised-button class="minibutton" color="primary" (click)="invoice(order)">{{ vE.listordersInvoiceBtn }}</button>
 			</span>
 			<span>
-				<button mat-stroked-button class="minibutton" color="primary" (click)="receipt(order)">{{ vE.listordersReceiptBtn }}</button>
+				<button mat-raised-button class="minibutton" color="primary" (click)="receipt(order)">{{ vE.listordersReceiptBtn }}</button>
 			</span>
 		</div>
 	</mat-expansion-panel>

src/app/listorders/listorders.component.ts

@@ -173,7 +173,8 @@ export class ListOrdersComponent implements OnInit, OnDestroy{
 		dialogConfig.disableClose = true;
 		dialogConfig.autoFocus = true;
 		dialogConfig.data = {
-			orderId: order._id
+			orderId: order._id,
+			orderToken: order.token
 		};
 
 		const dialogRef = this.dialog.open(PromptInvoiceComponent, dialogConfig);
@@ -194,7 +195,8 @@ export class ListOrdersComponent implements OnInit, OnDestroy{
 		dialogConfig.disableClose = true;
 		dialogConfig.autoFocus = true;
 		dialogConfig.data = {
-			orderId: order._id
+			orderId: order._id,
+			orderToken: order.token
 		};
 
 		const dialogRef = this.dialog.open(PromptReceiptComponent, dialogConfig);

src/app/order/order.component.ts

@@ -47,6 +47,7 @@ export class OrderComponent implements OnInit{
 		paid: false,
 		externalInvoice: '',
 		shortCode: '',
+		token: '',
 		lines: [
 			{
 				qty: 1,

src/app/order/order.model.ts

@@ -13,5 +13,6 @@ export interface Order {
 	lines: LineItem[],
 	paid: boolean,
 	externalInvoice: string,
-	shortCode: string
+	shortCode: string,
+	token: string
 }

src/app/order/order.service.ts

@@ -55,6 +55,7 @@ export class OrderService {
 			paid: false,
 			externalInvoice: '',
 			shortCode: '',
+			token: '',
 			lines: [
 				{
 					qty: 1,
@@ -159,6 +160,7 @@ export class OrderService {
 			paid: false,
 			externalInvoice: '',
 			shortCode: '',
+			token: '',
 			lines: [lineItem]
 		};
 		let obs = this.http.post<{message: string, order: Order}>(this.beUrl+'api/order', {payload: order}, { headers: this.reqHeaders, params: this.reqParams });
@@ -188,6 +190,7 @@ export class OrderService {
 				paid: false,
 				externalInvoice: '',
 				shortCode: '',
+				token: '',
 				lines: [
 					{
 						qty: 1,
@@ -223,6 +226,7 @@ export class OrderService {
 				paid: false,
 				externalInvoice: '',
 				shortCode: '',
+				token: '',
 				lines: [
 					{
 						qty: 1,

src/app/pmtservice/pmtservice.component.ts

@@ -85,6 +85,7 @@ public order: Order = {
          paid: false,
          externalInvoice: '',
          shortCode: '',
+		 token: '',
          lines: [
             {
                qty: 1,
@@ -316,6 +317,7 @@ vE = {
          paid: false,
          externalInvoice: this.invData.inv_No,
          shortCode: this.invData.inv_shortCode,
+		 token: '',
          lines: [{qty: 1,
                   name: 'Invoice from ' + this.owner.name + '[' + this.invData.inv_No + ']',
                   cost: this.invData.inv_Total}]

src/app/prompt-invoice/prompt-invoice.component.html

@@ -20,13 +20,13 @@
 			    style="text-align: left;" 
 			    width="94%">
 			    <div>
-					<textarea
+					<textarea matInput readonly
 					    style="border: none;
 					    	   outline: none;
 					    	   width: 95%;"
 				        cdkTextareaAutosize
 				        cdkAutosizeMinRows="1"
-				        cdkAutosizeMaxRows="4">{{ invoiceUrl }}
+				        cdkAutosizeMaxRows="5">{{ invoiceUrl }}
 					</textarea>
 				</div>
 

src/app/prompt-invoice/prompt-invoice.component.ts

@@ -18,6 +18,7 @@ var Buffer = require('buffer/').Buffer;
 
 export class PromptInvoiceComponent implements OnInit {
 	orderId: string;
+	orderToken: string = '';
 	invoiceUrl: string;
  	// ------------------------------------
 	//
@@ -41,10 +42,11 @@ export class PromptInvoiceComponent implements OnInit {
 	constructor(
 		  private languageService : LanguageService,
 			private dialogRef: MatDialogRef<PromptInvoiceComponent>,
-			@Inject(MAT_DIALOG_DATA) public data: {orderId: string},
+			@Inject(MAT_DIALOG_DATA) public data: {orderId: string, orderToken: string},
 			private notifierService : NotifierService ) {
 		this.orderId = data.orderId;
-		this.invoiceUrl = 'https://app.zgo.cash/invoice/'+this.orderId;
+		this.orderToken = data.orderToken;
+		this.invoiceUrl = 'https://app.zgo.cash/invoice/'+this.orderId + '?token=' + this.orderToken;
 	}
 
 	ngOnInit(): void {

src/app/prompt-receipt/prompt-receipt.component.html

@@ -21,13 +21,13 @@
 			    style="text-align: left;" 
 			    width="94%">
 			    <div>
-					<textarea
+					<textarea matInput readonly
 					    style="border: none;
 					    	   outline: none;
 					    	   width: 95%;"
 				        cdkTextareaAutosize
 				        cdkAutosizeMinRows="1"
-				        cdkAutosizeMaxRows="4">{{ receiptUrl }}
+				        cdkAutosizeMaxRows="5">{{ receiptUrl }}
 					</textarea>
 				</div>
 

src/app/prompt-receipt/prompt-receipt.component.ts

@@ -19,6 +19,7 @@ var Buffer = require('buffer/').Buffer;
 
 export class PromptReceiptComponent implements OnInit {
 	orderId: string;
+	orderToken: string;
 	receiptUrl: string;
  
  	// ------------------------------------
@@ -43,10 +44,11 @@ export class PromptReceiptComponent implements OnInit {
 	constructor(
 		  private languageService : LanguageService,
 			private dialogRef: MatDialogRef<PromptReceiptComponent>,
-			@Inject(MAT_DIALOG_DATA) public data: {orderId: string},
+			@Inject(MAT_DIALOG_DATA) public data: {orderId: string, orderToken: string},
 			private notifierService : NotifierService ) {
 		this.orderId = data.orderId;
-		this.receiptUrl = 'https://app.zgo.cash/receipt/'+this.orderId;
+		this.orderToken = data.orderToken;
+		this.receiptUrl = 'https://app.zgo.cash/receipt/' + this.orderId + '?token=' + this.orderToken;
 
 	}
 

src/app/receipt.service.ts

@@ -44,6 +44,7 @@ export class ReceiptService {
 			paid: false,
 			externalInvoice: '',
 			shortCode: '',
+			token: '',
 			lines: [
 				{
 					qty: 1,
@@ -67,14 +68,14 @@ export class ReceiptService {
 		public userService: UserService
 	) {
 		this.session = localStorage.getItem('s4z_token');
-		this.params = new HttpParams().append('session', this.session!);
+		this.params = new HttpParams();
 		var auth = 'Basic ' + Buffer.from(ConfigData.UsrPwd).toString('base64');
 		this.reqHeaders = new HttpHeaders().set('Authorization', auth);
 		this.ownerUpdate = userService.ownerUpdate;
 	}
 
-	getOrderById(id:string) {
+	getOrderById(id:string, token: string) {
-		let obs = this.http.get<{message: string, order: any}>(this.beUrl+'api/order/'+id, { headers:this.reqHeaders, params: this.params, observe: 'response'});
+		let obs = this.http.get<{message: string, order: any}>(this.beUrl+'order/'+id, { headers:this.reqHeaders, params: this.params.append("token", token), observe: 'response'});
 
 		obs.subscribe((OrderDataResponse) => {
 			if (OrderDataResponse.status == 200) {

src/app/receipt/receipt.component.ts

@@ -14,6 +14,7 @@ import { LanguageData } from '../language.model';
 })
 export class ReceiptComponent implements OnInit {
 	orderId;
+	orderToken: string = '';
 	public orderUpdate: Observable<Order>;
 	public nameUpdate: Observable<string>;
 	name: string = '';
@@ -30,6 +31,7 @@ export class ReceiptComponent implements OnInit {
 			paid: false,
 			externalInvoice: '',
 			shortCode: '',
+			token: '',
 			lines: [
 				{
 					qty: 1,
@@ -60,12 +62,15 @@ export class ReceiptComponent implements OnInit {
 	  public receiptService: ReceiptService
   ) {
 	  this.orderId = this._ActiveRoute.snapshot.paramMap.get("orderId");
+	  this._ActiveRoute.queryParams.subscribe((params) => {
+		  this.orderToken = params["token"];
+		  receiptService.getOrderById(this.orderId!, this.orderToken!);
+	  });
 	  this.orderUpdate = receiptService.orderUpdate;
-	  this.nameUpdate = receiptService.nameUpdate;
-	  receiptService.getOrderById(this.orderId!);
 	  this.orderUpdate.subscribe(order => {
 		  this.order = order;
 	  });
+	  this.nameUpdate = receiptService.nameUpdate;
 
 	  this.nameUpdate.subscribe(name => {
 		  this.name = name;

src/app/settings/settings.component.ts

@@ -1,5 +1,5 @@
 import { Inject, Component, OnInit, OnDestroy, ViewEncapsulation } from '@angular/core';
-import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
+import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
 import { MatSlideToggleChange } from '@angular/material/slide-toggle';
 import { UntypedFormBuilder, Validators, UntypedFormGroup, FormControl } from '@angular/forms';
 import { Subject, Observable } from 'rxjs';
@@ -11,7 +11,6 @@ import { NotifierService } from '../notifier.service';
 import { faCopy } from '@fortawesome/free-solid-svg-icons';
 
 import { LanguageService } from '../language.service';
-import { LanguageData } from '../language.model';
 
 @Component({
 	selector: 'app-settings',
@@ -158,7 +157,7 @@ export class SettingsComponent implements OnInit {
 				this.xeroLink = `https://login.xero.com/identity/connect/authorize?response_type=code&client_id=${this.clientId}&redirect_uri=http%3A%2F%2Flocalhost%3A4200%2Fxeroauth&scope=accounting.transactions offline_access&state=${this.owner.address.substring(0, 6)}`
 			});
 			this.accCodeUpdate = xeroService.accCodeUpdate;
-			xeroService.getXeroAccountCode(this.owner.address);
+			xeroService.getXeroAccountCode();
 			this.accCodeUpdate.subscribe(accData => {
 				this.xeroAccCod = accData;
 				//console.log("xeroAccCod -> [" + this.xeroAccCod + "]");

src/app/xero.service.ts

@@ -24,7 +24,7 @@ export class XeroService {
 	savedAcc : boolean = false;
 
 	public savedAccObs = new Observable((observer) => {
-     console.log("starting savedAccObs");
+     //console.log("starting savedAccObs");
      setTimeout(() => {observer.next(this.savedAcc)},1000);
 	})
 
@@ -71,9 +71,8 @@ export class XeroService {
 		return obs;
 	}
 
-	getXeroAccountCode(address: string){
+	getXeroAccountCode(){
-		const params = this.reqParams.append('address', address);
+		let obs = this.http.get<{message: string, code: string}>(this.beUrl + 'api/xeroaccount', {headers: this.reqHeaders, params: this.reqParams, observe: 'response'});
-		let obs = this.http.get<{message: string, code: string}>(this.beUrl + 'api/xeroaccount', {headers: this.reqHeaders, params: params, observe: 'response'});
 		obs.subscribe(accountResponse => {
 			if (accountResponse.status == 200) {
 				this.xeroAcc = accountResponse.body!.code;