import React, { useState } from 'react';
import { useNavigate } from 'react-router-dom';
import { useDispatch } from 'react-redux';
import {
Alert,
Button,
Paper,
Snackbar,
TextField,
Typography,
} from '@mui/material';
import { useForm } from 'react-hook-form';
import { setGuest } from '../slices/auth/guestSlice';
import { useLoginGuestMutation } from '../slices/api/guestSlice';
import type { Name, StatusProps } from '../models';
import { isFetchBaseQueryError } from '../error';
import type { Data } from '../error';
const Status = ({ error, setOpen }: StatusProps) => {
return isFetchBaseQueryError(error) ? (
setOpen(false)}>
{(error.data as Data).message}
) : (
setOpen(false)}>
Guest login failed
);
};
function GuestLogin() {
const dispatch = useDispatch();
const navigate = useNavigate();
const [login, { isLoading, error }] = useLoginGuestMutation();
const [open, setOpen] = useState(false);
const {
register,
handleSubmit,
formState: { errors },
} = useForm({
defaultValues: {
firstName: '',
lastName: '',
},
});
const onSubmit = async (data: Name) => {
try {
dispatch(setGuest(await login(data).unwrap()));
navigate('/rsvp');
} catch (e) {
setOpen(true);
}
};
return (
);
}
export default GuestLogin;