From 40fe4db39e4166c42f0258912c3527eb3a80746e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?V=C3=ADctor=20Fern=C3=A1ndez=20de=20Alba?=
 <sneridagh@gmail.com>
Date: Thu, 29 Jun 2023 15:14:01 +0200
Subject: [PATCH] Add accordion block (#108)

---
 news/108.feature                           |  1 +
 src/components/Blocks/Accordion/schema.jsx | 11 ++++++++
 src/components/Blocks/schema.js            |  1 +
 src/icons/block_icn_accordion.svg          |  1 +
 src/index.js                               | 29 +++++++++++++++++++++-
 src/theme/_layout.scss                     | 10 ++++++++
 src/theme/blocks/_accordion.scss           |  4 +++
 src/theme/main.scss                        |  1 +
 8 files changed, 57 insertions(+), 1 deletion(-)
 create mode 100644 news/108.feature
 create mode 100644 src/components/Blocks/Accordion/schema.jsx
 create mode 100755 src/icons/block_icn_accordion.svg
 create mode 100644 src/theme/blocks/_accordion.scss

diff --git a/news/108.feature b/news/108.feature
new file mode 100644
index 00000000..c746ba9f
--- /dev/null
+++ b/news/108.feature
@@ -0,0 +1 @@
+Add accordion @sneridagh
diff --git a/src/components/Blocks/Accordion/schema.jsx b/src/components/Blocks/Accordion/schema.jsx
new file mode 100644
index 00000000..f731d93c
--- /dev/null
+++ b/src/components/Blocks/Accordion/schema.jsx
@@ -0,0 +1,11 @@
+export function AccordionSchemaEnhancer({ schema, formData, intl }) {
+  // Opinionated removal of the options fieldset
+  schema.fieldsets = schema.fieldsets.filter((item) => item.id !== 'options');
+  // Some other opinionated defaults
+  schema.required = [];
+  schema.properties.right_arrows.default = true;
+  schema.properties.collapsed.default = false;
+  schema.properties.non_exclusive.default = false;
+
+  return schema;
+}
diff --git a/src/components/Blocks/schema.js b/src/components/Blocks/schema.js
index 3de42df4..598da3ff 100644
--- a/src/components/Blocks/schema.js
+++ b/src/components/Blocks/schema.js
@@ -33,5 +33,6 @@ export const defaultStylingSchema = ({ schema, formData, intl }) => {
     colors,
     default: defaultBGColor,
   };
+
   return schema;
 };
diff --git a/src/icons/block_icn_accordion.svg b/src/icons/block_icn_accordion.svg
new file mode 100755
index 00000000..8a355240
--- /dev/null
+++ b/src/icons/block_icn_accordion.svg
@@ -0,0 +1 @@
+<svg id="Ebene_1" data-name="Ebene 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 36 36"><polygon points="30.16 19.36 33.44 16.03 26.88 16.03 30.16 19.36"/><polygon points="30.09 8.02 26.88 11.35 33.44 11.35 30.09 8.02"/><polygon points="30.16 27.5 33.44 24.17 26.88 24.17 30.16 27.5"/><polygon points="2.79 12.98 4.79 12.98 4.79 6.68 24.46 6.68 24.46 4.68 2.79 4.68 2.79 12.98"/><polygon points="2.79 21.12 4.79 21.12 4.79 18.03 24.46 18.03 24.46 16.03 2.79 16.03 2.79 21.12"/><polygon points="2.79 28.61 4.79 28.61 4.79 26.17 24.46 26.17 24.46 24.17 2.79 24.17 2.79 28.61"/></svg>
\ No newline at end of file
diff --git a/src/index.js b/src/index.js
index 5f5dadf0..d246ea1b 100644
--- a/src/index.js
+++ b/src/index.js
@@ -11,9 +11,12 @@ import Container from './components/Atoms/Container/Container';
 import TopSideFacets from './components/Blocks/Search/TopSideFacets';
 
 import GridListingBlockTemplate from './components/Blocks/Listing/GridTemplate';
+import { ButtonStylingSchema } from './components/Blocks/Button/schema';
+
+import { AccordionSchemaEnhancer } from './components/Blocks/Accordion/schema';
 
 import gridSVG from './icons/block_icn_grid.svg';
-import { ButtonStylingSchema } from './components/Blocks/Button/schema';
+import accordionSVG from './icons/block_icn_accordion.svg';
 
 const BG_COLORS = [
   { name: 'transparent', label: 'Transparent' },
@@ -119,6 +122,30 @@ const applyConfig = (config) => {
     },
   ];
 
+  config.blocks.blocksConfig.accordion = {
+    ...config.blocks.blocksConfig.accordion,
+    mostUsed: true,
+    icon: accordionSVG,
+    allowedBlocks: ['slate', 'teaser', 'image', 'listing', 'slateTable'],
+    colors: BG_COLORS,
+    schemaEnhancer: composeSchema(
+      AccordionSchemaEnhancer,
+      defaultStylingSchema,
+    ),
+    sidebarTab: 1,
+  };
+
+  config.blocks.blocksConfig.accordion.blocksConfig = {
+    ...config.blocks.blocksConfig,
+    teaser: {
+      ...config.blocks.blocksConfig.teaser,
+      schemaEnhancer: composeSchema(
+        gridTeaserDisableStylingSchema,
+        teaserSchemaEnhancer,
+      ),
+    },
+  };
+
   config.blocks.blocksConfig.__grid = {
     ...config.blocks.blocksConfig.__grid,
     colors: BG_COLORS,
diff --git a/src/theme/_layout.scss b/src/theme/_layout.scss
index a383d996..1af41e48 100644
--- a/src/theme/_layout.scss
+++ b/src/theme/_layout.scss
@@ -247,6 +247,16 @@ body.has-toolbar.has-sidebar .block .ui.basic.button.delete-button {
   margin-right: -30px !important;
 }
 
+#page-add,
+#page-edit {
+  .block-editor-accordion {
+    [class*='block-editor-'] {
+      margin-right: 0;
+      margin-left: 0;
+    }
+  }
+}
+
 .contenttype-file {
   a {
     text-decoration: underline;
diff --git a/src/theme/blocks/_accordion.scss b/src/theme/blocks/_accordion.scss
new file mode 100644
index 00000000..81693bd9
--- /dev/null
+++ b/src/theme/blocks/_accordion.scss
@@ -0,0 +1,4 @@
+// Adjust in case the grid add-on is still in place.
+.block.accordion [data-rbd-draggable-context-id] {
+  margin-bottom: 2rem;
+}
diff --git a/src/theme/main.scss b/src/theme/main.scss
index 8b46f5d1..f8b3fe49 100644
--- a/src/theme/main.scss
+++ b/src/theme/main.scss
@@ -12,6 +12,7 @@
 @import 'content';
 @import 'footer';
 
+@import 'blocks/accordion';
 @import 'blocks/image';
 @import 'blocks/introduction';
 @import 'blocks/slider';