From 96ec3162d8c961015afc95afe265e9c988c2b55e Mon Sep 17 00:00:00 2001
From: peintnermax <max@caos.ch>
Date: Wed, 21 Aug 2024 16:08:37 +0200
Subject: [PATCH] handle errors more gracefully

---
 .../(login)/idp/[provider]/success/page.tsx   | 25 +++--------
 apps/login/src/lib/idp.ts                     | 44 ++++++++++++-------
 apps/login/src/lib/zitadel.ts                 |  8 ++--
 apps/login/src/ui/UserAvatar.tsx              |  4 +-
 4 files changed, 38 insertions(+), 43 deletions(-)

diff --git a/apps/login/src/app/(login)/idp/[provider]/success/page.tsx b/apps/login/src/app/(login)/idp/[provider]/success/page.tsx
index cd0261dafcf..c144186bf6e 100644
--- a/apps/login/src/app/(login)/idp/[provider]/success/page.tsx
+++ b/apps/login/src/app/(login)/idp/[provider]/success/page.tsx
@@ -115,27 +115,12 @@ export default async function Page({
                 );
               }
             }
-          } else if (options?.isCreationAllowed && options.isAutoCreation) {
-            const userId = await createUser(provider, idpInformation).catch(
-              (error) => {
-                return (
-                  <DynamicTheme branding={branding}>
-                    <div className="flex flex-col items-center space-y-4">
-                      <h1>Register failed</h1>
-                      <div className="w-full">
-                        {
-                          <Alert type={AlertType.ALERT}>
-                            {JSON.stringify(error.message)}
-                          </Alert>
-                        }
-                      </div>
-                    </div>
-                  </DynamicTheme>
-                );
-              },
-            );
+          }
 
-            if (userId) {
+          if (options?.isCreationAllowed && options.isAutoCreation) {
+            const newUser = await createUser(provider, idpInformation);
+
+            if (newUser) {
               return (
                 <DynamicTheme branding={branding}>
                   <div className="flex flex-col items-center space-y-4">
diff --git a/apps/login/src/lib/idp.ts b/apps/login/src/lib/idp.ts
index 870b7ae8cb1..3b0ee29f9d0 100644
--- a/apps/login/src/lib/idp.ts
+++ b/apps/login/src/lib/idp.ts
@@ -23,21 +23,23 @@ export function idpTypeToSlug(idpType: IdentityProviderType) {
 
 // this maps the IDPInformation to the AddHumanUserRequest which is used when creating a user or linking a user (email)
 // TODO: extend this object from a other file which can be overwritten by customers like map = { ...PROVIDER_MAPPING, ...customerMap }
+export type OIDC_USER = {
+  User: {
+    email: string;
+    name?: string;
+    given_name?: string;
+    family_name?: string;
+  };
+};
+
 export const PROVIDER_MAPPING: {
   [provider: string]: (
     rI: IDPInformation,
   ) => PartialMessage<AddHumanUserRequest>;
 } = {
   [idpTypeToSlug(IdentityProviderType.GOOGLE)]: (idp: IDPInformation) => {
-    const rawInfo = idp.rawInformation?.toJson() as {
-      User: {
-        email: string;
-        name?: string;
-        given_name?: string;
-        family_name?: string;
-      };
-    };
-
+    const rawInfo = idp.rawInformation?.toJson() as OIDC_USER;
+    console.log(rawInfo);
     const idpLink: PartialMessage<IDPLink> = {
       idpId: idp.idpId,
       userId: idp.userId,
@@ -62,10 +64,16 @@ export const PROVIDER_MAPPING: {
   },
   [idpTypeToSlug(IdentityProviderType.AZURE_AD)]: (idp: IDPInformation) => {
     const rawInfo = idp.rawInformation?.toJson() as {
+      jobTitle: string;
       mail: string;
+      mobilePhone: string;
+      preferredLanguage: string;
+      id: string;
       displayName?: string;
       givenName?: string;
       surname?: string;
+      officeLocation?: string;
+      userPrincipalName: string;
     };
 
     const idpLink: PartialMessage<IDPLink> = {
@@ -74,16 +82,18 @@ export const PROVIDER_MAPPING: {
       userName: idp.userName,
     };
 
+    console.log(rawInfo, rawInfo.userPrincipalName);
+
     const req: PartialMessage<AddHumanUserRequest> = {
       username: idp.userName,
       email: {
-        email: rawInfo?.mail,
+        email: rawInfo.mail || rawInfo.userPrincipalName || "",
         verification: { case: "isVerified", value: true },
       },
       profile: {
-        displayName: rawInfo?.displayName ?? "",
-        givenName: rawInfo?.givenName ?? "",
-        familyName: rawInfo?.surname ?? "",
+        displayName: rawInfo.displayName ?? "",
+        givenName: rawInfo.givenName ?? "",
+        familyName: rawInfo.surname ?? "",
       },
       idpLinks: [idpLink],
     };
@@ -105,13 +115,13 @@ export const PROVIDER_MAPPING: {
     const req: PartialMessage<AddHumanUserRequest> = {
       username: idp.userName,
       email: {
-        email: rawInfo?.email,
+        email: rawInfo.email,
         verification: { case: "isVerified", value: true },
       },
       profile: {
-        displayName: rawInfo?.name ?? "",
-        givenName: rawInfo?.name ?? "",
-        familyName: rawInfo?.name ?? "",
+        displayName: rawInfo.name ?? "",
+        givenName: rawInfo.name ?? "",
+        familyName: rawInfo.name ?? "",
       },
       idpLinks: [idpLink],
     };
diff --git a/apps/login/src/lib/zitadel.ts b/apps/login/src/lib/zitadel.ts
index 7c721f345f7..d5ed5a89835 100644
--- a/apps/login/src/lib/zitadel.ts
+++ b/apps/login/src/lib/zitadel.ts
@@ -391,12 +391,10 @@ export function addIDPLink(
   );
 }
 
-export function createUser(
-  provider: string,
-  info: IDPInformation,
-): Promise<string> {
+export function createUser(provider: string, info: IDPInformation) {
   const userData = PROVIDER_MAPPING[provider](info);
-  return userService.addHumanUser(userData, {}).then((resp) => resp.userId);
+  console.log("ud", userData);
+  return userService.addHumanUser(userData, {});
 }
 
 /**
diff --git a/apps/login/src/ui/UserAvatar.tsx b/apps/login/src/ui/UserAvatar.tsx
index 61e9a84df73..7af6cc58b38 100644
--- a/apps/login/src/ui/UserAvatar.tsx
+++ b/apps/login/src/ui/UserAvatar.tsx
@@ -42,7 +42,9 @@ export default function UserAvatar({
           loginName={loginName ?? ""}
         />
       </div>
-      <span className="ml-4 text-14px">{loginName}</span>
+      <span className="ml-4 text-14px max-w-[250px] text-ellipsis overflow-hidden">
+        {loginName}
+      </span>
       <span className="flex-grow"></span>
       {showDropdown && (
         <Link