Preventing users with external accounts to modify titles (as well as name and surname).

Author: krulis-martin

src/components/forms/EditUserProfileForm/EditUserProfileForm.js

@@ -7,6 +7,7 @@ import isEmail from 'validator/lib/isEmail';
 import FormBox from '../../widgets/FormBox';
 import Callout from '../../widgets/Callout';
 import SubmitButton from '../SubmitButton';
+import Explanation from '../../widgets/Explanation';
 import { SaveIcon } from '../../icons';
 import { validateRegistrationData } from '../../../redux/modules/users';
 import { TextField, PasswordField, PasswordStrength, CheckboxField } from '../Fields';
@@ -61,7 +62,20 @@ const EditUserProfileForm = ({
       component={TextField}
       maxLength={42}
       required
-      label={<FormattedMessage id="app.editUserProfile.titlesBeforeName" defaultMessage="Prefix Title:" />}
+      disabled={disabledNameChange}
+      label={
+        <>
+          <FormattedMessage id="app.editUserProfile.titlesBeforeName" defaultMessage="Prefix Title:" />
+          {disabledNameChange && (
+            <Explanation id="titles-before-disabled">
+              <FormattedMessage
+                id="app.editUserProfile.disabledNameExplanation"
+                defaultMessage="The name-related fields are disabled since this account was created and is managed by an external provider."
+              />
+            </Explanation>
+          )}
+        </>
+      }
     />
 
     <Field
@@ -70,7 +84,19 @@ const EditUserProfileForm = ({
       maxLength={100}
       required
       disabled={disabledNameChange}
-      label={<FormattedMessage id="app.editUserProfile.firstName" defaultMessage="Given Name:" />}
+      label={
+        <>
+          <FormattedMessage id="app.editUserProfile.firstName" defaultMessage="Given Name:" />
+          {disabledNameChange && (
+            <Explanation id="titles-before-disabled">
+              <FormattedMessage
+                id="app.editUserProfile.disabledNameExplanation"
+                defaultMessage="The name-related fields are disabled since this account was created and is managed by an external provider."
+              />
+            </Explanation>
+          )}
+        </>
+      }
     />
 
     <Field
@@ -79,15 +105,40 @@ const EditUserProfileForm = ({
       maxLength={255}
       required
       disabled={disabledNameChange}
-      label={<FormattedMessage id="app.editUserProfile.lastName" defaultMessage="Surname:" />}
+      label={
+        <>
+          <FormattedMessage id="app.editUserProfile.lastName" defaultMessage="Surname:" />
+          {disabledNameChange && (
+            <Explanation id="titles-before-disabled">
+              <FormattedMessage
+                id="app.editUserProfile.disabledNameExplanation"
+                defaultMessage="The name-related fields are disabled since this account was created and is managed by an external provider."
+              />
+            </Explanation>
+          )}
+        </>
+      }
     />
 
     <Field
       name="titlesAfterName"
       component={TextField}
       maxLength={42}
       required
-      label={<FormattedMessage id="app.editUserProfile.titlesAfterName" defaultMessage="Suffix Title:" />}
+      disabled={disabledNameChange}
+      label={
+        <>
+          <FormattedMessage id="app.editUserProfile.titlesAfterName" defaultMessage="Suffix Title:" />
+          {disabledNameChange && (
+            <Explanation id="titles-before-disabled">
+              <FormattedMessage
+                id="app.editUserProfile.disabledNameExplanation"
+                defaultMessage="The name-related fields are disabled since this account was created and is managed by an external provider."
+              />
+            </Explanation>
+          )}
+        </>
+      }
     />
 
     <Field

src/locales/cs.json

@@ -556,6 +556,7 @@
   "app.editUser.isEmailAlreadyVefiried": "Pokud jste právě ověřili vaši adresu a stále vidíte tuto hlášku, prosím občerstvěte stránku.",
   "app.editUser.makeLocal": "Vytvořit lokální účet",
   "app.editUser.title": "Upravit uživatelský profil",
+  "app.editUserProfile.disabledNameExplanation": "Položky související se jménem není možné měnit, protože tento účet je spravován externí autoritou.",
   "app.editUserProfile.emptyLocalPassword": "Lokální účet nemá nastavené heslo.",
   "app.editUserProfile.emptyLocalPasswordExplain": "Nebudete se moci přihlásit do ReCodExu pomocí lokálního účtu, dokud si nenastavíte heslo.",
   "app.editUserProfile.firstName": "Jméno:",

src/locales/en.json

@@ -556,6 +556,7 @@
   "app.editUser.isEmailAlreadyVefiried": "If you have just verified your email and still see the message, please refresh the page.",
   "app.editUser.makeLocal": "Create local account",
   "app.editUser.title": "Edit User's Profile",
+  "app.editUserProfile.disabledNameExplanation": "The name-related fields are disabled since this account was created and is managed by an external provider.",
   "app.editUserProfile.emptyLocalPassword": "Local account does not have a password.",
   "app.editUserProfile.emptyLocalPasswordExplain": "You may not sign in to ReCodEx using local account until you set the password.",
   "app.editUserProfile.firstName": "Given Name:",

src/pages/EditUser/EditUser.js

@@ -75,11 +75,9 @@ class EditUser extends Component {
 
   updateProfile(data, changeNames) {
     const { updateProfile } = this.props;
-    if (!changeNames) {
-      delete data.firstName;
-      delete data.lastName;
-    }
-    return updateProfile(data);
+    const { titlesBeforeName, firstName, lastName, titlesAfterName, ...restData } = data;
+    const transformedData = changeNames ? data : restData;
+    return updateProfile(transformedData);
   }
 
   setRole = ({ role }) => {