Merge branch 'trunk' of https://github.com/newfold-labs/wp-module-eco…

…mmerce into site-capabilities-test
newfold-labs · Jan 9, 2024 · 3c8ff07 · 3c8ff07
2 parents 9a7738d + 66fe3fa
commit 3c8ff07
Show file tree

Hide file tree

Showing 5 changed files with 97 additions and 45 deletions.
diff --git a/.github/workflows/brand-plugin-test.yml b/.github/workflows/brand-plugin-test.yml
@@ -0,0 +1,58 @@
+name: Build and Test Module Updates in Brand Plugins
+on:
+  pull_request:
+    types: [ opened, reopened, ready_for_review, synchronize ]
+    branches:
+      - main
+      - trunk
+  workflow_dispatch:
+
+concurrency:
+  group: ${{ github.workflow }}-${{ github.event_name == 'pull_request' && github.head_ref || github.sha }}
+  cancel-in-progress: true
+
+jobs:
+  setup:
+    name: Setup
+    runs-on: ubuntu-latest
+    outputs:
+      branch: ${{ steps.extract_branch.outputs.branch }}
+    steps:
+
+      - name: Extract branch name
+        shell: bash
+        run: echo "branch=${GITHUB_HEAD_REF:-${GITHUB_REF#refs/heads/}}" >> $GITHUB_OUTPUT
+        id: extract_branch
+
+  bluehost:
+    name: Bluehost Build and Test
+    needs: setup
+    uses: newfold-labs/workflows/.github/workflows/module-plugin-test.yml@main
+    with:
+      module-repo: ${{ github.repository }}
+      module-branch: ${{ needs.setup.outputs.branch }}
+      plugin-repo: 'bluehost/bluehost-wordpress-plugin'
+      sync-npm-package: true
+    secrets: inherit
+
+  hostgator:
+    name: HostGator Build and Test
+    needs: setup
+    uses: newfold-labs/workflows/.github/workflows/module-plugin-test.yml@main
+    with:
+      module-repo: ${{ github.repository }}
+      module-branch: ${{ needs.setup.outputs.branch }}
+      plugin-repo: 'newfold-labs/wp-plugin-hostgator'
+      sync-npm-package: true
+    secrets: inherit
+
+  crazydomains:
+    name: Crazy Domains Build and Test
+    needs: setup
+    uses: newfold-labs/workflows/.github/workflows/module-plugin-test.yml@main
+    with:
+      module-repo: ${{ github.repository }}
+      module-branch: ${{ needs.setup.outputs.branch }}
+      plugin-repo: 'newfold-labs/wp-plugin-crazy-domains'
+      sync-npm-package: true
+    secrets: inherit
diff --git a/build/index.asset.php b/build/index.asset.php
@@ -1 +1 @@
-<?php return array('dependencies' => array('lodash', 'moment', 'react', 'wp-api-fetch', 'wp-data', 'wp-date', 'wp-dom-ready', 'wp-element', 'wp-i18n', 'wp-url'), 'version' => '714a7e28c074dc71bcee');
+<?php return array('dependencies' => array('lodash', 'moment', 'react', 'wp-api-fetch', 'wp-data', 'wp-date', 'wp-dom-ready', 'wp-element', 'wp-i18n', 'wp-url'), 'version' => '48ad4ec1646d7a93d94d');
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -2,7 +2,7 @@
   "name": "@newfold-labs/wp-module-ecommerce",
   "description": "Brand Agnostic eCommerce Experience",
   "license": "GPL-2.0-or-later",
-  "version": "1.3.15",
+  "version": "1.3.16",
   "main": "build/index.js",
   "files": [
     "build/",

diff --git a/src/components/OnboardingScreen.js b/src/components/OnboardingScreen.js
@@ -1,5 +1,5 @@
 import { Alert, Button, Title } from "@newfold/ui-component-library";
-import { useEffect, useState } from "@wordpress/element";
+import { useState } from "@wordpress/element";
 import { __ } from "@wordpress/i18n";
 import classNames from "classnames";
 import { ReactComponent as ComingSoonIllustration } from "../icons/coming-soon.svg";
@@ -8,22 +8,21 @@ import { NewfoldRuntime } from "../sdk/NewfoldRuntime";
 import { OnboardingList } from "./OnboardingList";
 import { Section } from "./Section";
 import { SiteStatus } from "./SiteStatus";
-import useThumbnail from "./useThumbnail";
 
 const Text = {
   Pending: {
-    title: NewfoldRuntime.hasCapability('isEcommerce')
-      ? __('Congrats on your new store!', 'wp-module-ecommerce')
-      : __('Congrats on your new site!', 'wp-module-ecommerce'),
+    title: NewfoldRuntime.hasCapability("isEcommerce")
+      ? __("Congrats on your new store!", "wp-module-ecommerce")
+      : __("Congrats on your new site!", "wp-module-ecommerce"),
     description: __(
       'Your site is currently displaying a "Coming Soon" page.',
       "wp-module-ecommerce"
     ),
     Illustration: ComingSoonIllustration,
   },
   Live: {
-    title: __('Ready to go to the next level?', 'wp-module-ecommerce'),
-    description: __('Your site is live to the world!', 'wp-module-ecommerce'),
+    title: __("Ready to go to the next level?", "wp-module-ecommerce"),
+    description: __("Your site is live to the world!", "wp-module-ecommerce"),
     Illustration: WelcomeIllustration,
   },
 };
@@ -39,7 +38,6 @@ export function OnboardingScreen({
     : Text.Live;
 
   const [hovered, setIsHovered] = useState(false);
-  const [thumbnail, setThumbnail] = useState();
 
   const handleMouseOver = () => {
     setIsHovered(true);
@@ -48,28 +46,24 @@ export function OnboardingScreen({
   const handleMouseLeave = () => {
     setIsHovered(false);
   };
-
-  useEffect(() => {
-    async function thumbnail() {
-      const data = await useThumbnail(NewfoldRuntime.homeUrl);
-      setThumbnail(data?.thumbnail_loc);
-    }
-    thumbnail();
-  }, []);
-
+  const iframeOnLoad = () => {
+    window.frames["iframe-preview"].document.getElementById(
+      "wpadminbar"
+    ).style.display = "none";
+  };
   return (
     <Section.Container
       className="nfd-welcome-section"
       showShadowBox={showShadowBox}
     >
-      <Section.Header title={__('Home', 'wp-module-ecommerce')} />
+      <Section.Header title={__("Home", "wp-module-ecommerce")} />
       <Section.Content className="nfd-app-section-home">
         <div className="nfd-flex nfd-flex-col nfd-gap-6">
           <div
             className={classNames(
-              'nfd-grid nfd-gap-6 nfd-min-h-[350px]',
-              'sm:nfd-grid-cols-1',
-              'xl:nfd-grid-cols-2'
+              "nfd-grid nfd-gap-6 nfd-min-h-[350px]",
+              "sm:nfd-grid-cols-1",
+              "xl:nfd-grid-cols-2"
             )}
           >
             <div className="nfd-flex nfd-flex-col nfd-justify-start nfd-items-start nfd-gap-4">
@@ -92,22 +86,22 @@ export function OnboardingScreen({
                 onMouseOver={handleMouseOver}
                 onMouseOut={handleMouseLeave}
                 className={classNames(
-                  'nfd-relative  nfd-flex-col nfd-justify-center nfd-items-center',
-                  'nfd-border-[#CBD5E1] nfd-border-[1px] nfd-border-solid nfd-rounded-md'
+                  "nfd-relative  nfd-flex-col nfd-justify-center nfd-items-center",
+                  "nfd-border-[#CBD5E1] nfd-border-[1px] nfd-border-solid nfd-rounded-md"
                 )}
               >
                 <div className="nfd-flex nfd-justify-center nfd-items-center nfd-bg-gray-200 nfd-border-b nfd-border-[#dbd1d1] nfd-relative nfd-z-10 nfd-rounded-t-md">
                   <p className="nfd-font-bold">
-                    {__('SITE PREVIEW', 'wp-module-ecommerce')}
+                    {__("SITE PREVIEW", "wp-module-ecommerce")}
                   </p>
                 </div>
                 {comingSoon ? (
                   <div className="nfd-flex-col">
                     <Illustration
                       className={classNames(
-                        'nfd-h-full',
-                        'nfd-w-full',
-                        'nfd-rounded-b-md'
+                        "nfd-h-full",
+                        "nfd-w-full",
+                        "nfd-rounded-b-md"
                       )}
                     />
                   </div>
@@ -124,24 +118,24 @@ export function OnboardingScreen({
                         "2xl:nfd-w-[520px]"
                       )}
                     >
-                      {thumbnail ? (
-                        <img
-                          className="nfd-w-full nfd-h-full"
-                          src={thumbnail}
-                          alt="image not available"
-                        />
-                      ) : (
-                        <Illustration
-                          className={classNames("nfd-h-full", "nfd-w-full")}
-                        />
-                      )}
+                      <iframe
+                        onLoad={iframeOnLoad}
+                        id="iframe-preview"
+                        title="Preview"
+                        className="nfd-w-[400%] nfd-min-h-[400%] nfd-basis-full nfd-scale-[0.25] nfd-overflow-hidden nfd-relative nfd-top-[-9px]"
+                        src={NewfoldRuntime.homeUrl}
+                        scrolling="no"
+                        name="iframe-preview"
+                        sandbox
+                        seamless
+                      ></iframe>
                     </div>
                   </div>
                 )}
                 <div
                   className={classNames(
-                    'nfd-absolute nfd-top-0 nfd-left-0 nfd-bottom-0 nfd-right-0 nfd-place-content-center nfd-grid',
-                    'hover:nfd-animate-[wiggle_1s_ease-in-out_infinite]'
+                    "nfd-absolute nfd-top-0 nfd-left-0 nfd-bottom-0 nfd-right-0 nfd-place-content-center nfd-grid",
+                    "hover:nfd-animate-[wiggle_1s_ease-in-out_infinite]"
                   )}
                 >
                   <Button
@@ -154,7 +148,7 @@ export function OnboardingScreen({
                     target="_blank"
                     variant="secondary"
                   >
-                    {__('View your site', 'wp-module-ecommerce')}
+                    {__("View your site", "wp-module-ecommerce")}
                   </Button>
                 </div>
               </div>
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		<?php return array('dependencies' => array('lodash', 'moment', 'react', 'wp-api-fetch', 'wp-data', 'wp-date', 'wp-dom-ready', 'wp-element', 'wp-i18n', 'wp-url'), 'version' => '714a7e28c074dc71bcee');
		<?php return array('dependencies' => array('lodash', 'moment', 'react', 'wp-api-fetch', 'wp-data', 'wp-date', 'wp-dom-ready', 'wp-element', 'wp-i18n', 'wp-url'), 'version' => '48ad4ec1646d7a93d94d');