people-picker default-selected-user-ids removal fix (#552)

* prettier, types

* adding story

Author: vogtn

packages/mgt/src/components/mgt-people-picker/mgt-people-picker.ts

@@ -269,6 +269,8 @@ export class MgtPeoplePicker extends MgtTemplatedComponent {
   private _groupPeople: IDynamicPerson[];
   private _debouncedSearch: { (): void; (): void };
 
+  private defaultSelectedUsers: IDynamicPerson[];
+
   @internalProperty() private _isFocused = false;
 
   @internalProperty() private _foundPeople: IDynamicPerson[];
@@ -658,10 +660,10 @@ export class MgtPeoplePicker extends MgtTemplatedComponent {
       }
       this._showLoading = false;
 
-      if (this.defaultSelectedUserIds && !this.selectedPeople.length) {
-        const defaultSelectedUsers = await getUsersForUserIds(graph, this.defaultSelectedUserIds);
+      if (this.defaultSelectedUserIds && !this.selectedPeople.length && !this.defaultSelectedUsers) {
+        this.defaultSelectedUsers = await getUsersForUserIds(graph, this.defaultSelectedUserIds);
 
-        this.selectedPeople = [...defaultSelectedUsers];
+        this.selectedPeople = [...this.defaultSelectedUsers];
         this.requestUpdate();
         this.fireCustomEvent('selectionChanged', this.selectedPeople);
       }

stories/components/peoplePicker.stories.js

@@ -75,3 +75,9 @@ export const pickerOverflowGradient = () => html`
     }
   </style>
 `;
+
+export const pickerDefaultSelectedUserIds = () => html`
+  <mgt-people-picker
+    default-selected-user-ids="e3d0513b-449e-4198-ba6f-bd97ae7cae85, 40079818-3808-4585-903b-02605f061225"
+  ></mgt-people-picker>
+`;