const ContactInputs = ({ error }: any) => {
  return (
    <>
      <div className="input-block">
        <input
          type="text"
          id="firstName"
          name="firstName"
          placeholder="First Name"
          required
        />
        {error?.firstName ? (
          <p className="field-error">{error.firstName}</p>
        ) : (
          ""
        )}
      </div>
      <div className="input-block">
        <input
          type="text"
          id="lastName"
          name="lastName"
          placeholder="Last Name"
        />
        {error?.lastName ? <p className="field-error">{error.lastName}</p> : ""}
      </div>
      <div className="input-block">
        <input
          type="numeric"
          id="phone"
          name="phone"
          placeholder="Phone"
          required
        />
        {error?.phone ? <p className="field-error">{error.phone}</p> : ""}
      </div>
      <div className="input-block">
        <input
          type="email"
          id="email"
          name="email"
          placeholder="Email"
          required
        />
        {error?.email ? <p className="field-error">{error.email}</p> : ""}
      </div>
      <div className="input-block textarea col-span-1 lg:col-span-2">
        <textarea
          id="description"
          name="description"
          placeholder="Send us a couple lines about your event"
        ></textarea>
        {error?.description ? (
          <p className="field-error">{error.description}</p>
        ) : (
          ""
        )}
      </div>
    </>
  );
};

export default ContactInputs;