Provide a ordered pretty print for formEditor.getSchema

[pinussilvestrus]

Is your feature request related to a problem? Please describe.

As a user of our form editor, I might want to edit the form JSON manually, e.g. via my favorite IDE. In that case, it's hard for me to browse the schema as a form field properties are randomly ordered and don't follow the structure of the properties panel.

Example: The general properties like label, description and key comes first in the user interface, but sometimes last in the respective schema. This makes it harder to visually scan for a specific form field in the schema, where I'd rather look for a label instead of the values. This becomes even more important as forms tend to become more complex these days.

{
  "values": [
    {
      "label": "German",
      "value": "german"
    },
    {
      "label": "English",
      "value": "english"
    }
  ],
  "id": "Select_1",
  "key": "language",
  "label": "Language",
  "type": "select"
}

Describe the solution you'd like

Provide an option to export the schema by an ordered pretty print that follows the order of the properties panel.

We could consider making this the default behavior on export.

Describe alternatives you've considered

Decide that raw JSON editing is not a supported use case and do nothing.

Additional context

Cf. this slack thread from @falko.

[Skaiir]

So, we can't really do this easily without defining the order that we want. And the order is currently programmatically defined in a way which is a bit challenging to extract.

I'm not against raw editing, after all that's not a concern of form-js, but rather whatever's implementing it. So I think the way to go would be to restructure our properties panel entries into a more flexible and descriptive format. Something like defining the entries in a structured array, and then building it up from the array (as opposed to what we currently do where we call a bunch of constructor functions, which doesn't really help us). Then we can have a utility which makes use of the structured away to build up the ordered printed schema, and finally offer an API to get said printed schema.

This does get a little more complicated when nesting is involved, but still programmatically shouldn't be a huge task. Anyways because this is going to create a ton of conflicts (and is low prio), let's leave this one to after a release, probably not the next :).