c42e0317de
In order to unify package names, we decided to use `@appsmith` prefix as a marker to indicate that packages belong to our codebase and that these packages are developed internally. So that we can use this prefix, we need to rename the alias of the same name. But since `@appsmith` is currently being used as an alias for `ee` folder, we have to rename the alias as the first step. Related discussion https://theappsmith.slack.com/archives/CPG2ZTXEY/p1722516279126329 EE PR — https://github.com/appsmithorg/appsmith-ee/pull/4801 ## Automation /ok-to-test tags="@tag.All" ### 🔍 Cypress test results <!-- This is an auto-generated comment: Cypress test results --> > [!TIP] > 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉 > Workflow run: <https://github.com/appsmithorg/appsmith/actions/runs/10267368821> > Commit: 2b00af2d257e4d4304db0a80072afef7513de6be > <a href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=10267368821&attempt=2" target="_blank">Cypress dashboard</a>. > Tags: `@tag.All` > Spec: > <hr>Tue, 06 Aug 2024 14:24:22 UTC <!-- end of auto-generated comment: Cypress test results --> ## Communication Should the DevRel and Marketing teams inform users about this change? - [ ] Yes - [x] No
166 lines
4.2 KiB
TypeScript
166 lines
4.2 KiB
TypeScript
import React, { useEffect } from "react";
|
|
import Container from "./Container";
|
|
import { Button, Callout, Icon, Link, Text } from "design-system";
|
|
import { AUTH_LOGIN_URL } from "constants/routes";
|
|
import {
|
|
createMessage,
|
|
DEFAULT_ERROR_MESSAGE,
|
|
PAGE_CLIENT_ERROR_DESCRIPTION,
|
|
VERIFY_ERROR_ALREADY_VERIFIED_TITLE,
|
|
VERIFY_ERROR_EXPIRED_TITLE,
|
|
VERIFY_ERROR_MISMATCH_TITLE,
|
|
} from "ee/constants/messages";
|
|
import { useResendEmailVerification } from "./helpers";
|
|
import type { RouteComponentProps } from "react-router-dom";
|
|
import styled from "styled-components";
|
|
import AnalyticsUtil from "ee/utils/AnalyticsUtil";
|
|
|
|
const Body = styled.div`
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
`;
|
|
|
|
export enum VerificationErrorType {
|
|
MISSING_PARAMETER = "AE-APP-4000",
|
|
ALREADY_VERIFIED = "AE-EMV-4095",
|
|
EXPIRED = "AE-EMV-4096",
|
|
MISMATCH = "AE-EMV-4098",
|
|
UNKNOWN = "UNKNOWN",
|
|
}
|
|
|
|
const VerificationError = (
|
|
props: RouteComponentProps<{
|
|
errorCode: string;
|
|
email: string;
|
|
message: string;
|
|
}>,
|
|
) => {
|
|
const queryParams = new URLSearchParams(props.location.search);
|
|
const email = queryParams.get("email");
|
|
const code = queryParams.get("code");
|
|
const message = queryParams.get("message");
|
|
const [resendVerificationLink, enabled] = useResendEmailVerification(email);
|
|
useEffect(() => {
|
|
AnalyticsUtil.logEvent("EMAIL_VERIFICATION_FAILED", {
|
|
errorCode: code,
|
|
message,
|
|
});
|
|
}, [code, message]);
|
|
|
|
if (code === VerificationErrorType.EXPIRED) {
|
|
return (
|
|
<Container testId="verification-error" title="">
|
|
<Body>
|
|
<Callout kind="error">
|
|
<Text kind={"body-m"}>
|
|
{createMessage(VERIFY_ERROR_EXPIRED_TITLE)}
|
|
</Text>
|
|
</Callout>
|
|
</Body>
|
|
<Body>
|
|
<Button
|
|
isDisabled={!enabled}
|
|
onClick={resendVerificationLink}
|
|
size="md"
|
|
>
|
|
Send new link
|
|
</Button>
|
|
</Body>
|
|
</Container>
|
|
);
|
|
}
|
|
|
|
if (code === VerificationErrorType.MISSING_PARAMETER) {
|
|
return (
|
|
<Container testId="verification-error" title="">
|
|
<Body>
|
|
<Callout kind="error">
|
|
<Text kind={"body-m"}>{message}</Text>
|
|
</Callout>
|
|
</Body>
|
|
<Body>
|
|
<Button
|
|
isDisabled={!enabled}
|
|
onClick={resendVerificationLink}
|
|
size="md"
|
|
>
|
|
Send new link
|
|
</Button>
|
|
</Body>
|
|
</Container>
|
|
);
|
|
}
|
|
|
|
if (code === VerificationErrorType.ALREADY_VERIFIED) {
|
|
return (
|
|
<Container
|
|
footer={
|
|
<div className="px-2 py-4 flex items-center justify-center text-base text-center text-[color:var(--ads-v2\-color-fg)] text-[14px]">
|
|
<Icon name="arrow-left-line" size="md" />
|
|
Back to
|
|
<Link
|
|
className="text-sm justify-center pl-[var(--ads-v2\-spaces-3)]"
|
|
kind="primary"
|
|
target="_self"
|
|
to={AUTH_LOGIN_URL}
|
|
>
|
|
Sign in
|
|
</Link>
|
|
</div>
|
|
}
|
|
testId="verification-error"
|
|
title=""
|
|
>
|
|
<Body>
|
|
<Callout kind="error">
|
|
<Text kind={"body-m"}>
|
|
{createMessage(VERIFY_ERROR_ALREADY_VERIFIED_TITLE)}
|
|
</Text>
|
|
</Callout>
|
|
</Body>
|
|
</Container>
|
|
);
|
|
}
|
|
|
|
if (code === VerificationErrorType.MISMATCH) {
|
|
return (
|
|
<Container testId="verification-error" title="">
|
|
<Body>
|
|
<Callout kind="error">
|
|
<Text kind={"body-m"}>
|
|
{createMessage(VERIFY_ERROR_MISMATCH_TITLE)}
|
|
</Text>
|
|
</Callout>
|
|
</Body>
|
|
<Body>
|
|
<Button
|
|
isDisabled={!enabled}
|
|
onClick={resendVerificationLink}
|
|
size="md"
|
|
>
|
|
Send new link
|
|
</Button>
|
|
</Body>
|
|
</Container>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Container
|
|
testId="verification-error"
|
|
title={createMessage(DEFAULT_ERROR_MESSAGE)}
|
|
>
|
|
<Body>
|
|
<Callout kind="error">
|
|
<Text kind={"body-m"}>
|
|
{createMessage(PAGE_CLIENT_ERROR_DESCRIPTION)}
|
|
</Text>
|
|
</Callout>
|
|
</Body>
|
|
</Container>
|
|
);
|
|
};
|
|
|
|
export default VerificationError;
|