fix: change email settings

src/containers/EmailSettingsModal/hooks.js

@@ -14,24 +14,24 @@ export const useEmailData = ({
   cardId,
   dispatch,
 }) => {
-  const { isEmailEnabled } = appHooks.useCardEnrollmentData(cardId);
-  const [toggleValue, setToggleValue] = module.state.toggle(isEmailEnabled);
+  const { hasOptedOutOfEmail } = appHooks.useCardEnrollmentData(cardId);
+  const [isOptedOut, setIsOptedOut] = module.state.toggle(hasOptedOutOfEmail);
   const onToggle = React.useCallback(
-    () => setToggleValue(!toggleValue),
-    [setToggleValue, toggleValue],
+    () => setIsOptedOut(!isOptedOut),
+    [setIsOptedOut, isOptedOut],
   );
   const save = React.useCallback(
     () => {
-      dispatch(thunkActions.app.updateEmailSettings(cardId, toggleValue));
+      dispatch(thunkActions.app.updateEmailSettings(cardId, isOptedOut));
       closeModal();
     },
-    [cardId, closeModal, dispatch, toggleValue],
+    [cardId, closeModal, dispatch, isOptedOut],
   );
 
   return {
     onToggle,
     save,
-    toggleValue,
+    isOptedOut,
   };
 };
 

src/containers/EmailSettingsModal/hooks.test.js

@@ -31,7 +31,7 @@ describe('EmailSettingsModal hooks', () => {
   describe('useEmailData', () => {
     beforeEach(() => {
       state.mock();
-      appHooks.useCardEnrollmentData.mockReturnValueOnce({ isEmailEnabled: true });
+      appHooks.useCardEnrollmentData.mockReturnValueOnce({ hasOptedOutOfEmail: true });
       out = hooks.useEmailData({ closeModal, cardId, dispatch });
     });
     afterEach(state.restore);
@@ -40,29 +40,29 @@ describe('EmailSettingsModal hooks', () => {
       expect(appHooks.useCardEnrollmentData).toHaveBeenCalledWith(cardId);
     });
 
-    test('initializes toggle value to cardData.isEmailEnabled', () => {
+    test('initializes toggle value to cardData.hasOptedOutOfEmail', () => {
       state.expectInitializedWith(state.keys.toggle, true);
-      expect(out.toggleValue).toEqual(true);
+      expect(out.isOptedOut).toEqual(true);
 
-      appHooks.useCardEnrollmentData.mockReturnValueOnce({ isEmailEnabled: false });
+      appHooks.useCardEnrollmentData.mockReturnValueOnce({ hasOptedOutOfEmail: false });
       out = hooks.useEmailData({ closeModal, cardId });
       state.expectInitializedWith(state.keys.toggle, false);
-      expect(out.toggleValue).toEqual(false);
+      expect(out.isOptedOut).toEqual(false);
     });
     describe('onToggle - returned callback', () => {
       it('is based on toggle state value', () => {
-        expect(out.onToggle.useCallback.prereqs).toEqual([state.setState.toggle, out.toggleValue]);
+        expect(out.onToggle.useCallback.prereqs).toEqual([state.setState.toggle, out.isOptedOut]);
       });
       it('sets toggle state value to opposite current value', () => {
         out.onToggle.useCallback.cb();
-        expect(state.setState.toggle).toHaveBeenCalledWith(!out.toggleValue);
+        expect(state.setState.toggle).toHaveBeenCalledWith(!out.isOptedOut);
       });
     });
     describe('save', () => {
       it('calls dispatch with thunkActions.app.updateEmailSettings', () => {
         out.save.useCallback.cb();
-        expect(thunkActions.app.updateEmailSettings).toHaveBeenCalledWith(cardId, out.toggleValue);
-        expect(dispatch).toHaveBeenCalledWith(thunkActions.app.updateEmailSettings(cardId, out.toggleValue));
+        expect(thunkActions.app.updateEmailSettings).toHaveBeenCalledWith(cardId, out.isOptedOut);
+        expect(dispatch).toHaveBeenCalledWith(thunkActions.app.updateEmailSettings(cardId, out.isOptedOut));
       });
       it('calls closeModal', () => {
         out.save.useCallback.cb();

src/containers/EmailSettingsModal/index.jsx

@@ -22,7 +22,7 @@ export const EmailSettingsModal = ({
 }) => {
   const dispatch = useDispatch();
   const {
-    toggleValue,
+    isOptedOut,
     onToggle,
     save,
   } = useEmailData({ dispatch, closeModal, cardId });
@@ -37,8 +37,8 @@ export const EmailSettingsModal = ({
     >
       <div className="bg-white p-3 rounded shadow" style={{ textAlign: 'start' }}>
         <h4>{formatMessage(messages.header)}</h4>
-        <Form.Switch checked={toggleValue} onChange={onToggle}>
-          {formatMessage(!toggleValue ? messages.emailsOff : messages.emailsOn)}
+        <Form.Switch checked={!isOptedOut} onChange={onToggle}>
+          {formatMessage(isOptedOut ? messages.emailsOff : messages.emailsOn)}
         </Form.Switch>
         <p>{formatMessage(messages.description)}</p>
         <ActionRow>

src/containers/EmailSettingsModal/index.test.jsx

@@ -11,7 +11,7 @@ jest.mock('./hooks', () => ({
 }));
 
 const hookProps = {
-  toggleValue: false,
+  isOptedOut: true,
   onToggle: jest.fn().mockName('hooks.onToggle'),
   save: jest.fn().mockName('hooks.save'),
 };
@@ -53,7 +53,7 @@ describe('EmailSettingsModal', () => {
     test('snapshot: emails enabled, show: true', () => {
       hooks.mockReturnValueOnce({
         ...hookProps,
-        toggleValue: true,
+        isOptedOut: false,
       });
       expect(shallow(<EmailSettingsModal {...props} />)).toMatchSnapshot();
     });