Template mapping and detect issue fixed

frontend/src/app/services/template.service.ts

@@ -81,8 +81,12 @@ export class TemplateService {
     );
   }
 
-  createTemplate(data: { template_name: string, source_document_id?: string, fields: TemplateField[] }): Observable<Template> {
-    return this.http.post<Template>(`${this.apiUrl}/templates`, data);
+  createTemplate(payload: any): Observable<any> {
+    return this.http.post<any>(`${this.apiUrl}/templates`, payload);
+  }
+
+  updateTemplate(templateId: string, payload: any): Observable<any> {
+    return this.http.put<any>(`${this.apiUrl}/templates/${templateId}`, payload);
   }
 
   saveMappings(templateId: string, mappings: any[]): Observable<any> {

frontend/src/app/templates/templates.component.ts

@@ -47,6 +47,9 @@ export class TemplatesComponent implements OnInit {
   
   // UI State
   displayAddField: boolean = false;
+  isScanning: boolean = false;
+  scanProgress: number = 0;
+  currentTemplateId: string | null = null;
   newField: TemplateField = { field_label: '', field_type: 'TEXT', display_order: 0, required_flag: false };
   fieldTypes = [
     { label: 'TEXT', value: 'TEXT' },
@@ -67,6 +70,11 @@ export class TemplatesComponent implements OnInit {
   onFileUpload(event: any) {
     const file = event.target.files[0];
     if (file) {
+      this.currentTemplateId = null;
+      this.templateName = '';
+      this.templateFields = [];
+      this.mappings = {};
+      
       this.templateService.uploadDocument(file).subscribe({
         next: (res) => {
           this.documentId = res.id || res.pk_document_id;
@@ -126,11 +134,12 @@ export class TemplatesComponent implements OnInit {
           const match = matches[0];
           this.messageService.add({ severity: 'info', summary: 'Template Recognized', detail: `Confidence: ${(match.confidence_score * 100).toFixed(1)}%` });
           
-          this.templateService.getTemplate(match.format_id).subscribe({
-            next: (templateData) => {
-              this.templateName = templateData.name;
-              this.templateFields = [];
-              this.mappings = {};
+            this.templateService.getTemplate(match.format_id).subscribe({
+              next: (templateData) => {
+                this.templateName = templateData.name;
+                this.currentTemplateId = match.format_id;
+                this.templateFields = [];
+                this.mappings = {};
               
               if (templateData.cells) {
                 templateData.cells.forEach((cell: any) => {
@@ -221,11 +230,17 @@ export class TemplatesComponent implements OnInit {
       return;
     }
     
-    this.templateService.createTemplate({
+    const payload = {
       template_name: this.templateName,
       source_document_id: this.documentId || undefined,
       fields: this.templateFields
-    }).subscribe({
+    };
+
+    const saveRequest = this.currentTemplateId
+      ? this.templateService.updateTemplate(this.currentTemplateId, payload)
+      : this.templateService.createTemplate(payload);
+
+    saveRequest.subscribe({
       next: (res: any) => {
         const templateId = res.pk_template_id;