Allow extra fields via props

[RamonGebben]

It would be great if we would be able to specify the fields we want to submit, not only email. Think fields like name, company etc.

[michalica]

is there possibility of adding extra field?

[revolunet]

Looks like it is possible on the mailchimp side so do you have an API in mind ?

As is, the component only provide the email.

One could provide an array of fields as props ?

const fields = [{
  name:"email",
  type:"text",
  placeholder:"Your email"
},{
  name:"company",
  type:"text",
  placeholder:"Company"
}]

this wont handle validation and more complex scenarios though

[RamonGebben]

@revolunet one could also provide a validation function which should return a Boolean on each field and maybe an error string for when validation fails.

What kind of complex scenarios are you expecting to cause problems?

[revolunet]

say require phone 1 OR phone2 :) or graphic customisation

maybe we should only do something like this :

<MailchimpSubscribe
  url={url}
  render={({ subscribe, status, message }) => (
    <div>
      <SimpleForm onValidated={formData => subscribe(formData)} />
      {status === "sending" && <div style={{ color: "blue" }}>sending...</div>}
      {status === "error" && <div style={{ color: "red" }}>{message}</div>}
      {status === "success" && <div style={{ color: "green" }}>Subscribed !</div>}
    </div>
  )}
/>

So all the form logic and presentation is userland (the SimpleForm) and we only provide the mailchimp POST

basic form

// a basic form
const SimpleForm = ({ onValidated }) => {
  let input;
  const submit = () =>
    input &&
    input.value.indexOf("@") > -1 &&
    onValidated({
      email: input.value
    });

  return (
    <div>
      <input ref={node => (input = node)} type="email" placeholder="Your email" />
      <br />
      <button onClick={submit}>Submit</button>
    </div>
  );
};

[revolunet]

Published a 2.0.0 with a render prop implementation, tell me what you think :)