feat(admin-ui): Channel aware picker

vendure-ecommerce · Feb 14, 2024 · fd92b4c · fd92b4c
1 parent f02fc56
commit fd92b4c
Show file tree

Hide file tree

Showing 6 changed files with 32 additions and 47 deletions.
diff --git a/packages/admin-ui/src/lib/core/src/common/utilities/bulk-action-utils.ts b/packages/admin-ui/src/lib/core/src/common/utilities/bulk-action-utils.ts
@@ -179,8 +179,8 @@ export type CreateBulkAssignToChannelActionConfig<ItemType> = Pick<
     bulkAssignToChannel: (
         dataService: DataService,
         ids: string[],
-        channelId: string,
-    ) => Observable<Array<Partial<ItemType>>>;
+        channelIds: string[],
+    ) => Array<Observable<Array<Partial<ItemType>>>>;
 };
 
 export function createBulkAssignToChannelAction<ItemType>(
@@ -215,7 +215,7 @@ export function createBulkAssignToChannelAction<ItemType>(
                                 .bulkAssignToChannel(
                                     dataService,
                                     selection.map(c => c.id),
-                                    result.id,
+                                    result.map(c => c.id),
                                 )
                                 .pipe(mapTo(result));
                         } else {
@@ -224,10 +224,10 @@ export function createBulkAssignToChannelAction<ItemType>(
                     }),
                 )
                 .subscribe(result => {
-                    notificationService.success(_('common.notify-assign-to-channel-success-with-count'), {
-                        count: selection.length,
-                        channelCode: result.code,
-                    });
+                    // notificationService.success(_('common.notify-assign-to-channel-success-with-count'), {
+                    //     count: selection.length,
+                    //     channelCode: result.code,
+                    // });
                     clearSelection();
                 });
         },

diff --git a/...re/src/shared/components/assign-to-channel-dialog/assign-to-channel-dialog.component.html b/...re/src/shared/components/assign-to-channel-dialog/assign-to-channel-dialog.component.html
@@ -20,7 +20,7 @@
     <vdr-form-field [label]="'common.channel' | translate" class="mb-4">
         <vdr-channel-assignment-control
             clrInput
-            [multiple]="false"
+            [multiple]="true"
             [includeDefaultChannel]="false"
             [formControl]="selectedChannelIdControl"
         ></vdr-channel-assignment-control>
@@ -29,9 +29,9 @@
 
 <ng-template vdrDialogButtons>
     <button type="button" class="btn" (click)="cancel()">{{ 'common.cancel' | translate }}</button>
-    <button type="submit" (click)="assign()" [disabled]="!selectedChannel" class="btn btn-primary">
-        <ng-template [ngIf]="selectedChannel" [ngIfElse]="noSelection">
-            {{ 'catalog.assign-to-named-channel' | translate : { channelCode: selectedChannel?.code } }}
+    <button type="submit" (click)="assign()" [disabled]="selectedChannels.length > 0" class="btn btn-primary">
+        <ng-template [ngIf]="selectedChannels.length > 0" [ngIfElse]="noSelection">
+            {{ 'catalog.assign-to-channel' | translate }}
         </ng-template>
         <ng-template #noSelection>
             {{ 'catalog.no-channel-selected' | translate }}

diff --git a/...core/src/shared/components/assign-to-channel-dialog/assign-to-channel-dialog.component.ts b/...core/src/shared/components/assign-to-channel-dialog/assign-to-channel-dialog.component.ts
@@ -15,11 +15,12 @@ type Channel = ItemOf<GetChannelsQuery, 'channels'>;
     styleUrls: ['./assign-to-channel-dialog.component.scss'],
     changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class AssignToChannelDialogComponent implements OnInit, Dialog<Channel> {
-    selectedChannel: Channel | null | undefined;
+export class AssignToChannelDialogComponent implements OnInit, Dialog<Channel[]> {
+    selectedChannels: Channel[] = [];
+
     currentChannel: Channel;
     availableChannels: Channel[];
-    resolveWith: (result?: Channel) => void;
+    resolveWith: (result?: Channel[]) => void;
     selectedChannelIdControl = new UntypedFormControl();
 
     itemNames: string;
@@ -45,13 +46,13 @@ export class AssignToChannelDialogComponent implements OnInit, Dialog<Channel> {
     }
 
     selectChannel(channelIds: string[]) {
-        this.selectedChannel = this.availableChannels.find(c => c.id === channelIds[0]);
+        this.selectedChannels = this.availableChannels.filter(c => channelIds.includes(c.id));
     }
 
     assign() {
-        const selectedChannel = this.selectedChannel;
-        if (selectedChannel) {
-            this.resolveWith(selectedChannel);
+        const selectedChannels = this.selectedChannels;
+        if (selectedChannels.length > 0) {
+            this.resolveWith(selectedChannels);
         }
     }
 

diff --git a/...rc/shared/components/channel-assignment-control/channel-assignment-control.component.html b/...rc/shared/components/channel-assignment-control/channel-assignment-control.component.html
@@ -1,7 +1,7 @@
 <ng-select
     appendTo="body"
     [addTag]="false"
-    [multiple]="multiple"
+    [multiple]="true"
     [ngModel]="value"
     [clearable]="false"
     [searchable]="false"

diff --git a/...s/admin-ui/src/lib/marketing/src/components/promotion-list/promotion-list-bulk-actions.ts b/...s/admin-ui/src/lib/marketing/src/components/promotion-list/promotion-list-bulk-actions.ts
@@ -8,27 +8,8 @@ import {
     Permission,
     RemovePromotionsFromChannelDocument,
 } from '@vendure/admin-ui/core';
-import { gql } from 'apollo-angular';
 import { map } from 'rxjs/operators';
 
-const ASSIGN_PROMOTIONS_TO_CHANNEL = gql`
-    mutation AssignPromotionsToChannel($input: AssignPromotionsToChannelInput!) {
-        assignPromotionsToChannel(input: $input) {
-            id
-            name
-        }
-    }
-`;
-
-const REMOVE_PROMOTIONS_FROM_CHANNEL = gql`
-    mutation RemovePromotionsFromChannel($input: RemovePromotionsFromChannelInput!) {
-        removePromotionsFromChannel(input: $input) {
-            id
-            name
-        }
-    }
-`;
-
 export const deletePromotionsBulkAction = createBulkDeleteAction<ItemOf<GetPromotionListQuery, 'promotions'>>(
     {
         location: 'promotion-list',
@@ -45,15 +26,17 @@ export const assignPromotionsToChannelBulkAction = createBulkAssignToChannelActi
     location: 'promotion-list',
     requiresPermission: Permission.UpdatePromotion,
     getItemName: item => item.name,
-    bulkAssignToChannel: (dataService, promotionIds, channelId) =>
-        dataService
-            .mutate(AssignPromotionsToChannelDocument, {
-                input: {
-                    channelId,
-                    promotionIds,
-                },
-            })
-            .pipe(map(res => res.assignPromotionsToChannel)),
+    bulkAssignToChannel: (dataService, promotionIds, channelIds) =>
+        channelIds.map(channelId =>
+            dataService
+                .mutate(AssignPromotionsToChannelDocument, {
+                    input: {
+                        channelId,
+                        promotionIds,
+                    },
+                })
+                .pipe(map(res => res.assignPromotionsToChannel)),
+        ),
 });
 
 export const removePromotionsFromChannelBulkAction = createBulkRemoveFromChannelAction<

diff --git a/packages/admin-ui/src/lib/settings/src/components/role-detail/role-detail.component.html b/packages/admin-ui/src/lib/settings/src/components/role-detail/role-detail.component.html
@@ -64,6 +64,7 @@
         <vdr-card [title]="'settings.permissions' | translate">
             <vdr-form-field [label]="'settings.channel' | translate">
                 <vdr-channel-assignment-control
+                    [multiple]="true"
                     formControlName="channelIds"
                     [vdrDisabled]="!('UpdateAdministrator' | hasPermission)"
                 ></vdr-channel-assignment-control>