From 0f26bd2de34c8dc613d067f115caddbdfffb00ec Mon Sep 17 00:00:00 2001
From: mariateresa <mariateresa.paratore@isti.cnr.it>
Date: Tue, 28 May 2024 17:30:18 +0200
Subject: [PATCH] managing credential fields

---
 ...rty.java => TypePropertyUserPassword.java} |  0
 .../facet-composer.component.html             | 54 ++++++++++++++-----
 .../facet-composer.component.ts               | 32 +++++++----
 3 files changed, 63 insertions(+), 23 deletions(-)
 rename src/main/java/org/gcube/informationsystem/web/rest/{TypeProperty.java => TypePropertyUserPassword.java} (100%)

diff --git a/src/main/java/org/gcube/informationsystem/web/rest/TypeProperty.java b/src/main/java/org/gcube/informationsystem/web/rest/TypePropertyUserPassword.java
similarity index 100%
rename from src/main/java/org/gcube/informationsystem/web/rest/TypeProperty.java
rename to src/main/java/org/gcube/informationsystem/web/rest/TypePropertyUserPassword.java
diff --git a/src/main/webapp/app/facet-composer/facet-composer.component.html b/src/main/webapp/app/facet-composer/facet-composer.component.html
index 3c1a8f4..0fee660 100644
--- a/src/main/webapp/app/facet-composer/facet-composer.component.html
+++ b/src/main/webapp/app/facet-composer/facet-composer.component.html
@@ -45,18 +45,47 @@
 								    <!-- PROPERTIES -->	
 										<div formGroupName ="props" >
 										<div *ngFor="let prop of facetTemplate.value.guiProps">
-													<div *ngIf="prop.type==='typeprop'; else singlefield" style="border: 1px solid rgb(202, 202, 202); padding: 10px; margin: 5px;">
+											<div *ngIf="prop.type==='typeprop'; else singlefield" style="border: 1px solid rgb(202, 202, 202); padding: 10px; margin: 5px;">
 														<p style="color: darkgrey;">{{prop.label}}</p>
-														<mat-form-field>
-															<mat-label>username</mat-label>
-																<input matInput formControlName="schema" id="username" 
-																	type="text"/>
-														</mat-form-field>
-														<mat-form-field>
-															<mat-label>password</mat-label>
-																<input matInput formControlName="value" id="password" 
-																	type="password"/>
-														</mat-form-field>
+											
+											<mat-form-field>
+											<mat-label for="credentials" >Choose:</mat-label>
+												<mat-select formControlName="credentials" id="credentials" (selectionChange)="setCredentialType($event)">
+													<mat-option *ngFor="let opt of credentialTypes"  [value]="opt">
+														{{opt}}
+													</mat-option>
+								  				</mat-select>
+								  			</mat-form-field>
+								  			<div *ngIf="selectedCredentialType === 'username/password'">
+									  			<mat-form-field>
+											 		<mat-label for="username">username</mat-label>
+													<input matInput formControlName="username" type="text"/>
+												</mat-form-field>
+												<mat-form-field>
+											 		<mat-label for="password">password</mat-label>
+													<input matInput formControlName="password" type="password"/>
+												</mat-form-field>
+											</div>
+											<div *ngIf="selectedCredentialType === 'client-id/secret'">
+									  			<mat-form-field>
+											 		<mat-label for="client-id">client-id</mat-label>
+													<input matInput formControlName="client-id" type="text"/>
+												</mat-form-field>
+												<mat-form-field>
+											 		<mat-label for="secret">secret</mat-label>
+													<input matInput formControlName="secret" type="password"/>
+												</mat-form-field>
+											</div>
+											<div *ngIf="selectedCredentialType === 'token/secret'">
+									  			<mat-form-field>
+											 		<mat-label for="token">token</mat-label>
+													<input matInput formControlName="token" type="text"/>
+												</mat-form-field>
+												<mat-form-field>
+											 		<mat-label for="secret">secret</mat-label>
+													<input matInput formControlName="secret" type="password"/>
+												</mat-form-field>
+											</div>
 												</div>
 												<ng-template #singlefield>
 													<mat-form-field> 
@@ -167,8 +196,7 @@
 								(click)="addFacet(facetTemplate.key)"  [disabled]="facetTemplate.value.max==='1'">
 							<mat-icon>add</mat-icon>Add new </button>
   			   </div>
-
-			   </div> <!-- ends the form -->
+			</div> <!-- ends the form -->
 		</mat-dialog-content>   
 		<mat-dialog-actions align="end">
 		   <button mat-button type="submit" (click)="onSubmit()">Submit</button>
diff --git a/src/main/webapp/app/facet-composer/facet-composer.component.ts b/src/main/webapp/app/facet-composer/facet-composer.component.ts
index 8618f63..45a2ee1 100644
--- a/src/main/webapp/app/facet-composer/facet-composer.component.ts
+++ b/src/main/webapp/app/facet-composer/facet-composer.component.ts
@@ -11,6 +11,7 @@ import { IResource } from 'app/services/i-resource';
 import { FacetComposerService, ITypeSpecification } from './facet-composer.service';
 import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatButtonModule } from '@angular/material/button';
+import {MatRadioModule} from "@angular/material/radio";
 import { MatInputModule } from '@angular/material/input';
 import { MatExpansionModule } from '@angular/material/expansion';
 import { IFacetComposer, IFacetProps } from './i-facet-composer';
@@ -23,7 +24,7 @@ import { MatSelectFilterModule } from 'mat-select-filter';
   templateUrl: './facet-composer.component.html',
   styleUrls: ['./facet-composer.component.scss'],
   imports:[CommonModule,MatFormFieldModule,SharedModule,
-  ReactiveFormsModule,MatButtonModule,
+  ReactiveFormsModule,MatButtonModule,MatRadioModule,
   MatDialogModule,MatInputModule,MatExpansionModule,MatSelectFilterModule],
   providers: [FacetComposerService]
 })
@@ -34,6 +35,7 @@ export class FacetComposerComponent implements OnInit {
 	titlePath: string;
 	selectedOption: string;
 	selectedType: string;
+	selectedCredentialType: string|any;
 	
     myForm: FormGroup;	//form complessiva 
     typeSpec: ITypeSpecification;
@@ -91,8 +93,9 @@ export class FacetComposerComponent implements OnInit {
   		];
   		
 
-			
-			onOptionTypeSelected(): void {
+  		credentialTypes: string[] = ['username/password', 'client-id/secret', 'token/secret'];
+
+			onCredentialChoose(): void {
 				console.debug('******onOptionsSelected?...'+this.selectedType);
 			}
 		
@@ -122,6 +125,7 @@ export class FacetComposerComponent implements OnInit {
 				deno: ['',Validators.required],
 				val: ['',Validators.required],
 				tipo:['String']
+				
 				})
 			}	
 		
@@ -131,6 +135,8 @@ export class FacetComposerComponent implements OnInit {
 			}	
 		
 		
+		
+		
 		getPropsGroup(denoFacet:string, index:number):FormGroup{
 			return (this.getSingleFacetArray(denoFacet).controls[index]).get('props') as FormGroup;
 		}
@@ -183,7 +189,11 @@ export class FacetComposerComponent implements OnInit {
 				    
 			}
 			
-			
+		setCredentialType(opt:any){
+			this.selectedCredentialType = opt.value;
+			console.debug("*******CAMBIATO: "+opt.value);
+		}	
+		
 			
 		addPropertyControls(facetFg:FormGroup, props: IFacetProps[]):FormGroup{
 			const propsFg = this.fb.group({});
@@ -214,12 +224,14 @@ export class FacetComposerComponent implements OnInit {
 							 }
 						 }
 					 }
-					 if(prop.type==="typeprop"){ //TODO: forse va messo il controllo anche sul tipo di facet
-						 let fc2:FormControl;
-						 propsFg.addControl("schema",fc);
-						 // eslint-disable-next-line prefer-const
-						 fc2 = this.fb.control('') //text or typeprop
-						 propsFg.addControl("value",fc2);
+					 if(prop.type==="typeprop"){
+					 	 propsFg.addControl("credentials",this.fb.control('',Validators.required));
+						 propsFg.addControl("username",this.fb.control('',Validators.required));
+						 propsFg.addControl("password",this.fb.control('',Validators.required));
+						 propsFg.addControl("client-id",this.fb.control('',Validators.required));
+						 propsFg.addControl("secret",this.fb.control('',Validators.required));
+						 propsFg.addControl("token",this.fb.control('',Validators.required));
+						 propsFg.addControl("secret",this.fb.control('',Validators.required));
 					 }else{
 						 propsFg.addControl(prop.name,fc); //formGroup.addControl(prop_'controlName', formControl);
 					 }