import FieldLabel from "@/components/contactUs/FieldLabel";
import Field from "@/app/component/fields/Field";

function Content({ setData, data }) {
  const handleChange = (name, value) =>
    name === "phone" || name === "address"
      ? setData((prev) => ({
          ...prev,
          contact: {
            ...prev.contact,
            [name]: value,
          },
        }))
      : setData((prev) => ({
          ...prev,
          [name]: value,
        }));

  return (
    <div className="mt-[32px] md:mt-[36px] lg:mt-[40px] flex flex-col gap-[24px] md:gap-[28px] lg:gap-[32px] px-0 sm:px-[52px]">
      <FieldLabel title="نام">
        <Field
          title=""
          type="text"
          name="name"
          isPlaceHolder={true}
          value={data?.name}
          handleChange={handleChange}
        />
      </FieldLabel>
      <FieldLabel title="نسبت">
        <Field
          title=""
          type="text"
          name="relation"
          isPlaceHolder={true}
          value={data?.relation}
          handleChange={handleChange}
        />
      </FieldLabel>
      <FieldLabel title="شماره تماس">
        <Field
          title=""
          type="number"
          name="phone"
          isPlaceHolder={true}
          value={Number(data?.contact?.phone.replace(/^\+/, ""))}
          handleChange={handleChange}
        />
      </FieldLabel>
      <FieldLabel title="آدرس">
        <Field
          title=""
          type="text"
          name="address"
          isPlaceHolder={true}
          value={data?.contact?.address}
          handleChange={handleChange}
        />
      </FieldLabel>
    </div>
  );
}

export default Content;