Consolidate UI for Repeater, M2A, M2M, and O2M interfaces

[benhaynes]

Let's ensure these all look the same. I know some use the "table" (O2M) and others use the title rows, but we should ensure the following:

• Button styling is consistent (no more outlines vs primary)
• Buttons that open a dropdown should have an arrow icon
• There should be a similar "No Items" message/notice when empty
• All of these should have interface options for toggling "Create" and "Add Existing"

[benhaynes]

I'm thinking we only use the "repeater style" item units in the relational interfaces, removing the table view. This means:

• Applies to: Repeater, Relational Repeater, M2M, O2M, and M2A
• All have the same "Add New" and "Select Existing" buttons below (with options to toggle either/both off)
  • For M2A, the buttons should have an arrow to show it's a dropdown
• If there are more than X relational items to display, we would display the first Y and then have a button that opens the full list in a drawer (with search, column ordering, etc). If we didn't want to show the first Y, we could have a special state that just lists the total count of related items.
  • We could also have a similar feature that minimizes the number viewed by default. eg: it shows 5 with a link that says "click here to show 7 more" which expands on the page to show all items.
• Clicking any item opens it in a drawer

[Nitwel]

To make sure I understand this correctly. The plan is to get rid of all tables and have the repeater like items instead?
What should happen if you click on one of these new items with a m2m?

1. Expand like in the repeater interface
2. Open a modal
   Should this be consistent throughout all interfaces or should the repeater still expand and m2m open in a popup?

The repeater wont need a "Add Existing" but I guess that is ok.

[rijkvanzanten]

Number two! Consistently open in the modal drawer

[benhaynes]

Correct, #2 like Rijk said. And for the item/row labels, I think we should default to the Collection Display Template... and allow for overriding in the interface options.

It would be nice to think of a way to allow inline editing for the simple, non-relational repeater interface (in addition to the drawer), but that can come later. The main issue with editing inline is that nested fields get very messy. But if the fields were restricted to simple interfaces (that don't nest) like text input and dropdown, then it is nice having that inline option for things like key-value pairs. But again, we can enhance things later to support this... for now we just need consistency.

[mrleblanc101]

@benhaynes Is there any progress on inline editing of non-relational field ?
I created a page builder for a blog with reusable "components" like gallery and pull-out quote and other facy "blocks" that can be inserted between normal WYSIWYG paragraph (article body) and it's annoying having to open each WYSIWYG in the drawer... They should be inline like WordPress ACF ! I'm trying to find information about M2A fields but there is none anywhere.

[martinsotirov]

@mrleblanc101 I'd be interested in that as well, since this is also my preferred way of making my own "page builders" in WordPress