[HelpHub] [6.4] List View

[femkreations]

Article: https://wordpress.org/documentation/article/list-view/

Updates for 6.4

• Add keyboard shortcut for duplicating blocks. 53559
• Add media previews to list view for gallery and image blocks. 53381
• Allow Escape key to deselect blocks if blocks are selected. 48708

Reference

• Pls refer for the previous versions tasks here

General

• Convert all reusable blocks to a ‘regular block’.
• Update the changelog at the end of the article

Good first issues

If you are looking for simpler tasks, take a look at related good first issues:

• Check ALT attributes: [HelpHub][6.4][ALT]: List View #1321
• Check headings: [HelpHub][6.4][headings]: List View #1322
• Update screenshots: [HelpHub][6.4][screenshots]: List View #1323
• Update videos: [HelpHub][6.4][videos]: List View #1324

[github-actions]

Heads up @WordPress/docs-issues-coordinators, we have a new issue open. Time to use 'em labels.

[github-actions]

Heads up @femkreations - the "block editor" label was applied to this issue.

[iammehedi1]

I want to work on this. @femkreations @abhansnuk

[iammehedi1]

Add keyboard shortcut for duplicating blocks. WordPress/gutenberg#53559

In this update, a convenient keyboard shortcut has been introduced for duplicating blocks within the List View, simplifying block management during navigation. With this new feature, users can swiftly duplicate the currently selected or focused block without the necessity of switching to other interfaces, such as the block settings menu or the editor canvas.

The approach adopted mirrors that of the block settings menu, adapted specifically for the List View. Common logic for determining which blocks to modify, shared between block deletion and duplication in the List View, has been consolidated.

Additionally, the existing end-to-end test has been enhanced to encompass both block deletion and duplication within the List View.

2023-08-14.14.21.49.mp4

[iammehedi1]

Add media previews to list view for gallery and image blocks. WordPress/gutenberg#53381

This update introduces media previews for gallery and image blocks in the list view, improving document navigation in cases with numerous images or galleries.

Media previews are displayed for collapsed Gallery blocks, with a maximum of three images per row. Image blocks in the list view show a single image in the row.

To achieve this, a hook has been added to the list view for image retrieval, and images are displayed using background images with a cover setting.

The logic for fetching images is temporarily hard-coded to identify images within Image blocks or as children of Gallery blocks. However, there's a plan to establish a more consistent API for this in the future to ensure greater flexibility and maintain a unified list view experience.

[iammehedi1]

Allow Escape key to deselect blocks if blocks are selected. WordPress/gutenberg#48708

This update addresses the issue of users being unable to unselect blocks within the list view. The suggested fix is to allow the Escape key to unselect all blocks when a block selection is active, while keeping the list view open. If no blocks are selected, the Escape key will still close the list view as usual.

The motivation behind this change stems from a user-reported issue highlighting the need for a keyboard-based method to deselect blocks in the list view, which is currently unavailable. Given that users can open and close the list view using a keyboard shortcut, this update prioritizes using the Escape key to deselect blocks instead of closing the list view.

For reference, the keyboard shortcut for closing the list view is alt+shift+o on Windows and control+option+o on Mac.

In practical terms, when a block is selected in the list view, hitting Escape will remove the selection without closing the list view. If no blocks are selected, hitting Escape will carry out the usual action of closing the list view.

escape-to-clear-selection.mp4

[nalininsbs]

Confirmed update done in Slack. Submitted for 1st review.

[nalininsbs]

Thank you for your efforts on this @iammehedi1, and welcome as a new contributor too!

I think the content may need simplifying more as this is a document for end users rather than a dev note. My reading of the List View page is that it is at a less technical level. @femkreations @Leonardus-Nugraha @jennimckinnon could you please have a look at the content to help our new contributor make any updates and so the changes can be made by yourselves on the page? Thank you.

[nalininsbs]

I saw @abhansnuk raised the question on another issue. Is List View still upper case L and V? @zzap would you know if this is the case? Thank you.