Merge pull request #1973 from automatisch/AUT-1109

feat: refactor reset password mutation with the REST API endpoint

packages/backend/src/graphql/mutation-resolvers.js

@@ -32,7 +32,6 @@ import verifyConnection from './mutations/verify-connection.js';
 // Converted mutations
 import deleteUser from './mutations/delete-user.ee.js';
 import login from './mutations/login.js';
-import resetPassword from './mutations/reset-password.ee.js';
 
 const mutationResolvers = {
   createAppAuthClient,
@@ -54,7 +53,6 @@ const mutationResolvers = {
   login,
   registerUser,
   resetConnection,
-  resetPassword,
   updateAppAuthClient,
   updateAppConfig,
   updateConfig,

packages/backend/src/graphql/mutations/reset-password.ee.js

@@ -1,23 +0,0 @@
-import User from '../../models/user.js';
-
-const resetPassword = async (_parent, params) => {
-  const { token, password } = params.input;
-
-  if (!token) {
-    throw new Error('Reset password token is required!');
-  }
-
-  const user = await User.query().findOne({ reset_password_token: token });
-
-  if (!user || !user.isResetPasswordTokenValid()) {
-    throw new Error(
-      'Reset password link is not valid or expired. Try generating a new link.'
-    );
-  }
-
-  await user.resetPassword(password);
-
-  return true;
-};
-
-export default resetPassword;

packages/backend/src/graphql/schema.graphql

@@ -21,7 +21,6 @@ type Mutation {
   login(input: LoginInput): Auth
   registerUser(input: RegisterUserInput): User
   resetConnection(input: ResetConnectionInput): Connection
-  resetPassword(input: ResetPasswordInput): Boolean
   updateAppAuthClient(input: UpdateAppAuthClientInput): AppAuthClient
   updateAppConfig(input: UpdateAppConfigInput): AppConfig
   updateConfig(input: JSONObject): JSONObject
@@ -404,11 +403,6 @@ input UpdateCurrentUserInput {
   fullName: String
 }
 
-input ResetPasswordInput {
-  token: String!
-  password: String!
-}
-
 input LoginInput {
   email: String!
   password: String!

packages/backend/src/helpers/authentication.js

@@ -55,7 +55,6 @@ export const authenticationRules = {
     '*': isAuthenticatedRule,
     login: allow,
     registerUser: allow,
-    resetPassword: allow,
   },
 };
 

packages/web/src/components/ResetPasswordForm/index.ee.jsx

@@ -1,4 +1,3 @@
-import { useMutation } from '@apollo/client';
 import { yupResolver } from '@hookform/resolvers/yup';
 import LoadingButton from '@mui/lab/LoadingButton';
 import Paper from '@mui/material/Paper';
@@ -7,11 +6,12 @@ import useEnqueueSnackbar from 'hooks/useEnqueueSnackbar';
 import * as React from 'react';
 import { useNavigate, useSearchParams } from 'react-router-dom';
 import * as yup from 'yup';
+
 import Form from 'components/Form';
 import TextField from 'components/TextField';
 import * as URLS from 'config/urls';
-import { RESET_PASSWORD } from 'graphql/mutations/reset-password.ee';
 import useFormatMessage from 'hooks/useFormatMessage';
+import useResetPassword from 'hooks/useResetPassword';
 
 const validationSchema = yup.object().shape({
   password: yup.string().required('resetPasswordForm.mandatoryInput'),
@@ -26,25 +26,35 @@ export default function ResetPasswordForm() {
   const formatMessage = useFormatMessage();
   const navigate = useNavigate();
   const [searchParams] = useSearchParams();
-  const [resetPassword, { data, loading }] = useMutation(RESET_PASSWORD);
+  const {
+    mutateAsync: resetPassword,
+    isPending,
+    isSuccess,
+  } = useResetPassword();
   const token = searchParams.get('token');
 
   const handleSubmit = async (values) => {
-    await resetPassword({
+    const { password } = values;
-      variables: {
+    try {
-        input: {
+      await resetPassword({
-          password: values.password,
+        password,
-          token,
+        token,
+      });
+      enqueueSnackbar(formatMessage('resetPasswordForm.passwordUpdated'), {
+        variant: 'success',
+        SnackbarProps: {
+          'data-test': 'snackbar-reset-password-success',
         },
-      },
+      });
-    });
+      navigate(URLS.LOGIN);
-    enqueueSnackbar(formatMessage('resetPasswordForm.passwordUpdated'), {
+    } catch (error) {
-      variant: 'success',
+      enqueueSnackbar(
-      SnackbarProps: {
+        error?.message || formatMessage('resetPasswordForm.error'),
-        'data-test': 'snackbar-reset-password-success',
+        {
-      },
+          variant: 'error',
-    });
+        },
-    navigate(URLS.LOGIN);
+      );
+    }
   };
 
   return (
@@ -113,8 +123,8 @@ export default function ResetPasswordForm() {
               variant="contained"
               color="primary"
               sx={{ boxShadow: 2, my: 3 }}
-              loading={loading}
+              loading={isPending}
-              disabled={data || !token}
+              disabled={isSuccess || !token}
               fullWidth
             >
               {formatMessage('resetPasswordForm.submit')}

packages/web/src/graphql/mutations/reset-password.ee.js

@@ -1,6 +0,0 @@
-import { gql } from '@apollo/client';
-export const RESET_PASSWORD = gql`
-  mutation ResetPassword($input: ResetPasswordInput) {
-    resetPassword(input: $input)
-  }
-`;

packages/web/src/hooks/useResetPassword.js

@@ -0,0 +1,15 @@
+import { useMutation } from '@tanstack/react-query';
+
+import api from 'helpers/api';
+
+export default function useResetPassword() {
+  const mutation = useMutation({
+    mutationFn: async (payload) => {
+      const { data } = await api.post('/v1/users/reset-password', payload);
+
+      return data;
+    },
+  });
+
+  return mutation;
+}

packages/web/src/locales/en.json

@@ -165,6 +165,7 @@
   "resetPasswordForm.passwordFieldLabel": "Password",
   "resetPasswordForm.confirmPasswordFieldLabel": "Confirm password",
   "resetPasswordForm.passwordUpdated": "The password has been updated. Now, you can login.",
+  "resetPasswordForm.error": "Something went wrong. Please try again.",
   "acceptInvitationForm.passwordsMustMatch": "Passwords must match.",
   "acceptInvitationForm.mandatoryInput": "{inputName} is required.",
   "acceptInvitationForm.title": "Accept invitation",