Problem/Motivation

For the overarching #1535868: Convert all blocks into plugins, we introduced a UI to browse blocks. This UI was only a partial implementation of the desired level of UX. We want to integrate this browser with the layout editor introduced by #1841584: Add and configure master displays.

The problem this is trying to solve is the fact that in the SCOTCH initiative introduces the idea of being able to place blocks in different layouts. You will need a way to browse blocks, as there is no "disabled blocks" region anymore and the list of potential blocks could grow large.

Proposed resolution

From the layout editor you can press a small +, which brings you to the blocks browser.

Filters

  • Search: You can search the table by using the search in the sidebar, which similar to tools like Gmail would dynamically filter the table.
  • Categories: Part of our discussion in Component library, we decided that there should be a way to categorize blocks as the list could become unwieldy long and impossible to navigate for those who do not know exactly what they are looking for.

Add new block

  • The "Add new block" button will lead to a UI similar to creating content, where you can select from the possible types of blocks you can create. Its likely other modules will add their types to this, by default it comes with "Custom block" and "Views".
  • At the end of creating a block, you end up back on the layout editor

Remaining tasks

- Outline technical tasks.

API changes

- We will need to introduce a way to categorize blocks.

Files: 

Comments

Issue tags:+Usability, +Layout, +Spark

Sorry for the occasionally poor quality of the styling, I tried to work on fixing it but its clear there are currently just too many different styles in core. It would require a more significant overhaul, not really part of this issue. So I didn't focus on fixing it.

A few images to illustrate the idea, you initially start on layout editor and then continue to the block browser:


The block browser is sorted by date, which means new blocks are placed on top. The filters will act upon the table. Ideally we also have a pager, as to remove any need to scroll - we should be able to fit 10-20 blocks on a given modal, with filters applied I expect that to be enough.


You can add a new block, you always get this screen for 1) accessibility reasons, as we need to allow people to set it, 2) blocks that require something to be set (e.g. a context parameter) will need you to go to this screen. Ideally we do not need this step, but at the moment its required. Additionally we might want to have a "Preview" here, since there is really no connection with the front-end at the moment.

Upon clicking "Add new block" you get the following:

Example list of available types of blocks to be created. You can imagine interfaces like "Menu", "Views", "Node" provide a way to make blocks.

Well date wise, that one is a duplication of this one. However much of D8 issue titles have become so complex, I have been unable to follow much. If the decision is to close this one, please make sure images are transferred.

Title:Add block browserAdd modal block browser

I don't believe this is a dupe. A modal block browser is probably a useful addition to the Drupal toolkit, and its not related to whether we have derivatives.

Because the proposal at #1875252: [META] Make the block plugin UI shippable is currently for a non-modal block browser, but I believe both are valuable, I'm just going to rename this but keep it open.

Status:Active» Closed (duplicate)

Status:Closed (duplicate)» Closed (won't fix)

Still not a duplicate, even if you don't want to do it.