feat: add contitions to use linking feature if the field 'Allow linki…

…ng' is selected

src/components/manage/Blocks/Accordion/Schema.js

@@ -43,6 +43,14 @@ const messages = defineMessages({
     id: 'Allow multiple panels open at a time',
     defaultMessage: 'Allow multiple panels open at a time',
   },
+  allow_linking: {
+    id: 'Allow linking',
+    defaultMessage: 'Allow linking',
+  },
+  allow_linking_description: {
+    id: 'Allow linking to the last accordion item selected',
+    defaultMessage: 'Allow linking to the last accordion item selected',
+  },
   Theme: {
     id: 'Theme',
     defaultMessage: 'Theme',
@@ -99,6 +107,7 @@ export const AccordionBlockSchema = ({ intl }) => ({
         'right_arrows',
         'collapsed',
         'non_exclusive',
+        'allow_linking',
       ],
     },
   ],
@@ -142,6 +151,12 @@ export const AccordionBlockSchema = ({ intl }) => ({
       type: 'boolean',
       default: true,
     },
+    allow_linking: {
+      title: intl.formatMessage(messages.allow_linking),
+      description: intl.formatMessage(messages.allow_linking_description),
+      type: 'boolean',
+      default: true,
+    },
   },
   required: ['title'],
 });

src/components/manage/Blocks/Accordion/View.jsx

@@ -76,7 +76,7 @@ const View = (props) => {
   };
 
   const scrollToElement = () => {
-    if (!!activePanels) {
+    if (!!activePanels && data.allow_linking && !!activePanels[0].length) {
       let element = document.getElementById(
         activePanels[activePanels.length - 1],
       );
@@ -94,11 +94,21 @@ const View = (props) => {
   }, []);
 
   React.useEffect(() => {
-    return data.collapsed
-      ? activePanels && setActivePanel(activePanels || [])
-      : setActivePanel([firstIdFromPanels, ...(activePanels || [])]);
+    if (data.allow_linking) {
+      if (data.collapsed) {
+        setActivePanel(activePanels || []);
+      } else {
+        if (!!activePanels && !!activePanels[0].length) {
+          setActivePanel(activePanels || []);
+        } else {
+          setActivePanel([firstIdFromPanels, ...(activePanels || [])]);
+        }
+      }
+    } else {
+      setActiveIndex(data.collapsed ? [] : [0]);
+    }
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [data.collapsed]);
+  }, [data.collapsed, data.allow_linking]);
 
   return (
     <div className="accordion-block">