web: people: migrate editing form store to mobx

products/ASC.People/Client/src/components/dialogs/DataLossWarningDialog/index.js

@@ -1,15 +1,16 @@
 import React from "react";
-import { connect } from "react-redux";
+// import { connect } from "react-redux";
 import PropTypes from "prop-types";
 import { ModalDialog, Button, Text } from "asc-web-components";
 import { withTranslation } from "react-i18next";
 import { utils } from "asc-web-common";
 import ModalDialogContainer from "../ModalDialogContainer";
 import { createI18N } from "../../../helpers/i18n";
-import {
-  setIsVisibleDataLossDialog,
-  setIsEditingForm,
-} from "../../../store/people/actions";
+// import {
+//   setIsVisibleDataLossDialog,
+//   setIsEditingForm,
+// } from "../../../store/people/actions";
+import { inject, observer } from "mobx-react";
 
 const i18n = createI18N({
   page: "DataLossWarningDialog",
@@ -94,13 +95,11 @@ DataLossWarningDialog.propTypes = {
   onContinue: PropTypes.func.isRequired,
 };
 
-function mapStateToProps(state) {
+export default inject(({ peopleStore }) => {
   return {
-    editingForm: state.people.editingForm,
+    editingForm: peopleStore.editingFormStore,
+    setIsVisibleDataLossDialog:
+      peopleStore.editingFormStore.setIsVisibleDataLossDialog,
+    setIsEditingForm: peopleStore.editingFormStore.setIsEditingForm,
   };
-}
-
-export default connect(mapStateToProps, {
-  setIsVisibleDataLossDialog,
-  setIsEditingForm,
-})(DataLossWarningDialog);
+})(observer(DataLossWarningDialog));

products/ASC.People/Client/src/components/pages/ProfileAction/Section/Body/createAvatarEditorPage.js

@@ -23,6 +23,7 @@ import {
 } from "../../../../../store/people/actions";
 import { setDocumentTitle } from "../../../../../helpers/utils";
 import { isMobile } from "react-device-detect";
+import { inject, observer } from "mobx-react";
 
 const { createThumbnailsAvatar, loadAvatar } = api.people;
 const { isTablet } = utils.device;
@@ -296,7 +297,7 @@ function mapStateToProps(state) {
     createdAvatar: state.profile.createdAvatar,
     croppedAvatar: state.profile.croppedAvatar,
     //settings: state.auth.settings,
-    editingForm: state.people.editingForm,
+    //editingForm: state.people.editingForm,
   };
 }
 
@@ -310,5 +311,23 @@ export default connect(mapStateToProps, {
   setCreatedAvatar,
   setCroppedAvatar,
   resetProfile,
-  setIsEditingForm,
-})(withTranslation()(withRouter(CreateAvatarEditorPage)));
+  //setIsEditingForm,
+})(
+  inject(({ peopleStore }) => ({
+    editingForm: peopleStore.editingFormStore,
+    setIsEditingForm: peopleStore.editingFormStore.setIsEditingForm,
+  }))(observer(withRouter(withTranslation()(CreateAvatarEditorPage))))
+);
+
+// export default connect(mapStateToProps, {
+//   fetchProfile,
+//   updateProfile,
+//   toggleAvatarEditor,
+//   setAvatarMax,
+//   updateCreatedAvatar,
+//   updateProfileInUsers,
+//   setCreatedAvatar,
+//   setCroppedAvatar,
+//   resetProfile,
+//   setIsEditingForm,
+// })(withTranslation()(withRouter(CreateAvatarEditorPage)));

products/ASC.People/Client/src/components/pages/ProfileAction/Section/Body/createUserForm.js

@@ -662,7 +662,7 @@ const mapStateToProps = (state) => {
     //settings,
     groups,
     filter,
-    editingForm,
+    //editingForm,
     createdAvatar,
     croppedAvatar,
   };
@@ -677,15 +677,19 @@ export default connect(mapStateToProps, {
   updateCreatedAvatar,
   setFilter,
   updateProfileInUsers,
-  setIsVisibleDataLossDialog,
-  setIsEditingForm,
+  // setIsVisibleDataLossDialog,
+  // setIsEditingForm,
   toggleAvatarEditor,
   setCreatedAvatar,
   setCroppedAvatar,
   resetProfile,
 })(
-  inject(({ store }) => ({
+  inject(({ store, peopleStore }) => ({
     settings: store.settingsStore,
+    editingForm: peopleStore.editingFormStore,
+    setIsVisibleDataLossDialog:
+      peopleStore.editingFormStore.setIsVisibleDataLossDialog,
+    setIsEditingForm: peopleStore.editingFormStore.setIsEditingForm,
   }))(observer(withRouter(withTranslation()(CreateUserForm))))
 );
 

products/ASC.People/Client/src/components/pages/ProfileAction/Section/Body/updateUserForm.js

@@ -919,7 +919,7 @@ const mapStateToProps = (state) => {
     avatarMax: state.profile.avatarMax,
     //settings: state.auth.settings,
     groups: state.people.groups,
-    editingForm: state.people.editingForm,
+    //editingForm: state.people.editingForm,
     filter: state.people.filter,
     disableProfileType: getDisableProfileType(state),
     // isAdmin: isAdmin(state),
@@ -934,15 +934,19 @@ export default connect(mapStateToProps, {
   updateProfile,
   fetchProfile,
   updateProfileInUsers,
-  setIsVisibleDataLossDialog,
-  setIsEditingForm,
+  // setIsVisibleDataLossDialog,
+  // setIsEditingForm,
   setFilter,
   toggleAvatarEditor,
   setAvatarMax,
 })(
-  inject(({ store }) => ({
+  inject(({ store, peopleStore }) => ({
     settings: store.settingsStore,
     isAdmin: store.isAdmin,
+    editingForm: peopleStore.editingFormStore,
+    setIsVisibleDataLossDialog:
+      peopleStore.editingFormStore.setIsVisibleDataLossDialog,
+    setIsEditingForm: peopleStore.editingFormStore.setIsEditingForm,
   }))(observer(withRouter(withTranslation()(UpdateUserForm))))
 );
 

products/ASC.People/Client/src/components/pages/ProfileAction/Section/Header/index.js

@@ -114,7 +114,7 @@ function mapStateToProps(state) {
     profile: state.profile.targetUser,
     //settings: state.auth.settings,
     filter: state.people.filter,
-    editingForm: state.people.editingForm,
+    //editingForm: state.people.editingForm,
     avatarEditorIsOpen: state.people.avatarEditorIsOpen,
   };
 }
@@ -125,12 +125,15 @@ function mapStateToProps(state) {
 
 export default connect(mapStateToProps, {
   setFilter,
-  setIsVisibleDataLossDialog,
+  //setIsVisibleDataLossDialog,
   toggleAvatarEditor,
   resetProfile,
 })(
-  inject(({ store }) => ({
+  inject(({ store, peopleStore }) => ({
     settings: store.settingsStore,
+    editingForm: peopleStore.editingFormStore,
+    setIsVisibleDataLossDialog:
+      peopleStore.editingFormStore.setIsVisibleDataLossDialog,
   }))(observer(withRouter(SectionHeaderContent)))
 );
 

products/ASC.People/Client/src/components/pages/ProfileAction/index.js

@@ -145,13 +145,15 @@ function mapStateToProps(state) {
     isVisitor: state.auth.user.isVisitor,
     profile: state.profile.targetUser,
     // isAdmin: isAdmin(state),
-    isEdit: state.people.editingForm.isEdit,
+    //isEdit: state.people.editingForm.isEdit,
     avatarEditorIsOpen: state.people.avatarEditorIsOpen,
   };
 }
 
-export default connect(mapStateToProps, { fetchProfile, setIsEditingForm })(
-  inject(({ store }) => ({
+export default connect(mapStateToProps, { fetchProfile /*setIsEditingForm*/ })(
+  inject(({ store, peopleStore }) => ({
     isAdmin: store.isAdmin,
+    isEdit: peopleStore.editingFormStore.isEdit,
+    setIsEditingForm: peopleStore.editingFormStore.setIsEditingForm,
   }))(observer(ProfileActionContainer))
 );