diff --git a/frontend/projects/upgrade/src/app/features/dashboard/segments/pages/segment-details-page/segment-details-page-content/segment-lists-section-card/segment-lists-section-card.component.ts b/frontend/projects/upgrade/src/app/features/dashboard/segments/pages/segment-details-page/segment-details-page-content/segment-lists-section-card/segment-lists-section-card.component.ts index 98416990ed..628cffae46 100644 --- a/frontend/projects/upgrade/src/app/features/dashboard/segments/pages/segment-details-page/segment-details-page-content/segment-lists-section-card/segment-lists-section-card.component.ts +++ b/frontend/projects/upgrade/src/app/features/dashboard/segments/pages/segment-details-page/segment-details-page-content/segment-lists-section-card/segment-lists-section-card.component.ts @@ -14,7 +14,7 @@ import { Segment, SEGMENT_LIST_ACTIONS, } from '../../../../../../../core/segments/store/segments.model'; -import { Observable } from 'rxjs'; +import { Observable, Subscription } from 'rxjs'; import { AuthService } from '../../../../../../../core/auth/auth.service'; import { UserPermission } from '../../../../../../../core/auth/store/auth.models'; import { @@ -43,6 +43,7 @@ export class SegmentListsSectionCardComponent { permissions$: Observable; tableRowCount$ = this.segmentsService.selectSegmentListsLength$; selectedSegment$ = this.segmentsService.selectedSegment$; + subscriptions = new Subscription(); menuButtonItems: IMenuButtonItem[] = [ { @@ -77,13 +78,27 @@ export class SegmentListsSectionCardComponent { console.log('Import List'); break; case SEGMENT_LIST_ACTIONS.EXPORT_ALL: - console.log('Export All Lists'); + this.handleExportAllLists(segment); break; default: console.log('Unknown action'); } } + handleExportAllLists(segment: Segment) { + this.subscriptions.add( + this.dialogService + .openExportSegmentListsDesignModal() + .afterClosed() + .subscribe((isExportClicked: boolean) => { + if (isExportClicked) { + const subsegmentIds = segment.subSegments.map((subSegment) => subSegment.id); + this.segmentsService.exportSegments(subsegmentIds); + } + }) + ); + } + onSectionCardExpandChange(isSectionCardExpanded: boolean) { this.isSectionCardExpanded = isSectionCardExpanded; } @@ -113,4 +128,8 @@ export class SegmentListsSectionCardComponent { } }); } + + onDestroy() { + this.subscriptions.unsubscribe(); + } } diff --git a/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-modal/common-modal.component.html b/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-modal/common-modal.component.html index ec083814a0..d4a84cbd88 100644 --- a/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-modal/common-modal.component.html +++ b/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-modal/common-modal.component.html @@ -1,7 +1,7 @@
-

{{ title }}

+

{{ title | translate }}

@@ -14,7 +14,7 @@

{{ title }}

diff --git a/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-modal/common-modal.component.ts b/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-modal/common-modal.component.ts index 36f4691aca..9c3f8daa72 100644 --- a/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-modal/common-modal.component.ts +++ b/frontend/projects/upgrade/src/app/shared-standalone-component-lib/components/common-modal/common-modal.component.ts @@ -7,6 +7,7 @@ import { MatButtonModule } from '@angular/material/button'; import { MatDialogClose } from '@angular/material/dialog'; import { CommonModule } from '@angular/common'; import { MatIcon } from '@angular/material/icon'; +import { TranslateModule } from '@ngx-translate/core'; @Component({ selector: 'app-common-dialog', @@ -19,6 +20,7 @@ import { MatIcon } from '@angular/material/icon'; MatDialogClose, CommonModule, MatIcon, + TranslateModule, ], templateUrl: './common-modal.component.html', styleUrl: './common-modal.component.scss', diff --git a/frontend/projects/upgrade/src/app/shared/services/common-dialog.service.ts b/frontend/projects/upgrade/src/app/shared/services/common-dialog.service.ts index 5b55b199c6..c5bd844ef1 100644 --- a/frontend/projects/upgrade/src/app/shared/services/common-dialog.service.ts +++ b/frontend/projects/upgrade/src/app/shared/services/common-dialog.service.ts @@ -378,7 +378,7 @@ export class DialogService { return this.dialog.open(DeleteFeatureFlagModalComponent, config); } - openExportDesignModal(title, warning: string): MatDialogRef { + openExportDesignModal(title: string, warning: string): MatDialogRef { const commonModalConfig: CommonModalConfig = { title: title, primaryActionBtnLabel: 'Export', @@ -391,6 +391,18 @@ export class DialogService { return this.openSimpleCommonConfirmationModal(commonModalConfig, ModalSize.MEDIUM); } + openExportSegmentListsDesignModal(): MatDialogRef { + const commonModalConfig: CommonModalConfig = { + title: 'segments.export-feature-flag-design.confirmation-title.text', + primaryActionBtnLabel: 'Export', + primaryActionBtnColor: 'primary', + cancelBtnLabel: 'Cancel', + params: { + message: 'segments.export-feature-flag-design.confirmation-message.text', + }, + }; + return this.openSimpleCommonConfirmationModal(commonModalConfig, ModalSize.MEDIUM); + } openEmailFeatureFlagDataModal( warning: string, subtext: string diff --git a/frontend/projects/upgrade/src/assets/i18n/en.json b/frontend/projects/upgrade/src/assets/i18n/en.json index b40cdf20a1..967683e322 100644 --- a/frontend/projects/upgrade/src/assets/i18n/en.json +++ b/frontend/projects/upgrade/src/assets/i18n/en.json @@ -501,6 +501,8 @@ "segments.new-segment-overview-stepper.segment-name-error.text": "Segment name already exists for selected context. Please enter a unique segment name", "segments.view-segment.members-subtitle.text": "Member(s)", "segments.global-members.segments-count-members-error.text": "Please have at least 1 valid member to move forward", + "segments.export-feature-flag-design.confirmation-title.text": "Segment List Export All", + "segments.export-feature-flag-design.confirmation-message.text": "Are you sure you want to export all lists (JSON)?", "segments.import-segment.text": "IMPORT SEGMENT", "segments.import-segment.message.text": "Select the JSON file(s) to import segments:", "segments.import-segment-modal.title.text": "Import Segment",