import React, { useState } from "react"; import Link from "next/link"; import { observer } from "mobx-react-lite"; import { Controller, useForm } from "react-hook-form"; import { Eye, EyeOff, XCircle } from "lucide-react"; // services import { AuthService } from "services/auth.service"; // hooks import useToast from "hooks/use-toast"; // ui import { Button, Input } from "@plane/ui"; // helpers import { checkEmailValidity } from "helpers/string.helper"; // types import { IPasswordSignInData } from "@plane/types"; type Props = { onSubmit: () => Promise; }; type TPasswordFormValues = { email: string; password: string; }; const defaultValues: TPasswordFormValues = { email: "", password: "", }; const authService = new AuthService(); export const SignUpPasswordForm: React.FC = observer((props) => { const { onSubmit } = props; // states const [showPassword, setShowPassword] = useState(false); // toast alert const { setToastAlert } = useToast(); // form info const { control, formState: { errors, isSubmitting, isValid }, handleSubmit, } = useForm({ defaultValues: { ...defaultValues, }, mode: "onChange", reValidateMode: "onChange", }); const handleFormSubmit = async (formData: TPasswordFormValues) => { const payload: IPasswordSignInData = { email: formData.email, password: formData.password, }; await authService .passwordSignIn(payload) .then(async () => await onSubmit()) .catch((err) => setToastAlert({ type: "error", title: "Error!", message: err?.error ?? "Something went wrong. Please try again.", }) ); }; return ( <>

Get on your flight deck

Create or join a workspace. Start with your e-mail.

checkEmailValidity(value) || "Email is invalid", }} render={({ field: { value, onChange } }) => (
{value.length > 0 && ( onChange("")} /> )}
)} />
(
{showPassword ? ( setShowPassword(false)} /> ) : ( setShowPassword(true)} /> )}
)} />

This password will continue to be your account{"'"}s password.

When you click the button above, you agree with our{" "} terms and conditions of service.

); });