Refactor simulation components and UI integration

app/src/modules/scene/scene.tsx

@@ -15,7 +15,7 @@ import background from "../../assets/textures/hdr/mudroadpuresky2k.hdr";
 import SelectionControls from "./controls/selection/selectionControls";
 import MeasurementTool from "./tools/measurementTool";
 import Simulation from "../simulation/simulation";
-// import Simulation from "./simulationtemp/simulation";
+// import Simulation from "../simulation/simulationtemp/simulation";
 
 export default function Scene() {
 
@@ -41,7 +41,6 @@ export default function Scene() {
         <SelectionControls />
         <MeasurementTool />
         <World />
-        {/* <Simulation /> */}
         <Simulation />
         <PostProcessing />
         <Sun />

app/src/modules/simulation/simulationUI.tsx

@@ -1,5 +1,5 @@
 import { useMemo, useState } from 'react';
-import { useSelectedActionSphere, useToggleView, useSimulationPaths, useSelectedPath, useStartSimulation } from '../../store/store';
+import { useSelectedActionSphere, useToggleView, useSimulationPaths, useSelectedPath, useStartSimulation, useDrawMaterialPath } from '../../store/store';
 import * as THREE from 'three';
 import useModuleStore from '../../store/useModuleStore';
 
@@ -10,6 +10,8 @@ function SimulationUI() {
     const { selectedActionSphere } = useSelectedActionSphere();
     const { selectedPath, setSelectedPath } = useSelectedPath();
     const { simulationPaths, setSimulationPaths } = useSimulationPaths();
+    const { drawMaterialPath, setDrawMaterialPath } = useDrawMaterialPath();
+    const [activeButton, setActiveButton] = useState<string | null>(null);
 
     const handleAddAction = () => {
         if (!selectedActionSphere) return;
@@ -256,10 +258,15 @@ function SimulationUI() {
         return simulationPaths.flatMap((path) => path.points).find((point) => point.uuid === selectedActionSphere.point.uuid);
     }, [selectedActionSphere, simulationPaths]);
 
+    const createPath = () => {
+        setActiveButton(activeButton !== 'addMaterialPath' ? 'addMaterialPath' : null);
+        setDrawMaterialPath(!drawMaterialPath);
+    }
+
     return (
         <>
             {activeModule === "simulation" && (
-                <div style={{ zIndex: 10, position: "relative", width: '260px' }}>
+                <div style={{ zIndex: 10, position: "fixed", width: '260px' }}>
                     {!ToggleView && (
                         <>
                             <button
@@ -274,6 +281,10 @@ function SimulationUI() {
                                 {startSimulation ? 'Stop Simulation' : 'Start Simulation'}
                             </button>
 
+                            <div style={{ zIndex: "10", position: "relative" }}>
+                                {!ToggleView && <button onClick={createPath} style={{ marginTop: "10px", background: activeButton === 'addMaterialPath' ? '#ff320e' : '' }}> Add Material Path</button>}
+                            </div>
+
                             {selectedPath && (
                                 <div style={{ marginTop: "10px" }}>
                                     <label>Path Speed:</label>

app/src/modules/simulation/simulationtemp/path/pathFlow.tsx

@@ -2,7 +2,7 @@ import * as THREE from 'three';
 import { useState, useEffect, useRef, useMemo } from "react";
 import { useLoader, useFrame } from "@react-three/fiber";
 import { GLTFLoader } from "three-stdlib";
-import crate from "../../../../assets/models/gltf-glb/crate_box.glb";
+import crate from "../../../../assets/gltf-glb/crate_box.glb";
 import { useOrganization } from '../../../../store/store';
 import { useControls } from 'leva';
 
@@ -47,7 +47,7 @@ export default function PathFlow({ path, connections }: PathFlowProps) {
     };
 
     useFrame(() => {
-        if (organization !== 'hexrfactory' || isStopped || !path) return;
+        if (isStopped || !path) return;
 
         const now = performance.now();
 

app/src/pages/Project.tsx

@@ -16,7 +16,7 @@ import {
   useLoadingProgress,
 } from "../store/store";
 import { useNavigate } from "react-router-dom";
-// import SimulationUI from "../modules/simulation/simulationUI";
+import SimulationUI from "../modules/simulation/simulationUI";
 import LoadingPage from "../components/templates/LoadingPage";
 
 const Project: React.FC = () => {
@@ -55,7 +55,7 @@ const Project: React.FC = () => {
       <SideBarRight />
       <RealTimeVisulization />
       {activeModule !== "market" && <Tools />}
-      {/* <SimulationUI /> */}
+      <SimulationUI />
     </div>
   );
 };