From f7064f3baa6e068ea639afc1c9f2e3b85ff3f59d Mon Sep 17 00:00:00 2001
From: Artem Tarasov <artem.tarasov@onlyoffice.com>
Date: Wed, 30 Sep 2020 21:20:51 +0300
Subject: [PATCH] Web: Common: login: added hashPassword

---
 web/ASC.Web.Common/src/api/user/index.js     |   7 +-
 web/ASC.Web.Common/src/pages/login/index.js  | 141 ++++++++++---------
 web/ASC.Web.Common/src/store/auth/actions.js |  38 ++---
 3 files changed, 95 insertions(+), 91 deletions(-)

diff --git a/web/ASC.Web.Common/src/api/user/index.js b/web/ASC.Web.Common/src/api/user/index.js
index 616be75267..72455af8ed 100644
--- a/web/ASC.Web.Common/src/api/user/index.js
+++ b/web/ASC.Web.Common/src/api/user/index.js
@@ -1,10 +1,9 @@
-
 import { request, setAuthorizationToken } from "../client";
 
-export function login(userName, password) {
+export function login(userName, hash) {
   const data = {
     userName,
-    password
+    passwordHash: hash
   };
 
   return request({
@@ -33,4 +32,4 @@ export function checkConfirmLink(data) {
     url: "/authentication/confirm.json",
     data
   });
-}
\ No newline at end of file
+}
diff --git a/web/ASC.Web.Common/src/pages/login/index.js b/web/ASC.Web.Common/src/pages/login/index.js
index c544b181f7..e84e6a4f07 100644
--- a/web/ASC.Web.Common/src/pages/login/index.js
+++ b/web/ASC.Web.Common/src/pages/login/index.js
@@ -22,6 +22,7 @@ import ForgotPasswordModalDialog from "./sub-components/forgot-password-modal-di
 import { login, setIsLoaded } from "../../store/auth/actions";
 import { sendInstructionsToChangePassword } from "../../api/people";
 import Register from "./sub-components/register-container";
+import { createHashPassword } from "../../utils";
 
 const LoginContainer = styled.div`
   display: flex;
@@ -33,11 +34,11 @@ const LoginContainer = styled.div`
   @media (max-width: 768px) {
     padding: 0 16px;
     max-width: 475px;
-    }
+  }
   @media (max-width: 375px) {
     margin: 72px auto 0 auto;
     max-width: 311px;
-    }
+  }
 
   .greeting-title {
     width: 100%;
@@ -56,11 +57,11 @@ const LoginContainer = styled.div`
 
     @media (max-width: 768px) {
       margin: 32px 0 0 0;
-      width: 100%
+      width: 100%;
     }
     @media (max-width: 375px) {
       margin: 32px 0 0 0;
-      width: 100%
+      width: 100%;
     }
 
     .login-forgot-wrapper {
@@ -73,48 +74,48 @@ const LoginContainer = styled.div`
 
         .login-checkbox {
           float: left;
-           span {
+          span {
             font-size: 12px;
-           }
-         }
+          }
+        }
 
-          .login-tooltip {
-            display: inline-flex;
+        .login-tooltip {
+          display: inline-flex;
 
-             @media(min-width: 1025px) {
-               margin-left: 8px;
-               margin-top: 4px;
-             }
-             @media(max-width: 1024px) {
-               padding: 4px 8px 8px 8px;
-             }
+          @media (min-width: 1025px) {
+            margin-left: 8px;
+            margin-top: 4px;
+          }
+          @media (max-width: 1024px) {
+            padding: 4px 8px 8px 8px;
+          }
+        }
       }
-    }
 
       .login-link {
         float: right;
         line-height: 16px;
       }
-  }
+    }
 
-  .login-button {
-    margin-bottom: 16px;
-  }
+    .login-button {
+      margin-bottom: 16px;
+    }
 
-  .login-button-dialog {
-    margin-right: 8px;
-  }
+    .login-button-dialog {
+      margin-right: 8px;
+    }
 
-  .login-bottom-border {
-    width: 100%;
-    height: 1px;
-    background: #ECEEF1;
-  }
+    .login-bottom-border {
+      width: 100%;
+      height: 1px;
+      background: #eceef1;
+    }
 
-  .login-bottom-text {
-    margin: 0 8px;
+    .login-bottom-text {
+      margin: 0 8px;
+    }
   }
-}
 `;
 
 class Form extends Component {
@@ -174,8 +175,7 @@ class Form extends Component {
   onSendPasswordInstructions = () => {
     if (!this.state.email.trim()) {
       this.setState({ emailError: true });
-    }
-    else {
+    } else {
       this.setState({ isLoading: true });
       sendInstructionsToChangePassword(this.state.email)
         .then(
@@ -198,7 +198,7 @@ class Form extends Component {
 
   onSubmit = () => {
     const { errorText, identifier, password } = this.state;
-    const { login, setIsLoaded, history } = this.props;
+    const { login, setIsLoaded, history, passwordHash } = this.props;
 
     errorText && this.setState({ errorText: "" });
     let hasError = false;
@@ -221,7 +221,9 @@ class Form extends Component {
 
     this.setState({ isLoading: true });
 
-    login(userName, pass)
+    const hash = createHashPassword(pass, passwordHash);
+
+    login(userName, hash)
       .then(() => {
         setIsLoaded(true);
         history.push("/");
@@ -231,7 +233,7 @@ class Form extends Component {
       });
   };
 
-  componentDidMount() {
+  async componentDidMount() {
     const { match, t } = this.props;
     const { error, confirmedEmail } = match.params;
 
@@ -251,7 +253,7 @@ class Form extends Component {
     upperCase: false,
     digits: false,
     specSymbols: false
-  }
+  };
 
   render() {
     const { greetingTitle, match, t } = this.props;
@@ -276,16 +278,16 @@ class Form extends Component {
     return (
       <>
         <LoginContainer>
-
-          <Text fontSize="32px"
+          <Text
+            fontSize="32px"
             fontWeight={600}
             textAlign="center"
-            className="greeting-title">
+            className="greeting-title"
+          >
             {greetingTitle}
           </Text>
 
           <form className="auth-form-container">
-
             <FieldContainer
               isVertical={true}
               labelVisible={false}
@@ -338,19 +340,19 @@ class Form extends Component {
                   className="login-checkbox"
                   isChecked={isChecked}
                   onChange={this.onChangeCheckbox}
-                  label={<Text fontSize='13px'>{t("Remember")}</Text>}
+                  label={<Text fontSize="13px">{t("Remember")}</Text>}
                 />
                 <HelpButton
                   className="login-tooltip"
                   helpButtonHeaderContent={t("CookieSettingsTitle")}
                   tooltipContent={
-                    <Text fontSize='12px'>{t("RememberHelper")}</Text>
+                    <Text fontSize="12px">{t("RememberHelper")}</Text>
                   }
                 />
               </div>
 
               <Link
-                fontSize='13px'
+                fontSize="13px"
                 color="#316DAA"
                 className="login-link"
                 type="page"
@@ -361,7 +363,7 @@ class Form extends Component {
               </Link>
             </div>
 
-            {openDialog &&
+            {openDialog && (
               <ForgotPasswordModalDialog
                 openDialog={openDialog}
                 isLoading={isLoading}
@@ -372,7 +374,7 @@ class Form extends Component {
                 onDialogClose={this.onDialogClose}
                 t={t}
               />
-            }
+            )}
 
             <Button
               id="button"
@@ -388,25 +390,25 @@ class Form extends Component {
             />
 
             {params.confirmedEmail && (
-              <Text isBold={true} fontSize='16px'>
+              <Text isBold={true} fontSize="16px">
                 {t("MessageEmailConfirmed")} {t("MessageAuthorize")}
               </Text>
             )}
-            <Text fontSize='14px' color="#c30">
+            <Text fontSize="14px" color="#c30">
               {errorText}
             </Text>
 
-            {socialButtons.length ? (<Box displayProp="flex" alignItems="center">
-              <div className="login-bottom-border"></div>
-              <Text className="login-bottom-text" color="#A3A9AE">{t("Or")}</Text>
-              <div className="login-bottom-border"></div>
-            </Box>
+            {socialButtons.length ? (
+              <Box displayProp="flex" alignItems="center">
+                <div className="login-bottom-border"></div>
+                <Text className="login-bottom-text" color="#A3A9AE">
+                  {t("Or")}
+                </Text>
+                <div className="login-bottom-border"></div>
+              </Box>
             ) : null}
-
           </form>
-
         </LoginContainer>
-
       </>
     );
   }
@@ -440,13 +442,14 @@ const LoginForm = props => {
 
   return (
     <>
-      {isLoaded && <>
-        <PageLayout sectionBodyContent={<FormWrapper i18n={i18n} {...props} />} />
-        {enabledJoin &&
-          <RegisterWrapper i18n={i18n} {...props} />
-        }
-      </>
-      }
+      {isLoaded && (
+        <>
+          <PageLayout
+            sectionBodyContent={<FormWrapper i18n={i18n} {...props} />}
+          />
+          {enabledJoin && <RegisterWrapper i18n={i18n} {...props} />}
+        </>
+      )}
     </>
   );
 };
@@ -462,10 +465,12 @@ function mapStateToProps(state) {
     isLoaded: state.auth.isLoaded,
     language: state.auth.user.cultureName || state.auth.settings.culture,
     greetingTitle: state.auth.settings.greetingSettings,
-    enabledJoin: state.auth.settings.enabledJoin
+    enabledJoin: state.auth.settings.enabledJoin,
+    passwordHash: state.auth.settings.passwordHash
   };
 }
 
-export default connect(mapStateToProps, { login, setIsLoaded })(
-  withRouter(LoginForm)
-);
+export default connect(mapStateToProps, {
+  login,
+  setIsLoaded
+})(withRouter(LoginForm));
diff --git a/web/ASC.Web.Common/src/store/auth/actions.js b/web/ASC.Web.Common/src/store/auth/actions.js
index cfb53cbdcd..4143b016bb 100644
--- a/web/ASC.Web.Common/src/store/auth/actions.js
+++ b/web/ASC.Web.Common/src/store/auth/actions.js
@@ -15,7 +15,7 @@ export const SET_CURRENT_PRODUCT_ID = "SET_CURRENT_PRODUCT_ID";
 export const SET_CURRENT_PRODUCT_HOME_PAGE = "SET_CURRENT_PRODUCT_HOME_PAGE";
 export const SET_GREETING_SETTINGS = "SET_GREETING_SETTINGS";
 export const SET_CUSTOM_NAMES = "SET_CUSTOM_NAMES";
-export const SET_WIZARD_COMPLETED ="SET_WIZARD_COMPLETED";
+export const SET_WIZARD_COMPLETED = "SET_WIZARD_COMPLETED";
 
 export function setCurrentUser(user) {
   return {
@@ -45,7 +45,6 @@ export function setIsLoaded(isLoaded) {
   };
 }
 
-
 export function setLogout() {
   return {
     type: LOGOUT
@@ -118,28 +117,27 @@ export function setCustomNames(customNames) {
 export function setWizardComplete() {
   return {
     type: SET_WIZARD_COMPLETED
-  }
+  };
 }
 
 export function getUser(dispatch) {
-  return api.people.getUser()
+  return api.people
+    .getUser()
     .then(user => dispatch(setCurrentUser(user)))
     .catch(err => dispatch(setCurrentUser({})));
 }
 
 export function getPortalSettings(dispatch) {
-  return api.settings
-    .getSettings()
-    .then(settings => {
-      dispatch(setSettings(settings));
-      settings.nameSchemaId && getCurrentCustomSchema(dispatch, settings.nameSchemaId);
-    });
+  return api.settings.getSettings().then(settings => {
+    dispatch(setSettings(settings));
+    settings.nameSchemaId &&
+      getCurrentCustomSchema(dispatch, settings.nameSchemaId);
+  });
 }
 export function getCurrentCustomSchema(dispatch, id) {
-
-    return api.settings
+  return api.settings
     .getCurrentCustomSchema(id)
-    .then(customNames =>   dispatch(setCustomNames(customNames)));
+    .then(customNames => dispatch(setCustomNames(customNames)));
 }
 
 export function getModules(dispatch) {
@@ -156,17 +154,19 @@ export function getUserInfo(dispatch) {
   return getUser(dispatch).finally(() => loadInitInfo(dispatch));
 }
 
-export function login(user, pass) {
+export function login(user, hash) {
   return dispatch => {
-    return api.user.login(user, pass)
-    .then(() => dispatch(setIsLoaded(false)))
-    .then(() => getUserInfo(dispatch));
+    return api.user
+      .login(user, hash)
+      .then(() => dispatch(setIsLoaded(false)))
+      .then(() => getUserInfo(dispatch));
   };
 }
 
 export function logout() {
   return dispatch => {
-    return api.user.logout()
+    return api.user
+      .logout()
       .then(() => dispatch(setLogout()))
       .then(() => dispatch(setIsLoaded(true)));
   };
@@ -188,4 +188,4 @@ export function getPortalPasswordSettings(dispatch, confirmKey = null) {
   return api.settings.getPortalPasswordSettings(confirmKey).then(settings => {
     dispatch(setPasswordSettings(settings));
   });
-}
\ No newline at end of file
+}