Update flare-ui/src/app/dialogs/api-edit-dialog/api-edit-dialog.component.ts

flare-ui/src/app/dialogs/api-edit-dialog/api-edit-dialog.component.ts

@@ -1,7 +1,7 @@
 import { Component, Inject, OnInit } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { FormBuilder, FormGroup, Validators, ReactiveFormsModule, FormArray } from '@angular/forms';
-import { FormsModule } from '@angular/forms'; // ✅ FormsModule eklendi
+import { FormsModule } from '@angular/forms';
 import { MatDialogRef, MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
 import { MatTabsModule } from '@angular/material/tabs';
 import { MatFormFieldModule } from '@angular/material/form-field';
@@ -22,7 +22,7 @@ import { ApiService } from '../../services/api.service';
   imports: [
     CommonModule,
     ReactiveFormsModule,
-    FormsModule, // ✅ FormsModule imports'a eklendi
+    FormsModule,
     MatDialogModule,
     MatTabsModule,
     MatFormFieldModule,
@@ -45,15 +45,14 @@ export default class ApiEditDialogComponent implements OnInit {
   testing = false;
   testResult: any = null;
   testRequestJson = '{}';
-  allIntentParameters: { name: string; type: string }[] = [];
-  responseMappingVariables: { name: string; type: string }[] = [];
-  activeTabIndex = 0;  
+  allIntentParameters: string[] = [];
+  responseMappingVariables: string[] = [];
+  activeTabIndex = 0;
 
   httpMethods = ['GET', 'POST', 'PUT', 'PATCH', 'DELETE'];
   retryStrategies = ['static', 'exponential'];
   variableTypes = ['str', 'int', 'float', 'bool', 'date'];
 
-  // ✅ Cursor position tracking
   private cursorPositions: { [key: string]: number } = {};
   
   constructor(
@@ -95,69 +94,6 @@ export default class ApiEditDialogComponent implements OnInit {
     });
   }
 
-  populateForm(api: any) {
-    console.log('Populating form with API:', api); // Debug için
-    
-    // Convert headers object to FormArray
-    const headersArray = this.form.get('headers') as FormArray;
-    headersArray.clear();
-  
-    if (api.headers) {
-      // ✅ Array veya Object olabilir, kontrol edelim
-      if (Array.isArray(api.headers)) {
-        // Eğer array ise direkt kullan
-        api.headers.forEach((header: any) => {
-          headersArray.push(this.createHeaderFormGroup(header.key || '', header.value || ''));
-        });
-      } else if (typeof api.headers === 'object') {
-        // Eğer object ise entries ile dönüştür
-        Object.entries(api.headers).forEach(([key, value]) => {
-          headersArray.push(this.createHeaderFormGroup(key, value as string));
-        });
-      }
-    }
-  
-    // Convert response_mappings to FormArray
-    const responseMappingsArray = this.form.get('response_mappings') as FormArray;
-    responseMappingsArray.clear();
-  
-    if (api.response_mappings && Array.isArray(api.response_mappings)) {
-      api.response_mappings.forEach((mapping: any) => {
-        responseMappingsArray.push(this.createResponseMappingFormGroup(mapping));
-      });
-    }
-  
-    // Convert body_template to JSON string if it's an object
-    if (api.body_template && typeof api.body_template === 'object') {
-      api.body_template = JSON.stringify(api.body_template, null, 2);
-    }
-  
-    // Convert auth bodies to JSON strings  
-    if (api.auth) {
-      if (api.auth.token_request_body && typeof api.auth.token_request_body === 'object') {
-        api.auth.token_request_body = JSON.stringify(api.auth.token_request_body, null, 2);
-      }
-      if (api.auth.token_refresh_body && typeof api.auth.token_refresh_body === 'object') {
-        api.auth.token_refresh_body = JSON.stringify(api.auth.token_refresh_body, null, 2);
-      }
-    }
-  
-    // ✅ patchValue'dan önce form değerlerini düzelt
-    const formData = { ...api };
-    
-    // headers array'ini kaldır çünkü zaten FormArray'e ekledik
-    delete formData.headers;
-    delete formData.response_mappings;
-  
-    // Patch form values
-    this.form.patchValue(formData);
-  
-    // Disable name field if editing or testing
-    if (this.data.mode === 'edit' || this.data.mode === 'test') {
-      this.form.get('name')?.disable();
-    }
-  }
-
   initializeForm() {
     this.form = this.fb.group({
       // General Tab
@@ -212,21 +148,18 @@ export default class ApiEditDialogComponent implements OnInit {
   }
 
   populateForm(api: any) {
-    console.log('Populating form with API:', api); // Debug için
+    console.log('Populating form with API:', api);
     
     // Convert headers object to FormArray
     const headersArray = this.form.get('headers') as FormArray;
     headersArray.clear();
   
     if (api.headers) {
-      // ✅ Array veya Object olabilir, kontrol edelim
       if (Array.isArray(api.headers)) {
-        // Eğer array ise direkt kullan
         api.headers.forEach((header: any) => {
           headersArray.push(this.createHeaderFormGroup(header.key || '', header.value || ''));
         });
       } else if (typeof api.headers === 'object') {
-        // Eğer object ise entries ile dönüştür
         Object.entries(api.headers).forEach(([key, value]) => {
           headersArray.push(this.createHeaderFormGroup(key, value as string));
         });
@@ -258,7 +191,6 @@ export default class ApiEditDialogComponent implements OnInit {
       }
     }
   
-    // ✅ patchValue'dan önce form değerlerini düzelt
     const formData = { ...api };
     
     // headers array'ini kaldır çünkü zaten FormArray'e ekledik
@@ -268,8 +200,8 @@ export default class ApiEditDialogComponent implements OnInit {
     // Patch form values
     this.form.patchValue(formData);
   
-    // Disable name field if editing
-    if (this.data.mode === 'edit') {
+    // Disable name field if editing or testing
+    if (this.data.mode === 'edit' || this.data.mode === 'test') {
       this.form.get('name')?.disable();
     }
   }
@@ -294,7 +226,7 @@ export default class ApiEditDialogComponent implements OnInit {
       variable_name: [data.variable_name || '', [Validators.required, Validators.pattern(/^[a-z_][a-z0-9_]*$/)]],
       type: [data.type || 'str', Validators.required],
       json_path: [data.json_path || '', Validators.required],
-      caption: [data.caption || '', Validators.required]  // Yeni alan
+      caption: [data.caption || '', Validators.required]
     });
   }
 
@@ -328,27 +260,27 @@ export default class ApiEditDialogComponent implements OnInit {
 
   getTemplateVariables(includeResponseMappings = true): string[] {
     const variables = new Set<string>();
-  
+
     // Intent parameters
     this.allIntentParameters.forEach(param => {
-      variables.add(`variables.${param.name}`); // param artık object
+      variables.add(`variables.${param}`);
     });
-  
+
     // Auth tokens
     const apiName = this.form.get('name')?.value || 'api_name';
     variables.add(`auth_tokens.${apiName}.token`);
-  
+
     // Response mappings
     if (includeResponseMappings) {
       this.responseMappingVariables.forEach(varName => {
         variables.add(`variables.${varName}`);
       });
     }
-  
+
     // Config variables
     variables.add('config.work_mode');
     variables.add('config.cloud_token');
-  
+
     return Array.from(variables).sort();
   }
 
@@ -356,11 +288,8 @@ export default class ApiEditDialogComponent implements OnInit {
     this.responseMappingVariables = [];
     const mappings = this.responseMappings.value;
     mappings.forEach((mapping: any) => {
-      if (mapping.variable_name && mapping.type) {
-        this.responseMappingVariables.push({
-          name: mapping.variable_name,
-          type: mapping.type
-        });
+      if (mapping.variable_name) {
+        this.responseMappingVariables.push(mapping.variable_name);
       }
     });
   }
@@ -368,24 +297,21 @@ export default class ApiEditDialogComponent implements OnInit {
   async loadIntentParameters() {
     try {
       const projects = await this.apiService.getProjects(false).toPromise();
-      const params = new Map<string, string>();
-  
+      const params = new Set<string>();
+
       projects?.forEach(project => {
         project.versions?.forEach(version => {
           version.intents?.forEach(intent => {
             intent.parameters?.forEach((param: any) => {
-              if (param.variable_name && param.type) {
-                params.set(param.variable_name, param.type);
+              if (param.variable_name) {
+                params.add(param.variable_name);
               }
             });
           });
         });
       });
-  
-      this.allIntentParameters = Array.from(params.entries())
-        .map(([name, type]) => ({ name, type }))
-        .sort((a, b) => a.name.localeCompare(b.name));
-        
+
+      this.allIntentParameters = Array.from(params).sort();
     } catch (error) {
       console.error('Failed to load intent parameters:', error);
     }
@@ -394,59 +320,13 @@ export default class ApiEditDialogComponent implements OnInit {
   validateJSON(field: string): boolean {
     const control = this.form.get(field);
     if (!control || !control.value) return true;
-  
+
     try {
-      let jsonStr = control.value;
-      
-      jsonStr = jsonStr.replace(/\{\{([^}]+)\}\}/g, (match: string, variablePath: string) => {
-        const path = variablePath.trim();
-        
-        if (path.startsWith('variables.')) {
-          const varName = path.split('.')[1];
-          
-          // Önce intent parametrelerinde ara
-          const param = this.allIntentParameters.find(p => p.name === varName);
-          if (param) {
-            switch (param.type) {
-              case 'int': return '123';
-              case 'float': return '123.45';
-              case 'bool': return 'true';
-              case 'date': return '"2025-01-01"';
-              default: return '"placeholder"';
-            }
-          }
-          
-          // Response mapping'lerde ara
-          const responseVar = this.responseMappingVariables.find(v => v.name === varName);
-          if (responseVar) {
-            switch (responseVar.type) {
-              case 'int': return '123';
-              case 'float': return '123.45';
-              case 'bool': return 'true';
-              case 'date': return '"2025-01-01"';
-              default: return '"placeholder"';
-            }
-          }
-          
-          // Tanımsız değişken
-          return '"UNDEFINED_VARIABLE"';
-        }
-        
-        if (path.startsWith('auth_tokens.')) {
-          return '"token123"';
-        }
-        
-        if (path.startsWith('config.')) {
-          return '"configvalue"';
-        }
-        
-        return '"unknown"';
-      });
-      
-      JSON.parse(jsonStr);
+      const jsonStr = control.value;
+      const processedJson = this.replaceVariablesForValidation(jsonStr);
+      JSON.parse(processedJson);
       return true;
-      
-    } catch (e) {
+    } catch {
       return false;
     }
   }
@@ -454,13 +334,10 @@ export default class ApiEditDialogComponent implements OnInit {
   replaceVariablesForValidation(jsonStr: string): string {
     let processed = jsonStr;
   
-    // Tüm {{...}} template değişkenlerini uygun placeholder ile değiştir
     processed = processed.replace(/\{\{([^}]+)\}\}/g, (match, variablePath) => {
-      // Değişken tipini tahmin et
       if (variablePath.includes('variables.')) {
         const varName = variablePath.split('.').pop()?.toLowerCase() || '';
         
-        // Bilinen sayısal değişkenler
         const numericVars = ['count', 'passenger_count', 'timeout_seconds', 'retry_count', 'amount', 'price', 'quantity', 'age', 'id'];
         const booleanVars = ['enabled', 'published', 'is_active', 'confirmed', 'canceled', 'deleted', 'required'];
         
@@ -469,12 +346,10 @@ export default class ApiEditDialogComponent implements OnInit {
         } else if (booleanVars.some(v => varName.includes(v))) {
           return 'true';
         } else {
-          // String olarak ele al
           return '"placeholder"';
         }
       }
       
-      // Auth token'lar ve config değerleri her zaman string
       return '"placeholder"';
     });
   
@@ -482,7 +357,6 @@ export default class ApiEditDialogComponent implements OnInit {
   }
   
   async testAPI() {
-    // Validate form first
     const generalValid = this.form.get('url')?.valid && this.form.get('method')?.valid;
     if (!generalValid) {
       this.snackBar.open('Please fill in required fields first', 'Close', { duration: 3000 });
@@ -495,7 +369,6 @@ export default class ApiEditDialogComponent implements OnInit {
     try {
       const testData = this.prepareAPIData();
       
-      // Parse test request JSON
       let testRequestData = {};
       try {
         testRequestData = JSON.parse(this.testRequestJson);
@@ -508,13 +381,11 @@ export default class ApiEditDialogComponent implements OnInit {
         return;
       }
       
-      // Add test request to the data
       testData.test_request = testRequestData;
       
       const result = await this.apiService.testAPI(testData).toPromise();
       this.testResult = result;
   
-      // Show appropriate message based on actual success
       if (result.success) {
         this.snackBar.open(`API test successful! (${result.status_code})`, 'Close', { 
           duration: 3000 
@@ -559,17 +430,14 @@ export default class ApiEditDialogComponent implements OnInit {
       bodyTemplate = {};
     }
 
-    // Placeholder değerlerle doldur
     const testData = this.replacePlaceholdersForTest(bodyTemplate);
     this.testRequestJson = JSON.stringify(testData, null, 2);
   }
 
   replacePlaceholdersForTest(obj: any): any {
     if (typeof obj === 'string') {
-      // Template değişkenlerini test değerleriyle değiştir
       let result = obj;
       
-      // Intent parameters
       result = result.replace(/\{\{variables\.origin\}\}/g, 'Istanbul');
       result = result.replace(/\{\{variables\.destination\}\}/g, 'Ankara');
       result = result.replace(/\{\{variables\.flight_date\}\}/g, '2025-06-15');
@@ -578,13 +446,10 @@ export default class ApiEditDialogComponent implements OnInit {
       result = result.replace(/\{\{variables\.pnr\}\}/g, 'ABC12');
       result = result.replace(/\{\{variables\.surname\}\}/g, 'Test');
       
-      // Auth tokens
       result = result.replace(/\{\{auth_tokens\.[^}]+\.token\}\}/g, 'test_token_123');
       
-      // Config
       result = result.replace(/\{\{config\.work_mode\}\}/g, 'hfcloud');
       
-      // Diğer değişkenler
       result = result.replace(/\{\{[^}]+\}\}/g, 'test_value');
       
       return result;
@@ -601,7 +466,6 @@ export default class ApiEditDialogComponent implements OnInit {
   prepareAPIData(): any {
     const formValue = this.form.getRawValue();
 
-    // Convert headers array back to object
     const headers: any = {};
     formValue.headers.forEach((h: any) => {
       if (h.key && h.value) {
@@ -609,7 +473,6 @@ export default class ApiEditDialogComponent implements OnInit {
       }
     });
 
-    // Parse JSON fields
     let body_template = {};
     let auth_token_request_body = {};
     let auth_token_refresh_body = {};
@@ -632,7 +495,6 @@ export default class ApiEditDialogComponent implements OnInit {
       console.error('Invalid auth token_refresh_body JSON:', e);
     }
 
-    // Prepare final data
     const apiData: any = {
       name: formValue.name,
       url: formValue.url,
@@ -645,12 +507,10 @@ export default class ApiEditDialogComponent implements OnInit {
       response_mappings: formValue.response_mappings || []
     };
 
-    // Add proxy if specified
     if (formValue.proxy) {
       apiData.proxy = formValue.proxy;
     }
 
-    // Add auth if enabled
     if (formValue.auth.enabled) {
       apiData.auth = {
         enabled: true,
@@ -665,7 +525,6 @@ export default class ApiEditDialogComponent implements OnInit {
       }
     }
 
-    // Add last_update_date for edit mode
     if (this.data.mode === 'edit' && formValue.last_update_date) {
       apiData.last_update_date = formValue.last_update_date;
     }
@@ -678,14 +537,12 @@ export default class ApiEditDialogComponent implements OnInit {
       this.cancel();
       return;
     }
-    
+
     if (this.form.invalid) {
-      // Mark all fields as touched to show validation errors
       Object.keys(this.form.controls).forEach(key => {
         this.form.get(key)?.markAsTouched();
       });
       
-      // Check specific JSON fields
       const jsonFields = ['body_template', 'auth.token_request_body', 'auth.token_refresh_body'];
       for (const field of jsonFields) {
         if (!this.validateJSON(field)) {
@@ -745,7 +602,6 @@ export default class ApiEditDialogComponent implements OnInit {
       const variableText = `{{${variable}}}`;
       const cursorPos = this.cursorPositions[field] || currentValue.length;
       
-      // Değişkeni cursor pozisyonuna ekle
       const newValue = 
         currentValue.slice(0, cursorPos) + 
         variableText + 
@@ -753,9 +609,7 @@ export default class ApiEditDialogComponent implements OnInit {
       
       control.setValue(newValue);
       
-      // Cursor pozisyonunu güncelle (değişken sonrası)
       setTimeout(() => {
-        // ✅ Auth field'ları için özel selector
         let selector = `textarea[formControlName="${field}"]`;
         if (field === 'auth.token_request_body') {
           selector = 'div[formGroupName="auth"] textarea[formControlName="token_request_body"]';