import { useEffect } from 'react'
import MaterialInstance from './instance/materialInstance'
import { useSceneContext } from '../../../scene/sceneContext';

function MaterialInstances() {
    const { materialStore } = useSceneContext();
    const { materials, materialHistory } = materialStore();

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

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

    return (
        <>

            {materials.map((material: MaterialSchema) =>
                <MaterialInstance key={material.materialId} material={material} />
            )}

        </>
    )
}

export default MaterialInstances