Add logic to render Paragraphs Library items

Nuxtify-drupal · Apr 14, 2024 · 0c0d106 · 0c0d106
1 parent 32b172c
commit 0c0d106
Show file tree

Hide file tree

Showing 5 changed files with 143 additions and 21 deletions.
diff --git a/composer.lock b/composer.lock
diff --git a/frontend/components/base/PageLayout.vue b/frontend/components/base/PageLayout.vue
@@ -35,8 +35,7 @@ const layout = computed<LayoutSection[]>(() => {
       if (!section.children[child.composition.position.region])
         section.children[child.composition.position.region] = []
 
-      const component = { ...child } as any
-      delete component.composition
+      const component = { ...child }
 
       section.children[child.composition.position.region].push(component)
     }
@@ -84,8 +83,15 @@ const layout = computed<LayoutSection[]>(() => {
         >
           <component
             :is="component.__typename"
+            v-if="component.__typename !== 'ParagraphFromLibrary'"
             v-bind="component"
           />
+
+          <component
+            :is="component.reusableParagraph.paragraphs.__typename"
+            v-else-if="component.__typename === 'ParagraphFromLibrary'"
+            v-bind="component.reusableParagraph.paragraphs"
+          />
         </div>
       </div>
     </div>

diff --git a/frontend/queries/fragments/nodes/nodeBasicPage.fragment.gql b/frontend/queries/fragments/nodes/nodeBasicPage.fragment.gql
@@ -2,11 +2,8 @@
 #import "~/queries/fragments/metatags/metaTagValue.fragment.gql"
 #import "~/queries/fragments/metatags/metaTagProperty.fragment.gql"
 
-#import "~/queries/fragments/paragraphs/paragraphLayout.fragment.gql"
-#import "~/queries/fragments/paragraphs/paragraphTitle.fragment.gql"
-#import "~/queries/fragments/paragraphs/paragraphSubtitle.fragment.gql"
-#import "~/queries/fragments/paragraphs/paragraphTextarea.fragment.gql"
-#import "~/queries/fragments/paragraphs/paragraphImage.fragment.gql"
+#import "~/queries/fragments/paragraphs/paragraphUnion.fragment.gql"
+#import "~/queries/fragments/paragraphs/paragraphFromLibrary.fragment.gql"
 
 fragment nodeBasicPage on NodeBasicPage {
   title
@@ -17,11 +14,8 @@ fragment nodeBasicPage on NodeBasicPage {
     ...metaTagProperty
   }
   layout {
-    ...paragraphLayout
-    ...paragraphTitle
-    ...paragraphSubtitle
-    ...paragraphTextarea
-    ...paragraphImage
+    ...ParagraphUnion
+    ...paragraphFromLibrary
   }
   translations {
     path

diff --git a/frontend/queries/fragments/paragraphs/paragraphFromLibrary.fragment.gql b/frontend/queries/fragments/paragraphs/paragraphFromLibrary.fragment.gql
@@ -0,0 +1,16 @@
+#import "~/queries/fragments/paragraphs/paragraphUnion.fragment.gql"
+
+fragment paragraphFromLibrary on ParagraphFromLibrary {
+  __typename
+  reusableParagraph {
+    paragraphs {
+      ...ParagraphUnion
+    }
+  }
+  composition {
+    position {
+      parentId
+      region
+    }
+  }
+}
diff --git a/frontend/queries/fragments/paragraphs/paragraphUnion.fragment.gql b/frontend/queries/fragments/paragraphs/paragraphUnion.fragment.gql
@@ -0,0 +1,13 @@
+#import "~/queries/fragments/paragraphs/paragraphLayout.fragment.gql"
+#import "~/queries/fragments/paragraphs/paragraphTitle.fragment.gql"
+#import "~/queries/fragments/paragraphs/paragraphSubtitle.fragment.gql"
+#import "~/queries/fragments/paragraphs/paragraphTextarea.fragment.gql"
+#import "~/queries/fragments/paragraphs/paragraphImage.fragment.gql"
+
+fragment ParagraphUnion on ParagraphUnion {
+  ...paragraphLayout
+  ...paragraphTitle
+  ...paragraphSubtitle
+  ...paragraphTextarea
+  ...paragraphImage
+}