AmirReza Jamali
73 lines
1.8 KiB
TypeScript
73 lines
1.8 KiB
TypeScript
"use client";
|
|
import api from "@/service/api";
|
|
import { useForm } from "react-hook-form";
|
|
import { toast } from "react-toastify";
|
|
import InputGroup from "../_components/InputGroup";
|
|
type TContactUsForm = {
|
|
full_name: string;
|
|
company_name: string;
|
|
work_email: string;
|
|
phone_number: string;
|
|
};
|
|
const ContactUsForm = () => {
|
|
const {
|
|
register,
|
|
handleSubmit,
|
|
formState: { errors },
|
|
} = useForm<TContactUsForm>();
|
|
const onSubmit = async (data: TContactUsForm) => {
|
|
try {
|
|
const response = (await api.post("inquiries", { ...data })).data;
|
|
toast.success(response.message);
|
|
} catch (error) {
|
|
console.log(error);
|
|
toast.error("Something went wrong");
|
|
throw error;
|
|
}
|
|
};
|
|
return (
|
|
<form
|
|
className="w-full px-4 md:px-16 py-10 grid md:grid-cols-2 gap-4 "
|
|
onSubmit={handleSubmit(onSubmit)}>
|
|
<InputGroup
|
|
id="full_name"
|
|
label="Full Name"
|
|
register={register}
|
|
type="text"
|
|
/>
|
|
<InputGroup
|
|
id="company_name"
|
|
label="Company Name"
|
|
register={register}
|
|
type="text"
|
|
/>
|
|
<InputGroup
|
|
id="work_email"
|
|
label="Work Email"
|
|
register={register}
|
|
type="email"
|
|
/>
|
|
<InputGroup
|
|
id="phone_number"
|
|
label="Phone Number"
|
|
register={register}
|
|
type="text"
|
|
error={errors.phone_number?.message}
|
|
validation={{
|
|
pattern: {
|
|
value: /^[+\d]+$/,
|
|
message: "Please enter a valid phone number",
|
|
},
|
|
}}
|
|
/>
|
|
<div className="md:col-span-2 flex justify-end">
|
|
<button className="bg-(--primary) w-fit text-white rounded-full py-4 px-6">
|
|
Register Now
|
|
</button>
|
|
</div>
|
|
</form>
|
|
);
|
|
};
|
|
|
|
export default ContactUsForm;
|