From a85c9637b48f69f44949108e5b666bbf6e237b70 Mon Sep 17 00:00:00 2001 From: oleksandrkit Date: Thu, 6 Feb 2025 17:23:12 +0200 Subject: [PATCH 1/2] Fix lock icon issue --- .../shared/components/df-side-nav/df-side-nav.component.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/app/shared/components/df-side-nav/df-side-nav.component.scss b/src/app/shared/components/df-side-nav/df-side-nav.component.scss index a6095235..3d3ebe4f 100644 --- a/src/app/shared/components/df-side-nav/df-side-nav.component.scss +++ b/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; From e006aaa33885a8788283dd7742b6e1cb16d8ecdc Mon Sep 17 00:00:00 2001 From: oleksandrkit Date: Mon, 10 Feb 2025 15:11:29 +0200 Subject: [PATCH 2/2] Display lock icon based on user's license type --- .../df-side-nav/df-side-nav.component.html | 2 +- .../df-side-nav/df-side-nav.component.ts | 14 ++++++++++---- src/app/shared/services/df-paywall.service.ts | 14 +++++++++++--- 3 files changed, 22 insertions(+), 8 deletions(-) diff --git a/src/app/shared/components/df-side-nav/df-side-nav.component.html b/src/app/shared/components/df-side-nav/df-side-nav.component.html index b69c2508..c8ded1a4 100644 --- a/src/app/shared/components/df-side-nav/df-side-nav.component.html +++ b/src/app/shared/components/df-side-nav/df-side-nav.component.html @@ -153,7 +153,7 @@

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)"> diff --git a/src/app/shared/components/df-side-nav/df-side-nav.component.ts b/src/app/shared/components/df-side-nav/df-side-nav.component.ts index 89401259..eca1a0a6 100644 --- a/src/app/shared/components/df-side-nav/df-side-nav.component.ts +++ b/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); } } diff --git a/src/app/shared/services/df-paywall.service.ts b/src/app/shared/services/df-paywall.service.ts index a10c7d56..e16b9ebd 100644 --- a/src/app/shared/services/df-paywall.service.ts +++ b/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(