fix: Login workflow depending on smtp is configured (#3307)

This commit is contained in:
sriram veeraghanta 2024-01-04 16:27:17 +05:30
parent 7272c54439
commit 46e79dde27
7 changed files with 121 additions and 98 deletions

View File

@ -39,7 +39,6 @@ OPENAI_API_BASE="https://api.openai.com/v1" # deprecated
OPENAI_API_KEY="sk-" # deprecated
GPT_ENGINE="gpt-3.5-turbo" # deprecated
# Settings related to Docker
DOCKERIZED=1 # deprecated

View File

@ -20,7 +20,6 @@ class ConfigurationEndpoint(BaseAPIView):
]
def get(self, request):
# Get all the configuration
(
GOOGLE_CLIENT_ID,
@ -90,8 +89,12 @@ class ConfigurationEndpoint(BaseAPIView):
data = {}
# Authentication
data["google_client_id"] = GOOGLE_CLIENT_ID if GOOGLE_CLIENT_ID and GOOGLE_CLIENT_ID != "\"\"" else None
data["github_client_id"] = GITHUB_CLIENT_ID if GITHUB_CLIENT_ID and GITHUB_CLIENT_ID != "\"\"" else None
data["google_client_id"] = (
GOOGLE_CLIENT_ID if GOOGLE_CLIENT_ID and GOOGLE_CLIENT_ID != '""' else None
)
data["github_client_id"] = (
GITHUB_CLIENT_ID if GITHUB_CLIENT_ID and GITHUB_CLIENT_ID != '""' else None
)
data["github_app_name"] = GITHUB_APP_NAME
data["magic_login"] = (
bool(EMAIL_HOST_USER) and bool(EMAIL_HOST_PASSWORD)
@ -114,7 +117,9 @@ class ConfigurationEndpoint(BaseAPIView):
# File size settings
data["file_size_limit"] = float(os.environ.get("FILE_SIZE_LIMIT", 5242880))
# is self managed
data["is_self_managed"] = bool(int(os.environ.get("IS_SELF_MANAGED", "1")))
# is smtp configured
data["is_smtp_configured"] = not (
bool(EMAIL_HOST_USER) and bool(EMAIL_HOST_PASSWORD)
)
return Response(data, status=status.HTTP_200_OK)

View File

@ -1,5 +1,3 @@
export interface IAppConfig {
email_password_login: boolean;
file_size_limit: number;
@ -12,5 +10,5 @@ export interface IAppConfig {
posthog_host: string | null;
has_openai_configured: boolean;
has_unsplash_configured: boolean;
is_self_managed: boolean;
is_smtp_configured: boolean;
}

View File

@ -1,10 +1,12 @@
import React, { useEffect } from "react";
import { Controller, useForm } from "react-hook-form";
import { XCircle } from "lucide-react";
import { observer } from "mobx-react-lite";
// services
import { AuthService } from "services/auth.service";
// hooks
import useToast from "hooks/use-toast";
import { useApplication } from "hooks/store";
// ui
import { Button, Input } from "@plane/ui";
// helpers
@ -25,11 +27,13 @@ type TEmailFormValues = {
const authService = new AuthService();
export const EmailForm: React.FC<Props> = (props) => {
export const EmailForm: React.FC<Props> = observer((props) => {
const { handleStepChange, updateEmail } = props;
// hooks
const { setToastAlert } = useToast();
const {
config: { envConfig },
} = useApplication();
const {
control,
formState: { errors, isSubmitting, isValid },
@ -54,9 +58,11 @@ export const EmailForm: React.FC<Props> = (props) => {
await authService
.emailCheck(payload)
.then((res) => {
// if the password has been autoset, send the user to magic sign-in
if (res.is_password_autoset) handleStepChange(ESignInSteps.UNIQUE_CODE);
// if the password has not been autoset, send them to password sign-in
// if the password has been auto set, send the user to magic sign-in
if (res.is_password_autoset && envConfig?.is_smtp_configured) {
handleStepChange(ESignInSteps.UNIQUE_CODE);
}
// if the password has not been auto set, send them to password sign-in
else handleStepChange(ESignInSteps.PASSWORD);
})
.catch((err) =>
@ -119,4 +125,4 @@ export const EmailForm: React.FC<Props> = (props) => {
</form>
</>
);
};
});

View File

@ -6,6 +6,7 @@ import { XCircle } from "lucide-react";
import { AuthService } from "services/auth.service";
// hooks
import useToast from "hooks/use-toast";
import { useApplication } from "hooks/store";
// ui
import { Button, Input } from "@plane/ui";
// helpers
@ -14,12 +15,14 @@ import { checkEmailValidity } from "helpers/string.helper";
import { IPasswordSignInData } from "@plane/types";
// constants
import { ESignInSteps } from "components/account";
import { observer } from "mobx-react-lite";
type Props = {
email: string;
updateEmail: (email: string) => void;
handleStepChange: (step: ESignInSteps) => void;
handleSignInRedirection: () => Promise<void>;
handleEmailClear: () => void;
};
type TPasswordFormValues = {
@ -34,13 +37,16 @@ const defaultValues: TPasswordFormValues = {
const authService = new AuthService();
export const PasswordForm: React.FC<Props> = (props) => {
const { email, updateEmail, handleStepChange, handleSignInRedirection } = props;
export const PasswordForm: React.FC<Props> = observer((props) => {
const { email, updateEmail, handleStepChange, handleSignInRedirection, handleEmailClear } = props;
// states
const [isSendingUniqueCode, setIsSendingUniqueCode] = useState(false);
const [isSendingResetPasswordLink, setIsSendingResetPasswordLink] = useState(false);
// toast alert
const { setToastAlert } = useToast();
const {
config: { envConfig },
} = useApplication();
// form info
const {
control,
@ -157,11 +163,12 @@ export const PasswordForm: React.FC<Props> = (props) => {
hasError={Boolean(errors.email)}
placeholder="orville.wright@frstflt.com"
className="h-[46px] w-full border border-onboarding-border-100 pr-12 placeholder:text-onboarding-text-400"
disabled
/>
{value.length > 0 && (
<XCircle
className="absolute right-3 h-5 w-5 stroke-custom-text-400 hover:cursor-pointer"
onClick={() => onChange("")}
onClick={handleEmailClear}
/>
)}
</div>
@ -199,26 +206,28 @@ export const PasswordForm: React.FC<Props> = (props) => {
</button>
</div>
</div>
<div className="grid gap-2.5 sm:grid-cols-2">
<div className="flex gap-4">
{envConfig && envConfig.is_smtp_configured && (
<Button
type="button"
onClick={handleSendUniqueCode}
variant="primary"
variant="outline-primary"
className="w-full"
size="xl"
loading={isSendingUniqueCode}
>
{isSendingUniqueCode ? "Sending code" : "Use unique code"}
</Button>
)}
<Button
type="submit"
variant="outline-primary"
variant="primary"
className="w-full"
size="xl"
disabled={!isValid}
loading={isSubmitting}
>
Go to workspace
Continue
</Button>
</div>
<p className="text-xs text-onboarding-text-200">
@ -230,4 +239,4 @@ export const PasswordForm: React.FC<Props> = (props) => {
</form>
</>
);
};
});

View File

@ -13,7 +13,6 @@ import {
OAuthOptions,
OptionalSetPasswordForm,
CreatePasswordForm,
SelfHostedSignInForm,
} from "components/account";
export enum ESignInSteps {
@ -45,13 +44,6 @@ export const SignInRoot = observer(() => {
return (
<>
<div className="mx-auto flex flex-col">
{envConfig?.is_self_managed ? (
<SelfHostedSignInForm
email={email}
updateEmail={(newEmail) => setEmail(newEmail)}
handleSignInRedirection={handleRedirection}
/>
) : (
<>
{signInStep === ESignInSteps.EMAIL && (
<EmailForm
@ -64,6 +56,10 @@ export const SignInRoot = observer(() => {
email={email}
updateEmail={(newEmail) => setEmail(newEmail)}
handleStepChange={(step) => setSignInStep(step)}
handleEmailClear={() => {
setEmail("");
setSignInStep(ESignInSteps.EMAIL);
}}
handleSignInRedirection={handleRedirection}
/>
)}
@ -79,6 +75,10 @@ export const SignInRoot = observer(() => {
submitButtonLabel="Go to workspace"
showTermsAndConditions
updateUserOnboardingStatus={(value) => setIsOnboarded(value)}
handleEmailClear={() => {
setEmail("");
setSignInStep(ESignInSteps.EMAIL);
}}
/>
)}
{signInStep === ESignInSteps.UNIQUE_CODE && (
@ -88,6 +88,10 @@ export const SignInRoot = observer(() => {
handleStepChange={(step) => setSignInStep(step)}
handleSignInRedirection={handleRedirection}
updateUserOnboardingStatus={(value) => setIsOnboarded(value)}
handleEmailClear={() => {
setEmail("");
setSignInStep(ESignInSteps.EMAIL);
}}
/>
)}
{signInStep === ESignInSteps.OPTIONAL_SET_PASSWORD && (
@ -107,7 +111,6 @@ export const SignInRoot = observer(() => {
/>
)}
</>
)}
</div>
{isOAuthEnabled && !OAUTH_HIDDEN_STEPS.includes(signInStep) && (
<OAuthOptions handleSignInRedirection={handleRedirection} />

View File

@ -25,6 +25,7 @@ type Props = {
submitButtonLabel?: string;
showTermsAndConditions?: boolean;
updateUserOnboardingStatus: (value: boolean) => void;
handleEmailClear: () => void;
};
type TUniqueCodeFormValues = {
@ -50,6 +51,7 @@ export const UniqueCodeForm: React.FC<Props> = (props) => {
submitButtonLabel = "Continue",
showTermsAndConditions = false,
updateUserOnboardingStatus,
handleEmailClear,
} = props;
// states
const [isRequestingNewCode, setIsRequestingNewCode] = useState(false);
@ -183,11 +185,12 @@ export const UniqueCodeForm: React.FC<Props> = (props) => {
hasError={Boolean(errors.email)}
placeholder="orville.wright@frstflt.com"
className="h-[46px] w-full border border-onboarding-border-100 pr-12 placeholder:text-onboarding-text-400"
disabled
/>
{value.length > 0 && (
<XCircle
className="absolute right-3 h-5 w-5 stroke-custom-text-400 hover:cursor-pointer"
onClick={() => onChange("")}
onClick={handleEmailClear}
/>
)}
</div>