@plone/volto 18.32.1 → 18.32.2

package/src/helpers/Blocks/Blocks.js

@@ -80,6 +80,14 @@ export function blockHasValue(data) {
   return check(data);
 }
 
+/**
+ * Block id is valid (not undefined/null or the string "undefined" from object[undefined])
+ * @param {*} id Block id
+ * @return {boolean}
+ */
+const isValidBlockId = (id) =>
+  id != null && id !== 'undefined' && (typeof id !== 'string' || id.length > 0);
+
 /**
  * Get block pairs of [id, block] from content properties
  * @function getBlocks
@@ -89,12 +97,26 @@ export function blockHasValue(data) {
 export const getBlocks = (properties) => {
   const blocksFieldName = getBlocksFieldname(properties);
   const blocksLayoutFieldname = getBlocksLayoutFieldname(properties);
-  return (
-    properties[blocksLayoutFieldname]?.items?.map((n) => [
-      n,
-      properties[blocksFieldName][n],
-    ]) || []
-  );
+  const blocks = properties?.[blocksFieldName];
+  const items = properties?.[blocksLayoutFieldname]?.items;
+  if (!items) return [];
+  return items
+    .filter((n) => isValidBlockId(n))
+    .map((n) => [n, blocks?.[n]])
+    .filter(([, block]) => block != null);
+};
+
+/**
+ * Get layout item IDs that are valid but have no block data (orphaned refs).
+ * @param {Object} properties Content form properties
+ * @return {string[]} IDs that should be removed from layout
+ */
+export const getInvalidBlockLayoutIds = (properties) => {
+  const blocksFieldName = getBlocksFieldname(properties);
+  const blocksLayoutFieldName = getBlocksLayoutFieldname(properties);
+  const blocks = properties?.[blocksFieldName] ?? {};
+  const layoutItems = properties?.[blocksLayoutFieldName]?.items ?? [];
+  return layoutItems.filter((id) => isValidBlockId(id) && blocks[id] == null);
 };
 
 /**
@@ -129,12 +151,28 @@ export function deleteBlock(formData, blockId, intl) {
 
   let newFormData = {
     ...formData,
-    [blocksLayoutFieldname]: {
-      items: without(formData[blocksLayoutFieldname].items, blockId),
-    },
-    [blocksFieldname]: omit(formData[blocksFieldname], [blockId]),
   };
 
+  let container = findParent(newFormData, {
+    blockId,
+  });
+
+  if (container) {
+    container[blocksLayoutFieldname].items = without(
+      container[blocksLayoutFieldname].items,
+      blockId,
+    );
+    container[blocksFieldname] = omit(container[blocksFieldname], [blockId]);
+  } else {
+    newFormData[blocksLayoutFieldname].items = without(
+      newFormData[blocksLayoutFieldname].items,
+      blockId,
+    );
+    newFormData[blocksFieldname] = omit(newFormData[blocksFieldname], [
+      blockId,
+    ]);
+  }
+
   if (newFormData[blocksLayoutFieldname].items.length === 0) {
     newFormData = addBlock(
       newFormData,
@@ -817,7 +855,9 @@ export const getBlocksHierarchy = (properties) => {
     title: properties[blocksFieldName][n]?.['@type'],
     data: properties[blocksFieldName][n],
     children: isBlockContainer(properties[blocksFieldName][n])
-      ? getBlocksHierarchy(properties[blocksFieldName][n])
+      ? properties[blocksFieldName][n].data
+        ? getBlocksHierarchy(properties[blocksFieldName][n].data)
+        : getBlocksHierarchy(properties[blocksFieldName][n])
       : [],
   }));
 };
@@ -911,8 +951,13 @@ export function moveBlockEnhanced(formData, { source, destination }) {
       const destinationContainer = findContainer(clonedFormData, {
         containerId: destination.parent,
       });
+      const sourceContainer = findContainer(clonedFormData, {
+        containerId: source.parent,
+      });
+
       destinationContainer[blocksFieldName][source.id] =
-        formData[blocksFieldName][source.parent][blocksFieldName][source.id];
+        sourceContainer[blocksFieldName]?.[source.id] ||
+        sourceContainer.data?.[blocksFieldName][source.id];
 
       destinationContainer[blocksLayoutFieldname].items = insertInArray(
         destinationContainer[blocksLayoutFieldname].items,
@@ -921,9 +966,6 @@ export function moveBlockEnhanced(formData, { source, destination }) {
       );
 
       // Remove the source block from the source parent
-      const sourceContainer = findContainer(clonedFormData, {
-        containerId: source.parent,
-      });
       delete sourceContainer[blocksFieldName][source.id];
       sourceContainer[blocksLayoutFieldname].items = removeFromArray(
         sourceContainer[blocksLayoutFieldname].items,
@@ -957,23 +999,25 @@ export function moveBlockEnhanced(formData, { source, destination }) {
  * @returns {object|undefined} - The container object if found, otherwise undefined.
  */
 export const findContainer = (formData, { containerId }) => {
+  const block =
+    formData.blocks[containerId]?.data || formData.blocks[containerId];
   if (
-    formData.blocks[containerId] &&
-    Object.keys(formData.blocks[containerId]).includes('blocks') &&
-    Object.keys(formData.blocks[containerId]).includes('blocks_layout')
+    block &&
+    Object.keys(block).includes('blocks') &&
+    Object.keys(block).includes('blocks_layout')
   ) {
-    return formData.blocks[containerId];
+    return block;
   }
 
   let container;
   Object.keys(formData.blocks).every((blockId) => {
-    const block = formData.blocks[blockId];
+    const subBlock = formData.blocks[blockId].data || formData.blocks[blockId];
     if (
-      formData.blocks[blockId] &&
-      Object.keys(formData.blocks[blockId]).includes('blocks') &&
-      Object.keys(formData.blocks[blockId]).includes('blocks_layout')
+      subBlock &&
+      Object.keys(subBlock).includes('blocks') &&
+      Object.keys(subBlock).includes('blocks_layout')
     ) {
-      container = findContainer(block, { containerId });
+      container = findContainer(subBlock, { containerId });
     }
     if (container) {
       return false;
@@ -985,6 +1029,47 @@ export const findContainer = (formData, { containerId }) => {
   return container;
 };
 
+/**
+ * Finds parent container of the specified blockId in the given formData.
+ *
+ * @param {object} formData - The form data object.
+ * @param {object} options - The options object.
+ * @param {string} options.blockId - The ID of the block to find.
+ * @returns {object|undefined} - The container object if found, otherwise undefined.
+ */
+export const findParent = (formData, { blockId }) => {
+  const block = formData.data || formData;
+
+  if (block && block.blocks && Object.keys(block.blocks).includes(blockId)) {
+    return block;
+  }
+
+  let found = false;
+
+  if (block && block.blocks) {
+    Object.keys(block.blocks).every((subBlockId) => {
+      const subBlock =
+        block.blocks[subBlockId].data || block.blocks[subBlockId];
+      if (subBlock && subBlock.blocks) {
+        if (Object.keys(subBlock.blocks).includes(blockId)) {
+          found = subBlock;
+        }
+        const parent = findParent(subBlock, { blockId });
+        if (parent) {
+          found = parent;
+        }
+      }
+      if (found) {
+        return false;
+      } else {
+        return true;
+      }
+    });
+  }
+
+  return found;
+};
+
 const _dummyIntl = {
   formatMessage() {},
 };

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

@@ -7,6 +7,7 @@ import {
   getBlocks,
   getBlocksFieldname,
   getBlocksLayoutFieldname,
+  getInvalidBlockLayoutIds,
   hasBlocksData,
   insertBlock,
   moveBlock,
@@ -482,6 +483,105 @@ describe('Blocks', () => {
         ['a', { value: 1 }],
       ]);
     });
+
+    it('filters out invalid block IDs (null, undefined, string "undefined")', () => {
+      const validBlock = { '@type': 'search', value: 'test' };
+      const result = getBlocks({
+        blocks: {
+          'valid-id-123': validBlock,
+          // These shouldn't exist but test edge case
+          [null]: { '@type': 'invalid' },
+          [undefined]: { '@type': 'invalid' },
+          undefined: { '@type': 'invalid' },
+        },
+        blocks_layout: {
+          items: [
+            'valid-id-123',
+            null, // Invalid: null ID
+            undefined, // Invalid: undefined ID
+            'undefined', // Invalid: string "undefined"
+            'missing-block', // Valid ID but block doesn't exist (filtered by block !== undefined)
+          ],
+        },
+      });
+
+      // Should only return the valid block, filtering out:
+      // - null ID
+      // - undefined ID
+      // - string "undefined" ID
+      // - missing block (block is undefined)
+      expect(result).toStrictEqual([['valid-id-123', validBlock]]);
+      expect(result.length).toBe(1);
+
+      // Verify no invalid IDs in the result
+      const ids = result.map(([id]) => id);
+      expect(ids).not.toContain(null);
+      expect(ids).not.toContain(undefined);
+      expect(ids).not.toContain('undefined');
+    });
+
+    it('filters out invalid block IDs even when blocks object has invalid keys', () => {
+      // Simulate edge case where blocks object has invalid keys
+      const blocks = {
+        'valid-id': { '@type': 'search' },
+      };
+      // JavaScript allows this, creating string keys
+      blocks[null] = { '@type': 'invalid' };
+      blocks[undefined] = { '@type': 'invalid' };
+
+      const result = getBlocks({
+        blocks,
+        blocks_layout: {
+          items: ['valid-id', null, undefined, 'undefined'],
+        },
+      });
+
+      // Should only return valid block
+      expect(result).toStrictEqual([['valid-id', { '@type': 'search' }]]);
+      expect(result.length).toBe(1);
+    });
+  });
+
+  describe('getInvalidBlockLayoutIds', () => {
+    it('returns layout IDs that are valid but have no block data', () => {
+      const result = getInvalidBlockLayoutIds({
+        blocks: {
+          a: { '@type': 'custom', text: 'a' },
+          b: { '@type': 'custom', text: 'b' },
+        },
+        blocks_layout: {
+          items: ['a', 'b', 'MISSING-1', 'MISSING-2'],
+        },
+      });
+      expect(result).toStrictEqual(['MISSING-1', 'MISSING-2']);
+    });
+
+    it('returns empty when all layout items have block data', () => {
+      const result = getInvalidBlockLayoutIds({
+        blocks: { a: { '@type': 'custom' }, b: { '@type': 'custom' } },
+        blocks_layout: { items: ['a', 'b'] },
+      });
+      expect(result).toStrictEqual([]);
+    });
+
+    it('filters out invalid IDs (null, undefined, "undefined")', () => {
+      const result = getInvalidBlockLayoutIds({
+        blocks: {},
+        blocks_layout: {
+          items: [null, undefined, 'undefined', 'valid-missing'],
+        },
+      });
+      expect(result).toStrictEqual(['valid-missing']);
+    });
+
+    it('returns empty when items is missing or empty', () => {
+      expect(
+        getInvalidBlockLayoutIds({ blocks: {}, blocks_layout: {} }),
+      ).toStrictEqual([]);
+      expect(
+        getInvalidBlockLayoutIds({ blocks: {}, blocks_layout: { items: [] } }),
+      ).toStrictEqual([]);
+    });
   });
 
   describe('addBlock', () => {

package/src/helpers/FormValidation/validators.ts

@@ -15,6 +15,17 @@ type Validator = {
   formatMessage: Function;
 };
 
+type Choice = {
+  token: string;
+  label: string;
+};
+type ChoiceValidator = {
+  value: string | Choice;
+  field: Record<string, any>;
+  formData: any;
+  formatMessage: Function;
+};
+
 export const isMaxPropertyValid = ({
   value,
   fieldSpec,
@@ -211,12 +222,13 @@ export const defaultLanguageControlPanelValidator = ({
   value,
   formData,
   formatMessage,
-}: Validator) => {
+}: ChoiceValidator) => {
+  const token = typeof value === 'object' ? value.token : value;
   const isValid =
-    value &&
+    token &&
     (formData.available_languages.find(
-      (lang: { token: string }) => lang.token === value,
+      (lang: { token: string }) => lang.token === token,
     ) ||
-      formData.available_languages.includes(value));
+      formData.available_languages.includes(token));
   return !isValid ? formatMessage(messages.defaultLanguage) : null;
 };

package/types/components/manage/Blocks/Block/Order/utilities.d.ts

@@ -1,8 +1,9 @@
 export function getProjection(items: any, activeId: any, overId: any, dragOffset: any, indentationWidth: any, arrayMove: any): {
+    parentId: any;
+    parentType: any;
     depth: any;
     maxDepth: any;
     minDepth: any;
-    parentId: any;
 };
 export function flattenTree(items: any): any;
 export function findItem(items: any, itemId: any): any;

package/types/components/theme/ConnectionRefused/ConnectionRefused.d.ts

@@ -1,2 +1,2 @@
-export default ConnectionRefused;
-declare function ConnectionRefused(): import("react/jsx-runtime").JSX.Element;
+declare const _default: (props: any) => import("react/jsx-runtime").JSX.Element;
+export default _default;

package/types/components/theme/PasswordReset/PasswordReset.d.ts

@@ -1,2 +1,6 @@
-declare const _default: any;
-export default _default;
+export default PasswordReset;
+/**
+ * @function PasswordReset
+ * @returns {JSX.Element}
+ */
+declare function PasswordReset(): JSX.Element;

package/types/config/Views.d.ts

@@ -42,7 +42,7 @@ export const errorViews: {
     403: (props: any) => import("react/jsx-runtime").JSX.Element;
     408: () => string;
     500: (props: any) => import("react/jsx-runtime").JSX.Element;
-    ECONNREFUSED: () => import("react/jsx-runtime").JSX.Element;
+    ECONNREFUSED: (props: any) => import("react/jsx-runtime").JSX.Element;
     corsError: () => string;
 };
 export namespace layoutViewsNamesMapping {

package/types/helpers/Blocks/Blocks.d.ts

@@ -176,6 +176,7 @@ export function findBlocks(blocks: {}, types: any, result?: any[]): any[];
  */
 export function moveBlockEnhanced(formData: any, { source, destination }: number): any;
 export function getBlocks(properties: any): any[];
+export function getInvalidBlockLayoutIds(properties: any): string[];
 export function applyBlockInitialValue({ id, value, blocksConfig, formData, intl, }: {
     id: any;
     value: any;
@@ -193,3 +194,6 @@ export function getBlocksHierarchy(properties: any): any;
 export function findContainer(formData: object, { containerId }: {
     containerId: string;
 }): object | undefined;
+export function findParent(formData: object, { blockId }: {
+    blockId: string;
+}): object | undefined;

package/types/helpers/FormValidation/validators.d.ts

@@ -10,6 +10,16 @@ type Validator = {
     formData: any;
     formatMessage: Function;
 };
+type Choice = {
+    token: string;
+    label: string;
+};
+type ChoiceValidator = {
+    value: string | Choice;
+    field: Record<string, any>;
+    formData: any;
+    formatMessage: Function;
+};
 export declare const isMaxPropertyValid: ({ value, fieldSpec, criterion, formatMessage, }: MinMaxValidator) => any;
 export declare const isMinPropertyValid: ({ value, fieldSpec, criterion, formatMessage, }: MinMaxValidator) => any;
 export declare const minLengthValidator: ({ value, field, formatMessage, }: Validator) => any;
@@ -26,5 +36,5 @@ export declare const endEventDateRangeValidator: ({ value, field, formData, form
 export declare const patternValidator: ({ value, field, formatMessage, }: Validator) => any;
 export declare const maxItemsValidator: ({ value, field, formatMessage, }: Validator) => any;
 export declare const minItemsValidator: ({ value, field, formatMessage, }: Validator) => any;
-export declare const defaultLanguageControlPanelValidator: ({ value, formData, formatMessage, }: Validator) => any;
+export declare const defaultLanguageControlPanelValidator: ({ value, formData, formatMessage, }: ChoiceValidator) => any;
 export {};

package/types/routes.d.ts

@@ -12,22 +12,23 @@ export const multilingualRoutes: ({
     exact?: undefined;
 } | {
     path: string;
-    component: any;
+    component: () => import("react/jsx-runtime").JSX.Element;
     exact: boolean;
 })[];
 export const defaultRoutes: ({
     path: string;
     component: any;
     exact?: undefined;
+} | {
+    component: (props: any) => import("react/jsx-runtime").JSX.Element;
 } | {
     path: string;
     component: any;
     exact: boolean;
-} | {
-    component: (props: any) => import("react/jsx-runtime").JSX.Element;
 } | {
     path: string[];
     component: any;
+    exact?: undefined;
 })[];
 export default routes;
 /**
@@ -46,14 +47,15 @@ declare const routes: {
         path: string;
         component: any;
         exact?: undefined;
+    } | {
+        component: (props: any) => import("react/jsx-runtime").JSX.Element;
     } | {
         path: string;
         component: any;
         exact: boolean;
-    } | {
-        component: (props: any) => import("react/jsx-runtime").JSX.Element;
     } | {
         path: string[];
         component: any;
+        exact?: undefined;
     })[];
 }[];