diff --git a/packages/editor/src/components/assets/AssetPreviewPanels/MaterialPreviewPanel.tsx b/packages/editor/src/components/assets/AssetPreviewPanels/MaterialPreviewPanel.tsx
index 5491a24110..56ab48e47a 100644
--- a/packages/editor/src/components/assets/AssetPreviewPanels/MaterialPreviewPanel.tsx
+++ b/packages/editor/src/components/assets/AssetPreviewPanels/MaterialPreviewPanel.tsx
@@ -27,7 +27,7 @@ import React, { useEffect, useRef } from 'react'
import { Mesh, SphereGeometry } from 'three'
import { useRender3DPanelSystem } from '@etherealengine/client-core/src/user/components/Panel3D/useRender3DPanelSystem'
-import { generateEntityUUID, getMutableComponent, setComponent, UUIDComponent } from '@etherealengine/ecs'
+import { generateEntityUUID, getMutableComponent, setComponent, useComponent, UUIDComponent } from '@etherealengine/ecs'
import { EnvmapComponent } from '@etherealengine/engine/src/scene/components/EnvmapComponent'
import { MaterialSelectionState } from '@etherealengine/engine/src/scene/materials/MaterialLibraryState'
import { getState, useMutableState } from '@etherealengine/hyperflux'
@@ -35,6 +35,7 @@ import { CameraOrbitComponent } from '@etherealengine/spatial/src/camera/compone
import { NameComponent } from '@etherealengine/spatial/src/common/NameComponent'
import { addObjectToGroup } from '@etherealengine/spatial/src/renderer/components/GroupComponent'
import { VisibleComponent } from '@etherealengine/spatial/src/renderer/components/VisibleComponent'
+import { MaterialComponent, MaterialComponents } from '@etherealengine/spatial/src/renderer/materials/MaterialComponent'
import { getMaterial } from '@etherealengine/spatial/src/renderer/materials/materialFunctions'
export const MaterialPreviewCanvas = () => {
@@ -55,7 +56,11 @@ export const MaterialPreviewCanvas = () => {
const orbitCamera = getMutableComponent(cameraEntity, CameraOrbitComponent)
orbitCamera.focusedEntities.set([sceneEntity])
orbitCamera.refocus.set(true)
- }, [selectedMaterial])
+ }, [
+ selectedMaterial,
+ useComponent(UUIDComponent.getEntityByUUID(selectedMaterial.value!), MaterialComponent[MaterialComponents.State])
+ .material
+ ])
return (
<>
diff --git a/packages/spatial/src/renderer/materials/materialFunctions.ts b/packages/spatial/src/renderer/materials/materialFunctions.ts
index d3211e4fc7..1c20ba8671 100644
--- a/packages/spatial/src/renderer/materials/materialFunctions.ts
+++ b/packages/spatial/src/renderer/materials/materialFunctions.ts
@@ -118,7 +118,7 @@ export const getPluginObject = (pluginId: string) => {
export const applyMaterialPlugins = (materialEntity: Entity) => {
const materialComponent = getComponent(materialEntity, MaterialComponent[MaterialComponents.State])
- if (!materialComponent.pluginEntities || !materialComponent.material) return
+ if (!materialComponent.pluginEntities?.length || !materialComponent.material) return
const material = materialComponent.material as Material
material.plugins = []
for (const pluginEntity of materialComponent.pluginEntities) {
@@ -170,21 +170,13 @@ export const updateMaterialPrototype = (materialEntity: Entity) => {
if (!prototypeConstructor || !prototypeComponent.prototypeArguments) return
const material = materialComponent.material
if (!material || material.type === prototypeName) return
- const matKeys = Object.keys(material)
- const commonParameters = Object.fromEntries(
- Object.keys(prototypeComponent.prototypeArguments)
- .filter((key) => matKeys.includes(key))
- .map((key) => [key, material[key]])
- )
- const fullParameters = { ...extractDefaults(prototypeComponent.prototypeArguments), ...commonParameters }
+ const fullParameters = { ...extractDefaults(prototypeComponent.prototypeArguments) }
const newMaterial = new prototypeConstructor(fullParameters)
if (newMaterial.plugins) {
newMaterial.customProgramCacheKey = () =>
newMaterial.plugins!.map((plugin) => plugin.toString()).reduce((x, y) => x + y, '')
}
- newMaterial.uuid = material.uuid
- newMaterial.name = material.name
- newMaterial.type = prototypeName
+
if (material.defines?.['USE_COLOR']) {
newMaterial.defines = newMaterial.defines ?? {}
newMaterial.defines!['USE_COLOR'] = material.defines!['USE_COLOR']
@@ -197,5 +189,6 @@ export const updateMaterialPrototype = (materialEntity: Entity) => {
material: newMaterial,
parameters: fullParameters
})
+
return newMaterial
}