Fix in-page drag-and-drop for the Listing block in Volto 18 and 19#7907
Conversation
There was a problem hiding this comment.
Pull request overview
This pull request fixes a drag-and-drop bug in the Listing block for Volto 18 and 19. When users attempted to reposition a Listing block within a page, the block would visually move during the drag but immediately snap back to its original position after being dropped. The issue was caused by React.memo optimization preventing the component from re-rendering when its index (position) changed.
Changes:
- Added
indexprop comparison to the Listing block's React.memo equality check to ensure re-renders when block position changes - Added changelog entry documenting the bugfix
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated no comments.
| File | Description |
|---|---|
| packages/volto/src/components/manage/Blocks/Listing/Edit.jsx | Added nextProps.index !== prevProps.index check to the areEquals comparison function to enable proper re-rendering during drag-and-drop operations |
| packages/volto/news/7907.internal | Added changelog entry for the bugfix |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
@Manik-Khajuria-5 Are you going to handle the PR or cherry-picking on volto 18 too? :) |
|
@sabrina-bongiovanni Yes, I can take care of that |
* main: (122 commits) Release 19.0.0-alpha.27 Release @plone/slate 19.0.0-alpha.12 Release @plone/razzle 1.0.0-alpha.1 We do not release @plone/client from here Handle create-user 500 responses where body contains 'message' instead of 'error' (#7946) Dropzone filewidget a11y (#7956) Update css-minimizer-webpack-plugin to v7 and keep razzleOptions.enableSourceMaps control (#7934) Refactor Password Reset: Convert Class-Based Component to Functional Component (#7697) fix: Fixed searchable types in Object Browser Widget, adding also sel… (#7942) Fix in-page drag-and-drop for the Listing block in Volto 18 and 19 (#7907) Improved docs of Plone REST API JavaScript Client (#5576) Fix Moderate Comments control panel visibility based on Discussion Support addon installation (#7878) fix: Add authorization error handling to control panels (#7807) Fix subordering order tab (#7937) (#7939) Fix converting value to html in HtmlSlateWidget (#7938) razzle.config.js: Fix defaultPlugins missing name property to enable addon SCSS plugin replacement (#7908) Update users controlpanel to work with new response format (#7895) Avoid storing blocksClipboard in localstorage until it has a value (#7925) Remove link to Jobfamilie MEDICE: site is no longer a Volto site (redirects to non-Volto destination) (#7929) Exclude `.storybook` from ESLint's default hidden directory ignore list via `.eslintignore` to allow linting of Storybook configuration files (#7898) ...
Summary
Fix in-page drag-and-drop behavior for the Listing block, which could not be repositioned in Volto 18 and 19.
Fixes #7879
Problem
When dragging a Listing block within the same page to change its position:
Solution
screenrecording-2026-02-15_17-04-45.mp4
Closes #7879