From 42a61fde6d4370f2428f4d5cf58b07dd4057590d Mon Sep 17 00:00:00 2001 From: Connor van Spronssen Date: Sat, 11 May 2024 17:18:41 +0200 Subject: [PATCH] Add a container paragraph type --- composer.lock | 4 +- .../base/components/base/BasePageLayout.vue | 41 +++++++++++++++---- .../paragraph/ParagraphContainer.global.vue | 22 ++++++++++ .../ParagraphImage.global.vue} | 0 .../paragraph/ParagraphNotImplemented.vue | 22 ++++++++++ .../ParagraphSubtitle.global.vue} | 0 .../ParagraphTextarea.global.vue} | 0 .../ParagraphTitle.global.vue} | 0 .../nodes/nodeBasicPage.fragment.gql | 2 + .../paragraphContainer.fragment.gql | 14 +++++++ .../ParagraphSubtitle.global.vue} | 0 .../ParagraphTitle.global.vue} | 0 12 files changed, 94 insertions(+), 11 deletions(-) create mode 100644 frontend/base/components/paragraph/ParagraphContainer.global.vue rename frontend/base/components/{global/ParagraphImage.vue => paragraph/ParagraphImage.global.vue} (100%) create mode 100644 frontend/base/components/paragraph/ParagraphNotImplemented.vue rename frontend/base/components/{global/ParagraphSubtitle.vue => paragraph/ParagraphSubtitle.global.vue} (100%) rename frontend/base/components/{global/ParagraphTextarea.vue => paragraph/ParagraphTextarea.global.vue} (100%) rename frontend/base/components/{global/ParagraphTitle.vue => paragraph/ParagraphTitle.global.vue} (100%) create mode 100644 frontend/base/queries/fragments/paragraphs/paragraphContainer.fragment.gql rename frontend/themes/default/components/{global/ParagraphSubtitle.vue => paragraph/ParagraphSubtitle.global.vue} (100%) rename frontend/themes/default/components/{global/ParagraphTitle.vue => paragraph/ParagraphTitle.global.vue} (100%) diff --git a/composer.lock b/composer.lock index 7da4c75..b82f839 100644 --- a/composer.lock +++ b/composer.lock @@ -993,7 +993,7 @@ "source": { "type": "git", "url": "https://git.drupalcode.org/project/nuxtify", - "reference": "e2686e7505d20738c1558c46f121a4ddebe2cf4e" + "reference": "259541680c91d40606eb98eddca871b2389a5553" }, "require": { "cweagans/composer-patches": "^1.7", @@ -1080,7 +1080,7 @@ "issues": "https://drupal.org/project/issues/nuxtify", "source": "https://git.drupalcode.org/project/nuxtify" }, - "time": "2024-05-10T15:41:15+00:00" + "time": "2024-05-11T15:16:18+00:00" }, { "name": "doctrine/annotations", diff --git a/frontend/base/components/base/BasePageLayout.vue b/frontend/base/components/base/BasePageLayout.vue index 6f17388..89b19f4 100644 --- a/frontend/base/components/base/BasePageLayout.vue +++ b/frontend/base/components/base/BasePageLayout.vue @@ -59,6 +59,36 @@ const layout = computed(() => { return sections }) + +const instance = getCurrentInstance() +const defaultComponent = resolveComponent('ParagraphNotImplemented') + +function doesComponentExist(component: ParagraphUnion) { + return !!instance?.appContext.components[component.__typename ?? ''] +} + +function getDynamicComponent(component: ParagraphUnion) { + if (component.__typename === 'ParagraphFromLibrary') + return component.reusableParagraph.paragraphs.__typename + + if (!doesComponentExist(component)) + return defaultComponent + + return component.__typename || 'ParagraphNotImplemented' +} + +function getComponentProps(component: ParagraphUnion) { + if (component.__typename === 'ParagraphFromLibrary') { + const { __typename, composition, ...sanitisedComponent } = component.reusableParagraph.paragraphs + return sanitisedComponent + } + + if (!doesComponentExist(component)) + return { props: { type: component } } + + const { __typename, composition, ...sanitisedComponent } = component + return sanitisedComponent +} diff --git a/frontend/base/components/paragraph/ParagraphContainer.global.vue b/frontend/base/components/paragraph/ParagraphContainer.global.vue new file mode 100644 index 0000000..49d9b9e --- /dev/null +++ b/frontend/base/components/paragraph/ParagraphContainer.global.vue @@ -0,0 +1,22 @@ + + + diff --git a/frontend/base/components/global/ParagraphImage.vue b/frontend/base/components/paragraph/ParagraphImage.global.vue similarity index 100% rename from frontend/base/components/global/ParagraphImage.vue rename to frontend/base/components/paragraph/ParagraphImage.global.vue diff --git a/frontend/base/components/paragraph/ParagraphNotImplemented.vue b/frontend/base/components/paragraph/ParagraphNotImplemented.vue new file mode 100644 index 0000000..1041ed6 --- /dev/null +++ b/frontend/base/components/paragraph/ParagraphNotImplemented.vue @@ -0,0 +1,22 @@ + + + diff --git a/frontend/base/components/global/ParagraphSubtitle.vue b/frontend/base/components/paragraph/ParagraphSubtitle.global.vue similarity index 100% rename from frontend/base/components/global/ParagraphSubtitle.vue rename to frontend/base/components/paragraph/ParagraphSubtitle.global.vue diff --git a/frontend/base/components/global/ParagraphTextarea.vue b/frontend/base/components/paragraph/ParagraphTextarea.global.vue similarity index 100% rename from frontend/base/components/global/ParagraphTextarea.vue rename to frontend/base/components/paragraph/ParagraphTextarea.global.vue diff --git a/frontend/base/components/global/ParagraphTitle.vue b/frontend/base/components/paragraph/ParagraphTitle.global.vue similarity index 100% rename from frontend/base/components/global/ParagraphTitle.vue rename to frontend/base/components/paragraph/ParagraphTitle.global.vue diff --git a/frontend/base/queries/fragments/nodes/nodeBasicPage.fragment.gql b/frontend/base/queries/fragments/nodes/nodeBasicPage.fragment.gql index 8d6cd90..0ae0945 100644 --- a/frontend/base/queries/fragments/nodes/nodeBasicPage.fragment.gql +++ b/frontend/base/queries/fragments/nodes/nodeBasicPage.fragment.gql @@ -4,6 +4,7 @@ #import "~/base/queries/fragments/paragraphs/paragraphUnion.fragment.gql" #import "~/base/queries/fragments/paragraphs/paragraphFromLibrary.fragment.gql" +#import "~/base/queries/fragments/paragraphs/paragraphContainer.fragment.gql" fragment nodeBasicPage on NodeBasicPage { title @@ -16,6 +17,7 @@ fragment nodeBasicPage on NodeBasicPage { layout { ...ParagraphUnion ...paragraphFromLibrary + ...paragraphContainer } translations { path diff --git a/frontend/base/queries/fragments/paragraphs/paragraphContainer.fragment.gql b/frontend/base/queries/fragments/paragraphs/paragraphContainer.fragment.gql new file mode 100644 index 0000000..17013e3 --- /dev/null +++ b/frontend/base/queries/fragments/paragraphs/paragraphContainer.fragment.gql @@ -0,0 +1,14 @@ +#import "~/base/queries/fragments/paragraphs/paragraphUnion.fragment.gql" + +fragment paragraphContainer on ParagraphContainer { + __typename + paragraphs { + ...ParagraphUnion + } + composition { + position { + parentId + region + } + } +} diff --git a/frontend/themes/default/components/global/ParagraphSubtitle.vue b/frontend/themes/default/components/paragraph/ParagraphSubtitle.global.vue similarity index 100% rename from frontend/themes/default/components/global/ParagraphSubtitle.vue rename to frontend/themes/default/components/paragraph/ParagraphSubtitle.global.vue diff --git a/frontend/themes/default/components/global/ParagraphTitle.vue b/frontend/themes/default/components/paragraph/ParagraphTitle.global.vue similarity index 100% rename from frontend/themes/default/components/global/ParagraphTitle.vue rename to frontend/themes/default/components/paragraph/ParagraphTitle.global.vue