feat: output mapped structured data

apps/web/composables/useStructuredData/useStructuredData.ts

@@ -1,6 +1,6 @@
 import type { useStructuredDataReturn } from './types';
 import type { SetLogoMeta, SetProductMetaData, UseStructuredDataState } from './types';
-import { categoryTreeGetters, productGetters, reviewGetters } from '@plentymarkets/shop-api';
+import { categoryTreeGetters, productGetters, reviewGetters, productSeoSettingsGetters } from '@plentymarkets/shop-api';
 import type { CategoryTreeItem, Product } from '@plentymarkets/shop-api';
 import { useProductReviews } from '../useProductReviews';
 import { useProductReviewAverage } from '../useProductReviewAverage';
@@ -66,7 +66,6 @@ export const useStructuredData: useStructuredDataReturn = () => {
     const { data: productReviews } = useProductReviews(productId);
     const { data: reviewAverage } = useProductReviewAverage(productId);
 
-    const manufacturer = productGetters.getManufacturer(product);
     let reviews = null;
     if (reviewAverage.value) {
       reviews = [];
@@ -87,18 +86,13 @@ export const useStructuredData: useStructuredDataReturn = () => {
     const metaObject = {
       '@context': 'https://schema.org',
       '@type': 'Product',
-      // sku: sku,
       name: productGetters.getName(product),
       category: categoryTreeGetters.getName(categoryTree),
       releaseDate: '',
       image: productGetters.getCoverImage(product),
       identifier: productGetters.getId(product),
       description: product.texts.description,
       disambiguatingDescription: '',
-      manufacturer: {
-        '@type': 'Organization',
-        name: manufacturer.externalName,
-      },
       review: reviews,
       aggregateRating: {
         '@type': 'AggregateRating',
@@ -109,7 +103,6 @@ export const useStructuredData: useStructuredDataReturn = () => {
         '@type': 'Offer',
         priceCurrency: productGetters.getSpecialPriceCurrency(product),
         price: Number(price.value),
-        priceValidUntil: productGetters.getVariationAvailableUntil(product),
         url: null,
         priceSpecification: [
           {
@@ -122,10 +115,8 @@ export const useStructuredData: useStructuredDataReturn = () => {
             },
           },
         ],
-        availability: productGetters.isSalable(product)
-          ? 'https://schema.org/InStock'
-          : 'https://schema.org/OutOfStock',
-        itemCondition: null,
+        availability: productSeoSettingsGetters.getMappedAvailability(product),
+        itemCondition: productSeoSettingsGetters.getConditionOfItem(product),
       },
       depth: {
         '@type': 'QuantitativeValue',
@@ -143,7 +134,34 @@ export const useStructuredData: useStructuredDataReturn = () => {
         '@type': 'QuantitativeValue',
         value: productGetters.getWeightG(product),
       },
-    };
+    } as any;
+
+    const manufacturer = productSeoSettingsGetters.getSeoManufacturer(product);
+    if (manufacturer !== '') metaObject.manufacturer = { '@type': 'Organization', name: manufacturer };
+
+    const brand = productSeoSettingsGetters.getBrand(product);
+    if (brand !== '') metaObject.brand = { '@type': 'Brand', name: brand };
+
+    const sku = productSeoSettingsGetters.getSku(product);
+    if (sku !== '') metaObject.sku = sku;
+
+    const gtin = productSeoSettingsGetters.getGtin(product);
+    if (gtin !== '') metaObject.gtin = gtin;
+
+    const gtin8 = productSeoSettingsGetters.getGtin8(product);
+    if (gtin8 !== '') metaObject.gtin8 = gtin8;
+
+    const gtin13 = productSeoSettingsGetters.getGtin13(product);
+    if (gtin13 !== '') metaObject.gtin13 = gtin13;
+
+    const isbn = productSeoSettingsGetters.getIsbn(product);
+    if (isbn !== '') metaObject.isbn = productSeoSettingsGetters.getIsbn(product);
+
+    const mpn = productSeoSettingsGetters.getMpn(product);
+    if (mpn !== '') metaObject.mpn = mpn;
+
+    const priceValidUntil = productSeoSettingsGetters.getPriceValidUntil(product);
+    if (priceValidUntil !== '') metaObject.offers.priceValidUntil = priceValidUntil;
 
     if (product.prices?.rrp) {
       metaObject.offers.priceSpecification.push({
@@ -160,7 +178,7 @@ export const useStructuredData: useStructuredDataReturn = () => {
       script: [
         {
           type: 'application/ld+json',
-          innerHTML: JSON.stringify(metaObject),
+          innerHTML: JSON.stringify(metaObject, null, 4),
         },
       ],
     });

docs/changelog/changelog_en.md

@@ -9,7 +9,8 @@
 - Added progress loading indicator animation when navigating between pages.
 - Added Zoom functionality to product images.
 - New Json Editor
-- Added cookie consent management helper functions read more at https://pwa-docs.plentymarkets.com/guide/how-to/cookie#read-and-react-to-a-registered-cookie
+- Added cookie consent management helper functions read more at https://pwa-docs.plentymarkets.com/guide/how-to/cookie#read-and-react-to-a-registered-cookie.
+- Added dynamic structured data from the SEO config.
 
 ### 👷 Changed
 

package.json

@@ -31,7 +31,7 @@
     "lhci:mobile": "lhci autorun"
   },
   "dependencies": {
-    "@plentymarkets/shop-api": "^0.75.0",
+    "@plentymarkets/shop-api": "^0.76.0",
     "@types/applepayjs": "^14.0.8",
     "@types/drift-zoom": "^1.5.2",
     "@types/googlepay": "^0.7.6",

yarn.lock

@@ -4237,7 +4237,7 @@ __metadata:
     "@nuxt/test-utils": ^3.13.1
     "@nuxtjs/turnstile": ^0.8.0
     "@paypal/paypal-js": 8.1.0
-    "@plentymarkets/shop-api": ^0.75.0
+    "@plentymarkets/shop-api": ^0.76.0
     "@types/applepayjs": ^14.0.8
     "@types/drift-zoom": ^1.5.2
     "@types/googlepay": ^0.7.6
@@ -4273,14 +4273,14 @@ __metadata:
   languageName: unknown
   linkType: soft
 
-"@plentymarkets/shop-api@npm:^0.75.0":
-  version: 0.75.0
-  resolution: "@plentymarkets/shop-api@npm:0.75.0::__archiveUrl=https%3A%2F%2Fnpm.pkg.github.com%2Fdownload%2F%40plentymarkets%2Fshop-api%2F0.75.0%2F8a892c521664c403478a7c0c32472e68673e0174"
+"@plentymarkets/shop-api@npm:^0.76.0":
+  version: 0.76.0
+  resolution: "@plentymarkets/shop-api@npm:0.76.0::__archiveUrl=https%3A%2F%2Fnpm.pkg.github.com%2Fdownload%2F%40plentymarkets%2Fshop-api%2F0.76.0%2Fd646be8eaac7864ff677d3239cc579c4861db501"
   dependencies:
     "@vue-storefront/middleware": ^3.10.0
     axios: ^1.7.7
     consola: ^3.2.3
-  checksum: 55f966d8ca08fa60e3e4ef09165430f5a6878e76d44fcea13ef41a595b65bd345bca4d5cdb6a434e509a93614e694f103a2bc0ed6f9fe41593661c8a9c4b1e07
+  checksum: 4ad0886188834ee489d53aae347704292b93b6f44dc580553b710bccccd130fe509f9e9d949b2477fe7f85891851e1a61f106f438200244e421eb6b322d64200
   languageName: node
   linkType: hard