import React, { useEffect } from 'react';
import Vehicles from './vehicle/vehicles';
import Points from './events/points/points';
import Conveyor from './conveyor/conveyor';
import RoboticArm from './roboticArm/roboticArm';
import Materials from './materials/materials';
import Machine from './machine/machine';
import StorageUnit from './storageUnit/storageUnit';
import Simulator from './simulator/simulator';
import Products from './products/products';
import Trigger from './triggers/trigger';
import useModuleStore from '../../store/useModuleStore';
import SimulationAnalysis from './analysis/simulationAnalysis';
import { useSceneContext } from '../scene/sceneContext';

function Simulation() {
    const { activeModule } = useModuleStore();
    const { eventStore, productStore } = useSceneContext();
    const { events } = eventStore();
    const { products } = productStore();

    useEffect(() => {
        // console.log('events: ', events);
    }, [events])

    useEffect(() => {
        // console.log('products: ', products);
    }, [products])

    return (
        <>

            <Products />

            {activeModule === 'simulation' &&

                <>

                    <Points />

                    <Materials />

                    <Trigger />

                    <Conveyor />

                    <Vehicles />

                    <RoboticArm />

                    <Machine />

                    <StorageUnit />

                    <Simulator />

                    <SimulationAnalysis />

                </>

            }

        </>
    );
}

export default Simulation;
