Closed
Description
I would like to improve the UI/UX of the form debugger in various aspects. For reference, here is the current UI:
The following features should be added:
- The form tree on the left should be collapsible using Javascript. By default, only the first level of forms should be visible, i.e. "form", "title", "publishAt", "category", "author", "submit" and "_token". The lower layers should be collapsed by default. Ideally, the browser should remember which layers were collapsed and which not.
- The headers "Default Data", "Submitted Data", "Passed Options", "Resolved Options" and "View Variables" should be collapsible. By default, "Resolved Options" and "View Variables" should be collapsed. Again, the browser should remember which headers were expanded and collapsed even when switching the form node in the tree to the left or when reloading the page.
- The form tree to the left should mark erroneous fields with a small red badge showing the number of errors (similar to the green badge next to "FORMS" in the main menu. The "Errors" section to the right (not visible in the screenshot) should then be highlighted in some way (e.g. red frame and background, not sure..)
That's all I can think of for now. :)