62 lines
2.3 KiB
JavaScript
62 lines
2.3 KiB
JavaScript
import { useState } from "react"
|
|
import { useDispatch } from "react-redux"
|
|
import InputText from '@/Components/Input/InputText'
|
|
import ErrorText from '@/Components/Typography/ErrorText'
|
|
import { showNotification } from '@/Components/features/common/headerSlice'
|
|
import { addNewLead } from "../leadSlice"
|
|
|
|
const INITIAL_LEAD_OBJ = {
|
|
first_name: "",
|
|
last_name: "",
|
|
email: ""
|
|
}
|
|
|
|
function AddLeadModalBody({ closeModal }) {
|
|
const dispatch = useDispatch()
|
|
const [loading, setLoading] = useState(false)
|
|
const [errorMessage, setErrorMessage] = useState("")
|
|
const [leadObj, setLeadObj] = useState(INITIAL_LEAD_OBJ)
|
|
|
|
|
|
const saveNewLead = () => {
|
|
if (leadObj.first_name.trim() === "") return setErrorMessage("First Name is required!")
|
|
else if (leadObj.email.trim() === "") return setErrorMessage("Email id is required!")
|
|
else {
|
|
let newLeadObj = {
|
|
"id": 7,
|
|
"email": leadObj.email,
|
|
"first_name": leadObj.first_name,
|
|
"last_name": leadObj.last_name,
|
|
"avatar": "https://reqres.in/img/faces/1-image.jpg"
|
|
}
|
|
dispatch(addNewLead({ newLeadObj }))
|
|
dispatch(showNotification({ message: "New Lead Added!", status: 1 }))
|
|
closeModal()
|
|
}
|
|
}
|
|
|
|
const updateFormValue = ({ updateType, value }) => {
|
|
setErrorMessage("")
|
|
setLeadObj({ ...leadObj, [updateType]: value })
|
|
}
|
|
|
|
return (
|
|
<>
|
|
|
|
<InputText type="text" defaultValue={leadObj.first_name} updateType="first_name" containerStyle="mt-4" labelTitle="First Name" updateFormValue={updateFormValue} />
|
|
|
|
<InputText type="text" defaultValue={leadObj.last_name} updateType="last_name" containerStyle="mt-4" labelTitle="Last Name" updateFormValue={updateFormValue} />
|
|
|
|
<InputText type="email" defaultValue={leadObj.email} updateType="email" containerStyle="mt-4" labelTitle="Email Id" updateFormValue={updateFormValue} />
|
|
|
|
|
|
<ErrorText styleClass="mt-16">{errorMessage}</ErrorText>
|
|
<div className="modal-action">
|
|
<button className="btn btn-ghost" onClick={() => closeModal()}>Cancel</button>
|
|
<button className="btn btn-primary px-6" onClick={() => saveNewLead()}>Save</button>
|
|
</div>
|
|
</>
|
|
)
|
|
}
|
|
|
|
export default AddLeadModalBody |