|
| 1 | +import React, { useContext, useState, useMemo } from "react"; |
| 2 | +import { |
| 3 | + AuthContainer, |
| 4 | + ConfirmButton, |
| 5 | + FormWrapperMobile, |
| 6 | + StyledRouteLinkLogin, |
| 7 | +} from "pages/userAuth/authComponents"; |
| 8 | +import { FormInput, PasswordInput, messageInstance } from "lowcoder-design"; |
| 9 | +import { AUTH_LOGIN_URL, ORG_AUTH_LOGIN_URL } from "constants/routesURL"; |
| 10 | +import UserApi from "api/userApi"; |
| 11 | +import { useRedirectUrl } from "util/hooks"; |
| 12 | +import { checkEmailValid } from "util/stringUtils"; |
| 13 | +import styled from "styled-components"; |
| 14 | +import { requiresUnAuth } from "./authHOC"; |
| 15 | +import { useLocation } from "react-router-dom"; |
| 16 | +import { UserConnectionSource } from "@lowcoder-ee/constants/userConstants"; |
| 17 | +import { trans } from "i18n"; |
| 18 | +import { AuthContext, useAuthSubmit } from "pages/userAuth/authUtils"; |
| 19 | +import { useParams } from "react-router-dom"; |
| 20 | +import { Divider } from "antd"; |
| 21 | +import { validateResponse } from "api/apiUtils"; |
| 22 | + |
| 23 | +const StyledFormInput = styled(FormInput)` |
| 24 | + margin-bottom: 16px; |
| 25 | +`; |
| 26 | + |
| 27 | +const RegisterContent = styled(FormWrapperMobile)` |
| 28 | + display: flex; |
| 29 | + flex-direction: column; |
| 30 | + margin-bottom: 0px; |
| 31 | +`; |
| 32 | + |
| 33 | +function ForgotPassword() { |
| 34 | + const [account, setAccount] = useState(""); |
| 35 | + const [loading, setLoading] = useState(false); |
| 36 | + const location = useLocation(); |
| 37 | + |
| 38 | + const orgId = useParams<any>().orgId; |
| 39 | + |
| 40 | + const onSubmit = () => { |
| 41 | + setLoading(true); |
| 42 | + UserApi.forgotPassword(account) |
| 43 | + .then((resp) => { |
| 44 | + // TODO: need proper response from BE |
| 45 | + // if (validateResponse(resp)) { |
| 46 | + // messageInstance.success(trans("userAuth.forgotPasswordSuccess")); |
| 47 | + // } |
| 48 | + if (resp.status === 200) { |
| 49 | + messageInstance.success(trans("userAuth.forgotPasswordSuccess")); |
| 50 | + } |
| 51 | + }) |
| 52 | + .catch((e) => { |
| 53 | + messageInstance.error(trans("userAuth.forgotPasswordError")); |
| 54 | + }) |
| 55 | + .finally(() => { |
| 56 | + setLoading(false); |
| 57 | + }) |
| 58 | + } |
| 59 | + |
| 60 | + const forgotPasswordHeading = trans("userAuth.forgotPassword") |
| 61 | + const subHeading = trans("userAuth.poweredByLowcoder"); |
| 62 | + |
| 63 | + return ( |
| 64 | + <AuthContainer |
| 65 | + heading={forgotPasswordHeading} |
| 66 | + subHeading={subHeading} |
| 67 | + type="large" |
| 68 | + > |
| 69 | + <p style={{textAlign: 'center'}}>{trans("userAuth.forgotPasswordInfo")}</p> |
| 70 | + <RegisterContent> |
| 71 | + <StyledFormInput |
| 72 | + className="form-input" |
| 73 | + label={''} |
| 74 | + onChange={(value, valid) => setAccount(valid ? value : "")} |
| 75 | + placeholder={trans("userAuth.inputEmail")} |
| 76 | + checkRule={{ |
| 77 | + check: checkEmailValid, |
| 78 | + errorMsg: trans("userAuth.inputValidEmail"), |
| 79 | + }} |
| 80 | + /> |
| 81 | + <ConfirmButton |
| 82 | + disabled={!account} |
| 83 | + onClick={onSubmit} |
| 84 | + loading={loading} |
| 85 | + > |
| 86 | + {trans("button.submit")} |
| 87 | + </ConfirmButton> |
| 88 | + </RegisterContent> |
| 89 | + <Divider/> |
| 90 | + <StyledRouteLinkLogin to={{ |
| 91 | + pathname: orgId |
| 92 | + ? ORG_AUTH_LOGIN_URL.replace(':orgId', orgId) |
| 93 | + : AUTH_LOGIN_URL, |
| 94 | + state: location.state |
| 95 | + }}>{trans("userAuth.userLogin")} |
| 96 | + </StyledRouteLinkLogin> |
| 97 | + </AuthContainer> |
| 98 | + ); |
| 99 | +} |
| 100 | + |
| 101 | +export default requiresUnAuth(ForgotPassword); |
0 commit comments