Fix for the UI lock icon bug

src/app/shared/components/df-side-nav/df-side-nav.component.html

@@ -153,7 +153,7 @@ <h1 class="page-header">
         mat-flat-button
         class="nav-item"
         [class.active]="isActive(item)"
-        [class.commercial-feature]="isCommercialFeature(item.path)"
+        [class.commercial-feature]="isFeatureLocked(item.path, licenseType)"
         (click)="handleNavClick(item)">
         <span class="nav-item">
           <ng-container *ngIf="item?.icon">

src/app/shared/components/df-side-nav/df-side-nav.component.scss

@@ -180,7 +180,7 @@ $red-palette: mat.define-palette(mat.$red-palette);
 
         &::after {
           content: '';
-          background-image: url('/assets/img/lock-icon.svg');
+          background-image: url('~src/assets/img/lock-icon.svg');
           background-size: contain;
           width: 14px;
           height: 14px;

src/app/shared/components/df-side-nav/df-side-nav.component.ts

@@ -32,7 +32,7 @@ import { TranslocoPipe, TranslocoService } from '@ngneat/transloco';
 import { AsyncPipe, NgFor, NgIf, NgTemplateOutlet } from '@angular/common';
 import { DfErrorService } from 'src/app/shared/services/df-error.service';
 import { DfLicenseCheckService } from '../../services/df-license-check.service';
-import { debounceTime, distinctUntilChanged, of, switchMap } from 'rxjs';
+import { debounceTime, distinctUntilChanged, map, of, switchMap } from 'rxjs';
 import { MatDialog, MatDialogModule } from '@angular/material/dialog';
 import { DfSearchDialogComponent } from '../df-search-dialog/df-search-dialog.component';
 import { UntilDestroy } from '@ngneat/until-destroy';
@@ -44,6 +44,7 @@ import { MatFormFieldModule } from '@angular/material/form-field';
 import { MatInputModule } from '@angular/material/input';
 import { DfSnackbarService } from 'src/app/shared/services/df-snackbar.service';
 import { DfPaywallService } from '../../services/df-paywall.service';
+import { DfSystemConfigDataService } from '../../services/df-system-config-data.service';
 @UntilDestroy({ checkProperties: true })
 @Component({
   selector: 'df-side-nav',
@@ -89,6 +90,7 @@ export class DfSideNavComponent implements OnInit {
   smallScreen$ = this.breakpointService.isSmallScreen;
   faPlus = faPlus;
   faRefresh = faRefresh;
+  licenseType: string = 'OPEN SOURCE';
   constructor(
     private breakpointService: DfBreakpointService,
     private userDataService: DfUserDataService,
@@ -101,7 +103,8 @@ export class DfSideNavComponent implements OnInit {
     private themeService: DfThemeService,
     private searchService: DfSearchService,
     private snackbarService: DfSnackbarService,
-    private paywallService: DfPaywallService
+    private paywallService: DfPaywallService,
+    private systemConfigDataService: DfSystemConfigDataService,
   ) {}
 
   ngOnInit(): void {
@@ -158,6 +161,9 @@ export class DfSideNavComponent implements OnInit {
           position: { top: '60px' },
         });
       });
+    this.systemConfigDataService.environment$
+      .pipe(map(env => env.platform?.license ?? 'OPEN SOURCE'))
+      .subscribe(license => this.licenseType = license);
   }
   isDarkMode = this.themeService.darkMode$;
   logout() {
@@ -221,7 +227,7 @@ export class DfSideNavComponent implements OnInit {
     return this.transloco.getAvailableLangs() as string[];
   }
 
-  isCommercialFeature(route: string): boolean {
-    return this.paywallService.isCommercialFeature(route);
+  isFeatureLocked(route: string, licenseType: string): boolean {
+    return this.paywallService.isFeatureLocked(route, licenseType);
   }
 }

src/app/shared/services/df-paywall.service.ts

@@ -7,15 +7,23 @@ import { DfErrorService } from './df-error.service';
   providedIn: 'root',
 })
 export class DfPaywallService {
-  private commercialFeatures = [
+  private openSourceLockedFeatures = [
     'event-scripts',
     'rate-limiting',
     'scheduler',
     'reporting',
   ];
 
-  isCommercialFeature(route: string): boolean {
-    return this.commercialFeatures.some(feature => route.includes(feature));
+  private silverLockedFeatures = [
+    'rate-limiting',
+    'scheduler',
+    'reporting',
+  ]
+
+  isFeatureLocked(route: string, licenseType: string): boolean {
+    if (licenseType == 'GOLD') return false;
+    if (licenseType == 'SILVER') return this.silverLockedFeatures.some(feature => route.includes(feature));
+    return this.openSourceLockedFeatures.some(feature => route.includes(feature));
   }
 
   constructor(