app/src/components/layout/scenes/ComparisonScene.tsx

@@ -8,6 +8,7 @@ import { useComparisonProduct, useMainProduct } from '../../../store/simulation/
 import { usePlayButtonStore } from '../../../store/usePlayButtonStore';
 import { useEffect, useState } from 'react';
 import { useDuplicateProductStore } from '../../../modules/duplicate/duplicateStores/duplicateProductStore';
+import ProductsDuplicate from '../../../modules/duplicate/duplicateSimulation/duplicateProduct/duplicateProduct';
 
 function ComparisonScene() {
     const { isPlaying } = usePlayButtonStore();
@@ -119,6 +120,8 @@ function ComparisonScene() {
                     }
                     <CompareLayOut />
 
+                    <ProductsDuplicate projectId={"684bcd620a64bc2a815a88d6"} />
+
                     {(shouldShowComparisonResult && !loadingProgress) && <ComparisonResult />}
                 </>
             )}

app/src/components/ui/compareVersion/CompareLayOut.tsx

@@ -10,15 +10,15 @@ import {
 } from "../../../store/builder/store";
 import Search from "../inputs/Search";
 import OuterClick from "../../../utils/outerClick";
-import { useProductStore } from "../../../store/simulation/useProductStore";
 import Scene from "../../../modules/scene/scene";
 import { useComparisonProduct } from "../../../store/simulation/useSimulationStore";
 import { usePauseButtonStore, usePlayButtonStore } from "../../../store/usePlayButtonStore";
 import DuplicateScene from "../../../modules/duplicate/sceneDuplicate";
+import { useDuplicateProductStore } from "../../../modules/duplicate/duplicateStores/duplicateProductStore";
 
 const CompareLayOut = () => {
   const { comparisonProduct, setComparisonProduct, clearComparisonProduct } = useComparisonProduct();
-  const { products } = useProductStore();
+  const { products } = useDuplicateProductStore();
   const { setLoadingProgress } = useLoadingProgress();
   const [width, setWidth] = useState("50vw");
   const [isResizing, setIsResizing] = useState(false);

app/src/modules/duplicate/duplicateSimulation/duplicateProduct/duplicateProduct.tsx

@@ -5,14 +5,13 @@ import { getAllProductsApi } from '../../../../services/simulation/products/geta
 import { usePlayButtonStore, useResetButtonStore } from '../../../../store/usePlayButtonStore';
 import { useSceneContext } from '../../../scene/sceneContext';
 import { useProductContext } from '../../../simulation/products/productContext';
-import { useComparisonProduct, useMainProduct } from '../../../../store/simulation/useSimulationStore';
+import { useComparisonProduct } from '../../../../store/simulation/useSimulationStore';
 import { useDuplicateProductStore } from '../../duplicateStores/duplicateProductStore';
 
 function ProductsDuplicate({ projectId }: { projectId: string }) {
     const { armBotStore, machineStore, conveyorStore, vehicleStore, storageUnitStore, layout } = useSceneContext();
-    const { products, getProductById, addProduct, setProducts } = useDuplicateProductStore();
+    const { products, getProductById, setProducts } = useDuplicateProductStore();
     const { selectedProductStore } = useProductContext();
-    const { setMainProduct } = useMainProduct();
     const { selectedProduct, setSelectedProduct } = selectedProductStore();
     const { addVehicle, clearvehicles } = vehicleStore();
     const { addArmBot, clearArmBots } = armBotStore();
@@ -31,25 +30,8 @@ function ProductsDuplicate({ projectId }: { projectId: string }) {
 
     useEffect(() => {
         getAllProductsApi(projectId || '').then((data) => {
-            if (data.length === 0) {
+            if (data.length > 0)  {
-                const id = THREE.MathUtils.generateUUID();
-                const name = 'Product 1';
-                addProduct(name, id);
-                upsertProductOrEventApi({
-                    productName: name,
-                    productUuid: id,
-                    projectId: projectId || ''
-                })
-                if (layout === 'Main Layout') {
-                    setSelectedProduct(id, name);
-                    setMainProduct(id, name);
-                }
-            } else {
                 setProducts(data);
-                if (layout === 'Main Layout') {
-                    setSelectedProduct(data[0].productUuid, data[0].productName);
-                    setMainProduct(data[0].productUuid, data[0].productName);
-                }
             }
         })
     }, [])

app/src/modules/duplicate/duplicateSimulation/duplicateSimulation.tsx

@@ -3,12 +3,10 @@ import ProductsDuplicate from './duplicateProduct/duplicateProduct'
 import PointsDuplicate from './duplicatePoint/duplicatePoint'
 import TriggerDuplicate from './duplicateTrigger/duplicateTrigger'
 
-function SimulationDuplicate({ projectId }: { projectId: string }) {
+function SimulationDuplicate() {
     return (
         <>
 
-            <ProductsDuplicate projectId={projectId} />
-
             <PointsDuplicate />
 
             <TriggerDuplicate />

app/src/modules/duplicate/sceneDuplicate.tsx

@@ -9,14 +9,12 @@ import background from "../../assets/textures/hdr/mudroadpuresky2k.hdr";
 import ControlsDuplicate from "./duplicateSetup/controlsDuplicate";
 import PostProcessingDuplicate from "./duplicateSetup/postProcessingDuplicate";
 import { Color } from "three";
-import { SceneProvider } from "../scene/sceneContext";
 import SimulationDuplicate from "./duplicateSimulation/duplicateSimulation";
 
 export default function DuplicateScene() {
     const projectId = "684bcd620a64bc2a815a88d6";
 
     return (
-        <SceneProvider layout='Comparison Layout'>
         <Canvas
             id="sceneCanvas"
             shadows
@@ -46,8 +44,7 @@ export default function DuplicateScene() {
 
             <BuilderDuplicate projectId={projectId} />
 
-                <SimulationDuplicate projectId={projectId} />
+            <SimulationDuplicate />
         </Canvas>
-        </SceneProvider>
     );
 }

app/src/pages/Project.tsx

@@ -34,6 +34,7 @@ import { setFloorItemApi } from "../services/factoryBuilder/assest/floorAsset/se
 import { useAssetsStore } from "../store/builder/useAssetStore";
 import ComparisonSceneProvider from "../components/layout/scenes/ComparisonSceneProvider";
 import MainSceneProvider from "../components/layout/scenes/MainSceneProvider";
+import { SceneProvider } from "../modules/scene/sceneContext";
 
 const Project: React.FC = () => {
   let navigate = useNavigate();
@@ -127,7 +128,9 @@ const Project: React.FC = () => {
 
   return (
     <div className="project-main">
+      <SceneProvider layout='Comparison Layout'>
         <ComparisonSceneProvider />
+      </SceneProvider>
       <MainSceneProvider />
       {selectedUser && <FollowPerson />}
       {isLogListVisible && (