twentyhq/twenty · warning · Error

Email and password are required

Error message

Email and password are required

What it means

Thrown by useSignInUp's submitCredentials callback (useSignInUp.ts:123-125) when the submitted form values do not include both an email and a password. This is a defensive guard at the top of the sign-in submit handler before captcha/auth logic runs. Because it is thrown inside a React callback, it surfaces as an uncaught promise rejection unless the form library (react-hook-form) captures it.

Source

Thrown at packages/twenty-front/src/modules/auth/sign-in-up/hooks/useSignInUp.ts:124

    } catch {
      enqueueErrorSnackBar({ message: errorMsgUserAlreadyExist });
    }
  }, [
    readCaptchaToken,
    form,
    isCaptchaReady,
    enqueueErrorSnackBar,
    t,
    checkUserExistsQuery,
    setSignInUpMode,
    setSignInUpStep,
    errorMsgUserAlreadyExist,
  ]);

  const submitCredentials: SubmitHandler<Form> = useCallback(
    async (data) => {
      if (!data.email || !data.password) {
        throw new Error('Email and password are required');
      }

      if (!isCaptchaReady) {
        return enqueueErrorSnackBar({
          message: t`Captcha (anti-bot check) is still loading, try again`,
        });
      }

      const token = readCaptchaToken();
      try {
        setLastAuthenticatedMethod(AuthenticatedMethod.EMAIL);

        if (
          !isInviteMode &&
          signInUpMode === SignInUpMode.SignIn &&
          isOnAWorkspace
        ) {
          return await signInWithCredentialsInWorkspace(

View on GitHub (pinned to 1f5dd2bbd2)

Solutions

  1. Keep `required: true` (or equivalent) on the email and password field validators in react-hook-form.
  2. If invoking submitCredentials manually, pre-check `data.email && data.password` before calling.
  3. Render disabled submit button until both fields are non-empty.
  4. Test the form with empty inputs to confirm validation blocks submission.

Example fix

// before
const { register, handleSubmit } = useForm<Form>();
<input {...register('email')} />
// after
<input {...register('email', { required: true })} />
<input {...register('password', { required: true })} />
Defensive patterns

Strategy: validation

Validate before calling

// In the component, ensure react-hook-form marks both fields required
const { register, handleSubmit } = useForm<Form>({
  defaultValues: { email: '', password: '' },
});
<input {...register('email', { required: true })} />
<input {...register('password', { required: true })} />

Type guard

const hasEmailAndPassword = (data: Partial<Form>): data is { email: string; password: string } =>
  typeof data.email === 'string' && data.email.length > 0 &&
  typeof data.password === 'string' && data.password.length > 0;

Prevention

When it happens

Trigger: The sign-in form is submitted with an empty email or password field. Normally react-hook-form's required validators prevent this, so reaching the throw indicates validation was bypassed or disabled.

Common situations: Custom UI that calls submitCredentials directly without going through react-hook-form validation; a validator removed or made optional; programmatic submit with partial data; race where the form resets before submit fires.

Related errors


AI-assisted analysis of twentyhq/twenty@1f5dd2bbd2 (2026-08-12). Data as JSON: /api/errors/dfa8fe81cff123bc. Report an issue: GitHub.