diff --git a/packages/backend/src/graphql/mutations/forgot-password.ee.ts b/packages/backend/src/graphql/mutations/forgot-password.ee.ts
index 045ee704..dab887b0 100644
--- a/packages/backend/src/graphql/mutations/forgot-password.ee.ts
+++ b/packages/backend/src/graphql/mutations/forgot-password.ee.ts
@@ -42,7 +42,7 @@ const forgotPassword = async (_parent: unknown, params: Params) => {
await emailQueue.add(jobName, jobPayload, jobOptions);
- return;
+ return true;
};
export default forgotPassword;
diff --git a/packages/web/src/components/DeleteAccountDialog/index.ee.tsx b/packages/web/src/components/DeleteAccountDialog/index.ee.tsx
index 59b9f308..d7310de5 100644
--- a/packages/web/src/components/DeleteAccountDialog/index.ee.tsx
+++ b/packages/web/src/components/DeleteAccountDialog/index.ee.tsx
@@ -15,11 +15,11 @@ import useAuthentication from 'hooks/useAuthentication';
import useFormatMessage from 'hooks/useFormatMessage';
import useCurrentUser from 'hooks/useCurrentUser';
-type TDeleteAccountDialogProps = {
+type DeleteAccountDialogProps = {
onClose: () => void;
}
-export default function DeleteAccountDialog(props: TDeleteAccountDialogProps) {
+export default function DeleteAccountDialog(props: DeleteAccountDialogProps) {
const [deleteUser] = useMutation(DELETE_USER);
const formatMessage = useFormatMessage();
const currentUser = useCurrentUser();
diff --git a/packages/web/src/components/ForgotPasswordForm/index.ee.tsx b/packages/web/src/components/ForgotPasswordForm/index.ee.tsx
new file mode 100644
index 00000000..2fb21a05
--- /dev/null
+++ b/packages/web/src/components/ForgotPasswordForm/index.ee.tsx
@@ -0,0 +1,68 @@
+import * as React from 'react';
+import { useMutation } from '@apollo/client';
+import Paper from '@mui/material/Paper';
+import Typography from '@mui/material/Typography';
+import LoadingButton from '@mui/lab/LoadingButton';
+
+import { FORGOT_PASSWORD } from 'graphql/mutations/forgot-password.ee';
+import Form from 'components/Form';
+import TextField from 'components/TextField';
+import useFormatMessage from 'hooks/useFormatMessage';
+
+export default function ForgotPasswordForm() {
+ const formatMessage = useFormatMessage();
+ const [forgotPassword, { data, loading }] = useMutation(FORGOT_PASSWORD);
+
+ const handleSubmit = async (values: any) => {
+ await forgotPassword({
+ variables: {
+ input: values,
+ },
+ });
+ };
+
+ return (
+
+ theme.palette.text.disabled,
+ pb: 2,
+ mb: 2,
+ }}
+ gutterBottom
+ >
+ {formatMessage('forgotPassword.title')}
+
+
+
+
+ );
+}
diff --git a/packages/web/src/components/LoginForm/index.tsx b/packages/web/src/components/LoginForm/index.tsx
index fab8fae2..d6a82a8e 100644
--- a/packages/web/src/components/LoginForm/index.tsx
+++ b/packages/web/src/components/LoginForm/index.tsx
@@ -11,6 +11,7 @@ import * as URLS from 'config/urls';
import { LOGIN } from 'graphql/mutations/login';
import Form from 'components/Form';
import TextField from 'components/TextField';
+import useFormatMessage from 'hooks/useFormatMessage';
function renderFields(props: { loading: boolean }) {
const { loading = false } = props;
@@ -37,8 +38,17 @@ function renderFields(props: { loading: boolean }) {
margin="dense"
autoComplete="current-password"
data-test="password-text-field"
+ sx={{ mb: 1 }}
/>
+
+ Forgot password?
+
+
- Login
+ {formatMessage('loginForm.title')}
diff --git a/packages/web/src/config/urls.ts b/packages/web/src/config/urls.ts
index 062d88f4..be5e5ef7 100644
--- a/packages/web/src/config/urls.ts
+++ b/packages/web/src/config/urls.ts
@@ -6,6 +6,7 @@ export const EXECUTION = (executionId: string): string =>
export const LOGIN = '/login';
export const SIGNUP = '/sign-up';
+export const FORGOT_PASSWORD = '/forgot-password';
export const APPS = '/apps';
export const NEW_APP_CONNECTION = '/apps/new';
diff --git a/packages/web/src/graphql/mutations/forgot-password.ee.ts b/packages/web/src/graphql/mutations/forgot-password.ee.ts
new file mode 100644
index 00000000..9373875e
--- /dev/null
+++ b/packages/web/src/graphql/mutations/forgot-password.ee.ts
@@ -0,0 +1,7 @@
+import { gql } from '@apollo/client';
+
+export const FORGOT_PASSWORD = gql`
+ mutation ForgotPassword($input: ForgotPasswordInput) {
+ forgotPassword(input: $input)
+ }
+`;
diff --git a/packages/web/src/locales/en.json b/packages/web/src/locales/en.json
index 22afbb8e..381839d1 100644
--- a/packages/web/src/locales/en.json
+++ b/packages/web/src/locales/en.json
@@ -113,5 +113,10 @@
"signupForm.confirmPasswordFieldLabel": "Confirm password",
"signupForm.submit": "Sign up",
"signupForm.passwordMustMatch": "Passwords must match.",
- "signupForm.mandatoryInput": "{inputName} is required."
-}
+ "signupForm.mandatoryInput": "{inputName} is required.",
+ "loginForm.title": "Login",
+ "forgotPassword.title": "Forgot password",
+ "forgotPassword.submit": "Send reset instructions",
+ "forgotPassword.instructionsSent": "The instructions have been sent!",
+ "forgotPassword.emailFieldLabel": "Email"
+}
\ No newline at end of file
diff --git a/packages/web/src/pages/ForgotPassword/index.ee.tsx b/packages/web/src/pages/ForgotPassword/index.ee.tsx
new file mode 100644
index 00000000..42e7093c
--- /dev/null
+++ b/packages/web/src/pages/ForgotPassword/index.ee.tsx
@@ -0,0 +1,14 @@
+import * as React from 'react';
+import Box from '@mui/material/Box';
+import Container from 'components/Container';
+import ForgotPasswordForm from 'components/ForgotPasswordForm/index.ee';
+
+export default function Login(): React.ReactElement {
+ return (
+
+
+
+
+
+ );
+}
diff --git a/packages/web/src/routes.tsx b/packages/web/src/routes.tsx
index 5120663c..2147cd95 100644
--- a/packages/web/src/routes.tsx
+++ b/packages/web/src/routes.tsx
@@ -9,6 +9,7 @@ import Flows from 'pages/Flows';
import Flow from 'pages/Flow';
import Login from 'pages/Login';
import SignUp from 'pages/SignUp/index.ee';
+import ForgotPassword from 'pages/ForgotPassword/index.ee';
import EditorRoutes from 'pages/Editor/routes';
import * as URLS from 'config/urls';
import settingsRoutes from './settingsRoutes';
@@ -90,6 +91,15 @@ export default (
}
/>
+
+
+
+ }
+ />
+