From 54fe5a45f3f770f8c883765d6958d1939e13cece Mon Sep 17 00:00:00 2001
From: Keith LaForce <klaforce@gmail.com>
Date: Fri, 5 Nov 2021 11:04:08 -0400
Subject: [PATCH] feat(web): adding the ability to retrieve avatar and
 displayname

Developers were requesting the ability to show the users profile details like avatar and display
name within their applications. This change will allow them to retrieve this data as part of the get
token  process.
---
 packages/web/src/api/hasteClient.ts | 21 ++++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/packages/web/src/api/hasteClient.ts b/packages/web/src/api/hasteClient.ts
index 88e430c..522d998 100644
--- a/packages/web/src/api/hasteClient.ts
+++ b/packages/web/src/api/hasteClient.ts
@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-unsafe-assignment */
 import { isBrowser } from '../util/environmentCheck';
-import createAuth0Client, { Auth0Client } from '@auth0/auth0-spa-js';
+import { Auth0Client } from '@auth0/auth0-spa-js';
 import { HasteClientConfiguration } from '../config/hasteClientConfiguration';
 import SecureLS from 'secure-ls';
 import jwtDecode, { JwtPayload } from 'jwt-decode';
@@ -8,6 +8,8 @@ import jwtDecode, { JwtPayload } from 'jwt-decode';
 export type HasteAuthentication = {
   token: string;
   isAuthenticated: boolean;
+  picture: string;
+  displayName: string;
 };
 
 export class HasteClient {
@@ -82,35 +84,48 @@ export class HasteClient {
         const decoded = jwtDecode<JwtPayload>(cachedToken);
         // eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
         const expiration = decoded.exp;
-
         if (expiration && new Date(expiration * 1000) > new Date()) {
           return {
             token: cachedToken,
+            // eslint-disable-next-line dot-notation
+            picture: decoded['picture'],
+            displayName: decoded['https://hastearcade.com/displayName'],
             isAuthenticated: true,
           } as HasteAuthentication;
         } else {
           this.ls.remove('haste:config');
           return {
             token: '',
+            picture: '',
+            displayName: '',
             isAuthenticated: false,
           } as HasteAuthentication;
         }
       } else if (idToken) {
         this.ls.set('haste:config', idToken);
         urlSearchParams.delete('id_token');
+        const decoded = jwtDecode<JwtPayload>(idToken);
         const plainUrl = window.location.href.split('?')[0];
         window.history.pushState({}, document.title, `${plainUrl}${urlSearchParams.toString()}`);
         return {
           token: idToken,
+          // eslint-disable-next-line dot-notation
+          picture: decoded['picture'],
+          displayName: decoded['https://hastearcade.com/displayName'],
           isAuthenticated: true,
         } as HasteAuthentication;
       } else {
         const accessToken = await this.auth0Client.getTokenSilently();
         const idTokenClaims = await this.auth0Client.getIdTokenClaims();
+        const idToken = idTokenClaims.__raw;
 
+        const decoded = jwtDecode<JwtPayload>(idToken);
         if (accessToken) {
           return {
-            token: idTokenClaims.__raw,
+            token: idToken,
+            // eslint-disable-next-line dot-notation
+            picture: decoded['picture'],
+            displayName: decoded['https://hastearcade.com/displayName'],
             isAuthenticated: true,
           } as HasteAuthentication;
         }