Correct saving of viewing key

src/app/order/order.component.css

@@ -51,27 +51,29 @@ img.icon{
 }
 
 .buttons-class {
-  background-color: #ff4722;
-  color: white;
-  font-weight: 700;
-  height: 25px !important;
-  width: 80px !important;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  margin: auto;
+	font-family: 'Spartan', sans-serif;
+	background-color: #ff4722;
+	color: white;
+	font-weight: 500;
+	height: 25px !important;
+	width: 80px !important;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	cursor: pointer;
+	margin: auto;
 }
 
 .button-cancel-class {
-  font-weight: 700;
-  height: 25px !important;
-  width: 80px !important;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-  margin: auto;
+	font-family: 'Spartan', sans-serif;
+	font-weight: 500;
+	height: 25px !important;
+	width: 80px !important;
+	display: flex;
+	align-items: center;
+	justify-content: center;
+	cursor: pointer;
+	margin: auto;
 }
 
 .availableItems{

src/app/settings/settings.component.css

@@ -1,9 +1,9 @@
 * {
-	font-family: Spartan;
+	font-family: 'Spartan', sans-serif;
 }
 
 .settings-title {
-	font-family: Spartan;
+	font-family: 'Spartan', sans-serif;
 	background: #ff4722;
 	color: white;
 	font-size: 30px;
@@ -13,6 +13,9 @@
 
 .settings_field {
 	width:  100%;
-	font-family: Spartan;
+	font-family: 'Spartan', sans-serif;
 }
 
+.mat-slide-toggle-content {
+	font-family: 'Spartan', sans-serif;
+}

src/app/settings/settings.component.html

@@ -23,20 +23,17 @@
 		                  (change)="onChange($event)">
 			Use zatoshis?
 		</mat-slide-toggle>
+		<mat-slide-toggle formControlName="useVKey" 
+						  (change)="onChangeVKeyOn($event)">
+			Activate payment confirmation?
+		</mat-slide-toggle>
+		<pre></pre>
+		<mat-form-field [style.width.%]="100">
+			<mat-label>Viewing key</mat-label>
+			<input matInput placeholder="Your wallet viewing key" 
+							formControlName="vKey">
 
-			<pre></pre>
-			<mat-slide-toggle formControlName="VkeyOn" 
-			                  (change)="onChangeVKeyOn($event)">
-				Activate payment confirmation?
-			</mat-slide-toggle>
-			<pre></pre>
-			<mat-form-field [style.width.%]="100">
-				<mat-label>Viewing key</mat-label>
-				<input matInput placeholder="Your wallet viewing key" 
-				       formControlName="VKey"
-				       [formControl]="viewkeyControl">
-				      
-			</mat-form-field>
+		</mat-form-field>
 
 	</mat-dialog-content>
 
@@ -54,4 +51,4 @@
 			    Save
 			</button>
 	</mat-dialog-actions>
-</div>
+</div>

src/app/settings/settings.component.ts

@@ -36,8 +36,6 @@ export class SettingsComponent implements OnInit {
 		}
 	];
 
-    viewkeyControl = new FormControl({ value: null, disabled: true });
-
 	constructor(
 		private fb: UntypedFormBuilder,
 		private dialogRef: MatDialogRef<SettingsComponent>,
@@ -48,11 +46,12 @@ export class SettingsComponent implements OnInit {
 			name: [data.name, Validators.required],
 			currency: [data.currency, Validators.required],
 			useZats: [data.zats,  Validators.required],
-			VkeyOn: [data.payconf, Validators.required],
-			VKey: [{value:data.viewkey, disabled: true },
-			        Validators.required
-			      ]
+			useVKey: [data.payconf, Validators.required],
+			vKey: [data.viewkey]
 		});
+		if (data.payconf) {
+			this.settingsForm.get('vKey')!.enable();
+		}
 		this.owner = data;
 
 	}
@@ -65,15 +64,12 @@ export class SettingsComponent implements OnInit {
 	}
 
 	save() {
+		console.log('Settings', this.settingsForm.value.vKey);
 		this.owner.name = this.settingsForm.value.name;
 		this.owner.currency = this.settingsForm.value.currency;
 		this.owner.zats = this.settingsForm.value.useZats;
-		this.owner.payconf = this.useVKey;
-		if ( this.settingsForm.value.VkeyOn ) {
-		    this.owner.viewkey = this.settingsForm.value.VKey;
-		  }
-		 else 
-		    this.owner.viewkey = '';                      	
+		this.owner.payconf = this.settingsForm.value.useVKey;
+		this.owner.viewkey = this.settingsForm.value.vKey;
 		this.dialogRef.close(this.owner);
 	}
 
@@ -88,9 +84,9 @@ export class SettingsComponent implements OnInit {
         this.useVKey = ob.checked;
 
 	    if ( ob.checked ) 
-	      this.viewkeyControl.enable()
+	      this.settingsForm.get('vKey')!.enable();
 	    else 
-	      this.viewkeyControl.disable();
+	      this.settingsForm.get('vKey')!.disable();
 
 	}
 }