web: People: ProfileAction: fixed work with store

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

@@ -4,14 +4,11 @@ import PropTypes from "prop-types";
 import { PageLayout, Loader } from "asc-web-components";
 import { ArticleHeaderContent, ArticleMainButtonContent, ArticleBodyContent } from '../../Article';
 import { SectionHeaderContent, SectionBodyContent } from './Section';
-import { setProfile, fetchProfile, resetProfile } from '../../../store/profile/actions';
+import { fetchProfile } from '../../../store/profile/actions';
 import i18n from "./i18n";
 import { I18nextProvider } from "react-i18next";
 
 class Profile extends React.Component {
-  constructor(props) {
-    super(props);
-  }
 
   componentDidMount() {
     const { match, fetchProfile } = this.props;
@@ -30,10 +27,6 @@ class Profile extends React.Component {
     }
   }
 
-  componentWillUnmount() {
-    this.props.resetProfile();
-  }
-
   render() {
     console.log("Profile render")
 
@@ -70,6 +63,7 @@ Profile.propTypes = {
   history: PropTypes.object.isRequired,
   match: PropTypes.object.isRequired,
   profile: PropTypes.object,
+  fetchProfile: PropTypes.func.isRequired,
   isLoaded: PropTypes.bool
 };
 
@@ -80,7 +74,5 @@ function mapStateToProps(state) {
 }
 
 export default connect(mapStateToProps, {
-  setProfile,
-  fetchProfile,
-  resetProfile
+  fetchProfile
 })(Profile);

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

@@ -3,7 +3,7 @@ import { withRouter } from 'react-router'
 import { connect } from 'react-redux'
 import { Avatar, Button, Textarea, Text, toastr } from 'asc-web-components'
 import { withTranslation } from 'react-i18next';
-import { toEmployeeWrapper, getUserRole, profileEqual, createProfile } from '../../../../../store/profile/actions';
+import { toEmployeeWrapper, getUserRole, createProfile } from '../../../../../store/profile/actions';
 import { MainContainer, AvatarContainer, MainFieldsContainer } from './FormFields/Form'
 import TextField from './FormFields/TextField'
 import PasswordField from './FormFields/PasswordField'
@@ -30,12 +30,14 @@ class CreateUserForm extends React.Component {
   }
 
   componentDidUpdate(prevProps, prevState) {
-    if (!profileEqual(this.props.profile, prevProps.profile)) {
+    if (this.props.match.params.type !== prevProps.match.params.type) {
       this.setState(this.mapPropsToState(this.props));
     }
   }
 
   mapPropsToState = (props) => {
+    const isVisitor = props.match.params.type === "guest";
+
     return {
       isLoading: false,
       showPassword: false,
@@ -45,10 +47,7 @@ class CreateUserForm extends React.Component {
         email: false,
         password: false,
       },
-      profile: { 
-        ...{ passwordType: "link" },
-        ...toEmployeeWrapper(props.profile)
-      }
+      profile: toEmployeeWrapper({ isVisitor: isVisitor})
     };
   }
 
@@ -236,7 +235,6 @@ class CreateUserForm extends React.Component {
 
 const mapStateToProps = (state) => {
   return {
-    profile: state.profile.targetUser,
     settings: state.auth.settings
   }
 };

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

@@ -3,7 +3,7 @@ import { withRouter } from 'react-router'
 import { connect } from 'react-redux'
 import { Avatar, Button, Textarea, Text, toastr, ModalDialog } from 'asc-web-components'
 import { withTranslation } from 'react-i18next';
-import { toEmployeeWrapper, getUserRole, profileEqual, updateProfile } from '../../../../../store/profile/actions';
+import { toEmployeeWrapper, getUserRole, updateProfile } from '../../../../../store/profile/actions';
 import { MainContainer, AvatarContainer, MainFieldsContainer } from './FormFields/Form'
 import TextField from './FormFields/TextField'
 import TextChangeField from './FormFields/TextChangeField'
@@ -32,7 +32,7 @@ class UpdateUserForm extends React.Component {
   }
 
   componentDidUpdate(prevProps, prevState) {
-    if (!profileEqual(this.props.profile, prevProps.profile)) {
+    if (this.props.match.params.userId !== prevProps.match.params.userId) {
       this.setState(this.mapPropsToState(this.props));
     }
   }
@@ -47,10 +47,7 @@ class UpdateUserForm extends React.Component {
         email: false,
         password: false,
       },
-      profile: { 
-        ...{ passwordType: "link" },
-        ...toEmployeeWrapper(props.profile)
-      }
+      profile: toEmployeeWrapper(props.profile)
     };
   }
 

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

@@ -15,14 +15,17 @@ const Header = styled(Text.ContentHeader)`
 `;
 
 const SectionHeaderContent = (props) => {
-  const {profile, history, settings} = props;
+  const { profile, history, settings, match } = props;
+  const { type } = match.params;
   const { t } = useTranslation();
 
-  const headerText = profile && profile.displayName
-    ? profile.displayName
-    : profile.isVisitor
+  const headerText = type
+    ? type === "guest"
       ? t('NewGuest')
-      : t('NewEmployee');
+      : t('NewEmployee')
+    : profile
+      ? profile.displayName
+      : "";
 
   const onClick = useCallback(() => {
     history.push(settings.homepage)

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

@@ -4,53 +4,45 @@ import PropTypes from "prop-types";
 import { PageLayout, Loader } from "asc-web-components";
 import { ArticleHeaderContent, ArticleMainButtonContent, ArticleBodyContent } from '../../Article';
 import { SectionHeaderContent, CreateUserForm, UpdateUserForm } from './Section';
-import { setProfile, fetchProfile, resetProfile } from '../../../store/profile/actions';
+import { fetchProfile } from '../../../store/profile/actions';
 import i18n from "./i18n";
 import { I18nextProvider } from "react-i18next";
 
 class ProfileAction extends React.Component {
-  componentDidMount() {
-    const { match, setProfile, fetchProfile } = this.props;
-    const { userId, type } = match.params;
 
-    if (!userId) {
-      setProfile({ isVisitor: type === "guest" });
-    } else {
+  componentDidMount() {
+    const { match, fetchProfile } = this.props;
+    const { userId } = match.params;
+
+    if (userId) {
       fetchProfile(userId);
     }
   }
 
   componentDidUpdate(prevProps) {
-    const { match, setProfile, fetchProfile } = this.props;
-    const { userId, type } = match.params;
+    const { match, fetchProfile } = this.props;
+    const { userId } = match.params;
     const prevUserId = prevProps.match.params.userId;
-    const prevType = prevProps.match.params.type;
 
-    if (!userId && type !== prevType) {
-      setProfile({ isVisitor: type === "guest" });
-    } else if (userId !== prevUserId) {
+    if (userId !== undefined && userId !== prevUserId) {
       fetchProfile(userId);
     }
   }
 
-  componentWillUnmount() {
-    this.props.resetProfile();
-  }
-
   render() {
     console.log("ProfileAction render")
 
-    const { profile } = this.props;
+    const { profile, match } = this.props;
 
     return (
       <I18nextProvider i18n={i18n}>
-        {profile
+        {profile || match.params.type
         ? <PageLayout
           articleHeaderContent={<ArticleHeaderContent />}
           articleMainButtonContent={<ArticleMainButtonContent />}
           articleBodyContent={<ArticleBodyContent />}
           sectionHeaderContent={<SectionHeaderContent />}
-          sectionBodyContent={profile.id ? <UpdateUserForm /> : <CreateUserForm />}
+          sectionBodyContent={match.params.type ? <CreateUserForm /> : <UpdateUserForm />}
         />
         : <PageLayout
           articleHeaderContent={<ArticleHeaderContent />}
@@ -66,9 +58,7 @@ class ProfileAction extends React.Component {
 ProfileAction.propTypes = {
   match: PropTypes.object.isRequired,
   profile: PropTypes.object,
-  setProfile: PropTypes.func.isRequired,
-  fetchProfile: PropTypes.func.isRequired,
-  resetProfile: PropTypes.func.isRequired
+  fetchProfile: PropTypes.func.isRequired
 };
 
 function mapStateToProps(state) {
@@ -78,7 +68,5 @@ function mapStateToProps(state) {
 }
 
 export default connect(mapStateToProps, {
-  setProfile,
-  fetchProfile,
-  resetProfile
+  fetchProfile
 })(ProfileAction);

products/ASC.People/Client/src/store/profile/actions.js

@@ -33,32 +33,6 @@ export function getUserRole(profile) {
     return "user";
 };
 
-export function profileEqual(profileA, profileB) {
-    const keys = Object.keys(profileA);
-
-    for (let i = 0; i < keys.length; i++) {
-        let key = keys[i];
-
-        if (key === "groups") {
-            if (profileA[key].length !== profileB[key].length)
-                return false;
-
-            const groupsA = profileA[key].map(group => group.id);
-            const groupsB = profileA[key].map(group => group.id);
-            
-            for (let j = 0; j < groupsA.length; j++) {
-                if (!groupsB.includes(groupsA[j]))
-                    return false;
-            }
-        }
-
-        if(profileA[key] !== profileB[key])
-            return false;
-    }
-
-    return true;
-}
-
 export function toEmployeeWrapper(profile) {
     const emptyData = {
         id: "",
@@ -68,6 +42,7 @@ export function toEmployeeWrapper(profile) {
         password: "",
         birthday: "",
         sex: "male",
+        passwordType: "link",
         workFrom: "",
         location: "",
         title: "",