diff --git a/src/Components/API/API.tsx b/src/Components/API/API.tsx index 6f99637..d00ab31 100644 --- a/src/Components/API/API.tsx +++ b/src/Components/API/API.tsx @@ -5,6 +5,7 @@ import { ActivationType, LoginType, RegisterType } from "../Types/Types"; const instance = axios.create({ baseURL: "http://localhost:8000/", }); + // Token Handling export async function getAccessToken() { const accessToken = await localStorage.getItem("access_token"); @@ -36,6 +37,25 @@ export async function GetConfig() { }; } +export function ParseError(error: { response: { data: string } }) { + if (error.response && error.response.data) { + if (error.response.data.length > 50) { + return "Error truncated (too long)"; + } + return JSON.stringify(error.response.data) + .replace(/[{}]/g, " ") + .replace(/\(/g, " ") + .replace(/\)/g, " ") + .replace(/"/g, " ") + .replace(/,/g, " ") + .replace(/\[/g, "") + .replace(/\]/g, "") + .replace(/\./g, "") + .replace(/non_field_errors/g, "") + .trim(); + } + return "Unable to reach server"; +} // User APIs export function RegisterAPI(register: RegisterType) { @@ -47,7 +67,7 @@ export function RegisterAPI(register: RegisterType) { }) .catch((error) => { console.log("Registration failed"); - return [false, error.response]; + return [false, ParseError(error)]; }); } diff --git a/src/Components/RegisterModal/RegisterModal.tsx b/src/Components/RegisterModal/RegisterModal.tsx index fad4327..ca75021 100644 --- a/src/Components/RegisterModal/RegisterModal.tsx +++ b/src/Components/RegisterModal/RegisterModal.tsx @@ -10,6 +10,7 @@ import { AppRegistration } from "@mui/icons-material"; import Button from "../Button/Button"; import { useNavigate } from "react-router-dom"; import { RegisterAPI } from "../API/API"; +import { toast } from "react-toastify"; export default function RegisterModal() { const navigate = useNavigate(); const [showPassword, setShowPassword] = useState(false); @@ -63,6 +64,16 @@ export default function RegisterModal() { value={user.last_name} placeholder={"Enter your last name"} /> + ) => + setUser({ ...user, email: e.target.value }) + } + value={user.email} + placeholder={"Enter your email"} + /> { + navigate(0); + }, 3000); + setUser({ + first_name: "", + last_name: "", + username: "", + email: "", + password: "", + confirm_password: "", + }); } else { - setError(status[1]); + setError(JSON.stringify(status[1])); } } }}