fix(admin-ui): Fix error when updating roles

Fixes #828

packages/admin-ui/src/lib/core/src/shared/components/channel-assignment-control/channel-assignment-control.component.ts

@@ -1,8 +1,9 @@
 import { ChangeDetectionStrategy, Component, Input, OnInit } from '@angular/core';
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
 import { DEFAULT_CHANNEL_CODE } from '@vendure/common/lib/shared-constants';
+import { notNullOrUndefined } from '@vendure/common/lib/shared-utils';
 import { Observable } from 'rxjs';
-import { map } from 'rxjs/operators';
+import { map, tap } from 'rxjs/operators';
 
 import { Channel, CurrentUserChannel } from '../../../common/generated-types';
 import { DataService } from '../../../data/providers/data.service';
@@ -26,23 +27,23 @@ export class ChannelAssignmentControlComponent implements OnInit, ControlValueAc
     @Input() disableChannelIds: string[] = [];
 
     channels$: Observable<CurrentUserChannel[]>;
-    value: string[] = [];
+    value: CurrentUserChannel[] = [];
     disabled = false;
     private onChange: (value: any) => void;
     private onTouched: () => void;
+    private channels: CurrentUserChannel[];
 
     constructor(private dataService: DataService) {}
 
     ngOnInit() {
-        this.channels$ = this.dataService.client
-            .userStatus()
-            .single$.pipe(
-                map(({ userStatus }) =>
-                    userStatus.channels.filter(c =>
-                        this.includeDefaultChannel ? true : c.code !== DEFAULT_CHANNEL_CODE,
-                    ),
+        this.channels$ = this.dataService.client.userStatus().single$.pipe(
+            map(({ userStatus }) =>
+                userStatus.channels.filter(c =>
+                    this.includeDefaultChannel ? true : c.code !== DEFAULT_CHANNEL_CODE,
                 ),
-            );
+            ),
+            tap(channels => (this.channels = channels)),
+        );
     }
 
     registerOnChange(fn: any): void {
@@ -59,7 +60,20 @@ export class ChannelAssignmentControlComponent implements OnInit, ControlValueAc
 
     writeValue(obj: unknown): void {
         if (Array.isArray(obj)) {
-            this.value = obj;
+            if (typeof obj[0] === 'string') {
+                this.value = obj.map(id => this.channels?.find(c => c.id === id)).filter(notNullOrUndefined);
+            } else {
+                this.value = obj;
+            }
+        } else {
+            if (typeof obj === 'string') {
+                const channel = this.channels?.find(c => c.id === obj);
+                if (channel) {
+                    this.value = [channel];
+                }
+            } else if (obj && (obj as any).id) {
+                this.value = [obj as any];
+            }
         }
     }
 
@@ -81,7 +95,9 @@ export class ChannelAssignmentControlComponent implements OnInit, ControlValueAc
         }
     }
 
-    compareFn(c1: Channel, c2: Channel): boolean {
-        return c1 && c2 ? c1.id === c2.id : c1 === c2;
+    compareFn(c1: Channel | string, c2: Channel | string): boolean {
+        const c1id = typeof c1 === 'string' ? c1 : c1.id;
+        const c2id = typeof c2 === 'string' ? c2 : c2.id;
+        return c1id === c2id;
     }
 }

packages/admin-ui/src/lib/settings/src/components/role-detail/role-detail.component.ts

@@ -123,7 +123,7 @@ export class RoleDetailComponent extends BaseDetailComponent<Role> implements On
         this.detailForm.patchValue({
             description: role.description,
             code: role.code,
-            channelIds: role.channels,
+            channelIds: role.channels.map(c => c.id),
             permissions: role.permissions,
         });
         // This was required to get the channel selector component to