From 747b5fd0346db5d31de08fa063ee85a33e40761d Mon Sep 17 00:00:00 2001
From: alihamza1221 <alihamza77065@gmail.com>
Date: Mon, 18 Nov 2024 23:34:14 +0500
Subject: [PATCH 1/4] fix:Order blocks in sidebar doesn't respect layout
 restrictions: required and fixed position

---
 .../manage/Blocks/Block/EditBlockWrapper.jsx        |  9 +--------
 .../components/manage/Blocks/Block/Order/Item.jsx   | 12 +++++++++++-
 packages/volto/src/helpers/Blocks/Blocks.js         | 13 +++++++++++++
 3 files changed, 25 insertions(+), 9 deletions(-)

diff --git a/packages/volto/src/components/manage/Blocks/Block/EditBlockWrapper.jsx b/packages/volto/src/components/manage/Blocks/Block/EditBlockWrapper.jsx
index 3c94084860..249e5dbd56 100644
--- a/packages/volto/src/components/manage/Blocks/Block/EditBlockWrapper.jsx
+++ b/packages/volto/src/components/manage/Blocks/Block/EditBlockWrapper.jsx
@@ -9,6 +9,7 @@ import {
   buildStyleObjectFromData,
   buildStyleClassNamesExtenders,
 } from '@plone/volto/helpers';
+import { hideHandler } from '@plone/volto/helpers/Blocks/Blocks';
 import dragSVG from '@plone/volto/icons/drag.svg';
 import { Button } from 'semantic-ui-react';
 import includes from 'lodash/includes';
@@ -28,14 +29,6 @@ const messages = defineMessages({
 });
 
 const EditBlockWrapper = (props) => {
-  const hideHandler = (data) => {
-    return (
-      !!data.fixed ||
-      (!config.experimental.addBlockButton.enabled &&
-        !(blockHasValue(data) && props.blockProps.editable))
-    );
-  };
-
   const { intl, blockProps, draginfo, children } = props;
   const {
     allowedBlocks,
diff --git a/packages/volto/src/components/manage/Blocks/Block/Order/Item.jsx b/packages/volto/src/components/manage/Blocks/Block/Order/Item.jsx
index 5580fc416f..5b4cc766b4 100644
--- a/packages/volto/src/components/manage/Blocks/Block/Order/Item.jsx
+++ b/packages/volto/src/components/manage/Blocks/Block/Order/Item.jsx
@@ -2,10 +2,12 @@ import React, { forwardRef } from 'react';
 import classNames from 'classnames';
 import { useDispatch, useSelector } from 'react-redux';
 import { includes } from 'lodash';
+import isBoolean from 'lodash/isBoolean';
 import cx from 'classnames';
 import { Icon } from '@plone/volto/components';
 import { setUIState } from '@plone/volto/actions';
 import config from '@plone/volto/registry';
+import { hideHandler } from '@plone/volto/helpers/Blocks/Blocks';
 
 import deleteSVG from '@plone/volto/icons/delete.svg';
 import dragSVG from '@plone/volto/icons/drag.svg';
@@ -39,6 +41,11 @@ export const Item = forwardRef(
     const gridSelected = useSelector((state) => state.form.ui.gridSelected);
     const dispatch = useDispatch();
 
+    const visible = !hideHandler(data);
+    const required = isBoolean(data.required)
+      ? data.required
+      : includes(config.blocks.requiredBlocks, data.type);
+
     return (
       <li
         className={classNames(
@@ -91,6 +98,9 @@ export const Item = forwardRef(
           <button
             ref={ref}
             {...handleProps}
+            style={{
+              visibility: visible ? 'visible' : 'hidden',
+            }}
             className={classNames('action', 'drag')}
             tabIndex={0}
             data-cypress="draggable-handle"
@@ -112,7 +122,7 @@ export const Item = forwardRef(
             {data?.plaintext ||
               config.blocks.blocksConfig[data?.['@type']]?.title}
           </span>
-          {!clone && onRemove && (
+          {!clone && onRemove && !required && (
             <button
               onClick={onRemove}
               className={classNames('action', 'delete')}
diff --git a/packages/volto/src/helpers/Blocks/Blocks.js b/packages/volto/src/helpers/Blocks/Blocks.js
index e863bfc231..a4f05db221 100644
--- a/packages/volto/src/helpers/Blocks/Blocks.js
+++ b/packages/volto/src/helpers/Blocks/Blocks.js
@@ -73,6 +73,19 @@ export function blockHasValue(data) {
   }
   return check(data);
 }
+/**
+ * Pluggable method to test if a block has a set value (any non-empty value)
+ * @function hideHandler
+ * @param {Object} data Block data
+ * @return {boolean} True if block has fixed attribute, or if the addBlockButton is disabled or block having value is not editable
+ */
+export const hideHandler = (data) => {
+  return (
+    !!data.fixed ||
+    (!config.experimental.addBlockButton.enabled &&
+      !(blockHasValue(data) && data.editable))
+  );
+};
 
 /**
  * Get block pairs of [id, block] from content properties

From 10fb29c1dfcb0e5614cecb0ae2c65865de41aefa Mon Sep 17 00:00:00 2001
From: alihamza1221 <alihamza77065@gmail.com>
Date: Fri, 22 Nov 2024 11:09:53 +0500
Subject: [PATCH 2/4] fixed test cases

---
 packages/volto/news/6481.bugfix                          | 1 +
 .../src/components/manage/Blocks/Block/BlocksForm.jsx    | 1 +
 .../components/manage/Blocks/Block/EditBlockWrapper.jsx  | 2 +-
 .../src/components/manage/Blocks/Block/Order/Item.jsx    | 9 +++++----
 .../src/components/manage/Blocks/Block/Order/Order.jsx   | 2 ++
 .../Blocks/Block/__snapshots__/BlocksForm.test.jsx.snap  | 2 ++
 packages/volto/src/helpers/Blocks/Blocks.js              | 9 +++++----
 7 files changed, 17 insertions(+), 9 deletions(-)
 create mode 100644 packages/volto/news/6481.bugfix

diff --git a/packages/volto/news/6481.bugfix b/packages/volto/news/6481.bugfix
new file mode 100644
index 0000000000..6def19193f
--- /dev/null
+++ b/packages/volto/news/6481.bugfix
@@ -0,0 +1 @@
+Fixed Order blocks in sidebar doesn't respect layout restrictions by setting appropriate handlers in `Item.jsx`. @alihamza1221
\ No newline at end of file
diff --git a/packages/volto/src/components/manage/Blocks/Block/BlocksForm.jsx b/packages/volto/src/components/manage/Blocks/Block/BlocksForm.jsx
index 65d3f6fb0d..ee49a900e9 100644
--- a/packages/volto/src/components/manage/Blocks/Block/BlocksForm.jsx
+++ b/packages/volto/src/components/manage/Blocks/Block/BlocksForm.jsx
@@ -283,6 +283,7 @@ const BlocksForm = (props) => {
               onDeleteBlock={onDeleteBlock}
               onSelectBlock={onSelectBlock}
               removable
+              editable={editable}
               errors={blocksErrors}
             />
           </div>,
diff --git a/packages/volto/src/components/manage/Blocks/Block/EditBlockWrapper.jsx b/packages/volto/src/components/manage/Blocks/Block/EditBlockWrapper.jsx
index 249e5dbd56..8e0577e1ea 100644
--- a/packages/volto/src/components/manage/Blocks/Block/EditBlockWrapper.jsx
+++ b/packages/volto/src/components/manage/Blocks/Block/EditBlockWrapper.jsx
@@ -52,7 +52,7 @@ const EditBlockWrapper = (props) => {
 
   const data = applyBlockDefaults({ data: originalData, ...blockProps, intl });
 
-  const visible = selected && !hideHandler(data);
+  const visible = selected && !hideHandler(data, editable);
 
   const required = isBoolean(data.required)
     ? data.required
diff --git a/packages/volto/src/components/manage/Blocks/Block/Order/Item.jsx b/packages/volto/src/components/manage/Blocks/Block/Order/Item.jsx
index 5b4cc766b4..d18200b057 100644
--- a/packages/volto/src/components/manage/Blocks/Block/Order/Item.jsx
+++ b/packages/volto/src/components/manage/Blocks/Block/Order/Item.jsx
@@ -41,10 +41,11 @@ export const Item = forwardRef(
     const gridSelected = useSelector((state) => state.form.ui.gridSelected);
     const dispatch = useDispatch();
 
-    const visible = !hideHandler(data);
-    const required = isBoolean(data.required)
-      ? data.required
-      : includes(config.blocks.requiredBlocks, data.type);
+    const visible = !hideHandler(data, props?.editable);
+
+    const required = isBoolean(data?.required)
+      ? data?.required
+      : includes(config.blocks.requiredBlocks, data?.['@type']);
 
     return (
       <li
diff --git a/packages/volto/src/components/manage/Blocks/Block/Order/Order.jsx b/packages/volto/src/components/manage/Blocks/Block/Order/Order.jsx
index 7c17bba43a..4cbea090d7 100644
--- a/packages/volto/src/components/manage/Blocks/Block/Order/Order.jsx
+++ b/packages/volto/src/components/manage/Blocks/Block/Order/Order.jsx
@@ -17,6 +17,7 @@ export function Order({
   dndKitCore,
   dndKitSortable,
   dndKitUtilities,
+  editable,
   errors,
 }) {
   const [activeId, setActiveId] = useState(null);
@@ -147,6 +148,7 @@ export function Order({
             indentationWidth={indentationWidth}
             onRemove={removable ? () => handleRemove(id) : undefined}
             onSelectBlock={onSelectBlock}
+            editable={editable}
             errors={errors?.[id] || {}}
           />
         ))}
diff --git a/packages/volto/src/components/manage/Blocks/Block/__snapshots__/BlocksForm.test.jsx.snap b/packages/volto/src/components/manage/Blocks/Block/__snapshots__/BlocksForm.test.jsx.snap
index 15c1cb7e5b..d7e3bdab8f 100644
--- a/packages/volto/src/components/manage/Blocks/Block/__snapshots__/BlocksForm.test.jsx.snap
+++ b/packages/volto/src/components/manage/Blocks/Block/__snapshots__/BlocksForm.test.jsx.snap
@@ -153,6 +153,7 @@ exports[`Allow override of blocksConfig 1`] = `
             class="action drag"
             data-cypress="draggable-handle"
             role="button"
+            style="visibility: visible;"
             tabindex="0"
           >
             <svg
@@ -215,6 +216,7 @@ exports[`Allow override of blocksConfig 1`] = `
             class="action drag"
             data-cypress="draggable-handle"
             role="button"
+            style="visibility: visible;"
             tabindex="0"
           >
             <svg
diff --git a/packages/volto/src/helpers/Blocks/Blocks.js b/packages/volto/src/helpers/Blocks/Blocks.js
index a4f05db221..6969c79585 100644
--- a/packages/volto/src/helpers/Blocks/Blocks.js
+++ b/packages/volto/src/helpers/Blocks/Blocks.js
@@ -77,13 +77,14 @@ export function blockHasValue(data) {
  * Pluggable method to test if a block has a set value (any non-empty value)
  * @function hideHandler
  * @param {Object} data Block data
- * @return {boolean} True if block has fixed attribute, or if the addBlockButton is disabled or block having value is not editable
+ * @param {boolean} editable Indicates if is editable
+ * @return {boolean} True if block is fixed
  */
-export const hideHandler = (data) => {
+export const hideHandler = (data, editable) => {
   return (
-    !!data.fixed ||
+    !!data?.fixed ||
     (!config.experimental.addBlockButton.enabled &&
-      !(blockHasValue(data) && data.editable))
+      !(data && blockHasValue(data) && !!editable))
   );
 };
 

From 5095340f220972638e3aba60ce7593a21962cf34 Mon Sep 17 00:00:00 2001
From: Ali Hamza <133019575+alihamza1221@users.noreply.github.com>
Date: Sat, 23 Nov 2024 10:48:59 +0500
Subject: [PATCH 3/4] Update packages/volto/news/6481.bugfix

Co-authored-by: Steve Piercy <web@stevepiercy.com>
---
 packages/volto/news/6481.bugfix | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/volto/news/6481.bugfix b/packages/volto/news/6481.bugfix
index 6def19193f..eca8e72f5f 100644
--- a/packages/volto/news/6481.bugfix
+++ b/packages/volto/news/6481.bugfix
@@ -1 +1 @@
-Fixed Order blocks in sidebar doesn't respect layout restrictions by setting appropriate handlers in `Item.jsx`. @alihamza1221
\ No newline at end of file
+While editing a block, and in the sidebar under the {guilabel}`Settings` tab, when an item has {guilabel}`Required` checked, then it can no longer be deleted under the {guilabel}`Order`. Similarly, when  {guilabel}`Fixed position` is checked, the item's ordered position can no longer be changed. Previously neither option was honored. @alihamza1221
\ No newline at end of file

From 27f437009257d643c27f898371e020dfb26c63bd Mon Sep 17 00:00:00 2001
From: Steve Piercy <web@stevepiercy.com>
Date: Fri, 22 Nov 2024 22:20:27 -0800
Subject: [PATCH 4/4] Add omitted word

---
 packages/volto/news/6481.bugfix | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/volto/news/6481.bugfix b/packages/volto/news/6481.bugfix
index eca8e72f5f..305e76beb3 100644
--- a/packages/volto/news/6481.bugfix
+++ b/packages/volto/news/6481.bugfix
@@ -1 +1 @@
-While editing a block, and in the sidebar under the {guilabel}`Settings` tab, when an item has {guilabel}`Required` checked, then it can no longer be deleted under the {guilabel}`Order`. Similarly, when  {guilabel}`Fixed position` is checked, the item's ordered position can no longer be changed. Previously neither option was honored. @alihamza1221
\ No newline at end of file
+While editing a block, and in the sidebar under the {guilabel}`Settings` tab, when an item has {guilabel}`Required` checked, then it can no longer be deleted under the {guilabel}`Order` tab. Similarly, when  {guilabel}`Fixed position` is checked, the item's ordered position can no longer be changed. Previously neither option was honored. @alihamza1221