Add submit logic

Signed-off-by: soupette <cyril.lpz@gmail.com>

packages/strapi-admin/admin/src/containers/ProfilePage/index.js

@@ -83,6 +83,8 @@ const ProfilePage = () => {
           type: 'ON_SUBMIT_SUCCEEDED',
           data,
         });
+
+        strapi.notification.success('notification.success.saved');
       } catch (err) {
         const data = get(err, 'response.payload', { data: {} });
         const apiErrors = formatAPIErrors(data);

packages/strapi-admin/admin/src/containers/Users/EditPage/index.js

@@ -24,11 +24,10 @@ import init from './init';
 
 const EditPage = () => {
   const { settingsBaseURL } = useGlobalContext();
-  const [{ formErrors, isLoading, initialData, modifiedData }, dispatch] = useReducer(
+  const [
-    reducer,
+    { formErrors, isLoading, initialData, modifiedData, showHeaderLoader },
-    initialState,
+    dispatch,
-    init
+  ] = useReducer(reducer, initialState, init);
-  );
   const { formatMessage } = useIntl();
   const {
     params: { id },
@@ -75,6 +74,8 @@ const EditPage = () => {
     });
   };
 
+  // TODO: remove this line when API's ready
+  // eslint-disable-next-line consistent-return
   const handleSubmit = async e => {
     e.preventDefault();
 
@@ -85,11 +86,38 @@ const EditPage = () => {
       errors: errors || {},
     });
 
-    console.log(errors);
-
     if (!errors) {
-      // todo
+      try {
-      console.log('will submit');
+        strapi.lockAppWithOverlay();
+
+        dispatch({
+          type: 'ON_SUBMIT',
+        });
+
+        return new Promise(resolve => {
+          setTimeout(() => {
+            dispatch({
+              type: 'ON_SUBMIT_SUCCEEDED',
+              // TODO
+              // data,
+            });
+
+            strapi.notification.success('notification.success.saved');
+            resolve();
+          }, 1000);
+        });
+      } catch (err) {
+        // const data = get(err, 'response.payload', { data: {} });
+        // const apiErrors = formatAPIErrors(data);
+        // dispatch({
+        //   type: 'SET_ERRORS',
+        //   errors: apiErrors,
+        // });
+        // TODO
+        strapi.notification.error('An error occured');
+      } finally {
+        strapi.unlockApp();
+      }
     }
   };
 
@@ -103,7 +131,7 @@ const EditPage = () => {
           <Header
             // TODO: remove the content it is temporary
             content="Waiting for the API, this text will be removed when connected to the back-end"
-            isLoading={isLoading}
+            isLoading={showHeaderLoader}
             initialData={initialData}
             label={headerLabel}
             modifiedData={modifiedData}

packages/strapi-admin/admin/src/containers/Users/EditPage/reducer.js

@@ -27,23 +27,23 @@ const reducer = (state, action) =>
       case 'ON_CHANGE': {
         if (action.inputType === 'password' && !action.value) {
           unset(draftState.modifiedData, action.keys.split('.'));
-        } else if (action.keys.includes('username')) {
+        } else if (action.keys.includes('username') && !action.value) {
           set(draftState.modifiedData, action.keys.split('.'), null);
         } else {
           set(draftState.modifiedData, action.keys.split('.'), action.value);
         }
         break;
       }
-      // case 'ON_SUBMIT': {
+      case 'ON_SUBMIT': {
-      //   draftState.showHeaderLoader = true;
+        draftState.showHeaderLoader = true;
-      //   break;
+        break;
-      // }
+      }
-      // case 'ON_SUBMIT_SUCCEEDED': {
+      case 'ON_SUBMIT_SUCCEEDED': {
-      //   draftState.initialData = pick(action.data, ['email', 'firstname', 'lastname', 'username']);
+        // TODO fix this and add tests
-      //   draftState.modifiedData = pick(action.data, ['email', 'firstname', 'lastname', 'username']);
+        draftState.initialData = state.modifiedData;
-      //   draftState.showHeaderLoader = false;
+        draftState.showHeaderLoader = false;
-      //   break;
+        break;
-      // }
+      }
       case 'SET_ERRORS': {
         draftState.formErrors = action.errors;
         break;

packages/strapi-admin/admin/src/containers/Users/EditPage/tests/reducer.test.js

@@ -10,4 +10,152 @@ describe('ADMIN | CONTAINERS | USERS | EditPage | reducer', () => {
       expect(reducer(initialState, {})).toEqual(initialState);
     });
   });
+
+  describe('ON_CANCEL', () => {
+    it('should set the modifiedData with the initialData', () => {
+      const initialState = {
+        initialData: {
+          email: 'john@strapi.io',
+          firstname: '',
+        },
+        modifiedData: {
+          email: 'john@strapi.io',
+          firstname: 'test',
+        },
+      };
+      const action = {
+        type: 'ON_CANCEL',
+      };
+      const expected = {
+        initialData: {
+          email: 'john@strapi.io',
+          firstname: '',
+        },
+        modifiedData: {
+          email: 'john@strapi.io',
+          firstname: '',
+        },
+      };
+
+      expect(reducer(initialState, action)).toEqual(expected);
+    });
+  });
+
+  describe('ON_CHANGE', () => {
+    it('should change the data correctly if the inputType is not password', () => {
+      const initialState = {
+        modifiedData: {
+          email: 'john@strapi.io',
+          firstname: null,
+        },
+      };
+      const action = {
+        type: 'ON_CHANGE',
+        keys: 'email',
+        inputType: 'email',
+        value: 'test123',
+      };
+      const expected = {
+        modifiedData: {
+          email: 'test123',
+          firstname: null,
+        },
+      };
+
+      expect(reducer(initialState, action)).toEqual(expected);
+    });
+
+    it('should change the data correctly if the inputType is password', () => {
+      const initialState = {
+        modifiedData: {
+          email: 'john@strapi.io',
+          password: 'pwd123',
+        },
+      };
+      const action = {
+        type: 'ON_CHANGE',
+        keys: 'password',
+        inputType: 'password',
+        value: 'pwd1234',
+      };
+      const expected = {
+        modifiedData: {
+          email: 'john@strapi.io',
+          password: 'pwd1234',
+        },
+      };
+
+      expect(reducer(initialState, action)).toEqual(expected);
+    });
+
+    it('should change the data correctly if the inputType is password and the value is empty', () => {
+      const initialState = {
+        modifiedData: {
+          email: 'john@strapi.io',
+          password: 'pwd123',
+        },
+      };
+      const action = {
+        type: 'ON_CHANGE',
+        keys: 'password',
+        inputType: 'password',
+        value: '',
+      };
+      const expected = {
+        modifiedData: {
+          email: 'john@strapi.io',
+        },
+      };
+
+      expect(reducer(initialState, action)).toEqual(expected);
+    });
+
+    it('should set the username value to null if the value is empty', () => {
+      const initialState = {
+        modifiedData: {
+          email: 'john@strapi.io',
+          password: 'pwd123',
+          username: 'test',
+        },
+      };
+      const action = {
+        type: 'ON_CHANGE',
+        keys: 'username',
+        inputType: 'text',
+        value: '',
+      };
+      const expected = {
+        modifiedData: {
+          email: 'john@strapi.io',
+          password: 'pwd123',
+          username: null,
+        },
+      };
+
+      expect(reducer(initialState, action)).toEqual(expected);
+    });
+  });
+
+  describe('ON_SUBMIT', () => {
+    it('should change the showHeaderLoader property to true', () => {
+      const initialState = {
+        initialData: {},
+        modifiedData: {},
+        isLoading: false,
+        showHeaderLoader: false,
+      };
+      const expected = {
+        initialData: {},
+        modifiedData: {},
+        isLoading: false,
+        showHeaderLoader: true,
+      };
+
+      const action = {
+        type: 'ON_SUBMIT',
+      };
+
+      expect(reducer(initialState, action)).toEqual(expected);
+    });
+  });
 });

packages/strapi-admin/admin/src/containers/Users/EditPage/utils/tempData.js

@@ -6,7 +6,7 @@ const data = {
     username: null,
     email: 'soup@soup.com',
     isActive: false,
-    roles: [],
+    roles: [{ id: 1, name: 'Super Admin' }],
     registrationToken: 'my-super-token',
   },
   other: {
@@ -16,7 +16,10 @@ const data = {
     username: 'Display username',
     email: 'soup@soup.com',
     isActive: false,
-    roles: [],
+    roles: [
+      { id: 1, name: 'Super Admin' },
+      { id: 2, name: 'Author' },
+    ],
     registrationToken: null,
   },
 };

packages/strapi-admin/admin/src/translations/en.json

@@ -312,6 +312,7 @@
   "notification.form.success.fields": "Changes saved",
   "notification.link-copied": "Link copied into the clipboard",
   "notification.success.delete": "The item has been deleted",
+  "notification.success.saved": "Saved",
   "global.prompt.unsaved": "Are you sure you want to leave this page? All your modifications will be lost",
 
   "app.components.Users.SortPicker.button-label": "Sort by",