IlyaSobolev/DocSpace-buildtools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Web: Login: moved forgot-password-modal-dialog, added types

Browse Source
This commit is contained in:
Artem Tarasov 2022-08-16 01:47:37 +03:00
parent 6dcb42ec0b
commit 1e7068a63b
1 changed files with 26 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
packages/login/src/sub-components/forgot-password-modal-dialog.js → packages/login/src/client/components/sub-components/forgot-password-modal-dialog.tsx
View File

@ -11,8 +11,23 @@ import ModalDialogContainer from "./modal-dialog-container";
import { sendInstructionsToChangePassword } from "@docspace/common/api/people"; import { sendInstructionsToChangePassword } from "@docspace/common/api/people";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
const ForgotPasswordModalDialog = (props) => { interface IForgotPasswordDialogProps {
const [email, setEmail] = useState(props.email); isVisible: boolean;
userEmail?: string;
onDialogClose: VoidFunction;
}
interface IEmailValid {
value: string;
isValid: boolean;
errors: string[]; // TODO: check type
}
const ForgotPasswordModalDialog: React.FC<IForgotPasswordDialogProps> = ({
isVisible,
userEmail,
onDialogClose,
}) => {
const [email, setEmail] = useState(userEmail);
const [emailError, setEmailError] = useState(false); const [emailError, setEmailError] = useState(false);
const [isLoading, setIsLoading] = useState(false); const [isLoading, setIsLoading] = useState(false);
const [errorText, setErrorText] = useState(""); const [errorText, setErrorText] = useState("");
@ -20,11 +35,7 @@ const ForgotPasswordModalDialog = (props) => {
const { t } = useTranslation("Login"); const { t } = useTranslation("Login");
const { visible, onDialogClose } = props; const onChangeEmail = (event: React.ChangeEvent<HTMLInputElement>) => {
useEffect(() => {}, []);
const onChangeEmail = (event) => {
//console.log("onChangeEmail", event.target.value); //console.log("onChangeEmail", event.target.value);
setEmail(event.target.value); setEmail(event.target.value);
setEmailError(false); setEmailError(false);
@ -32,21 +43,21 @@ const ForgotPasswordModalDialog = (props) => {
}; };
const onSendPasswordInstructions = () => { const onSendPasswordInstructions = () => {
if (!email.trim() || emailError) { if (!email || !email.trim() || emailError) {
setEmailError(true); setEmailError(true);
setIsShowError(true); setIsShowError(true);
} else { } else {
setIsLoading(true); setIsLoading(true);
sendInstructionsToChangePassword(email) sendInstructionsToChangePassword(email)
.then( .then(
(res) => toastr.success(res), (res: string) => toastr.success(res),
(message) => toastr.error(message) (message: string) => toastr.error(message)
) )
.finally(onDialogClose()); .finally(onDialogClose());
} }
}; };
const onKeyDown = (e) => { const onKeyDown = (e: KeyboardEvent) => {
//console.log("onKeyDown", e.key); //console.log("onKeyDown", e.key);
if (e.key === "Enter") { if (e.key === "Enter") {
onSendPasswordInstructions(); onSendPasswordInstructions();
@ -54,7 +65,7 @@ const ForgotPasswordModalDialog = (props) => {
} }
}; };
const onValidateEmail = (res) => { const onValidateEmail = (res: IEmailValid) => {
setEmailError(!res.isValid); setEmailError(!res.isValid);
setErrorText(res.errors[0]); setErrorText(res.errors[0]);
}; };
@ -66,7 +77,7 @@ const ForgotPasswordModalDialog = (props) => {
return ( return (
<ModalDialogContainer <ModalDialogContainer
displayType="modal" displayType="modal"
visible={visible} visible={isVisible}
modalBodyPadding="12px 0 0 0" modalBodyPadding="12px 0 0 0"
asideBodyPadding="16px 0 0 0" asideBodyPadding="16px 0 0 0"
onClose={onDialogClose} onClose={onDialogClose}
@ -148,8 +159,8 @@ const ForgotPasswordModalDialog = (props) => {
}; };
ForgotPasswordModalDialog.propTypes = { ForgotPasswordModalDialog.propTypes = {
email: PropTypes.string, userEmail: PropTypes.string,
visible: PropTypes.bool.isRequired, isVisible: PropTypes.bool.isRequired,
onDialogClose: PropTypes.func.isRequired, onDialogClose: PropTypes.func.isRequired,
}; };