@plone/contents - Enhance Contents View #4

PLIP (Plone Improvement Proposal)

Responsible Persons

Proposer: Víctor Fernández de Alba (@sneridagh)

Seconder:

Abstract

Overhaul, and refactor the contents view. Move it to use own core package @plone/contents, so it's portable to other frameworks or platforms (electron, ionic, etc...) or even use it in Plone ClassicUI

It should address these issues:

• Use react-aria-components for better accessibility support
• Loading indicator (spinner) badly positioned when uploading hundreds of images via folder contents. Replace spinner with upload progress indicator (x of y files uploaded). volto#5620
• File upload modal needs overflow: auto and max-height volto#5677 (partially solves #5620)
• a11y: add aria-live="polite" to results table in folder content volto#5617
• UI Issue : dropdown popup positioning in contents page volto#5566
• Allow editors to edit metadata on bulk upload of images volto#5549

Motivation

The contents view is a key element for managing content and should have the best support and UX possible. In addition, we should improve it in order to make it a true mini-app detached from the "site frame", so the usability is better (see Quanta mocks).

https://www.figma.com/file/YpaRSKjFcFaAkVYnTSVGuz/Volto-UI-%E2%80%93-Quanta?type=design&node-id=1780-534&t=APRtPBwzIc5APzxL-4

Assumptions

No preconditions.

Proposal & Implementation

Refactor the contents view:

• Use own core package @plone/contents
• Use TypeScript
• Better slicing of components so they are easily shadowable
• Don't use SemanticUI on it, use react-aria-components
• Use @plone/client instead of the Volto redux-based request API

Deliverables

Refactored Contents.jsx (and child components) using the Tanstack table library.
Documentation on how to use it outside Volto

Risks

No risks.

Participants

@iFlameing
Put your name here.