@plone/volto 16.31.0 → 16.31.1

package/.changelog.draft

@@ -1,8 +1,8 @@
-## 16.31.0 (2024-02-26)
+## 16.31.1 (2024-02-28)
 
-### Feature
+### Bugfix
 
-- Allow editor to edit metadata during bulk upload. @iFlameing [#5549](https://github.com/plone/volto/issues/5549)
-- Add global form state. @robgietema [#5721](https://github.com/plone/volto/issues/5721)
+- Fix the condition deciding on listing pagination format so it takes into account container blocks as well @sneridagh [#4978](https://github.com/plone/volto/issues/4978)
+- Enhance findBlocks to check for blocks also in data for add-ons such as @eeacms/volto-tabs-block. @ichim-david [#5796](https://github.com/plone/volto/issues/5796)
 
 

package/CHANGELOG.md

@@ -8,6 +8,13 @@
 
 <!-- towncrier release notes start -->
 
+## 16.31.1 (2024-02-28)
+
+### Bugfix
+
+- Fix the condition deciding on listing pagination format so it takes into account container blocks as well @sneridagh [#4978](https://github.com/plone/volto/issues/4978)
+- Enhance findBlocks to check for blocks also in data for add-ons such as @eeacms/volto-tabs-block. @ichim-david [#5796](https://github.com/plone/volto/issues/5796)
+
 ## 16.31.0 (2024-02-26)
 
 ### Feature

package/package.json

@@ -9,7 +9,7 @@
     }
   ],
   "license": "MIT",
-  "version": "16.31.0",
+  "version": "16.31.1",
   "repository": {
     "type": "git",
     "url": "git@github.com:plone/volto.git"

package/packages/volto-slate/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@plone/volto-slate",
-  "version": "16.31.0",
+  "version": "16.31.1",
   "description": "Slate.js integration with Volto",
   "main": "src/index.js",
   "author": "European Environment Agency: IDM2 A-Team",

package/src/config/index.js

@@ -185,6 +185,7 @@ let config = {
     querystringSearchGet: false,
     blockSettingsTabFieldsetsInitialStateOpen: true,
     excludeLinksAndReferencesMenuItem: true,
+    containerBlockTypes: [],
   },
   experimental: {
     addBlockButton: {

package/src/helpers/Blocks/Blocks.js

@@ -533,3 +533,28 @@ export const getPreviousNextBlock = ({ content, block }) => {
 
   return [previousBlock, nextBlock];
 };
+
+/**
+ * Given a `block` object and a list of block types, return a list of block ids matching the types
+ *
+ * @function findBlocks
+ * @param {Object} types A list with the list of types to be matched
+ * @return {Array} An array of block ids
+ */
+export function findBlocks(blocks, types, result = []) {
+  const containerBlockTypes = config.settings.containerBlockTypes;
+
+  Object.keys(blocks).forEach((blockId) => {
+    const block = blocks[blockId];
+    // check blocks from data as well since some add-ons use that
+    // such as @eeacms/volto-tabs-block
+    const child_blocks = block.blocks || block.data?.blocks;
+    if (types.includes(block['@type'])) {
+      result.push(blockId);
+    } else if (containerBlockTypes.includes(block['@type']) || child_blocks) {
+      findBlocks(child_blocks, types, result);
+    }
+  });
+
+  return result;
+}

package/src/helpers/Blocks/Blocks.test.js

@@ -19,6 +19,7 @@ import {
   buildStyleClassNamesFromData,
   buildStyleClassNamesExtenders,
   getPreviousNextBlock,
+  findBlocks,
 } from './Blocks';
 
 import config from '@plone/volto/registry';
@@ -1226,3 +1227,39 @@ describe('Blocks', () => {
     });
   });
 });
+
+describe('findBlocks', () => {
+  it('Get all blocks in the first level (main block container)', () => {
+    const blocks = {
+      '1': { title: 'title', '@type': 'title' },
+      '2': { title: 'an image', '@type': 'image' },
+      '3': { title: 'description', '@type': 'description' },
+      '4': { title: 'a text', '@type': 'slate' },
+    };
+    const types = ['description'];
+    expect(findBlocks(blocks, types)).toStrictEqual(['3']);
+  });
+
+  it('Get all blocks in the first level (main block container) given a list', () => {
+    const blocks = {
+      '1': { title: 'title', '@type': 'title' },
+      '2': { title: 'an image', '@type': 'image' },
+      '3': { title: 'description', '@type': 'description' },
+      '4': { title: 'a text', '@type': 'slate' },
+    };
+    const types = ['description', 'slate'];
+    expect(findBlocks(blocks, types)).toStrictEqual(['3', '4']);
+  });
+
+  it('Get all blocks in the first level (main block container) given a list', () => {
+    const blocks = {
+      '1': { title: 'title', '@type': 'title' },
+      '2': { title: 'an image', '@type': 'image' },
+      '3': { title: 'description', '@type': 'description' },
+      '4': { title: 'a text', '@type': 'slate' },
+      '5': { title: 'a text', '@type': 'slate' },
+    };
+    const types = ['description', 'slate'];
+    expect(findBlocks(blocks, types)).toStrictEqual(['3', '4', '5']);
+  });
+});

package/src/helpers/Utils/usePagination.js

@@ -2,7 +2,7 @@ import React, { useRef, useEffect } from 'react';
 import { useHistory, useLocation } from 'react-router-dom';
 import qs from 'query-string';
 import { useSelector } from 'react-redux';
-import { slugify } from '@plone/volto/helpers/Utils/Utils';
+import { findBlocks, slugify } from '@plone/volto/helpers';
 
 /**
  * @function useCreatePageQueryStringKey
@@ -12,13 +12,8 @@ import { slugify } from '@plone/volto/helpers/Utils/Utils';
 const useCreatePageQueryStringKey = (id) => {
   const blockTypesWithPagination = ['search', 'listing'];
   const blocks = useSelector((state) => state?.content?.data?.blocks) || [];
-  const blocksLayout =
-    useSelector((state) => state?.content?.data?.blocks_layout?.items) || [];
-  const displayedBlocks = blocksLayout?.map((item) => blocks[item]);
   const hasMultiplePaginations =
-    displayedBlocks.filter((item) =>
-      blockTypesWithPagination.includes(item['@type']),
-    ).length > 1 || false;
+    findBlocks(blocks, blockTypesWithPagination).length > 1;
 
   return hasMultiplePaginations ? slugify(`page-${id}`) : 'page';
 };

package/src/helpers/index.js

@@ -58,6 +58,7 @@ export {
   buildStyleClassNamesFromData,
   buildStyleClassNamesExtenders,
   getPreviousNextBlock,
+  findBlocks,
 } from '@plone/volto/helpers/Blocks/Blocks';
 export { default as BodyClass } from '@plone/volto/helpers/BodyClass/BodyClass';
 export { default as ScrollToTop } from '@plone/volto/helpers/ScrollToTop/ScrollToTop';
@@ -91,6 +92,7 @@ export {
   replaceItemOfArray,
   cloneDeepSchema,
   reorderArray,
+  slugify,
 } from '@plone/volto/helpers/Utils/Utils';
 export { messages } from './MessageLabels/MessageLabels';
 export {

package/test-setup-config.js

@@ -82,6 +82,7 @@ config.set('settings', {
   viewableInBrowserObjects: [],
   styleClassNameConverters,
   styleClassNameExtenders,
+  containerBlockTypes: [],
 });
 config.set('blocks', {
   blocksConfig: {