diff --git a/packages/drupal/gutenberg_blocks/src/blocks/cta.tsx b/packages/drupal/gutenberg_blocks/src/blocks/cta.tsx index c0bbaacdc..2ee5fe308 100644 --- a/packages/drupal/gutenberg_blocks/src/blocks/cta.tsx +++ b/packages/drupal/gutenberg_blocks/src/blocks/cta.tsx @@ -5,7 +5,7 @@ import { RichText, } from 'wordpress__block-editor'; import { registerBlockType } from 'wordpress__blocks'; -import { PanelBody, ToggleControl } from 'wordpress__components'; +import { PanelBody, SelectControl, ToggleControl } from 'wordpress__components'; import { compose, withState } from 'wordpress__compose'; // @ts-ignore @@ -37,6 +37,14 @@ registerBlockType('custom/cta', { openInNewTab: { type: 'boolean', }, + icon: { + type: 'string', + default: 'NONE', + }, + iconPlacement: { + type: 'string', + default: 'AFTER', + }, }, // @ts-ignore edit: compose(withState({}))((props) => { @@ -116,6 +124,35 @@ registerBlockType('custom/cta', { }); }} /> + { + props.setAttributes({ + icon, + }); + }} + /> + {typeof props.attributes.icon !== 'undefined' && + props.attributes.icon !== 'NONE' && ( + { + props.setAttributes({ + iconPlacement, + }); + }} + /> + )} diff --git a/packages/drupal/test_content/content/node/a397ca48-8fad-411e-8901-0eba2feb989c.yml b/packages/drupal/test_content/content/node/a397ca48-8fad-411e-8901-0eba2feb989c.yml index de316ba27..99d4c3f38 100644 --- a/packages/drupal/test_content/content/node/a397ca48-8fad-411e-8901-0eba2feb989c.yml +++ b/packages/drupal/test_content/content/node/a397ca48-8fad-411e-8901-0eba2feb989c.yml @@ -88,9 +88,10 @@ default: - + + + -

diff --git a/packages/schema/src/fragments/PageContent/BlockCta.gql b/packages/schema/src/fragments/PageContent/BlockCta.gql index 2dae0fda2..07969df8e 100644 --- a/packages/schema/src/fragments/PageContent/BlockCta.gql +++ b/packages/schema/src/fragments/PageContent/BlockCta.gql @@ -2,4 +2,6 @@ fragment BlockCta on BlockCta { url text openInNewTab + icon + iconPlacement } diff --git a/packages/schema/src/schema.graphql b/packages/schema/src/schema.graphql index 9300972cb..fb8946c90 100644 --- a/packages/schema/src/schema.graphql +++ b/packages/schema/src/schema.graphql @@ -242,6 +242,19 @@ type BlockCta @type(id: "custom/cta") { url: Url @resolveEditorBlockAttribute(key: "url") text: String @resolveEditorBlockAttribute(key: "text") openInNewTab: Boolean @resolveEditorBlockAttribute(key: "openInNewTab") + icon: CTAIconType @resolveEditorBlockAttribute(key: "icon") + iconPlacement: CTAIconPlacement + @resolveEditorBlockAttribute(key: "iconPlacement") +} + +enum CTAIconType { + NONE + ARROW +} + +enum CTAIconPlacement { + AFTER + BEFORE } input PaginationInput { diff --git a/tests/schema/specs/blocks.spec.ts b/tests/schema/specs/blocks.spec.ts index 9a246e3f6..dd1bef7e6 100644 --- a/tests/schema/specs/blocks.spec.ts +++ b/tests/schema/specs/blocks.spec.ts @@ -52,6 +52,8 @@ test('Blocks', async () => { url text openInNewTab + icon + iconPlacement } } } @@ -145,18 +147,24 @@ test('Blocks', async () => { }, { "__typename": "BlockCta", + "icon": null, + "iconPlacement": null, "openInNewTab": null, "text": "Internal CTA", "url": "/en/drupal", }, { "__typename": "BlockCta", + "icon": "ARROW", + "iconPlacement": null, "openInNewTab": true, "text": "External CTA", "url": "https://www.google.com", }, { "__typename": "BlockCta", + "icon": "ARROW", + "iconPlacement": "BEFORE", "openInNewTab": null, "text": "CTA with link to media", "url": "/media/[numeric]", @@ -205,6 +213,8 @@ test('Blocks', async () => { }, { "__typename": "BlockCta", + "icon": null, + "iconPlacement": null, "openInNewTab": null, "text": null, "url": null,