[DT-744] Add option to modify email preferences (#2717)

cypress/component/UserProfile/user_profile.spec.js

@@ -0,0 +1,50 @@
+/* eslint-disable no-undef */
+
+import {mount} from 'cypress/react';
+import React from 'react';
+import {Storage} from '../../../src/libs/storage';
+import {User} from '../../../src/libs/ajax/User';
+import {Institution} from '../../../src/libs/ajax/Institution';
+import UserProfile from '../../../src/pages/user_profile/UserProfile';
+
+const duosUser = {
+    isSigningOfficial: false,
+};
+
+describe('User Profile', () => {
+  // Intercept configuration calls
+  beforeEach(() => {
+    cy.intercept({
+      method: 'GET',
+      url: '/config.json',
+      hostname: 'localhost',
+    }, {'env': 'ci'});
+  });
+
+  it('Renders the user profile page', () => {
+    cy.stub(Storage, 'getCurrentUser').returns(duosUser);
+    cy.stub(Institution, 'list').returns([]);
+    cy.stub(User, 'getMe').returns(duosUser);
+    cy.stub(User, 'getApprovedDatasets').returns([]);
+    cy.stub(User, 'getAcknowledgements').returns({});
+    mount(<UserProfile/>);
+    cy.get('h2').should('contain', 'Your Profile');
+  });
+
+  it('Updates the user email preferences', () => {
+    cy.stub(Storage, 'getCurrentUser').returns(duosUser);
+    cy.stub(Institution, 'list').returns([]);
+    cy.stub(User, 'getMe').returns(duosUser);
+    cy.stub(User, 'getApprovedDatasets').returns([]);
+    cy.stub(User, 'getAcknowledgements').returns({});
+    cy.intercept(
+      {method: 'PUT', url: '**/user'},
+      {statusCode: 200, body: duosUser}
+    ).as('updateSelf');
+    mount(<UserProfile/>);
+    cy.get('input[id="profileEmailEnabled_yes"]').check();
+    cy.wait('@updateSelf').then(() => {
+      cy.get('div').contains('Email preference updated successfully!');
+    });
+  });
+});

src/pages/user_profile/UserProfile.jsx

@@ -27,6 +27,7 @@ export default function UserProfile(props) {
   const [profile, setProfile] = useState({
     profileName: '',
     email: undefined,
+    emailPreference: undefined,
     id: undefined
   });
 
@@ -54,6 +55,19 @@ export default function UserProfile(props) {
     }
   };
 
+  const updateEmailPreference = (value) => {
+    const payload = {
+      emailPreference: value
+    };
+
+    User.updateSelf(payload).then((response) => {
+      setUserRoleStatuses(response, Storage);
+      Notifications.showSuccess({ text: 'Email preference updated successfully!' });
+    }, () => {
+      Notifications.showError({ text: 'Some errors occurred, the user\'s email preference was not updated.' });
+    });
+  }
+
 
   useEffect(() => {
     const init = async () => {
@@ -64,6 +78,7 @@ export default function UserProfile(props) {
         setProfile({
           profileName: user.displayName,
           email: user.email,
+          emailPreference: user.emailPreference,
           id: user.userId
         });
         setName(user.displayName);
@@ -179,7 +194,22 @@ export default function UserProfile(props) {
       defaultValue={profile.email}
       disabled={true}
     />
-    <div style={{ marginTop: '60px' }} />
+    <div style={{ marginTop: '10px' }} />
+    <p
+      style={{
+        color: '#000',
+        fontSize: '16px',
+        fontWeight: '400',
+      }}
+    >
+      Send me email notifications
+    </p>
+    <FormField
+        type={FormFieldTypes.YESNORADIOGROUP}
+        id='profileEmailEnabled'
+        defaultValue={profile.emailPreference}
+        onChange={(field) => updateEmailPreference(field.value)}
+      />
     <div style={{ 'marginTop': '60px' }} />
     <ControlledAccessGrants />
     <div style={{ 'marginTop': '60px' }} />