diff --git a/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-exclusions-section-card/feature-flag-exclusions-section-card.component.html b/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-exclusions-section-card/feature-flag-exclusions-section-card.component.html index c3e000bdce..048e42d373 100644 --- a/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-exclusions-section-card/feature-flag-exclusions-section-card.component.html +++ b/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-exclusions-section-card/feature-flag-exclusions-section-card.component.html @@ -10,7 +10,7 @@ diff --git a/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-exclusions-section-card/feature-flag-exclusions-section-card.component.ts b/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-exclusions-section-card/feature-flag-exclusions-section-card.component.ts index 5a057ba8fd..1d8226fe66 100644 --- a/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-exclusions-section-card/feature-flag-exclusions-section-card.component.ts +++ b/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-exclusions-section-card/feature-flag-exclusions-section-card.component.ts @@ -20,6 +20,9 @@ import { EditPrivateSegmentListRequest, Segment, } from '../../../../../../../core/segments/store/segments.model'; +import { UserPermission } from '../../../../../../../core/auth/store/auth.models'; +import { Observable } from 'rxjs'; +import { AuthService } from '../../../../../../../core/auth/auth.service'; @Component({ selector: 'app-feature-flag-exclusions-section-card', @@ -38,15 +41,24 @@ import { }) export class FeatureFlagExclusionsSectionCardComponent { @Input() isSectionCardExpanded; + permissions$: Observable; tableRowCount$ = this.featureFlagService.selectFeatureFlagExclusionsLength$; selectedFlag$ = this.featureFlagService.selectedFeatureFlag$; - constructor(private featureFlagService: FeatureFlagsService, private dialogService: DialogService) {} + constructor( + private featureFlagService: FeatureFlagsService, + private dialogService: DialogService, + private authService: AuthService + ) {} menuButtonItems: IMenuButtonItem[] = [ // { name: 'Import Exclude List', disabled: false }, // { name: 'Export All Exclude Lists', disabled: false }, ]; + ngOnInit() { + this.permissions$ = this.authService.userPermissions$; + } + onAddExcludeListClick(appContext: string, flagId: string) { this.dialogService.openAddExcludeListModal(appContext, flagId); } diff --git a/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-exclusions-section-card/feature-flag-exclusions-table/feature-flag-exclusions-table.component.html b/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-exclusions-section-card/feature-flag-exclusions-table/feature-flag-exclusions-table.component.html index aeb41ae368..7871f76af8 100644 --- a/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-exclusions-section-card/feature-flag-exclusions-table/feature-flag-exclusions-table.component.html +++ b/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-exclusions-section-card/feature-flag-exclusions-table/feature-flag-exclusions-table.component.html @@ -2,6 +2,7 @@ diff --git a/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-inclusions-section-card/feature-flag-inclusions-section-card.component.ts b/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-inclusions-section-card/feature-flag-inclusions-section-card.component.ts index 55de97cf29..32e0eb2059 100644 --- a/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-inclusions-section-card/feature-flag-inclusions-section-card.component.ts +++ b/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-inclusions-section-card/feature-flag-inclusions-section-card.component.ts @@ -24,6 +24,8 @@ import { EditPrivateSegmentListRequest, Segment, } from '../../../../../../../core/segments/store/segments.model'; +import { UserPermission } from '../../../../../../../core/auth/store/auth.models'; +import { AuthService } from '../../../../../../../core/auth/auth.service'; @Component({ selector: 'app-feature-flag-inclusions-section-card', @@ -42,6 +44,7 @@ import { }) export class FeatureFlagInclusionsSectionCardComponent { @Input() isSectionCardExpanded; + permissions$: Observable; tableRowCount$ = this.featureFlagService.selectFeatureFlagInclusionsLength$; selectedFlag$ = this.featureFlagService.selectedFeatureFlag$; @@ -55,7 +58,11 @@ export class FeatureFlagInclusionsSectionCardComponent { return FILTER_MODE; } - constructor(private featureFlagService: FeatureFlagsService, private dialogService: DialogService) {} + constructor( + private featureFlagService: FeatureFlagsService, + private dialogService: DialogService, + private authService: AuthService + ) {} subscriptions = new Subscription(); menuButtonItems: IMenuButtonItem[] = [ // { name: 'Import Include List', disabled: false }, @@ -64,6 +71,10 @@ export class FeatureFlagInclusionsSectionCardComponent { confirmIncludeAllChangeDialogRef: MatDialogRef; + ngOnInit() { + this.permissions$ = this.authService.userPermissions$; + } + onAddIncludeListClick(appContext: string, flagId: string) { this.dialogService.openAddIncludeListModal(appContext, flagId); } diff --git a/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-inclusions-section-card/feature-flag-inclusions-table/feature-flag-inclusions-table.component.html b/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-inclusions-section-card/feature-flag-inclusions-table/feature-flag-inclusions-table.component.html index 65e8650bff..0a0b1d409c 100644 --- a/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-inclusions-section-card/feature-flag-inclusions-table/feature-flag-inclusions-table.component.html +++ b/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-details-page/feature-flag-details-page-content/feature-flag-inclusions-section-card/feature-flag-inclusions-table/feature-flag-inclusions-table.component.html @@ -2,6 +2,8 @@ ; isSectionCardExpanded = true; @Output() sectionCardExpandChange = new EventEmitter(); emailId = ''; @@ -45,23 +48,24 @@ export class FeatureFlagOverviewDetailsSectionCardComponent implements OnInit, O shouldShowWarning$ = this.featureFlagService.shouldShowWarningForSelectedFlag$; subscriptions = new Subscription(); confirmStatusChangeDialogRef: MatDialogRef; - menuButtonItems: IMenuButtonItem[] = [ - { name: FEATURE_FLAG_DETAILS_PAGE_ACTIONS.EDIT, disabled: false }, - { name: FEATURE_FLAG_DETAILS_PAGE_ACTIONS.DUPLICATE, disabled: false }, - { name: FEATURE_FLAG_DETAILS_PAGE_ACTIONS.EXPORT_DESIGN, disabled: false }, - { name: FEATURE_FLAG_DETAILS_PAGE_ACTIONS.EMAIL_DATA, disabled: true }, - { name: FEATURE_FLAG_DETAILS_PAGE_ACTIONS.ARCHIVE, disabled: true }, - { name: FEATURE_FLAG_DETAILS_PAGE_ACTIONS.DELETE, disabled: false }, - ]; + menuButtonItems: IMenuButtonItem[]; constructor( private dialogService: DialogService, private featureFlagService: FeatureFlagsService, - private router: Router + private router: Router, + private authService: AuthService ) {} ngOnInit(): void { + this.permissions$ = this.authService.userPermissions$; this.subscriptions.add(this.featureFlagService.currentUserEmailAddress$.subscribe((id) => (this.emailId = id))); + + this.subscriptions.add( + this.permissions$.subscribe((permissions) => { + this.updateMenuItems(permissions); + }) + ); } get FEATURE_FLAG_STATUS() { @@ -72,6 +76,17 @@ export class FeatureFlagOverviewDetailsSectionCardComponent implements OnInit, O return FILTER_MODE; } + private updateMenuItems(permissions: UserPermission): void { + this.menuButtonItems = [ + { name: FEATURE_FLAG_DETAILS_PAGE_ACTIONS.EDIT, disabled: !permissions?.featureFlags.update }, + { name: FEATURE_FLAG_DETAILS_PAGE_ACTIONS.DUPLICATE, disabled: !permissions?.featureFlags.create }, + { name: FEATURE_FLAG_DETAILS_PAGE_ACTIONS.EXPORT_DESIGN, disabled: false }, + { name: FEATURE_FLAG_DETAILS_PAGE_ACTIONS.EMAIL_DATA, disabled: true }, + { name: FEATURE_FLAG_DETAILS_PAGE_ACTIONS.ARCHIVE, disabled: true }, + { name: FEATURE_FLAG_DETAILS_PAGE_ACTIONS.DELETE, disabled: !permissions?.featureFlags.delete }, + ]; + } + onSlideToggleChange(event: MatSlideToggleChange, flag: FeatureFlag) { const slideToggleEvent = event.source; const newStatus = slideToggleEvent.checked ? FEATURE_FLAG_STATUS.ENABLED : FEATURE_FLAG_STATUS.DISABLED; diff --git a/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-root-page/feature-flag-root-page-content/feature-flag-root-section-card/feature-flag-root-section-card.component.html b/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-root-page/feature-flag-root-page-content/feature-flag-root-section-card/feature-flag-root-section-card.component.html index 33193ac76c..b6360acd75 100644 --- a/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-root-page/feature-flag-root-page-content/feature-flag-root-section-card/feature-flag-root-section-card.component.html +++ b/frontend/projects/upgrade/src/app/features/dashboard/feature-flags/pages/feature-flag-root-page/feature-flag-root-page-content/feature-flag-root-section-card/feature-flag-root-section-card.component.html @@ -11,10 +11,10 @@ ; dataSource$: Observable>; isLoadingFeatureFlags$ = this.featureFlagService.isLoadingFeatureFlags$; isInitialLoading$ = this.featureFlagService.isInitialFeatureFlagsLoading$; @@ -75,10 +78,12 @@ export class FeatureFlagRootSectionCardComponent { private featureFlagService: FeatureFlagsService, private translateService: TranslateService, private dialogService: DialogService, - private tableHelpersService: CommonTableHelpersService + private tableHelpersService: CommonTableHelpersService, + private authService: AuthService ) {} ngOnInit() { + this.permissions$ = this.authService.userPermissions$; this.featureFlagService.fetchFeatureFlags(true); } diff --git a/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-details-participant-list-table/common-details-participant-list-table.component.html b/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-details-participant-list-table/common-details-participant-list-table.component.html index 0422160c31..3ee3d94139 100644 --- a/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-details-participant-list-table/common-details-participant-list-table.component.html +++ b/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-details-participant-list-table/common-details-participant-list-table.component.html @@ -49,7 +49,12 @@ {{ PARTICIPANT_LIST_TRANSLATION_KEYS.ENABLE | translate }} - + @@ -60,10 +65,10 @@ {{ PARTICIPANT_LIST_TRANSLATION_KEYS.ACTIONS | translate }} - - diff --git a/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-details-participant-list-table/common-details-participant-list-table.component.scss b/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-details-participant-list-table/common-details-participant-list-table.component.scss index bbdb3913ac..fd6ffc3d35 100644 --- a/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-details-participant-list-table/common-details-participant-list-table.component.scss +++ b/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-details-participant-list-table/common-details-participant-list-table.component.scss @@ -86,6 +86,12 @@ .action-button { color: var(--dark-grey); + + &[disabled] { + .mat-icon { + opacity: 0.5; + } + } } } } diff --git a/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-details-participant-list-table/common-details-participant-list-table.component.ts b/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-details-participant-list-table/common-details-participant-list-table.component.ts index 6e83089e75..4289bb26df 100644 --- a/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-details-participant-list-table/common-details-participant-list-table.component.ts +++ b/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-details-participant-list-table/common-details-participant-list-table.component.ts @@ -25,8 +25,10 @@ import { MemberTypes } from '../../../core/segments/store/segments.model'; * - * + * [noDataRowText]="'No data available' | translate" + * [slideToggleDisabled]="false" + * [actionsDisabled]="false" + * > * ``` */ @@ -55,6 +57,8 @@ export class CommonDetailsParticipantListTableComponent { @Input() tableType: FEATURE_FLAG_PARTICIPANT_LIST_KEY; @Input() dataSource: any[]; @Input() noDataRowText: string; + @Input() slideToggleDisabled?: boolean = false; + @Input() actionsDisabled?: boolean = false; @Input() isLoading: boolean; @Output() rowAction = new EventEmitter(); diff --git a/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-section-card-action-buttons/common-section-card-action-buttons.component.html b/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-section-card-action-buttons/common-section-card-action-buttons.component.html index b624bd1f94..92c52c0215 100644 --- a/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-section-card-action-buttons/common-section-card-action-buttons.component.html +++ b/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-section-card-action-buttons/common-section-card-action-buttons.component.html @@ -3,7 +3,8 @@ {{ slideToggleText }} diff --git a/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-section-card-action-buttons/common-section-card-action-buttons.component.ts b/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-section-card-action-buttons/common-section-card-action-buttons.component.ts index d1421bbee3..683af0f4b2 100644 --- a/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-section-card-action-buttons/common-section-card-action-buttons.component.ts +++ b/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-section-card-action-buttons/common-section-card-action-buttons.component.ts @@ -17,7 +17,8 @@ import { IMenuButtonItem } from 'upgrade_types'; * ``` *