thunderstrike/plane
thunderstrike/plane
2
0
Fork 0
forked from github/plane
Code Pull Requests Activity

chore: password form fix

Browse Source
This commit is contained in:
Aaryan Khandelwal 2023-11-23 17:46:07 +05:30
parent 82665a35ee
commit 981ee12226
2 changed files with 49 additions and 43 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
web/components/account/email-password-form.tsx
View File

@ -35,7 +35,15 @@ export const EmailPasswordForm: React.FC<IEmailPasswordForm> = (props) => {
return (
<>
<form className="space-y-4 mt-10 w-full sm:w-[360px] mx-auto" onSubmit={handleSubmit(onSubmit)}>
<h1 className="text-center text-2xl sm:text-2.5xl font-semibold text-custom-text-100">
Get on your flight deck!
</h1>
<div className="text-center text-sm text-onboarding-text-200 mt-3">
<p className="text-center text-sm text-onboarding-text-200 px-20 mt-3">
Sign in with the email you used to sign up for Plane
</p>
</div>
<form className="space-y-4 mt-5 sm:w-96 mx-auto" onSubmit={handleSubmit(onSubmit)}>
<div className="space-y-1">
<Controller
control={control}
@ -109,7 +117,7 @@ export const EmailPasswordForm: React.FC<IEmailPasswordForm> = (props) => {
onClick={() => router.push("/accounts/sign-up")}
className="text-custom-text-200 hover:text-custom-primary-100"
>
{"Don't have an account? Sign Up"}
Don{"'"}t have an account? Sign up
</button>
</div>
</form>

80
web/components/page-views/signin.tsx
View File

@ -149,9 +149,10 @@ export const SignInView = observer(() => {
}
};
const handlePasswordSignIn = (formData: EmailPasswordFormValues) => {
const handlePasswordSignIn = async (formData: EmailPasswordFormValues) => {
setLoading(true);
return authService
return await authService
.emailLogin(formData)
.then(() => {
mutateUserInfo();
@ -231,48 +232,45 @@ export const SignInView = observer(() => {
</div>
) : (
<>
<>
{enableEmailPassword && <EmailPasswordForm onSubmit={handlePasswordSignIn} />}
{envConfig?.magic_login && (
<div className="sm:w-96 mx-auto flex flex-col divide-y divide-custom-border-200">
<div className="pb-2">
<EmailCodeForm authType={authType} handleSignIn={handleEmailCodeSignIn} />
</div>
</div>
)}
<div className="flex sm:w-96 items-center mt-4 mx-auto">
<hr className={`border-onboarding-border-100 w-full`} />
<p className="text-center text-sm text-onboarding-text-400 mx-3 flex-shrink-0">
Or continue with
</p>
<hr className={`border-onboarding-border-100 w-full`} />
</div>
<div className="flex flex-col items-center justify-center gap-4 pt-7 sm:flex-row sm:w-96 mx-auto overflow-hidden">
{envConfig?.google_client_id && (
<GoogleLoginButton clientId={envConfig?.google_client_id} handleSignIn={handleGoogleSignIn} />
)}
{envConfig?.github_client_id && (
<GithubLoginButton
authType={authType}
clientId={envConfig?.github_client_id}
handleSignIn={handleGitHubSignIn}
/>
<div className="sm:w-96 mx-auto flex flex-col divide-y divide-custom-border-200">
<div className="pb-2">
{envConfig.magic_login ? (
<EmailCodeForm authType={authType} handleSignIn={handleEmailCodeSignIn} />
) : (
<EmailPasswordForm onSubmit={handlePasswordSignIn} />
)}
</div>
{authType === "sign-up" && (
<div className="sm:w-96 text-center mx-auto mt-6 text-onboarding-text-400 text-sm">
Already using Plane?{" "}
<span
className="text-custom-primary-80 hover text-sm font-medium underline hover:cursor-pointer"
onClick={() => {
setAuthType("sign-in");
}}
>
Sign in
</span>
</div>
</div>
<div className="flex sm:w-96 items-center mt-4 mx-auto">
<hr className={`border-onboarding-border-100 w-full`} />
<p className="text-center text-sm text-onboarding-text-400 mx-3 flex-shrink-0">Or continue with</p>
<hr className={`border-onboarding-border-100 w-full`} />
</div>
<div className="flex flex-col items-center justify-center gap-4 pt-7 sm:flex-row sm:w-96 mx-auto overflow-hidden">
{envConfig?.google_client_id && (
<GoogleLoginButton clientId={envConfig?.google_client_id} handleSignIn={handleGoogleSignIn} />
)}
</>
{envConfig?.github_client_id && (
<GithubLoginButton
authType={authType}
clientId={envConfig?.github_client_id}
handleSignIn={handleGitHubSignIn}
/>
)}
</div>
{authType === "sign-up" && (
<div className="sm:w-96 text-center mx-auto mt-6 text-onboarding-text-400 text-sm">
Already using Plane?{" "}
<span
className="text-custom-primary-80 hover text-sm font-medium underline hover:cursor-pointer"
onClick={() => {
setAuthType("sign-in");
}}
>
Sign in
</span>
</div>
)}
<div
className={`flex py-2 bg-onboarding-background-100 border border-onboarding-border-200 mx-auto rounded-[3.5px] sm:w-96 mt-16`}
>