From ea2c1e2d060c597ceb0dcbcd4d2201a2a3c4c510 Mon Sep 17 00:00:00 2001 From: sriram veeraghanta Date: Wed, 4 Oct 2023 18:55:29 +0530 Subject: [PATCH 01/10] fix: login process validation based on api config (#2361) --- .../account/email-password-form.tsx | 163 +++++++----------- web/components/account/email-signup-form.tsx | 114 ++++++++++++ .../account/github-login-button.tsx | 16 +- web/components/account/google-login.tsx | 15 +- web/components/account/index.ts | 1 + web/pages/index.tsx | 94 ++++++---- web/pages/sign-up.tsx | 25 +-- web/services/app-config.service.ts | 30 ++++ 8 files changed, 283 insertions(+), 175 deletions(-) create mode 100644 web/components/account/email-signup-form.tsx create mode 100644 web/services/app-config.service.ts diff --git a/web/components/account/email-password-form.tsx b/web/components/account/email-password-form.tsx index bb341b371..7a95095ee 100644 --- a/web/components/account/email-password-form.tsx +++ b/web/components/account/email-password-form.tsx @@ -1,12 +1,5 @@ -import React, { useState } from "react"; - -import { useRouter } from "next/router"; -import Link from "next/link"; - -// react hook form +import React from "react"; import { useForm } from "react-hook-form"; -// components -import { EmailResetPasswordForm } from "components/account"; // ui import { Input, PrimaryButton } from "components/ui"; // types @@ -18,14 +11,12 @@ type EmailPasswordFormValues = { type Props = { onSubmit: (formData: EmailPasswordFormValues) => Promise; + setIsResettingPassword: (value: boolean) => void; }; -export const EmailPasswordForm: React.FC = ({ onSubmit }) => { - const [isResettingPassword, setIsResettingPassword] = useState(false); - - const router = useRouter(); - const isSignUpPage = router.pathname === "/sign-up"; - +export const EmailPasswordForm: React.FC = (props) => { + const { onSubmit, setIsResettingPassword } = props; + // form info const { register, handleSubmit, @@ -42,94 +33,62 @@ export const EmailPasswordForm: React.FC = ({ onSubmit }) => { return ( <> -

- {isResettingPassword - ? "Reset your password" - : isSignUpPage - ? "Sign up on Plane" - : "Sign in to Plane"} -

- {isResettingPassword ? ( - - ) : ( -
-
- - /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test( - value - ) || "Email address is not valid", - }} - error={errors.email} - placeholder="Enter your email address..." - className="border-custom-border-300 h-[46px]" - /> -
-
- -
-
- {isSignUpPage ? ( - - - Already have an account? Sign in. - - - ) : ( - - )} -
-
- - {isSignUpPage - ? isSubmitting - ? "Signing up..." - : "Sign up" - : isSubmitting - ? "Signing in..." - : "Sign in"} - - {!isSignUpPage && ( - - - Don{"'"}t have an account? Sign up. - - - )} -
-
- )} +
+
+ + /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test( + value + ) || "Email address is not valid", + }} + error={errors.email} + placeholder="Enter your email address..." + className="border-custom-border-300 h-[46px]" + /> +
+
+ +
+
+ +
+
+ + {isSubmitting ? "Signing in..." : "Sign in"} + +
+
); }; diff --git a/web/components/account/email-signup-form.tsx b/web/components/account/email-signup-form.tsx new file mode 100644 index 000000000..0a219741f --- /dev/null +++ b/web/components/account/email-signup-form.tsx @@ -0,0 +1,114 @@ +import React from "react"; +import Link from "next/link"; +import { useForm } from "react-hook-form"; +// ui +import { Input, PrimaryButton } from "components/ui"; +// types +type EmailPasswordFormValues = { + email: string; + password?: string; + confirm_password: string; + medium?: string; +}; + +type Props = { + onSubmit: (formData: EmailPasswordFormValues) => Promise; +}; + +export const EmailSignUpForm: React.FC = (props) => { + const { onSubmit } = props; + + const { + register, + handleSubmit, + watch, + formState: { errors, isSubmitting, isValid, isDirty }, + } = useForm({ + defaultValues: { + email: "", + password: "", + confirm_password: "", + medium: "email", + }, + mode: "onChange", + reValidateMode: "onChange", + }); + + return ( + <> +
+
+ + /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/.test( + value + ) || "Email address is not valid", + }} + error={errors.email} + placeholder="Enter your email address..." + className="border-custom-border-300 h-[46px]" + /> +
+
+ +
+
+ { + if (watch("password") != val) { + return "Your passwords do no match"; + } + }, + }} + error={errors.confirm_password} + placeholder="Confirm your password..." + className="border-custom-border-300 h-[46px]" + /> +
+ +
+ + {isSubmitting ? "Signing up..." : "Sign up"} + +
+
+ + ); +}; diff --git a/web/components/account/github-login-button.tsx b/web/components/account/github-login-button.tsx index 2f4fcbc4d..9ea5b7df2 100644 --- a/web/components/account/github-login-button.tsx +++ b/web/components/account/github-login-button.tsx @@ -1,29 +1,27 @@ import { useEffect, useState, FC } from "react"; - import Link from "next/link"; import Image from "next/image"; import { useRouter } from "next/router"; - -// next-themes import { useTheme } from "next-themes"; // images import githubBlackImage from "/public/logos/github-black.png"; import githubWhiteImage from "/public/logos/github-white.png"; -const { NEXT_PUBLIC_GITHUB_ID } = process.env; - export interface GithubLoginButtonProps { handleSignIn: React.Dispatch; + clientId: string; } -export const GithubLoginButton: FC = ({ handleSignIn }) => { +export const GithubLoginButton: FC = (props) => { + const { handleSignIn, clientId } = props; + // states const [loginCallBackURL, setLoginCallBackURL] = useState(undefined); const [gitCode, setGitCode] = useState(null); - + // router const { query: { code }, } = useRouter(); - + // theme const { theme } = useTheme(); useEffect(() => { @@ -42,7 +40,7 @@ export const GithubLoginButton: FC = ({ handleSignIn }) return (
diff --git a/space/services/app-config.service.ts b/space/services/app-config.service.ts new file mode 100644 index 000000000..713cda3da --- /dev/null +++ b/space/services/app-config.service.ts @@ -0,0 +1,30 @@ +// services +import APIService from "services/api.service"; +// helper +import { API_BASE_URL } from "helpers/common.helper"; + +export interface IEnvConfig { + github: string; + google: string; + github_app_name: string | null; + email_password_login: boolean; + magic_login: boolean; +} + +export class AppConfigService extends APIService { + constructor() { + super(API_BASE_URL); + } + + async envConfig(): Promise { + return this.get("/api/configs/", { + headers: { + "Content-Type": "application/json", + }, + }) + .then((response) => response?.data) + .catch((error) => { + throw error?.response?.data; + }); + } +} diff --git a/turbo.json b/turbo.json index b3c5e4d9f..e40a56ab7 100644 --- a/turbo.json +++ b/turbo.json @@ -1,8 +1,6 @@ { "$schema": "https://turbo.build/schema.json", "globalEnv": [ - "NEXT_PUBLIC_GITHUB_ID", - "NEXT_PUBLIC_GOOGLE_CLIENTID", "NEXT_PUBLIC_API_BASE_URL", "NEXT_PUBLIC_DEPLOY_URL", "API_BASE_URL", diff --git a/web/pages/index.tsx b/web/pages/index.tsx index ed98d29f6..1696f2fbc 100644 --- a/web/pages/index.tsx +++ b/web/pages/index.tsx @@ -85,11 +85,11 @@ const HomePage: NextPage = observer(() => { const handleGitHubSignIn = async (credential: string) => { try { - if (process.env.NEXT_PUBLIC_GITHUB_ID && credential) { + if (data && data.github && credential) { const socialAuthPayload = { medium: "github", credential, - clientId: process.env.NEXT_PUBLIC_GITHUB_ID, + clientId: data.github, }; const response = await authenticationService.socialAuth(socialAuthPayload); if (response && response?.user) { From 62035f3bad19209f52cf1df1552e636d268502db Mon Sep 17 00:00:00 2001 From: guru_sainath Date: Thu, 5 Oct 2023 12:04:09 +0530 Subject: [PATCH 08/10] fix: added user store variables in mobx store observable (#2380) --- space/store/user.ts | 3 +++ 1 file changed, 3 insertions(+) diff --git a/space/store/user.ts b/space/store/user.ts index cc7334e87..cec2d340f 100644 --- a/space/store/user.ts +++ b/space/store/user.ts @@ -27,6 +27,9 @@ class UserStore implements IUserStore { constructor(_rootStore: any) { makeObservable(this, { // observable + loader: observable.ref, + error: observable.ref, + currentUser: observable.ref, // actions setCurrentUser: action, From 85147db85faba7bd9bc812d2fb7fe6d577ca3bb2 Mon Sep 17 00:00:00 2001 From: Aaryan Khandelwal <65252264+aaryan610@users.noreply.github.com> Date: Thu, 5 Oct 2023 13:08:27 +0530 Subject: [PATCH 09/10] fix: state group icons (#2381) --- web/components/icons/state/backlog.tsx | 24 +++++++++++++++++--- web/components/icons/state/started.tsx | 31 +++++++++++++++++++++----- 2 files changed, 47 insertions(+), 8 deletions(-) diff --git a/web/components/icons/state/backlog.tsx b/web/components/icons/state/backlog.tsx index b6378b82d..369692c20 100644 --- a/web/components/icons/state/backlog.tsx +++ b/web/components/icons/state/backlog.tsx @@ -15,10 +15,28 @@ export const StateGroupBacklogIcon: React.FC = ({ height={height} width={width} className={className} - viewBox="0 0 12 12" - fill="none" xmlns="http://www.w3.org/2000/svg" + viewBox="0 0 323.15 323.03" > - + + + + + + + + ); diff --git a/web/components/icons/state/started.tsx b/web/components/icons/state/started.tsx index 7bc39f9f7..f4796548b 100644 --- a/web/components/icons/state/started.tsx +++ b/web/components/icons/state/started.tsx @@ -9,17 +9,38 @@ export const StateGroupStartedIcon: React.FC = ({ width = "20", height = "20", className, - color = "#f59e0b", + color = "#f39e1f", }) => ( - - + + + + + + + + + ); From 67922f9c5d82b325771dbd3ba1005413d0e657f2 Mon Sep 17 00:00:00 2001 From: guru_sainath Date: Thu, 5 Oct 2023 13:47:51 +0530 Subject: [PATCH 10/10] fix: removed default theme setting in the index page (#2382) * fix: removed default theme setting in the index page * fix: empty space --- web/pages/index.tsx | 4 ---- 1 file changed, 4 deletions(-) diff --git a/web/pages/index.tsx b/web/pages/index.tsx index 1696f2fbc..cccd32407 100644 --- a/web/pages/index.tsx +++ b/web/pages/index.tsx @@ -155,10 +155,6 @@ const HomePage: NextPage = observer(() => { } }; - useEffect(() => { - setTheme("system"); - }, [setTheme]); - return ( {isLoading ? (