Append formdata to form data

form_data_builder.js

// <form id="form">
//   <input type="text" value="John Snow" name="first_name" />
//   <input type="file" name="image" />
// </form>
// const formElement = document.getElementById("form")
// const formData = new FormData(formElement);
// const builder = new FormDataBuilder();

// builder.append("values", formData);
// builder.data.get("values[first_name]"); == "John Snow" #=> "true"
// builder.data.get("values[file]"); #=> "File"

class FormDataBuilder {
  constructor(data) {
    this.data = new FormData();
  }

  append(key, value) {
    switch (value.constructor.name) {
      case "FormData":
        this.append(key, Object.fromEntries(value));
        break;
      case "HTMLFormElement":
        this.append(key, $(data).serializeObject());
        break;
      case "Object":
      case "Array":
        _.each(value, (item, indexOrKey) => {
          this.append(`${key}[${indexOrKey}]`, item);
        });
        break;
      default:
        this.data.append(key, value);
    }

    return this;
  }
}