diff --git a/visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/WireframesUi/wireframe-renderer.component.ts b/visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/WireframesUi/wireframe-renderer.component.ts
index f26625c..17e6001 100644
--- a/visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/WireframesUi/wireframe-renderer.component.ts
+++ b/visaproject-front-f/authsec_angular/frontend/angular-clarity-master/src/app/modules/main/fnd/SiteTreeBuilder/WireframesUi/wireframe-renderer.component.ts
@@ -957,6 +957,7 @@ private async checkAllExistingPages(expectedPages: string[]): Promise<Map<string
 private async checkSinglePage(pageName: string): Promise<string | null> {
   const sanitizedPageName = this.sanitizeFilename(pageName);
   
+  console.log(sanitizedPageName)
   return new Promise((resolve) => {
     this.siteTreeService.readPages(this.sitename, sanitizedPageName).subscribe({
       next: (response) => {
@@ -3295,15 +3296,16 @@ createPageOrderFromJson(jsonInput: string): string[] {
 }
 
     async checkIfPageExists(siteName: string, pageName: string): Promise<boolean> {
+     
       return new Promise((resolve) => {
-        this.siteTreeService.readPages(siteName, pageName).subscribe({
+        this.siteTreeService.readPages(this.formatSiteName(siteName),  this.sanitizeFilename(pageName)).subscribe({
           next: (response) => {
             // Adjust this check based on your API's actual response
             if (response && (response.exists || (typeof response === 'string' && response.trim() !== '' && !response.includes('❌ File not found')))) {
-              console.log(`Page "${pageName}" exists in site "${siteName}"`);
+              console.log(`Page "${this.sanitizeFilename(pageName)}" exists in site "${this.formatSiteName(siteName)}"`);
               resolve(true);
             } else {
-              console.log(`Page "${pageName}" does not exist in site "${siteName}"`);
+              console.log(`Page "${this.sanitizeFilename(pageName)}" does not exist in site "${this.formatSiteName(siteName)}"`);
               resolve(false);
             }
           },
@@ -3324,7 +3326,7 @@ async mapOfExistingPagesWithHtmlCss(existingPages: string[]): Promise<void> {
   // Create promises for all page requests
   const pagePromises = existingPages.map(page => {
     return new Promise<void>((resolve, reject) => {
-      this.siteTreeService.readPages(this.sitename, page).subscribe({
+      this.siteTreeService.readPages(this.formatSiteName(this.sitename), this.sanitizeFilename(page)).subscribe({
         next: (response) => {
           if (typeof response === 'string') {
             let htmlBody: string = response;
@@ -3423,7 +3425,10 @@ calculateSectionHtmlsForExistingPage(pageName: string, htmlContent: string): voi
   // Create all pages first, then save them
   let pagesToSave = new Map<string, string>();
 
+  let sanitizedPageName = '';
+
   for (const pageName of missingPages) {
+    
     const pageDef = allPagesDef[pageName];
     if (!pageDef) continue;
 
@@ -3446,8 +3451,10 @@ calculateSectionHtmlsForExistingPage(pageName: string, htmlContent: string): voi
       sectionHtmls.push(html);
     }
 
+    sanitizedPageName = this.sanitizeFilename(pageName);
+
     // Combine all section HTMLs and CSS for the page
-    const finalHtml = this.createCompleteHtml(pageName, COMMON_CSS, sectionHtmls.join('\n'));
+    const finalHtml = this.createCompleteHtml(sanitizedPageName, COMMON_CSS, sectionHtmls.join('\n'));
 
     this.pageSections[pageName] = { FullPage: finalHtml };
     this.mapofPageAndHtmlBody[pageName] = finalHtml;
@@ -3457,34 +3464,42 @@ calculateSectionHtmlsForExistingPage(pageName: string, htmlContent: string): voi
 
     pagesToSave.set(pageName, finalHtml.toString());
 
-    console.log(pagesToSave)
-
-    this.siteTreeService.createHtmlfile(this.siteId, this.sitename, pagesToSave).subscribe({
-      next: (response) => {
-        console.log('All pages created successfully:', Array.from(pagesToSave.keys()));
-        this.toastr.success(`Generated and saved ${pagesToSave} pages successfully.`);
-      },
-      error: (error) => {
-        console.error('Error creating pages:', error);
-        this.toastr.error('Failed to save some generated pages.');
-      }
-    });
+    // Instead of saving all pages at once, save each page individually
+    for (const [pageName, html] of pagesToSave.entries()) {
+       
+      const pageObj: Record<string, string> = { [pageName]: html };
+    // Ensure the page name is sanitized
+      await new Promise<void>((resolve) => {
+        this.siteTreeService.createHtmlfile(this.siteId, this.sitename, pageObj).subscribe({
+          next: (response) => {
+            console.log(`Page "${pageName}" created successfully.`);
+            this.toastr.success(`Generated and saved page: ${pageName}`);
+            resolve();
+          },
+          error: (error) => {
+            console.error(`Error creating page "${pageName}":`, error);
+            this.toastr.error(`Failed to save generated page: ${pageName}`);
+            resolve();
+          }
+        });
+      });
+    }
 
   }
 
   // Save all pages at once after they're all created
-  if (pagesToSave.size > 0) {
-    this.siteTreeService.createHtmlfile(this.siteId, this.sitename, pagesToSave).subscribe({
-      next: (response) => {
-        console.log('All pages created successfully:', Array.from(pagesToSave.keys()));
-        this.toastr.success(`Generated and saved ${pagesToSave.size} pages successfully.`);
-      },
-      error: (error) => {
-        console.error('Error creating pages:', error);
-        this.toastr.error('Failed to save some generated pages.');
-      }
-    });
-  }
+  // if (pagesToSave.size > 0) {
+  //   this.siteTreeService.createHtmlfile(this.siteId, this.sitename, pagesToSave).subscribe({
+  //     next: (response) => {
+  //       console.log('All pages created successfully:', Array.from(pagesToSave.keys()));
+  //       this.toastr.success(`Generated and saved ${pagesToSave.size} pages successfully.`);
+  //     },
+  //     error: (error) => {
+  //       console.error('Error creating pages:', error);
+  //       this.toastr.error('Failed to save some generated pages.');
+  //     }
+  //   });
+  // }
 
   console.log('Map of All Pages with HTML:', this.mapofPageAndHtmlBody);
   this.toastr.success('Generated all missing pages with AI.');