Feat/209 save clear cache option

src/app/adf-config/df-cache/df-cache-table.component.ts

@@ -134,7 +134,6 @@ export class DfCacheModal {
     this.cacheService
       .delete(this.row.name, { snackbarSuccess: 'cache.serviceCacheFlushed' })
       .subscribe({
-        next: () => console.log('Cache flushed'),
         error: (err: any) => console.error('Error flushing cache', err),
       });
   }

src/app/adf-services/df-service-details/df-service-details.component.html

@@ -2,7 +2,7 @@
   [formGroup]="serviceForm"
   class="details-section"
   [class]="(isDarkMode | async) ? 'dark-theme' : ''"
-  (ngSubmit)="save()">
+  (ngSubmit)="save(false)">
   <ng-container *ngIf="this.isDatabase && !this.edit; else notDatabase">
     <mat-stepper linear #stepper>
       <mat-step errorMessage="Service Type is required." [editable]="true">
@@ -448,6 +448,29 @@ <h4 class="text-center" style="color: black !important">
         (click)="goBack()">
         {{ 'cancel' | transloco }}
       </button>
+      <ng-container *ngIf="this.edit">
+        <!-- <mat-button-toggle-group
+          [(ngModel)]="clearCache"
+          [ngModelOptions]="{ standalone: true }"
+          appearance="legacy">
+          <mat-button-toggle
+            [value]="true"
+            mat-flat-button
+            class="save-btn"
+            color="primary"
+            (click)="save()">
+            {{ 'saveAndClear' | transloco }}</mat-button-toggle
+          >
+        </mat-button-toggle-group> -->
+        <button
+          [value]="true"
+          mat-flat-button
+          class="save-btn"
+          color="primary"
+          (click)="save(true)">
+          {{ 'saveAndClear' | transloco }}
+        </button>
+      </ng-container>
       <button mat-flat-button class="save-btn" color="primary">
         {{ 'save' | transloco }}
       </button>

src/app/adf-services/df-service-details/df-service-details.component.ts

@@ -36,7 +36,10 @@ import { FontAwesomeModule } from '@fortawesome/angular-fontawesome';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { MatButtonModule } from '@angular/material/button';
 import { UntilDestroy } from '@ngneat/until-destroy';
-import { SERVICES_SERVICE_TOKEN } from 'src/app/shared/constants/tokens';
+import {
+  CACHE_SERVICE_TOKEN,
+  SERVICES_SERVICE_TOKEN,
+} from 'src/app/shared/constants/tokens';
 import { DfBaseCrudService } from 'src/app/shared/services/df-base-crud.service';
 import { Service } from 'src/app/shared/types/files';
 import { AceEditorMode } from 'src/app/shared/types/scripts';
@@ -103,14 +106,13 @@ export class DfServiceDetailsComponent implements OnInit {
   search = '';
   serviceDefinition: string;
   serviceDefinitionType: string;
-
   systemEvents: Array<{ label: string; value: string }>;
 
   constructor(
     private activatedRoute: ActivatedRoute,
     private fb: FormBuilder,
-    @Inject(SERVICES_SERVICE_TOKEN)
-    private servicesService: DfBaseCrudService,
+    @Inject(SERVICES_SERVICE_TOKEN) private servicesService: DfBaseCrudService,
+    @Inject(CACHE_SERVICE_TOKEN) private cacheService: DfBaseCrudService,
     private router: Router,
     private systemConfigDataService: DfSystemConfigDataService,
     private http: HttpClient,
@@ -318,7 +320,7 @@ export class DfServiceDetailsComponent implements OnInit {
     return this.serviceForm.controls[name] as FormControl;
   }
 
-  save() {
+  save(clearCache: boolean) {
     if (this.serviceForm.invalid) {
       return;
     }
@@ -434,7 +436,21 @@ export class DfServiceDetailsComponent implements OnInit {
           snackbarSuccess: 'services.updateSuccessMsg',
         })
         .subscribe(() => {
-          this.router.navigate(['../'], { relativeTo: this.activatedRoute });
+          if (clearCache) {
+            this.cacheService
+              .delete(payload.name, {
+                snackbarSuccess: 'cache.serviceCacheFlushed',
+              })
+              .subscribe({
+                next: () => {
+                  console.log('Cache flushed');
+                  this.router.navigate(['../'], {
+                    relativeTo: this.activatedRoute,
+                  });
+                },
+                error: (err: any) => console.error('Error flushing cache', err),
+              });
+          }
         });
     } else {
       this.servicesService
@@ -446,7 +462,6 @@ export class DfServiceDetailsComponent implements OnInit {
         )
         .subscribe(() => {
           this.router.navigate(['../'], { relativeTo: this.activatedRoute });
-          // this.router.navigate([`/api-connections/api-docs/${data.name}`]);
         });
     }
   }

src/assets/i18n/en.json

@@ -5,6 +5,7 @@
   "upload": "Upload",
   "delete": "Delete",
   "edit": "Edit",
+  "saveAndClear": "Save & Clear Cache",
   "select": "Select",
   "submit": "Submit",
   "browse": "Browse",

src/assets/img/databaseImages.json

@@ -5,12 +5,12 @@
       "label": "alloydb"
     },
     {
-      "src": "https://assets-global.website-files.com/64ed8da8a866be7a702fbafb/64ed8da8a866be7a702fbc60_API%2520Logo%2520Container-18-p-500.webp",
+      "src": "https://assets-global.website-files.com/64ed8da8a866be7a702fbafb/663d4b60d4c482cefa684e84_dynamodb%20logo.png",
       "alt": "aws_dynamodb",
       "label": "aws_dynamodb"
     },
     {
-      "src": "https://assets-global.website-files.com/64ed8da8a866be7a702fbafb/64ed8da8a866be7a702fbbf5_Redshift-p-500.jpg",
+      "src": "https://assets-global.website-files.com/64ed8da8a866be7a702fbafb/663d4aeec92f326a1b4d7aba_redshift.png",
       "alt": "aws_redshift_db",
       "label": "aws_redshift_db"
     },
@@ -55,7 +55,7 @@
       "label": "mariadb"
     },
     {
-      "src": "https://assets-global.website-files.com/64ed8da8a866be7a702fbafb/64ed8da8a866be7a702fbb5d_API%2520Logo%2520Container-2-p-500.webp",
+      "src": "https://assets-global.website-files.com/64ed8da8a866be7a702fbafb/663d4c15c6896a7cbc6606d4_singlestore.png",
       "alt": "memsql",
       "label": "memsql"
     },