fix(member-invites): show role error messages (#85912)

we now show the error message on hover if it is a role error:
<img width="238" alt="Screenshot 2025-02-25 at 4 14 52 PM"
src="https://github.com/user-attachments/assets/e5d48aec-a84f-4e82-9f37-31e8f6db35a5"
/>

also fixed issue with member details page where there was an extra
column in the teams list
before:
<img width="764" alt="Screenshot 2025-02-25 at 4 56 00 PM"
src="https://github.com/user-attachments/assets/154d8165-db72-4db3-b06f-87ea4d4b9f8d"
/>
after:
<img width="766" alt="Screenshot 2025-02-25 at 4 55 41 PM"
src="https://github.com/user-attachments/assets/51c70ef7-d161-4c14-a5dd-9a3ed1a1de55"
/>

static/app/components/modals/inviteMembersModal/useInviteModal.tsx

@@ -136,11 +136,13 @@ export default function useInviteModal({organization, initialData, source}: Prop
         // Use the email error message if available. This inconsistently is
         // returned as either a list of errors for the field, or a single error.
         const emailError =
-          !errorResponse || !errorResponse.email
+          !errorResponse ||
+          (!errorResponse.email
             ? false
             : Array.isArray(errorResponse.email)
               ? errorResponse.email[0]
-              : errorResponse.email;
+              : errorResponse.email) ||
+          (!errorResponse.role ? false : errorResponse.role);
 
         const orgLevelError = errorResponse?.organization;
         const error = orgLevelError || emailError || t('Could not invite user');

static/app/views/settings/components/teamSelect/teamSelectForMember.tsx

@@ -178,7 +178,7 @@ function TeamRow({
 
 const GRID_TEMPLATE = `
   display: grid;
-  grid-template-columns: minmax(100px, 1fr) minmax(0px, 100px) 200px 95px;
+  grid-template-columns: minmax(100px, 1fr) minmax(0px, 100px) 200px;
   gap: ${space(1)};
 
   > div:last-child {