feat: basic email validation

This commit is contained in:
amhsirak
2025-07-12 01:29:54 +05:30
parent 7be3282629
commit 3bdea4970e

View File

@@ -9,9 +9,8 @@ import { useThemeMode } from "../context/theme-provider";
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import i18n from '../i18n'; import i18n from '../i18n';
const Register = () => { const Register = () => {
const {t} = useTranslation(); const { t } = useTranslation();
const [form, setForm] = useState({ const [form, setForm] = useState({
email: "", email: "",
password: "", password: "",
@@ -39,6 +38,20 @@ const Register = () => {
const submitForm = async (e: any) => { const submitForm = async (e: any) => {
e.preventDefault(); e.preventDefault();
// Basic "@" check (minimal)
if (!email.includes("@")) {
notify("error", t('register.error.invalid_email') || "Invalid email format");
return;
}
// Optional: Better regex-based email format check
// const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
// if (!emailRegex.test(email)) {
// notify("error", t('register.error.invalid_email') || "Invalid email format");
// return;
// }
setLoading(true); setLoading(true);
try { try {
const { data } = await axios.post(`${apiUrl}/auth/register`, { email, password }); const { data } = await axios.post(`${apiUrl}/auth/register`, { email, password });
@@ -46,12 +59,12 @@ const Register = () => {
notify("success", t('register.welcome_notification')); notify("success", t('register.welcome_notification'));
window.localStorage.setItem("user", JSON.stringify(data)); window.localStorage.setItem("user", JSON.stringify(data));
navigate("/"); navigate("/");
} catch (error:any) { } catch (error: any) {
const errorResponse = error.response?.data; const errorResponse = error.response?.data;
const errorMessage = errorResponse?.code const errorMessage = errorResponse?.code
? t(errorResponse.code) ? t(errorResponse.code)
: t('register.error.generic'); : t('register.error.generic');
notify("error", errorMessage); notify("error", errorMessage);
setLoading(false); setLoading(false);
@@ -68,7 +81,6 @@ const Register = () => {
mt: 6, mt: 6,
padding: 4, padding: 4,
backgroundColor: darkMode ? "#121212" : "#ffffff", backgroundColor: darkMode ? "#121212" : "#ffffff",
}} }}
> >
<Box <Box
@@ -80,7 +92,8 @@ const Register = () => {
color: darkMode ? "#ffffff" : "#333333", color: darkMode ? "#ffffff" : "#333333",
padding: 6, padding: 6,
borderRadius: 5, borderRadius: 5,
boxShadow: "0px 20px 40px rgba(0, 0, 0, 0.2), 0px -5px 10px rgba(0, 0, 0, 0.15)", boxShadow:
"0px 20px 40px rgba(0, 0, 0, 0.2), 0px -5px 10px rgba(0, 0, 0, 0.15)",
display: "flex", display: "flex",
flexDirection: "column", flexDirection: "column",
alignItems: "center", alignItems: "center",
@@ -143,9 +156,13 @@ const Register = () => {
t('register.button') t('register.button')
)} )}
</Button> </Button>
<Typography variant="body2" align="center" sx={{ color: darkMode ? "#ffffff" : "#333333" }}> <Typography
variant="body2"
align="center"
sx={{ color: darkMode ? "#ffffff" : "#333333" }}
>
{t('register.register_prompt')}{" "} {t('register.register_prompt')}{" "}
<Link to="/login" style={{ textDecoration: "none", color: "#ff33cc" }}> <Link to="/login" style={{ textDecoration: "none", color: "#ff33cc" }}>
{t('register.login_link')} {t('register.login_link')}
</Link> </Link>
</Typography> </Typography>
@@ -154,4 +171,4 @@ const Register = () => {
); );
}; };
export default Register; export default Register;