Merge branch 'sessionpay'

CHANGELOG.md

@@ -3,6 +3,12 @@ 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.1.0] - 2023-05-02
+
+### Added
+
+- New dialog to purchase sessions ahead of expiration.
+
 ## [2.0.0] - 2023-03-16
 
 ### Added

package.json

@@ -1,6 +1,6 @@
 {
   "name": "zgo",
-  "version": "2.0.0-beta",
+  "version": "2.1.0",
   "scripts": {
     "ng": "ng",
     "start": "ng serve",

src/app/app.component.html

@@ -45,7 +45,7 @@
      style="margin-top: 10px;
             margin-bottom: 20px;">
   <div >&copy; 2023 Vergara Technologies LLC</div>
-  <div class="tiny">Version 2.0.0</div>
+  <div class="tiny">Version 2.1.0</div>
   <div class="tiny">{{ vE.mainPriceData }}</div>
 </div>
 <div></div>

src/app/app.module.ts

@@ -51,6 +51,7 @@ import { NotifierComponent } from './notifier/notifier.component';
 import { PmtserviceComponent } from './pmtservice/pmtservice.component';
 import { XeroRegComponent } from './xeroreg/xeroreg.component';
 import { DbExportComponent } from './db-export/db-export.component';
+import { SessionpayComponent } from './sessionpay/sessionpay.component';
 
 @NgModule({
     declarations: [
@@ -81,6 +82,7 @@ import { DbExportComponent } from './db-export/db-export.component';
         PmtserviceComponent,
         XeroRegComponent,
         DbExportComponent,
+        SessionpayComponent,
     ],
     imports: [
         BrowserModule,

src/app/listorders/listorders.component.html

@@ -8,7 +8,7 @@
 			{{ vE.listordersEndDate }}{{(ownerUpdate | async)!.expiration | date: 'YYYY-MM-dd'}}
 			</td>
 			<td>
-				<button mat-icon-button color="primary">
+				<button mat-icon-button color="primary" (click)="paySession()">
 					<mat-icon class="icon">queue</mat-icon>
 				</button>
 			</td>

src/app/listorders/listorders.component.ts

@@ -4,6 +4,7 @@ import { Order } from '../order/order.model';
 import { FullnodeService } from '../fullnode.service';
 import { UserService } from '../user.service';
 import { Owner } from '../owner.model';
+import { User } from '../user.model';
 import { OrderService } from '../order/order.service';
 
 import { MatDialog, MatDialogConfig} from '@angular/material/dialog';
@@ -20,6 +21,7 @@ import { faTrash } from '@fortawesome/free-solid-svg-icons';
 
 import { LanguageService } from '../language.service';
 import { LanguageData } from '../language.model';
+import {SessionpayComponent} from '../sessionpay/sessionpay.component';
 
 @Component({
 	selector: 'app-list-orders',
@@ -71,6 +73,12 @@ export class ListOrdersComponent implements OnInit, OnDestroy{
 			viewkey: '',
 			crmToken: ''
 		};
+	zecPrice: number = 1;
+	nodeAddress: string = '';
+	session: string = '';
+	addrUpdate: Observable<string>;
+	priceUpdate: Observable<number>;
+	userUpdate: Observable<User>;
 	// -------------------------------------
 	// -------------------------------------
 	//
@@ -97,11 +105,24 @@ export class ListOrdersComponent implements OnInit, OnDestroy{
 		private languageService : LanguageService,
 		public orderService: OrderService,
 		public userService: UserService,
+		public fullnodeService: FullnodeService,
 		private dialog: MatDialog)
 	{
 		this.ownerUpdate = userService.ownerUpdate;
+		this.userUpdate = userService.userUpdate;
 		this.orderService.getAllOrders();
 		this.ordersUpdate = orderService.allOrdersUpdate;
+		this.addrUpdate = fullnodeService.addrUpdate;
+		this.priceUpdate = fullnodeService.priceUpdate;
+		this.priceUpdate.subscribe(price => {
+			this.zecPrice = price;
+		});
+		this.addrUpdate.subscribe(nAddress => {
+			this.nodeAddress = nAddress;
+		});
+		this.userUpdate.subscribe(user => {
+			this.session = user.session;
+		});
 	}
 
 	ngOnInit(){
@@ -237,4 +258,17 @@ export class ListOrdersComponent implements OnInit, OnDestroy{
       );
   }  
 
+  paySession() {
+	  const dialogConfig = new MatDialogConfig();
+
+	  dialogConfig.disableClose = true;
+	  dialogConfig.autoFocus = true;
+	  dialogConfig.data = {
+		  addr: this.nodeAddress,
+		  session: this.session,
+		  zecPrice: this.zecPrice
+	  };
+
+	  const dialogRef = this.dialog.open(SessionpayComponent, dialogConfig);
+  }
 }

src/app/sessionpay/sessionpay.component.css

@@ -0,0 +1,20 @@
+
+* {
+	font-family: 'Spartan', sans-serif;
+}
+
+.settings-title {
+	font-family: 'Spartan', sans-serif;
+	background: #ff5722;
+	color: white;
+	font-size: 30px;
+	text-align: center;
+	padding: 5px;
+	margin-bottom: 10px;
+}
+
+.container {
+	display: flex;
+	justify-content: space-between;
+	align-items: center;
+}

src/app/sessionpay/sessionpay.component.html

@@ -0,0 +1,15 @@
+<div class="settings-title">Purchase Session</div>
+<mat-card [formGroup]="payForm">
+	<mat-form-field appearance="outline">
+		<mat-label>Select session:</mat-label>
+		<mat-select formControlName="session">
+			<mat-option *ngFor="let ticket of tickets" [value]="ticket.value">
+				{{ticket.viewValue}}
+			</mat-option>
+		</mat-select>
+	</mat-form-field>
+	<div class="container">
+		<button mat-raised-button (click)="close()">Cancel</button>
+		<button mat-raised-button color="primary" [disabled]="payForm.invalid" (click)="pay()">Pay</button>
+	</div>
+</mat-card>

src/app/sessionpay/sessionpay.component.spec.ts

@@ -0,0 +1,23 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SessionpayComponent } from './sessionpay.component';
+
+describe('SessionpayComponent', () => {
+  let component: SessionpayComponent;
+  let fixture: ComponentFixture<SessionpayComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ SessionpayComponent ]
+    })
+    .compileComponents();
+
+    fixture = TestBed.createComponent(SessionpayComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/sessionpay/sessionpay.component.ts

@@ -0,0 +1,68 @@
+import { Inject, Component } from '@angular/core';
+import { ScanComponent } from '../scan/scan.component';
+import { Validators, UntypedFormGroup, FormBuilder } from '@angular/forms';
+import { MatDialog, MatDialogConfig, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
+
+@Component({
+  selector: 'app-sessionpay',
+  templateUrl: './sessionpay.component.html',
+  styleUrls: ['./sessionpay.component.css']
+})
+export class SessionpayComponent {
+
+	nodeAddress: string = '';
+	zecPrice: number = 1;
+	tickets = [
+		{
+			value: 1,
+			viewValue: '1 day: USD $1'
+		},{
+			value: 6,
+			viewValue: '1 week: USD $6'
+		},{
+			value: 22,
+			viewValue: '1 month: USD $22'
+		},{
+			value: 30,
+			viewValue: '1 month Pro: USD $30'
+		}
+	];
+	payForm: UntypedFormGroup;
+	session: string;
+
+	constructor(
+		private dialog: MatDialog,
+		private dialogRef: MatDialogRef<SessionpayComponent>,
+		private fb: FormBuilder,
+		@Inject(MAT_DIALOG_DATA) public data: { addr: string, session: string, zecPrice: number }
+	) {
+		this.payForm= fb.group({
+			session: ['', Validators.required]
+		});
+		this.session = data.session;
+		this.zecPrice = data.zecPrice;
+		this.nodeAddress = data.addr;
+	}
+
+	pay(){
+		const dialogConfig = new MatDialogConfig();
+
+		dialogConfig.disableClose = true;
+		dialogConfig.autoFocus = true;
+		dialogConfig.data = {
+			totalZec: (this.payForm.get('session')!.value)/this.zecPrice,
+			addr: this.nodeAddress,
+			session: this.session,
+			pay: true
+		};
+
+		const dialogRef1 = this.dialog.open(ScanComponent, dialogConfig);
+		dialogRef1.afterClosed().subscribe(val => {
+			this.dialogRef.close();
+		});
+	}
+
+	close(){
+		this.dialogRef.close();
+	}
+}