Usability for cases with a lot of nested data

[christianruhstaller]

Nice plugin!

We run into a usability issue when there is a load of nested data where it's really hard to navigate the fields and know where you are.

For our case the base data structure is like:

{
 ivr: {
  f: { // gender female
   18: {
    standard: 23.00,
    premium: 25.00
   },
           19: {},
           20: {},
           …
  },
  m: { // gender male
   …
  },
 },
 tfk: {…},
 wair: {…},
}

For each ivr, tfk and wair there are two genders and below that each entry corresponds to an age and range from 18 to 60. So quite a lot of data.

The problem is because there are so many entries you do not see on which branch you are and it's quite hard to edit those entries and knowing if you are in the correct branch:

Improvement-1: Collapsible children

One possible solution which could help, that you cold collapse the children so that you can drill in and know on which branch you are. Similar like code folding works:

Improvment-2: Fixed labels

Another possible solution would be to always have the property name visible at the specific position:

Final statement

Of course these are just ideas and need to validated if they work as intended and maybe there is even another better solution.

I'd like to know what you think of that? Do you even want to support such large structures with this plugin?

[chasegiunta]

Hey there,

I appreciate the well-written issue. I understand the problem and agree with the potential solutions (if viable).

I'll play around with these ideas and see what I can come up with. I might, depending on the work taken, end up putting this under a small paid tier for the plug-in so I can justify putting more features like this in and continue improving upon it.