Develop

src/app/adf-config/df-cache/df-cache-modal.html

@@ -0,0 +1,10 @@
+<div mat-dialog-content>
+  <h2>Refresh {{ row.label }} Cache</h2>
+  <button
+    mat-flat-button
+    class="save-btn"
+    [attr.aria-label]="'importList' | transloco"
+    (click)="clearCache()">
+    {{ 'cache.flushCache' | transloco }}
+  </button>
+</div>

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

@@ -1,5 +1,5 @@
 import { LiveAnnouncer } from '@angular/cdk/a11y';
-import { Component, Inject } from '@angular/core';
+import { Component, ElementRef, Inject, ViewChild } from '@angular/core';
 import { ActivatedRoute, Router } from '@angular/router';
 import {
   DfManageTableComponent,
@@ -8,11 +8,17 @@ import {
 import { CacheRow, CacheType } from '../../shared/types/df-cache';
 import { DfBaseCrudService } from 'src/app/shared/services/df-base-crud.service';
 import { CACHE_SERVICE_TOKEN } from 'src/app/shared/constants/tokens';
-import { TranslocoService } from '@ngneat/transloco';
-import { MatDialog } from '@angular/material/dialog';
+import { TranslocoPipe, TranslocoService } from '@ngneat/transloco';
+import {
+  MAT_DIALOG_DATA,
+  MatDialog,
+  MatDialogModule,
+} from '@angular/material/dialog';
 import { faRefresh } from '@fortawesome/free-solid-svg-icons';
 import { getFilterQuery } from 'src/app/shared/utilities/filter-queries';
 import { Actions } from 'src/app/shared/types/table';
+import { MatButtonModule } from '@angular/material/button';
+import { DfPaywallComponent } from 'src/app/shared/components/df-paywall/df-paywall.component';
 
 @Component({
   selector: 'df-cache-table',
@@ -23,6 +29,7 @@ import { Actions } from 'src/app/shared/types/table';
   ],
   standalone: true,
   imports: DfManageTableModules,
+  providers: [DfBaseCrudService],
 })
 export class DfCacheTableComponent extends DfManageTableComponent<CacheRow> {
   constructor(
@@ -76,12 +83,59 @@ export class DfCacheTableComponent extends DfManageTableComponent<CacheRow> {
   }
 
   clearCache = (row: CacheRow) => {
-    this.cacheService
-      .delete(row.name, { snackbarSuccess: 'cache.serviceCacheFlushed' })
-      .subscribe();
+    this.openDialog(row);
+    // this.cacheService
+    //   .delete(row.name, { snackbarSuccess: 'cache.serviceCacheFlushed' })
+    //   .subscribe({
+    //     next: () => console.log('Cache flushed'),
+    //     error: (err: any) => console.error('Error flushing cache', err),
+    //   });
   };
 
+  openDialog(row: CacheRow) {
+    const dialogRef = this.dialog.open(DfCacheModal, {
+      data: { row },
+    });
+    dialogRef.afterClosed().subscribe();
+  }
+
   filterQuery = getFilterQuery();
 
   refreshTable = () => null;
 }
+
+@Component({
+  selector: 'df-cache-modal',
+  templateUrl: 'df-cache-modal.html',
+  styleUrls: ['./df-cache.component.scss'],
+  standalone: true,
+  imports: [
+    MatDialogModule,
+    MatButtonModule,
+    DfPaywallComponent,
+    TranslocoPipe,
+  ],
+})
+// eslint-disable-next-line @angular-eslint/component-class-suffix
+export class DfCacheModal {
+  @ViewChild('calendlyWidget') calendlyWidget: ElementRef;
+  row: CacheRow;
+  cacheService: DfBaseCrudService;
+  constructor(
+    @Inject(MAT_DIALOG_DATA) public data: any,
+    @Inject(CACHE_SERVICE_TOKEN)
+    cacheService: DfBaseCrudService
+  ) {
+    this.row = data.row;
+    this.cacheService = cacheService;
+  }
+
+  clearCache() {
+    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-config/df-cache/df-cache.component.ts

@@ -22,6 +22,7 @@ import { DfCacheTableComponent } from './df-cache-table.component';
     MatTableModule,
     NgFor,
   ],
+  providers: [DfBaseCrudService],
 })
 export class DfCacheComponent {
   faRotate = faRotate;
@@ -33,7 +34,7 @@ export class DfCacheComponent {
 
   flushSystemCache() {
     this.cacheService
-      .delete('system', { snackbarSuccess: 'cache.systemCacheFlushed' })
+      .delete('', { snackbarSuccess: 'cache.systemCacheFlushed' })
       .subscribe();
   }
 }

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

@@ -352,7 +352,8 @@ <h4 class="text-center" style="color: black !important">
               >{{ 'services.options' | transloco }}
             </mat-expansion-panel-header>
             <div class="details-section">
-              <ng-container *ngIf="this.isNetworkService">
+              <ng-container
+                *ngIf="this.isNetworkService || this.isScriptService">
                 <mat-button-toggle-group
                   aria-label="Service Definition Type"
                   [(ngModel)]="serviceDefinitionType"

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

@@ -89,6 +89,7 @@ export class DfServiceDetailsComponent implements OnInit {
   edit = false;
   isDatabase = false;
   isNetworkService = false;
+  isScriptService = false;
   serviceTypes: Array<ServiceType>;
   notIncludedServices: Array<ServiceType>;
   serviceForm: FormGroup;
@@ -146,12 +147,12 @@ export class DfServiceDetailsComponent implements OnInit {
         if (route['groups'] && route['groups'][0] === 'Database') {
           this.isDatabase = true;
         }
-        if (
-          (route['groups'] && route['groups'][0] === 'Remote Service') ||
-          (route['groups'] && route['groups'][0] === 'Script')
-        ) {
+        if (route['groups'] && route['groups'][0] === 'Remote Service') {
           this.isNetworkService = true;
         }
+        if (route['groups'] && route['groups'][0] === 'Script') {
+          this.isScriptService = true;
+        }
         const { data, serviceTypes, groups } = route;
         const licenseType = env.platform?.license;
         this.serviceTypes = serviceTypes;
@@ -307,8 +308,16 @@ export class DfServiceDetailsComponent implements OnInit {
       data.service_doc_by_service_id.format = Number(
         this.serviceDefinitionType
       );
+    } else if (this.isScriptService) {
+      params = {
+        ...params,
+        fields: '*',
+        related: 'service_doc_by_service_id',
+      };
+      data.service_doc_by_service_id = null;
+      data.config.content = this.serviceDefinition;
     } else {
-      delete data.service_doc_by_service_id; // Remove service_doc_by_service_id if it's not a network service
+      delete data.service_doc_by_service_id;
     }
 
     if (this.edit) {

src/app/shared/services/df-base-crud.service.ts

@@ -68,7 +68,9 @@ export class DfBaseCrudService {
   ) {
     const url = Array.isArray(id)
       ? `${this.url}?ids=${id.join(',')}`
-      : `${this.url}/${id}`;
+      : id
+      ? `${this.url}/${id}`
+      : `${this.url}`;
     return this.http.delete(
       url,
       this.getOptions({ snackbarError: 'server', ...options })

src/assets/i18n/cache/en.json

@@ -2,6 +2,7 @@
   "cache": "Cache",
   "overview": "Cache Overview",
   "flushService": "Flush {{serviceName}} Cache",
+  "flushCache": "Flush Cache",
   "description": "Flush system-wide cache or per-service caches. Use the cache clearing buttons below to refresh any changes made to your system configuration values.",
   "flushSystemCache": "Flush System-Wide Cache",
   "perServiceCaches": "Per-Service Caches",