43 lines
1.5 KiB
TypeScript
43 lines
1.5 KiB
TypeScript
import DangerMessage from "@/components/message/DangerMessage";
|
|
import SuccessMessage from "@/components/message/SuccessMessage";
|
|
import { useConfirm } from "@/hooks/AuthHooks";
|
|
import { useTimedModal } from "@/providers/TimedModalProvider";
|
|
import { useEffect } from "react";
|
|
import { useNavigate, useParams } from "react-router";
|
|
|
|
|
|
export default function ConfirmPage(){
|
|
const { confirmToken } = useParams();
|
|
const navigate = useNavigate();
|
|
const { addErrorMessage, addSuccessMessage } = useTimedModal();
|
|
|
|
|
|
const { mutate: confirmQueryMutate, status: confirmQueryStatus, error: confirmQueryError, reset: confirmQueryReset } = useConfirm();
|
|
|
|
useEffect(() => {
|
|
if(confirmQueryStatus === "idle"){
|
|
confirmQueryMutate(confirmToken ?? "");
|
|
}
|
|
else if(confirmQueryStatus === "error"){
|
|
addErrorMessage(confirmQueryError.message);
|
|
confirmQueryReset();
|
|
}
|
|
else if(confirmQueryStatus === "success"){
|
|
addSuccessMessage("Email confirmed. Please Login.");
|
|
confirmQueryReset();
|
|
navigate("/login");
|
|
}
|
|
}, [ confirmToken, confirmQueryMutate, confirmQueryStatus, confirmQueryError, confirmQueryReset, navigate, addSuccessMessage, addErrorMessage ]);
|
|
|
|
|
|
if(confirmQueryStatus === "pending"){
|
|
return <main>Confirming...</main>;
|
|
}
|
|
else if(confirmQueryStatus === "error"){
|
|
return <main><DangerMessage>Error: {confirmQueryError.message}</DangerMessage></main>;
|
|
}
|
|
else if(confirmQueryStatus === "success"){
|
|
return <main><SuccessMessage>Confirmed</SuccessMessage></main>;
|
|
}
|
|
}
|