fix: encode hash on getUserPhoto (#3408)

* fix userPrincipleName/mail encoding

* use encodeUriComponent

Author: Mnickii

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

@@ -218,9 +218,9 @@ export const getEmailFromGraphEntity = (entity: IDynamicPerson): string => {
 
   if (user?.mail) {
     return extractEmailAddress(user.mail);
-  } else if (person.scoredEmailAddresses?.length) {
+  } else if (person?.scoredEmailAddresses?.length) {
     return extractEmailAddress(person.scoredEmailAddresses[0].address);
-  } else if (contact.emailAddresses?.length) {
+  } else if (contact?.emailAddresses?.length) {
     return extractEmailAddress(contact.emailAddresses[0].address);
   }
   return null;
@@ -244,7 +244,7 @@ export const findContactsByEmail = async (graph: IGraph, email: string): Promise
     }
   }
 
-  const encodedEmail = `${email.replace(/#/g, '%2523')}`;
+  const encodedEmail = encodeURIComponent(email);
 
   const result = (await graph
     .api('/me/contacts')

packages/mgt-components/src/graph/graph.photos.ts

@@ -120,6 +120,8 @@ export const getUserPhoto = async (graph: IGraph, userId: string): Promise<strin
   let cache: CacheStore<CachePhoto>;
   let photoDetails: CachePhoto;
 
+  const encodedUser = encodeURIComponent(userId);
+
   if (getIsPhotosCacheEnabled()) {
     cache = CacheService.getCache<CachePhoto>(schemas.photos, schemas.photos.stores.users);
     photoDetails = await cache.getValue(userId);
@@ -144,7 +146,7 @@ export const getUserPhoto = async (graph: IGraph, userId: string): Promise<strin
     }
   }
   // if there is a photo in the cache, we got here because it was stale
-  photoDetails = photoDetails || (await getPhotoForResource(graph, `users/${userId}`, anyUserValidPhotoScopes));
+  photoDetails = photoDetails || (await getPhotoForResource(graph, `users/${encodedUser}`, anyUserValidPhotoScopes));
   if (getIsPhotosCacheEnabled() && photoDetails) {
     await cache.putValue(userId, photoDetails);
   }

packages/mgt-components/src/graph/graph.user.ts

@@ -417,7 +417,7 @@ export const findUsers = async (graph: IGraph, query: string, top = 10, userFilt
     }
   }
 
-  const encodedQuery = `${query.replace(/#/g, '%2523')}`;
+  const encodedQuery = encodeURIComponent(query);
   const graphBuilder = graph
     .api('users')
     .search(`"displayName:${encodedQuery}" OR "mail:${encodedQuery}" OR "userPrincipalName:${encodedQuery}"`)