Merged in bugfix/ProductFruitsWrapper (pull request #1527)

- Improve product fruits wrapper for extra checks

Approved-by: Allan Carr

client/.env.development.promanager

@@ -1,7 +1,7 @@
 VITE_APP_GRAPHQL_ENDPOINT=https://db.dev.bodyshop.app/v1/graphql
 VITE_APP_GRAPHQL_ENDPOINT_WS=wss://db.dev.bodyshop.app/v1/graphql
 VITE_APP_GA_CODE=231099835
-VITE_APP_FIREBASE_CONFIG={  "apiKey": "AIzaSyAuLQR9SV5LsVxjU8wh9hvFLdhcAHU6cxE",  "authDomain": "rome-prod-1.firebaseapp.com",  "projectId": "rome-prod-1",  "storageBucket": "rome-prod-1.appspot.com",  "messagingSenderId": "147786367145",  "appId": "1:147786367145:web:9d4cba68071c3f29a8a9b8",  "measurementId": "G-G8Z9DRHTZS"}
+VITE_APP_FIREBASE_CONFIG={"apiKey":"AIzaSyDPLT8GiDHDR1R4nI66Qi0BY1aYviDPioc","authDomain":"imex-dev.firebaseapp.com","databaseURL":"https://imex-dev.firebaseio.com","projectId":"imex-dev","storageBucket":"imex-dev.appspot.com","messagingSenderId":"759548147434","appId":"1:759548147434:web:e8239868a48ceb36700993","measurementId":"G-K5XRBVVB4S"}
 VITE_APP_CLOUDINARY_ENDPOINT_API=https://api.cloudinary.com/v1_1/io-test
 VITE_APP_CLOUDINARY_ENDPOINT=https://res.cloudinary.com/io-test
 VITE_APP_CLOUDINARY_API_KEY=957865933348715

client/src/App/App.jsx

@@ -1,15 +1,13 @@
 import { useSplitClient } from "@splitsoftware/splitio-react";
 import { Button, Result } from "antd";
 import LogRocket from "logrocket";
-import React, { lazy, Suspense, useEffect, useMemo, useState } from "react";
+import React, { lazy, Suspense, useEffect, useState } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { Route, Routes } from "react-router-dom";
 import { createStructuredSelector } from "reselect";
 import DocumentEditorContainer from "../components/document-editor/document-editor.container";
-import ErrorBoundary from "../components/error-boundary/error-boundary.component";
-
-// Component Imports
+import ErrorBoundary from "../components/error-boundary/error-boundary.component"; // Component Imports
 import LoadingSpinner from "../components/loading-spinner/loading-spinner.component";
 import DisclaimerPage from "../pages/disclaimer/disclaimer.page";
 import LandingPage from "../pages/landing/landing.page";
@@ -23,7 +21,7 @@ import "./App.styles.scss";
 import handleBeta from "../utils/betaHandler";
 import Eula from "../components/eula/eula.component";
 import InstanceRenderMgr from "../utils/instanceRenderMgr";
-import { ProductFruits } from "react-product-fruits";
+import ProductFruitsWrapper from "./ProductFruitsWrapper.jsx";
 
 const ResetPassword = lazy(() => import("../pages/reset-password/reset-password.component"));
 const ManagePage = lazy(() => import("../pages/manage/manage.page.container"));
@@ -48,23 +46,6 @@ export function App({ bodyshop, checkUserSession, currentUser, online, setOnline
   const [listenersAdded, setListenersAdded] = useState(false);
   const { t } = useTranslation();
 
-  const workspaceCode = useMemo(
-    () =>
-      InstanceRenderMgr({
-        imex: null,
-        rome: "9BkbEseqNqxw8jUH",
-        promanager: "aoJoEifvezYI0Z0P"
-      }),
-    []
-  );
-
-  const workspaceLogin = useMemo(
-    () => ({
-      email: currentUser.email,
-      username: currentUser.email
-    }),
-    [currentUser.email]
-  );
   useEffect(() => {
     if (!navigator.onLine) {
       setOnline(false);
@@ -73,6 +54,10 @@ export function App({ bodyshop, checkUserSession, currentUser, online, setOnline
     checkUserSession();
   }, [checkUserSession, setOnline]);
 
+  //const b = Grid.useBreakpoint();
+  // console.log("Breakpoints:", b);
+
+  // Associate event listeners, memoize to prevent multiple listeners being added
   useEffect(() => {
     const offlineListener = () => {
       setOnline(false);
@@ -144,6 +129,7 @@ export function App({ bodyshop, checkUserSession, currentUser, online, setOnline
     return <Eula />;
   }
 
+  // Any route that is not assigned and matched will default to the Landing Page component
   return (
     <Suspense
       fallback={
@@ -156,9 +142,7 @@ export function App({ bodyshop, checkUserSession, currentUser, online, setOnline
         />
       }
     >
-      {currentUser && currentUser.email && (
-        <ProductFruits workspaceCode={workspaceCode} debug language="en" user={workspaceLogin} />
-      )}
+      <ProductFruitsWrapper currentUser={currentUser} />
 
       <Routes>
         <Route

client/src/App/ProductFruitsWrapper.jsx

@@ -0,0 +1,27 @@
+import React from "react";
+import { ProductFruits } from "react-product-fruits";
+import InstanceRenderMgr from "../utils/instanceRenderMgr";
+
+const ProductFruitsWrapper = React.memo(({ currentUser }) => {
+  return (
+    currentUser?.authorized === true &&
+    currentUser?.email && (
+      <ProductFruits
+        lifeCycle="unmount"
+        workspaceCode={InstanceRenderMgr({
+          imex: null,
+          rome: "9BkbEseqNqxw8jUH",
+          promanager: "aoJoEifvezYI0Z0P"
+        })}
+        debug
+        language="en"
+        user={{
+          email: currentUser.email,
+          username: currentUser.email
+        }}
+      />
+    )
+  );
+});
+
+export default ProductFruitsWrapper;