Bug fix: Microsoft profile pic not showing (#9956)

* microsoft auth api returning encoded image for profile picture, using that instead

* include optional chaining

* return an empty string if type, encoding doesn't exist in the picture

webapp/src/identity.tsx

@@ -100,9 +100,15 @@ export class UserMenu extends auth.Component<UserMenuProps, UserMenuState> {
         this.props.parent.signOutGithub();
     }
 
+    encodedAvatarPic(user: pxt.auth.UserProfile): string {
+        const type = user?.idp?.picture?.mimeType;
+        const encodedImg = user?.idp?.picture?.encoded;
+        return type && encodedImg ? `data:${type};base64,${encodedImg}` : "";
+    }
+
     avatarPicUrl(): string {
         const user = this.getUserProfile();
-        return user?.idp?.pictureUrl ?? user?.idp?.picture?.dataUrl;
+        return user?.idp?.pictureUrl ?? this.encodedAvatarPic(user);
     }
 
     hide() {