gatsby-attainlabs-cms 1.0.15 → 1.0.18

package/README.md

@@ -57,6 +57,7 @@ module.exports = {
       options: {
         brand: "Cash Money", // LendDirect | Cash Money | Heights Finance adding-puck-for-visual-code-editing
         // personalAccessToken: "optional-fallback", // not recommended, but supported
+        environment: "production", // production | dev
       },
     },
   ],

package/dist/sliceWrapper.d.ts

@@ -3,6 +3,8 @@ interface SliceWrapperProps {
         componentPath: string;
         [key: string]: any;
     };
+    data: any;
 }
-export default function SliceWrapper({ sliceContext }: SliceWrapperProps): import("react/jsx-runtime").JSX.Element | null;
+export default function SliceWrapper({ sliceContext, data, }: SliceWrapperProps): import("react/jsx-runtime").JSX.Element | null;
+export declare const TrustPilotQuery: import("gatsby").StaticQueryDocument;
 export {};

package/dist/sliceWrapper.js

@@ -1,6 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import { graphql } from "gatsby";
 import { CMS_COMPONENTS } from "./map";
-export default function SliceWrapper({ sliceContext }) {
+export default function SliceWrapper({ sliceContext, data, }) {
     const { componentPath, ...props } = sliceContext;
     const pathFormatted = componentPath
         .replace("src/cms/components//", "")
@@ -11,5 +12,40 @@ export default function SliceWrapper({ sliceContext }) {
         console.warn(`Component "${pathFormatted}" not found in CMS_COMPONENTS`);
         return null;
     }
-    return _jsx(Component, { ...props });
+    return (_jsx(Component, { ...props, trustPilotData: data.allTrustPilotReviews.edges[0].node }));
 }
+export const TrustPilotQuery = graphql `
+  query {
+    allTrustPilotReviews {
+      edges {
+        node {
+          recentReviews {
+            reviews {
+              numberOfLikes
+              stars
+              text
+              title
+              createdAt
+              isVerified
+              reviewVerificationLevel
+              consumer {
+                displayName
+              }
+            }
+          }
+          businessData {
+            score {
+              stars
+              trustScore
+            }
+            displayName
+            numberOfReviews {
+              total
+              usedForTrustScoreCalculation
+            }
+          }
+        }
+      }
+    }
+  }
+`;

package/gatsby-config.js

@@ -0,0 +1,16 @@
+module.exports = ({ brand }) => ({
+  plugins: [
+    `gatsby-plugin-image`,
+    {
+      resolve: `gatsby-plugin-sharp`,
+      options: {
+        defaults: {
+          quality: 100,
+          placeholder: "none",
+          formats: [`webp`, "avif"],
+        },
+      },
+    },
+    `gatsby-transformer-sharp`,
+  ],
+});

package/gatsby-node.js

@@ -11,18 +11,18 @@ const brands = {
   "Attain Finance": "attainfinance",
 };
 
-const createPage = async (blocks, pageUrl, id) => {
+const createPage = async (blocks, pageUrl) => { 
   // Validate input parameters
-  if (!Array.isArray(blocks) || !pageUrl || !id) {
+  if (!Array.isArray(blocks) || !pageUrl) {
     throw new Error("Invalid parameters passed to createPage.");
   }
 
   // Helper function to generate Slice components
-  const generateSlices = (blocks, pageUrl, id) => {
+  const generateSlices = (blocks, id) => {
     return blocks
       .map(
         (b) =>
-          `<Slice alias="block--${pageUrl}--${b.props.component.name}--${id}" />`
+          `<Slice alias="${b.sliceId}" />`
       )
       .join("\n");
   };
@@ -44,7 +44,7 @@ const createPage = async (blocks, pageUrl, id) => {
     const Page = () => {
       return (
         <Layout>
-          ${generateSlices(blocks, pageUrl, id)}
+          ${generateSlices(blocks, pageUrl)}
         </Layout>
       );
     };
@@ -59,11 +59,23 @@ const createPage = async (blocks, pageUrl, id) => {
 require("dotenv").config();
 // Load PAT from env instead of hardcoding (fallback to old const for now but warn)
 exports.onPreInit = async (_, pluginOptions) => {
-  const { brand, azureBranch, personalAccessToken: patOption } = pluginOptions;
+  const {
+    brand,
+    azureBranch,
+    personalAccessToken: patOption,
+    environment,
+  } = pluginOptions;
 
   // Try env first, then plugin option fallback
   const pat = process.env.PERSONAL_ACCESS_TOKEN || patOption;
 
+  if (environment === "dev") {
+    console.log(
+      "ℹ️ [gatsby-attainlabs-cms] Running in 'dev' environment mode. Skipping component sync."
+    );
+    return;
+  }
+
   if (!pat) {
     console.warn(
       "⚠️ [gatsby-attainlabs-cms] No PERSONAL_ACCESS_TOKEN found. " +
@@ -106,13 +118,12 @@ exports.onPreInit = async (_, pluginOptions) => {
   // List of folders to download from
   const targets = [
     {
-      repoPath: `/apps/cms/src/cms/components/editor/visual-block-editor/components/brands/${brands[brand]}`,
-      localBasePath: path.resolve("./src/cms/components/"),
+      repoPath: `/apps/cms/src/cms/editors/visual-block-editor/brands/${brands[brand]}/`,
+      localBasePath: path.resolve("./src/cms/"),
     },
     {
-      repoPath:
-        "/apps/cms/src/cms/components/editor/visual-block-editor/components/global/blocks",
-      localBasePath: path.resolve("./src/cms/components/"),
+      repoPath: "/apps/cms/src/cms/editors/visual-block-editor/core/",
+      localBasePath: path.resolve("./src/cms/"),
     },
     {
       repoPath: `/apps/cms/src/gatsby-plugin-theme-ui/${brands[brand]}`,
@@ -165,13 +176,12 @@ exports.onPreInit = async (_, pluginOptions) => {
           const result = JSON.parse(data);
           const posix = path.posix;
 
-          // Keep only index.tsx files
+          // Exclude files named config.tsx
           const items = (result.value || []).filter(
             (i) =>
               !i.isFolder &&
               i.gitObjectType === "blob" &&
-              (posix.basename(i.path) === "index.tsx" ||
-                posix.extname(i.path) === ".ts")
+              posix.basename(i.path) !== "config.tsx"
           );
 
           console.log(`Found ${items.length} files in ${repoPath}`);
@@ -240,8 +250,12 @@ exports.onPreInit = async (_, pluginOptions) => {
           res.pipe(fileStream);
           fileStream.on("finish", () => {
             fileStream.close(() => {
-              const generatedComment =
-                "// GENERATED FILE // This file is automatically generated by the AttainLabs CMS plugin. Do not edit this file directly.\n";
+              const ext = path.extname(destFile).toLowerCase(); 
+              let generatedComment = "";
+                    if (ext === ".ts" || ext === ".tsx" || ext === ".js" || ext === ".jsx") {
+                      generatedComment =
+                        "// GENERATED FILE // This file is automatically generated by the AttainLabs CMS plugin. Do not edit this file directly.\n";
+                    }
               const fileContent = fs.readFileSync(tmpFile, "utf8");
               fs.writeFileSync(destFile, generatedComment + fileContent);
 
@@ -259,11 +273,96 @@ exports.onPreInit = async (_, pluginOptions) => {
     doRequest(fileUrl);
   }
 };
+exports.sourceNodes = async (
+  { actions, createNodeId, createContentDigest },
+  pluginOptions
+) => {
+  const { createNode } = actions;
+  const { trustpilotApiKey, brand } = pluginOptions;
+  const apiKey = process.env.TRUSTPILOT_API_KEY || trustpilotApiKey;
+  console.log(
+    `ℹ️ [gatsby-attainlabs-cms] Fetching Trustpilot data for brand: ${brand}`
+  );
+  // // Map brand names to Trustpilot business unit IDs 
+  const businessIds = {
+    LendDirect: "599affea0000ff0005a95acd",
+    "Cash Money": "599afd420000ff0005a95a9d",
+    "Heights Finance": "5e72238d600d1a0001be01eb",
+  };
+  const businessUnitId = businessIds[brand];
+  if (!apiKey) {
+    console.warn(
+      "⚠️ [gatsby-attainlabs-cms] No TRUSTPILOT_API_KEY found. " +
+        "Set it in your project's .env file (recommended) or pass via plugin options.\n" +
+        "Example .env:\n" +
+        "TRUSTPILOT_API_KEY=xxxxxxx\n"
+    );
+    return; // stop execution early
+  }
+  if (!brand || !businessUnitId) {
+    console.warn(
+      "⚠️ [gatsby-attainlabs-cms] Invalid or missing 'brand' option for Trustpilot integration. " +
+        `Current value: '${brand}'. Supported brands: ${Object.keys(businessIds).join(", ")}. ` +
+        "Trustpilot data will not be fetched."
+    );
+    return; // stop execution early
+  }
+
+  const fetchTrustpilotData = async (endpoint) => {
+    try {
+      const response = await fetch(
+        `https://api.trustpilot.com/v1/business-units/${businessUnitId}/${endpoint}`,
+        {
+          headers: { ApiKey: apiKey },
+        }
+      );
+
+      if (!response.ok) {
+        throw new Error(`HTTP error! status: ${response.status}`);
+      }
 
+      return await response.json();
+    } catch (error) {
+      console.error(
+        `Failed to fetch data from Trustpilot (${endpoint}):`,
+        error.message
+      );
+      return null;
+    }
+  };
+
+  const businessData = await fetchTrustpilotData("");
+  const recentReviewsData = await fetchTrustpilotData(
+    "reviews?stars=5&includeReportedReviews=true"
+  );
+
+  if (businessData || recentReviewsData) {
+    const combinedData = {
+      businessData: businessData || {},
+      recentReviews: recentReviewsData || {},
+    };
+
+    return createNode({
+      ...combinedData,
+      id: createNodeId("trustPilotReviews"),
+      parent: null,
+      internal: {
+        type: "TrustPilotReviews",
+        contentDigest: createContentDigest(combinedData),
+      },
+    });
+  }
+}; 
 exports.createPages = async ({ actions, store }, pluginOptions) => {
-  const { brand } = pluginOptions;
+  const { brand, environment } = pluginOptions;
   const { createSlice } = actions;
   const siteRoot = store.getState().program.directory;
+  if (environment === "dev") {
+    console.log(
+      "ℹ️ [gatsby-attainlabs-cms] Running in 'dev' environment mode. Skipping component sync."
+    );
+    return;
+  }
   // 🚨 Validate brand option
   if (!brand || !brands[brand]) {
     throw new Error(
@@ -292,34 +391,40 @@ exports.createPages = async ({ actions, store }, pluginOptions) => {
           },
         },
         id,
+        published,
       } = page;
 
-      //Generate page's blocks slices
-      await Promise.all(
-        content.map(async (b) => {
-          const name = b.props.component.name;
-          const blockId = `block--${pageUrl}--${name}--${id}`;
-          console.log(`Creating slice: ${blockId}`);
-          // here we could await something per slice if needed later
-          createSlice({
-            id: blockId,
-            component: path.resolve(
-              siteRoot,
-              "src/cms/components/sliceWrapper.tsx"
-            ),
-            context: {
-              componentPath: `./src/cms/components/${b.props.component.path}/index.tsx`,
-              ...b.props,
-            },
-          });
-        })
-      );
-
-      const pageSource = await createPage(content, pageUrl, id);
-      const outPath = path.join(siteRoot, "src/pages", `${pageUrl}.tsx`);
-      // Generate the page itself
-      await fse.outputFile(outPath, pageSource);
-      console.log(`✅ Wrote page to ${outPath}`);
+      if (published) {
+        //Generate page's blocks slices
+        await Promise.all(
+          content.map(async (b) => {  
+            const name = b.props.component.name;
+            const sliceId = `block--${pageUrl}--${name}--${id}--${crypto.randomUUID()}`;
+            console.log(`Creating slice: ${sliceId}`);
+            // here we could await something per slice if needed later
+            createSlice({
+              id: sliceId,
+              component: path.resolve(
+                siteRoot,
+                "src/cms/components/sliceWrapper.tsx"
+              ),
+              context: {
+                componentPath: `./src/cms/components${b.props.component.path}/index.tsx`,
+                ...b.props,
+              },
+            });
+            b["sliceId"] = sliceId; // attach sliceId to block for later use
+            return b;
+          })
+        );
+
+        const pageSource = await createPage(content, pageUrl);
+        const outPath = path.join(siteRoot, "src/pages", `${pageUrl}.tsx`);
+        // Generate the page itself
+        await fse.outputFile(outPath, pageSource);
+        console.log(`✅ Wrote page to ${outPath}`);
+      }
     }
   }
 };
+

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "gatsby-attainlabs-cms",
-  "version": "1.0.15",
+  "version": "1.0.18",
   "main": "dist/index.js",
   "module": "dist/index.js",
-  "types": "dist/index.d.ts",
+  "types": "dist/index.d.ts", 
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
     "build": "tsc"
@@ -16,6 +16,11 @@
   },
   "dependencies": {
     "dotenv": "^17.2.1",
+    "gatsby-background-image": "^1.6.0",
+    "gatsby-plugin-image": "^3.15.0",
+    "gatsby-plugin-sharp": "^5.15.0",
+    "gatsby-source-filesystem": "^5.15.0",
+    "gatsby-transformer-sharp": "^5.15.0",
     "prettier": "^3.6.2",
     "react-slick": "^0.31.0"
   },

package/src/sliceWrapper.tsx

@@ -1,7 +1,7 @@
 // GENERATED FILE // This file is automatically generated by the AttainLabs CMS plugin. Do not edit this file directly.
 
 import React from "react";
-import type { SliceComponentProps } from "gatsby";
+import { graphql, type SliceComponentProps } from "gatsby";
 import { CMS_COMPONENTS } from "./map";
 
 interface SliceWrapperProps {
@@ -9,11 +9,14 @@ interface SliceWrapperProps {
     componentPath: string;
     [key: string]: any;
   };
+  data: any;
 }
 
-export default function SliceWrapper({ sliceContext }: SliceWrapperProps) {
+export default function SliceWrapper({
+  sliceContext,
+  data,
+}: SliceWrapperProps) {
   const { componentPath, ...props } = sliceContext;
-
   const pathFormatted = componentPath
     .replace("src/cms/components//", "")
     .replace(/^.\//, "")
@@ -24,5 +27,46 @@ export default function SliceWrapper({ sliceContext }: SliceWrapperProps) {
     return null;
   }
 
-  return <Component {...props} />;
+  return (
+    <Component
+      {...props}
+      trustPilotData={data.allTrustPilotReviews.edges[0].node}
+    />
+  );
 }
+
+export const TrustPilotQuery = graphql`
+  query {
+    allTrustPilotReviews {
+      edges {
+        node {
+          recentReviews {
+            reviews {
+              numberOfLikes
+              stars
+              text
+              title
+              createdAt
+              isVerified
+              reviewVerificationLevel
+              consumer {
+                displayName
+              }
+            }
+          }
+          businessData {
+            score {
+              stars
+              trustScore
+            }
+            displayName
+            numberOfReviews {
+              total
+              usedForTrustScoreCalculation
+            }
+          }
+        }
+      }
+    }
+  }
+`;