fix: [UIE-9894] - IAM: enable own email editing

packages/manager/.changeset/pr-13214-fixed-1766145130482.md

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Fixed
+---
+
+IAM: User can’t edit their own email on the user details page ([#13214](https://github.com/linode/manager/pull/13214))

packages/manager/src/features/IAM/Users/UserDetails/UserEmailPanel.test.tsx

@@ -26,7 +26,7 @@ describe('UserEmailPanel', () => {
     const user = accountUserFactory.build();
 
     const { getByLabelText } = renderWithTheme(
-      <UserEmailPanel activeUser={user} canUpdateUser={true} />
+      <UserEmailPanel activeUser={user} />
     );
 
     const emailTextField = getByLabelText('Email');
@@ -45,7 +45,7 @@ describe('UserEmailPanel', () => {
     );
 
     const { findByLabelText, getByLabelText, getByText } = renderWithTheme(
-      <UserEmailPanel activeUser={user} canUpdateUser={false} />
+      <UserEmailPanel activeUser={user} />
     );
 
     const warning = await findByLabelText(
@@ -70,7 +70,7 @@ describe('UserEmailPanel', () => {
     });
 
     const { getByLabelText, getByText } = renderWithTheme(
-      <UserEmailPanel activeUser={user} canUpdateUser={false} />
+      <UserEmailPanel activeUser={user} />
     );
 
     const warning = getByLabelText('This field can’t be modified.');
@@ -94,7 +94,7 @@ describe('UserEmailPanel', () => {
       username: 'user-1',
     });
 
-    renderWithTheme(<UserEmailPanel activeUser={user} canUpdateUser={true} />);
+    renderWithTheme(<UserEmailPanel activeUser={user} />);
 
     const emailInput = screen.getByLabelText('Email');
 
@@ -114,7 +114,7 @@ describe('UserEmailPanel', () => {
     });
 
     const { getByRole, findByDisplayValue } = renderWithTheme(
-      <UserEmailPanel activeUser={user} canUpdateUser={false} />
+      <UserEmailPanel activeUser={user} />
     );
 
     await findByDisplayValue(user.email);

packages/manager/src/features/IAM/Users/UserDetails/UserEmailPanel.tsx

@@ -14,10 +14,9 @@ import type { User } from '@linode/api-v4';
 
 interface Props {
   activeUser: User;
-  canUpdateUser: boolean;
 }
 
-export const UserEmailPanel = ({ canUpdateUser, activeUser }: Props) => {
+export const UserEmailPanel = ({ activeUser }: Props) => {
   const { enqueueSnackbar } = useSnackbar();
   const { profileUserName } = useDelegationRole();
 
@@ -54,7 +53,7 @@ export const UserEmailPanel = ({ canUpdateUser, activeUser }: Props) => {
 
   // This should be disabled if this is NOT the current user or if the proxy user is viewing their own profile.
   const disableEmailField =
-    profileUserName !== activeUser.username || isProxyUser || !canUpdateUser;
+    profileUserName !== activeUser.username || isProxyUser;
 
   return (
     <Paper>
@@ -79,11 +78,11 @@ export const UserEmailPanel = ({ canUpdateUser, activeUser }: Props) => {
         />
         <Button
           buttonType="primary"
-          disabled={!isDirty || !canUpdateUser}
+          disabled={!isDirty || disableEmailField}
           loading={isSubmitting}
           sx={{ mt: 2 }}
           tooltipText={
-            !canUpdateUser
+            disableEmailField
               ? 'You do not have permission to update this user.'
               : undefined
           }

packages/manager/src/features/IAM/Users/UserDetails/UserProfile.tsx

@@ -68,7 +68,7 @@ export const UserProfile = () => {
       >
         <UserDetailsPanel activeUser={user} assignedRoles={assignedRoles} />
         <UsernamePanel activeUser={user} canUpdateUser={isAccountAdmin} />
-        <UserEmailPanel activeUser={user} canUpdateUser={isAccountAdmin} />
+        <UserEmailPanel activeUser={user} />
         <DeleteUserPanel activeUser={user} canDeleteUser={isAccountAdmin} />
       </Stack>
     </>