form error, 'password is required' response from the backend - reactjs

Question

this is my scheduleForm component
import { LoginOrSchedule } from 'context/isLoginOrIsSquedule/Context';
import React, { useContext, useState } from 'react';
import * as Styled from './styles';
export type ScheduleFormProps = {
errorMessage?: string;
onScheduleSend?: (
name: string,
email: string,
password: string,
age: number,
) => void;
};
export const ScheduleForm = ({
errorMessage,
onScheduleSend,
}: ScheduleFormProps) => {
const [loading, setLoading] = useState(false);
const [form, setForm] = useState({
name: '',
email: '',
password: '',
confirmPass: '',
age: 0,
});
const { dispatch } = useContext(LoginOrSchedule);
const handleSubmitForm = async (e: React.FormEvent) => {
e.preventDefault();
const { age, confirmPass, email, name, password } = form;
if (!age || !confirmPass || !email || !name || !password) {
alert('Um ou mais campos estão em branco');
return;
}
if (confirmPass !== password) {
alert('As senhas não batem');
return;
}
setLoading(true);
if (onScheduleSend) {
await onScheduleSend(name, email, password, age); //<<<sending to backend
}
setLoading(false);
setForm({
name: '',
email: '',
password: '',
confirmPass: '',
age: 0,
});
};
const handleLogin = () => {
dispatch({ type: 'TRIGGER' });
};
return (
<Styled.Wrapper>
<h2>Amostra de formulário de Cadastro</h2>
<Styled.Form onSubmit={handleSubmitForm}>
{!!errorMessage && (
<Styled.ErrorMessage>{errorMessage}</Styled.ErrorMessage>
)}
<Styled.InputWrapper>
<Styled.InputText
id="user-name"
type="text"
name="user-name"
onChange={(e) => {
setForm((f) => {
return { ...f, name: e.target.value };
});
}}
value={form.name}
/>
<Styled.InputLabel htmlFor="user-name">Nome</Styled.InputLabel>
</Styled.InputWrapper>
<Styled.InputWrapper>
<Styled.InputText
id="user-email"
type="email"
name="user-email"
onChange={(e) => {
setForm((f) => {
return { ...f, email: e.target.value };
});
}}
value={form.email}
/>
<Styled.InputLabel htmlFor="user-email">Email</Styled.InputLabel>
</Styled.InputWrapper>
<Styled.InputWrapper>
<Styled.InputText
id="user-age"
type="number"
name="user-age"
onChange={(e) => {
setForm((f) => {
return { ...f, age: Number(e.target.value) };
});
}}
value={form.age === 0 ? '' : form.age}
/>
<Styled.InputLabel htmlFor="user-age">Idade</Styled.InputLabel>
</Styled.InputWrapper>
<Styled.InputWrapper>
<Styled.InputText
id="user-pássword"
type="password"
name="user-password"
onChange={(e) => {
setForm((f) => {
return { ...f, password: e.target.value };
});
}}
value={form.password}
/>
<Styled.InputLabel htmlFor="user-password">Senha</Styled.InputLabel>
</Styled.InputWrapper>
<Styled.InputWrapper>
<Styled.InputText
id="user-confirmPass"
type="password"
name="user-confirmPass"
onChange={(e) => {
setForm((f) => {
return { ...f, confirmPass: e.target.value };
});
}}
value={form.confirmPass}
/>
<Styled.InputLabel htmlFor="user-confirmPass">
Confirme sua senha
</Styled.InputLabel>
</Styled.InputWrapper>
<Styled.newUser onClick={handleLogin}>
Já tem cadastro?? faça o login agora!
</Styled.newUser>
<Styled.SubmitButton
type="submit"
value={loading ? 'Cadastrando...' : 'Cadastrar'}
disabled={loading}
/>
</Styled.Form>
</Styled.Wrapper>
);
};
and this was my function who call back-end
const handleSchedule = async (
name: string,
email: string,
password: string,
age: number,
) => {
const scheduleResponse = await fetch(
`${process.env.NEXT_PUBLIC_API_URL}${process.env.NEXT_PUBLIC_API_REGISTER}`,
{
method: 'POST',
headers: {
'Content-Type': 'text/plain',
},
body: JSON.stringify({ name, email, password, age }),
},
);
if (!scheduleResponse.ok) {
const getError = await scheduleResponse.text();
getError.includes('E11000')
? setErrorSchedule('Email já cadastrado')
: setErrorSchedule(getError);
setTimeout(() => {
setErrorSchedule('');
}, 5000);
return;
}
dispatch({ type: 'TRIGGER' });
alert('Cadastrado com sucesso.Por favor, faça o login');
};
but it return to me "password is a required field".
to see if its an back-end error, i create a playground file who do a fetch to the api with the values, and it return a 200
const email = 'emailtest#gmail.com'
const password = 'testpass123'
const age =19
const name= 'testename'
fetch('register',{method:'POST',
headers: {
'Content-Type': 'application/json'
},
body:JSON.stringify({email,password,age,name})
}).then(res=>res.text()).then(text=> console.log(text))
it just happen on the production mode, on localhost work as expect.
someone know what are happening here?