Unify the Edit API and Add API forms

[bajiat]

There should be no need to maintain two separate instances of the API configuration form. Additionally, this can cause misalignment, if one of the forms gets updated. The forms should be unified with minimal conditional logic to change the form according to current form method (adding or editing).

Definition of done

• List the differences between the two forms.
• Choose one for the forms and rename it to API configuration form.
• Add conditional logic to update form depending on context: adding or editing API.
  • UI text, e.g. title, button.
  • Form action or method, e.g. insert or update.

[55]

Interested in this task.

[bajiat]

@elnzv What is the status of the task?

[55]

Forms are unified now.
Need to change UI text, button text, title according to form type.
Hours updated.

Working branch:
https://github.com/apinf/api-umbrella-dashboard/tree/feature/unify-api-forms

[55]

@apinf/developers need help here.
I have changed the way how we define router and now can't add new API.

Here is how I define route

Router.route("/api/:_id/edit", function () {
  this.render("apiBackendForm", {
    data: function () {
      var apiBackend = ApiBackends.findOne({_id: this.params._id});
      return { apiBackend: apiBackend }
    },
    waitOn: function() {
      return this.subscribe('apiBackend', this.params._id);
    }
  });
  this.layout("masterLayout");
}, {
  name: "editApiBackend"
});

[brylie]

This is the Edit API route. What does the Add API route look like?

On 25 November 2015 10:45:54 EET, illya nizyev notifications@github.com wrote:

@apinf/developers need help here.
I have changed the way how we define router and now can't add new API.

Here is how I define route

Router.route("/api/:_id/edit", function () {
 this.render("apiBackendForm", {
   data: function () {
     var apiBackend = ApiBackends.findOne({_id: this.params._id});
     return { apiBackend: apiBackend }
   },
   waitOn: function() {
     return this.subscribe('apiBackend', this.params._id);
   }
 });
 this.layout("masterLayout");
}, {
 name: "editApiBackend"
});

---

Reply to this email directly or view it on GitHub:
https://github.com/apinf/api-umbrella-dashboard/issues/368#issuecomment-159536143

Sent from my Android device with K-9 Mail. Please excuse my brevity.

[55]

Router.route("/apibackends", function () {
  this.layout("masterLayout");
  this.render("apiBackendForm");
}, {
  name: "apiBackends"
});

[brylie]

I have tested your branch, and am able to create an API Backend. Is the problem with the edit form?

[brylie]

One bug I notice is that when editing, the redirect after edit goes to api/1, which is not an ID. However, changes made on the edit form are saved.

[brylie]

I have pushed some changes to your branch. The forms seem to be working now. Please verify.

[55]

@brylie, thanks for help!
Added helper to show relevant title for form. Creating PR.