Dynamic attributes view redesign

[gorbunkov]

Edit attributes from the main dynamic attributes screen

Currently we already display dynamic attributes for the selected category

It seems that we can do the following:

1. Edit categories using the dialog window. No composition collection with attribute will be inside the category editor
2. Add buttons for CRUD operations for attributes right above the attributes list. This will avoid us to make an unnecessary click for diving into category editor when we want to do anything with attributes.

Redesign attribute details view

1. The attribute details view must be open using the navigation mode
2. We must rethink current tabs. Currently the Visiblity settings are always on a separate tab, although we need it for every attribute. The "Dropdown list" checkbox is on the first tab, but the script for loading options are defined on a separate tab, etc. Probably we may have a single tab with a vertical scroll. Or at least have tabs like General and Andvanced.

3. Add the "Add all known views" to the table with views where the attribute must be displayed 4

   

4. Auto-fill the category name

Currently, we first need to enter some category name and then select an entity. I suppose that for many entities there will be a single category only. Users may be confused what is a category name and what value to enter there. We can switch these two fields, so the user will first select an entity from the list and after selecting the entity the category name will be automatically generated, e.g. "User-category"

[KartnDev]

6. Required attribute UX improvement

   Also for better UX move required field to the right layout (place it before all checkboxes) From this poor layout Move to the right

[glebfox]

7. CategoryDetailView
   1. DataGrid should occupy all available height
   2. Detail buttons should be always visible, even if not enough height. See example in the ResourceRoleDetailView
   3. Required attribute and Type columns too wide, make them auto width.
   4. Double-click doesn't work for Category attribute DataGrid. It seems that Edit action is custom and doesn't have Enter shortcut.

8. CategoryListView (Dynamic attributes)
   1. Left side misses padding
   2. It's better to replace not responsive Split with two columns layout that becomes one column layout if not enough space. See RoleAssignmentView as an example of CSS Container Queries or Bookstore app as an example of Grid.
   3. Apply changes button requires color difference, e.g. make it success or contrast

9. CategoryAttributeDetailView
   1. Remove PrintMargin from all CodeEditors
   2. Since the dialog is resizable, every tab should look pretty while resizing. Currently a lot of blank space appears.