[email protected] - Added the save method to the store #copy (#1732

) * f-account-info - Added the save consumer details method to the store * f-account-info - Added missing dependencies * f-account-info - trying to fix build * f-account-info - f-account-info - trying to fix build Co-authored-by: billy.oliver <[email protected]>
justeattakeaway · Mar 9, 2022 · d7f40ff · d7f40ff
1 parent 469d1e2
commit d7f40ff
Show file tree

Hide file tree

Showing 7 changed files with 331 additions and 299 deletions.
diff --git a/packages/components/pages/f-account-info/CHANGELOG.md b/packages/components/pages/f-account-info/CHANGELOG.md
@@ -4,6 +4,14 @@ The format is based on [Keep a Changelog](http://keepachangelog.com/en/1.0.0/)
 and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.html).
 
 
+v0.18.0
+------------------------------
+*March 4, 2022*
+
+### Added
+- Added Save method to vuex store
+
+
 v0.17.0
 ------------------------------
 *March 3, 2022*

diff --git a/packages/components/pages/f-account-info/package.json b/packages/components/pages/f-account-info/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@justeat/f-account-info",
   "description": "Fozzie Account Info - The account information page",
-  "version": "0.17.0",
+  "version": "0.18.0",
   "main": "dist/f-account-info.umd.min.js",
   "maxBundleSize": "100kB",
   "files": [
@@ -50,20 +50,22 @@
     "extends @justeat/browserslist-config-fozzie"
   ],
   "dependencies": {
-    "@justeat/f-button": "3.2.0",
-    "@justeat/f-card": "3.4.0",
-    "@justeat/f-card-with-content": "1.0.0",
-    "@justeat/f-form-field": "4.5.0",
     "@justeat/f-globalisation": "1.0.0",
-    "@justeat/f-vue-icons": "3.3.0",
     "@justeat/f-services": "1.13.0",
+    "@justeat/f-vue-icons": "3.3.0",
     "vuelidate": "0.7.6"
   },
   "peerDependencies": {
     "@justeat/browserslist-config-fozzie": ">=1.2.0",
     "vuex": ">=3.5.1"
   },
   "devDependencies": {
+    "@justeat/f-button": "3.2.0",
+    "@justeat/f-card": "3.4.0",
+    "@justeat/f-card-with-content": "1.0.0",
+    "@justeat/f-error-message": "1.1.0",
+    "@justeat/f-form-field": "4.5.0",
+    "@justeat/f-link": "2.3.0",    
     "@justeat/f-wdio-utils": "0.6.0",
     "@samhammer/vue-cli-plugin-stylelint": "2.1.0",
     "@vue/cli-plugin-babel": "4.5.15",

diff --git a/packages/components/pages/f-account-info/src/services/mapping/consumer.mapper.js b/packages/components/pages/f-account-info/src/services/mapping/consumer.mapper.js
@@ -37,3 +37,25 @@ export const mapToConsumerAddress = addresses => {
 
     return model;
 };
+
+/**
+ * Maps the current consumer model to the update model for the patch request.
+ * @param {object} consumer - The consumer details.
+ * @returns {object} Patch request model.
+ */
+export const mapToConsumerUpdate = consumer => {
+    const model = {
+        FirstName: consumer?.firstName || null,
+        LastName: consumer?.lastName || null,
+        Address: {
+            Line1: consumer?.line1 || null,
+            Line2: consumer?.line2 || null,
+            Line3: consumer?.line3 || null,
+            City: consumer?.locality || null,
+            ZipCode: consumer?.postcode || null
+        },
+        PhoneNumber: consumer?.phoneNumber || null
+    };
+
+    return model;
+};
diff --git a/packages/components/pages/f-account-info/src/store/_tests/accountInfo.module.test.js b/packages/components/pages/f-account-info/src/store/_tests/accountInfo.module.test.js
@@ -10,24 +10,28 @@ import {
     consumerAddressesGetResponse,
     consumerViewModel,
     consumerDetailsMappedModel,
-    consumerAddressMappedModel
+    consumerAddressMappedModel,
+    consumerUpdateBody
 } from '../../../test-utils/setup';
 
 describe('AccountInfo Store', () => {
     let apiClientMock;
     let setConversationIdMock;
     let getConsumerDetailsMock;
     let getConsumerAddressesMock;
+    let patchConsumerDetailsMock;
 
     beforeEach(() => {
         // Arrange
         setConversationIdMock = jest.fn(() => conversationId);
         getConsumerDetailsMock = jest.fn(() => consumerDetailsGetResponse);
         getConsumerAddressesMock = jest.fn(() => consumerAddressesGetResponse);
+        patchConsumerDetailsMock = jest.fn(() => {});
         apiClientMock = {
             setConversationId: setConversationIdMock,
             getConsumerDetails: getConsumerDetailsMock,
-            getConsumerAddresses: getConsumerAddressesMock
+            getConsumerAddresses: getConsumerAddressesMock,
+            patchConsumer: patchConsumerDetailsMock
         };
     });
 
@@ -118,7 +122,7 @@ describe('AccountInfo Store', () => {
             });
         });
 
-        describe('editPreference ::', () => {
+        describe('editConsumerDetails ::', () => {
             it(`should call ${UPDATE_CONSUMER_DETAIL} mutation with the correct data`, () => {
                 // Arrange
                 const currentState = { consumer: { ...consumerViewModel, firstName: 'Tester1' } };
@@ -143,6 +147,16 @@ describe('AccountInfo Store', () => {
                 expect(commitSpy).not.toHaveBeenCalled();
             });
         });
+
+        describe('saveConsumerDetails ::', () => {
+            it('should call the patchConsumer api method with the correct parameters', async () => {
+                // Act
+                await accountInfoModule.actions.saveConsumerDetails({ state: consumerViewModel }, { api: apiClientMock, authToken: token });
+
+                // Assert
+                expect(patchConsumerDetailsMock).toHaveBeenCalledWith(token, consumerUpdateBody);
+            });
+        });
     });
 
     describe('mutations ::', () => {

diff --git a/packages/components/pages/f-account-info/src/store/accountInfo.module.js b/packages/components/pages/f-account-info/src/store/accountInfo.module.js
@@ -1,6 +1,7 @@
 import {
     mapToConsumerDetails,
-    mapToConsumerAddress
+    mapToConsumerAddress,
+    mapToConsumerUpdate
 } from '../services/mapping/consumer.mapper';
 import {
     UPDATE_CONSUMER_DETAILS,
@@ -28,6 +29,12 @@ export default {
             commit(UPDATE_CONSUMER_DETAILS, { details, address });
         },
 
+        async saveConsumerDetails ({ state }, { api, authToken }) {
+            const body = mapToConsumerUpdate(state);
+
+            await api.patchConsumer(authToken, body);
+        },
+
         editConsumerDetails ({ commit, state }, { field, value }) {
             const present = field in state.consumer;
             if (present) {

diff --git a/packages/components/pages/f-account-info/test-utils/setup.js b/packages/components/pages/f-account-info/test-utils/setup.js
@@ -75,7 +75,6 @@ export const consumerDetailsMappedModel = {
 export const consumerAddressMappedModel = {
     line1: consumerAddressGetResponse.Line1,
     line2: consumerAddressGetResponse.Line2,
-    line3: consumerAddressGetResponse.Line3,
     locality: consumerAddressGetResponse.City,
     postcode: consumerAddressGetResponse.ZipCode
 };
@@ -93,14 +92,14 @@ export const consumerStateModel = {
 };
 
 export const consumerUpdateBody = {
-    FirstName: 'harry',
-    LastName: 'Potter',
+    FirstName: consumerDetailsGetResponse.data.FirstName,
+    LastName: consumerDetailsGetResponse.data.LastName,
     Address: {
-        Line1: '4 Privet Drive',
-        Line2: 'Little Whinging',
+        Line1: consumerAddressGetResponse.Line1,
+        Line2: consumerAddressGetResponse.Line2,
         Line3: null,
-        City: 'Surrey',
-        ZipCode: 'CR25ER'
+        City: consumerAddressGetResponse.City,
+        ZipCode: consumerAddressGetResponse.ZipCode
     },
-    PhoneNumber: '+441234567890'
+    PhoneNumber: consumerDetailsGetResponse.data.PhoneNumber
 };