import { useEffect, FormEventHandler, useState } from 'react'; import { Head, Link, useForm } from '@inertiajs/react'; import GuestLayout from '@/Layouts/GuestLayout'; import ProjectBanner from '@/Components/ProjectBanner'; import FormGroup from '@/Components/FormGroup'; import InputError from '@/Components/InputError'; import InputLabel from '@/Components/InputLabel'; import TextInput from '@/Components/TextInput'; import PrimaryButton from '@/Components/PrimaryButton'; import { Grid, User, Mail, AtSign, Lock, Eye, EyeOff, LogIn, Unlock, CheckCircle, XOctagon } from 'react-feather'; import axios from 'axios'; import Modal from '@/Components/Modal'; import ModalButton from '@/Components/ModalButton'; export default function Register() { const { data, setData, post, processing, errors, reset } = useForm({ emp_id: '', name: '', email: '', username: '', password: '', password_confirmation: '', role_id: '' }); useEffect(() => { return () => { reset('password', 'password_confirmation'); }; }, []); const [showPassword, setShowPassword] = useState(false); const toggleShowPassword = () => { setShowPassword((prevShowPassword) => !prevShowPassword); }; const [status, setStatus] = useState(''); const [feedback, setFeedback] = useState(''); const [isSuccessModalOpen, setIsSuccessModalOpen] = useState(false); const [isErrorModalOpen, setIsErrorModalOpen] = useState(false); const handleCloseSuccessModal = () => { setIsSuccessModalOpen(false); window.location.href = '/login'; }; const submit: FormEventHandler = async (e) => { e.preventDefault(); try { const response = await axios.post(route('register'), data); setStatus('Success') setFeedback(response.data.message); setIsSuccessModalOpen(true); } catch (error) { setStatus('Error') if (axios.isAxiosError(error)) { setFeedback(error.response?.data.message || 'An error occurred'); } else { setFeedback('An unexpected error occurred'); } setIsErrorModalOpen(true); } }; return (
An image that represents a sign up form from StorySet
setData('emp_id', e.target.value)} /> setData('name', e.target.value)} /> setData('email', e.target.value)} /> setData('username', e.target.value)} /> setData('password', e.target.value)} className='border-r-0' /> setData('password_confirmation', e.target.value)} />
Already registered? Login instead. Sign Up
setIsSuccessModalOpen(false)} maxWidth="lg" styling='success'>

{ status }

{ feedback }

Login Now
setIsErrorModalOpen(false)} maxWidth="lg" styling='error'>

{ status }

{ feedback }

setIsErrorModalOpen(false)} className="bg-error-main text-white hover:bg-error-hover active:bg-error-pressed"> Close
); }