@okendo/shopify-hydrogen 1.2.1 → 1.2.2

package/dist/esnext/client-components/OkendoClientStarRating.client.js

@@ -2,15 +2,16 @@ import React from 'react';
 import { OkendoWidgetClient } from './OkendoWidget.client';
 import { getOkendoProductId } from '../shared/productUtils';
 import { widgetConfigurationError, widgetMetafieldError } from '../shared/errorUtils';
+import { logger } from '../shared/logger';
 export const OkendoClientStarRating = (props) => {
     const { productId, okendoStarRatingSnippet } = props;
     const okendoProductId = getOkendoProductId(productId);
     if (!okendoProductId) {
-        console.error(widgetConfigurationError('OkendoClientStarRating', 'productId was not provided'));
+        logger.error(widgetConfigurationError('OkendoClientStarRating', 'productId was not provided'));
         return null;
     }
     if (!okendoStarRatingSnippet?.value) {
-        console.warn(widgetMetafieldError('OkendoStarRating', 'StarRatingSnippet'));
+        logger.warn(widgetMetafieldError('OkendoStarRating', 'StarRatingSnippet'));
     }
     const dataAttributes = {
         'data-oke-star-rating': '',

package/dist/esnext/client-components/OkendoWidget.client.js

@@ -2,21 +2,23 @@ import React, { useEffect, useRef } from 'react';
 export const OkendoWidgetClient = (props) => {
     const { dataAttributes, metafieldContent = '' } = props;
     const widgetContainer = useRef(null);
-    const initializeReviewsWidget = () => {
+    const initializeWidget = () => {
         if (widgetContainer.current) {
-            window.okeWidgetApi.initWidget(widgetContainer.current);
+            // `forceReinitialisation` must be true because we can expect `data-oke-rendered`
+            // to be present on already-initialised widget snippets.
+            window.okeWidgetApi.initWidget(widgetContainer.current, true);
         }
     };
     useEffect(() => {
         if (window.okeWidgetApi && widgetContainer.current) {
-            initializeReviewsWidget();
+            initializeWidget();
         }
         else {
-            document.addEventListener('oke-script-loaded', initializeReviewsWidget);
+            document.addEventListener('oke-script-loaded', initializeWidget);
         }
         return () => {
-            document.removeEventListener('oke-script-loaded', initializeReviewsWidget);
+            document.removeEventListener('oke-script-loaded', initializeWidget);
         };
-    }, []);
+    }, [dataAttributes]);
     return (React.createElement("div", { ref: widgetContainer, ...dataAttributes, dangerouslySetInnerHTML: { __html: metafieldContent } }));
 };

package/dist/esnext/components/OkendoProvider.server.js

@@ -3,6 +3,7 @@ import { fetchSync, useShopQuery, gql, CacheShort } from '@shopify/hydrogen';
 import { Head } from '@shopify/hydrogen';
 import { okendoError } from '../shared/errorUtils';
 import { setInOkendoRequestContext } from '../shared/server/requestUtils';
+import { logger } from '../shared/logger';
 const kDefaultOkendoApiDomain = 'api.okendo.io/v1';
 const kDefaultOkendoCdnDomain = 'cdn-static.okendo.io';
 export const OkendoProvider = (props) => {
@@ -11,7 +12,7 @@ export const OkendoProvider = (props) => {
     const url = `https://${apiDomain ?? kDefaultOkendoApiDomain}/stores/${subscriberId}/widget_plus_settings`;
     const settingsResponse = fetchSync(url, { preload: true });
     if (!settingsResponse.ok) {
-        console.error(okendoError('Failed to retrieve subscriber settings. Please check your environment variables.'));
+        logger.error(okendoError('Failed to retrieve subscriber settings. Please check your environment variables.'));
         setInOkendoRequestContext('setupFailed', true);
         return null;
     }
@@ -24,7 +25,7 @@ export const OkendoProvider = (props) => {
         preload: true
     });
     if (!initScriptResponse.ok) {
-        console.error(okendoError('Failed to retrieve widget initialization script.'));
+        logger.error(okendoError('Failed to retrieve widget initialization script.'));
         setInOkendoRequestContext('setupFailed', true);
         return null;
     }
@@ -36,14 +37,14 @@ export const OkendoProvider = (props) => {
             ? `/products/${product.productHandle}/${product.variantId ? '?variantId=' + product.variantId : ''}`
             : undefined;
     // Get pre-rendered style settings.
-    const query = gql `
-        query metafields {
-            shop {
-                widgetPreRenderStyleTags: metafield(namespace: "okendo", key: "WidgetPreRenderStyleTags") {
-                    value
-                }
-            }
-        }
+    const query = gql `
+        query metafields {
+            shop {
+                widgetPreRenderStyleTags: metafield(namespace: "okendo", key: "WidgetPreRenderStyleTags") {
+                    value
+                }
+            }
+        }
     `;
     const { data: { shop: { widgetPreRenderStyleTags } } } = useShopQuery({
         query: query,
@@ -51,7 +52,7 @@ export const OkendoProvider = (props) => {
     });
     const preRenderStyleTags = widgetPreRenderStyleTags?.value ?? '';
     if (!preRenderStyleTags) {
-        console.warn(okendoError('Failed to retrieve pre-rendered widget style settings.'));
+        logger.warn(okendoError('Failed to retrieve pre-rendered widget style settings.'));
     }
     return (React.createElement(React.Fragment, null,
         React.createElement(Head, null,

package/dist/esnext/components/OkendoReviewsWidget.server.js

@@ -4,6 +4,7 @@ import { OkendoWidgetClient } from '../client-components/OkendoWidget.client';
 import { widgetMetafieldError } from '../shared/errorUtils';
 import { getOkendoProductId } from '../shared/productUtils';
 import { useOkendoRequestContext } from '../shared/server/requestUtils';
+import { logger } from '../shared/logger';
 export const OkendoReviewsWidget = (props) => {
     const { setupFailed } = useOkendoRequestContext();
     if (setupFailed) {
@@ -11,23 +12,23 @@ export const OkendoReviewsWidget = (props) => {
     }
     const { productId } = props;
     const productQuery = productId
-        ? `
-            product(id: $productId) {
-                reviewsWidgetSnippet: metafield(namespace: "okendo", key: "ReviewsWidgetSnippet") {
-                    value
-                }
-            }
+        ? `
+            product(id: $productId) {
+                reviewsWidgetSnippet: metafield(namespace: "okendo", key: "ReviewsWidgetSnippet") {
+                    value
+                }
+            }
         `
         : '';
-    const query = gql `
-        query metafields${productId ? '($productId: ID!)' : ''} {
-            ${productQuery}
-            shop {
-                widgetPreRenderBodyStyleTags: metafield(namespace: "okendo", key: "WidgetPreRenderBodyStyleTags") {
-                    value
-                }
-            }
-        }
+    const query = gql `
+        query metafields${productId ? '($productId: ID!)' : ''} {
+            ${productQuery}
+            shop {
+                widgetPreRenderBodyStyleTags: metafield(namespace: "okendo", key: "WidgetPreRenderBodyStyleTags") {
+                    value
+                }
+            }
+        }
     `;
     const { data: { product, shop } } = useShopQuery({
         query: query,
@@ -37,10 +38,10 @@ export const OkendoReviewsWidget = (props) => {
         }
     });
     if (productId && !product?.reviewsWidgetSnippet?.value) {
-        console.warn(widgetMetafieldError('OkendoReviewsWidget', 'ReviewsWidgetSnippet'));
+        logger.warn(widgetMetafieldError('OkendoReviewsWidget', 'ReviewsWidgetSnippet'));
     }
     if (!shop?.widgetPreRenderBodyStyleTags?.value) {
-        console.warn(widgetMetafieldError('OkendoReviewsWidget', 'WidgetPreRenderBodyStyleTags'));
+        logger.warn(widgetMetafieldError('OkendoReviewsWidget', 'WidgetPreRenderBodyStyleTags'));
     }
     const dataAttributes = {
         'data-oke-widget': ''

package/dist/esnext/components/OkendoStarRating.server.js

@@ -4,6 +4,7 @@ import { OkendoWidgetClient } from '../client-components/OkendoWidget.client';
 import { widgetConfigurationError, widgetMetafieldError } from '../shared/errorUtils';
 import { getOkendoProductId } from '../shared/productUtils';
 import { useOkendoRequestContext } from '../shared/server/requestUtils';
+import { logger } from '../shared/logger';
 export const OkendoStarRating = (props) => {
     const { setupFailed } = useOkendoRequestContext();
     if (setupFailed) {
@@ -12,17 +13,17 @@ export const OkendoStarRating = (props) => {
     const { productId } = props;
     const okendoProductId = getOkendoProductId(productId);
     if (!okendoProductId) {
-        console.error(widgetConfigurationError('OkendoStarRating', 'productId was not provided'));
+        logger.error(widgetConfigurationError('OkendoStarRating', 'productId was not provided'));
         return null;
     }
-    const query = gql `
-        query metafields($productId: ID!) {
-            product(id: $productId) {
-                starRatingSnippet: metafield(namespace: "okendo", key: "StarRatingSnippet") {
-                    value
-                }
-            }
-        }
+    const query = gql `
+        query metafields($productId: ID!) {
+            product(id: $productId) {
+                starRatingSnippet: metafield(namespace: "okendo", key: "StarRatingSnippet") {
+                    value
+                }
+            }
+        }
     `;
     const { data: { product: { starRatingSnippet } } } = useShopQuery({
         query: query,
@@ -32,7 +33,7 @@ export const OkendoStarRating = (props) => {
         }
     });
     if (!starRatingSnippet?.value) {
-        console.warn(widgetMetafieldError('OkendoStarRating', 'StarRatingSnippet'));
+        logger.warn(widgetMetafieldError('OkendoStarRating', 'StarRatingSnippet'));
     }
     const dataAttributes = {
         'data-oke-star-rating': '',

package/dist/esnext/fragments/index.js

@@ -1,11 +1,11 @@
 import { gql } from '@shopify/hydrogen';
-export const OKENDO_PRODUCT_STAR_RATING_FRAGMENT = gql `
-  fragment OkendoStarRatingSnippet on Product {
-    okendoStarRatingSnippet: metafield(
-      namespace: "okendo"
-      key: "StarRatingSnippet"
-    ) {
-      value
-    }
-  }
+export const OKENDO_PRODUCT_STAR_RATING_FRAGMENT = gql `
+  fragment OkendoStarRatingSnippet on Product {
+    okendoStarRatingSnippet: metafield(
+      namespace: "okendo"
+      key: "StarRatingSnippet"
+    ) {
+      value
+    }
+  }
 `;

package/dist/esnext/shared/logger.d.ts

@@ -0,0 +1,14 @@
+export declare const logger: {
+    log: {
+        (...data: any[]): void;
+        (message?: any, ...optionalParams: any[]): void;
+    };
+    warn: {
+        (...data: any[]): void;
+        (message?: any, ...optionalParams: any[]): void;
+    };
+    error: {
+        (...data: any[]): void;
+        (message?: any, ...optionalParams: any[]): void;
+    };
+};

package/dist/esnext/shared/logger.js

@@ -0,0 +1,7 @@
+const isProduction = process.env.NODE_ENV === 'production';
+const noop = () => undefined;
+export const logger = {
+    log: isProduction ? noop : console.log,
+    warn: isProduction ? noop : console.warn,
+    error: console.error
+};

package/package.json

@@ -1,58 +1,58 @@
-{
-    "name": "@okendo/shopify-hydrogen",
-    "version": "1.2.1",
-    "description": "A component library containing Okendo Reviews React components.",
-    "main": "dist/esnext/index.js",
-    "engines": {
-        "node": ">=14"
-    },
-    "exports": {
-        ".": "./dist/esnext/index.js",
-        "./plugin": {
-            "import": "./dist/esnext/framework/plugins/plugin.js",
-            "require": "./dist/node/framework/plugins/plugin.js"
-        },
-        "./client": {
-            "import": {
-                "types": "./dist/esnext/client.d.ts",
-                "default": "./dist/esnext/client.js"
-            },
-            "node": {
-                "types": "./dist/esnext/client.d.ts",
-                "default": "./dist/esnext/client.js"
-            }
-        },
-        "./plugin.cjs": "./plugin.cjs",
-        "./package.json": "./package.json",
-        "./*": "./dist/esnext/*.js"
-    },
-    "types": "dist/esnext/index.d.ts",
-    "files": [
-        "dist",
-        "plugin.cjs"
-    ],
-    "scripts": {
-        "build": "rimraf dist/ && npm run build:esm && npm run build:plugin:cjs",
-        "build:plugin:cjs": "tsc --p tsconfig.plugin.cjs.json",
-        "build:esm": "tsc --p tsconfig.esm.json",
-        "prepublishOnly": "npm run build"
-    },
-    "author": "Okendo",
-    "license": "SEE LICENSE IN LICENSE.txt",
-    "devDependencies": {
-        "@okendo/reviews-widget-plus": "^0.49.0",
-        "@okendo/tsconfig": "0.0.2",
-        "@shopify/hydrogen": "^1.2.0",
-        "@types/node": "^17.0.35",
-        "@types/react": "^18.0.14",
-        "@types/react-dom": "^18.0.5",
-        "dotenv": "^16.0.1",
-        "ncp": "^2.0.0",
-        "rimraf": "^3.0.2",
-        "typescript": "^4.7.4",
-        "vite": "^2.9.0"
-    },
-    "peerDependencies": {
-        "@shopify/hydrogen": "1.2.x"
-    }
-}
+{
+    "name": "@okendo/shopify-hydrogen",
+    "version": "1.2.2",
+    "description": "A component library containing Okendo Reviews React components.",
+    "main": "dist/esnext/index.js",
+    "engines": {
+        "node": ">=14"
+    },
+    "exports": {
+        ".": "./dist/esnext/index.js",
+        "./plugin": {
+            "import": "./dist/esnext/framework/plugins/plugin.js",
+            "require": "./dist/node/framework/plugins/plugin.js"
+        },
+        "./client": {
+            "import": {
+                "types": "./dist/esnext/client.d.ts",
+                "default": "./dist/esnext/client.js"
+            },
+            "node": {
+                "types": "./dist/esnext/client.d.ts",
+                "default": "./dist/esnext/client.js"
+            }
+        },
+        "./plugin.cjs": "./plugin.cjs",
+        "./package.json": "./package.json",
+        "./*": "./dist/esnext/*.js"
+    },
+    "types": "dist/esnext/index.d.ts",
+    "files": [
+        "dist",
+        "plugin.cjs"
+    ],
+    "scripts": {
+        "build": "rimraf dist/ && npm run build:esm && npm run build:plugin:cjs",
+        "build:plugin:cjs": "tsc --p tsconfig.plugin.cjs.json",
+        "build:esm": "tsc --p tsconfig.esm.json",
+        "prepublishOnly": "npm run build"
+    },
+    "author": "Okendo",
+    "license": "SEE LICENSE IN LICENSE.txt",
+    "devDependencies": {
+        "@okendo/reviews-widget-plus": "^0.53.1",
+        "@okendo/tsconfig": "0.0.2",
+        "@shopify/hydrogen": "^1.2.0",
+        "@types/node": "^17.0.35",
+        "@types/react": "^18.0.14",
+        "@types/react-dom": "^18.0.5",
+        "dotenv": "^16.0.1",
+        "ncp": "^2.0.0",
+        "rimraf": "^3.0.2",
+        "typescript": "^4.7.4",
+        "vite": "^2.9.0"
+    },
+    "peerDependencies": {
+        "@shopify/hydrogen": "1.2.x"
+    }
+}

package/plugin.cjs

@@ -1 +1 @@
-module.exports = require('./dist/node/framework/plugin');
+module.exports = require('./dist/node/framework/plugin');