fix(Editor): Resolve syntax error and extract material properties correctly

src/pages/Editor.tsx

@@ -264,6 +264,72 @@ const ShadowFloor = ({ bounds, opacity, rotation, softness }: { bounds: any, opa
   );
 };
 
+export const extractTextureUrl = (texture: any) => {
+  if (!texture) return undefined;
+  const img = texture.image || (texture.source && texture.source.data);
+  if (!img) return undefined;
+  if (typeof img.src === 'string' && img.src.length > 0) return img.src;
+  if (typeof img.currentSrc === 'string' && img.currentSrc.length > 0) return img.currentSrc;
+  
+  // Fallback: draw ImageBitmap or HTMLImageElement to canvas to extract data URL
+  try {
+    const MAX = 1024;
+    let scale = 1;
+    if (img.width > MAX || img.height > MAX) {
+      scale = MAX / Math.max(img.width, img.height);
+    }
+    const cw = Math.round((img.width || 1024) * scale);
+    const ch = Math.round((img.height || 1024) * scale);
+    
+    const canvas = document.createElement('canvas');
+    canvas.width = cw;
+    canvas.height = ch;
+    const ctx = canvas.getContext('2d');
+    if (ctx) {
+      ctx.drawImage(img, 0, 0, cw, ch);
+      return canvas.toDataURL('image/webp', 0.8);
+    }
+  } catch (e) {
+    console.error('Error extracting texture URL:', e);
+  }
+  return undefined;
+};
+
+export const extractMaterialProps = (material: any): Partial<MaterialProps> => {
+  if (!material) return {};
+  const mProps: Partial<MaterialProps> = {};
+  
+  if (material.color) mProps.color = `#${material.color.getHexString()}`;
+  if (material.roughness !== undefined) mProps.roughness = material.roughness;
+  if (material.metalness !== undefined) mProps.metalness = material.metalness;
+  if (material.opacity !== undefined) mProps.opacity = material.opacity;
+  
+  // Standard material props
+  const m = material as any;
+  if (m.transmission !== undefined) mProps.transmission = m.transmission;
+  if (m.ior !== undefined) mProps.ior = m.ior;
+  if (m.thickness !== undefined) mProps.thickness = m.thickness;
+  if (m.clearcoat !== undefined) mProps.clearcoat = m.clearcoat;
+  if (m.sheen !== undefined) mProps.sheen = m.sheen;
+  if (m.specularIntensity !== undefined) mProps.specularIntensity = m.specularIntensity;
+
+  // Extract textures
+  if (m.map) mProps.map = extractTextureUrl(m.map);
+  if (m.normalMap) mProps.normalMap = extractTextureUrl(m.normalMap);
+  if (m.roughnessMap) mProps.roughnessMap = extractTextureUrl(m.roughnessMap);
+  if (m.metalnessMap) mProps.metalnessMap = extractTextureUrl(m.metalnessMap);
+  if (m.alphaMap) mProps.alphaMap = extractTextureUrl(m.alphaMap);
+
+  // Extract UV properties from the main map if available
+  if (m.map) {
+    if (m.map.repeat) mProps.uvTiling = [m.map.repeat.x, m.map.repeat.y];
+    if (m.map.offset) mProps.uvOffset = [m.map.offset.x, m.map.offset.y];
+    if (m.map.rotation !== undefined) mProps.uvRotation = m.map.rotation * (180 / Math.PI);
+  }
+  
+  return mProps;
+};
+
 export default function Editor() {
   const { projectId } = useParams();
   const navigate = useNavigate();
@@ -1068,14 +1134,7 @@ export default function Editor() {
               if (child instanceof THREE.Mesh) {
                 const meshId = `mesh-${mIdx++}`;
                 const material = Array.isArray(child.material) ? child.material[0] : child.material;
-                const mProps = { ...globalMaterialProps };
+                const mProps = { ...globalMaterialProps, ...extractMaterialProps(material) };
-                
-                if (material) {
-                  if (material.color) mProps.color = `#${material.color.getHexString()}`;
-                  if (material.roughness !== undefined) mProps.roughness = material.roughness;
-                  if (material.metalness !== undefined) mProps.metalness = material.metalness;
-                  if (material.opacity !== undefined) mProps.opacity = material.opacity;
-                }
                 
                 builtObjects.push({
                   id: meshId,
@@ -1655,68 +1714,7 @@ export default function Editor() {
             
             // Extract mesh material properties if available
             const material = Array.isArray(child.material) ? child.material[0] : child.material;
-            const mProps = { ...globalMaterialProps };
+            const mProps = { ...globalMaterialProps, ...extractMaterialProps(material) };
-            
-            const extractTextureUrl = (texture: any) => {
-              if (!texture) return undefined;
-              const img = texture.image || (texture.source && texture.source.data);
-              if (!img) return undefined;
-              if (typeof img.src === 'string' && img.src.length > 0) return img.src;
-              if (typeof img.currentSrc === 'string' && img.currentSrc.length > 0) return img.currentSrc;
-              
-              // Fallback: draw ImageBitmap or HTMLImageElement to canvas to extract data URL
-              try {
-                const MAX = 1024;
-                let scale = 1;
-                if (img.width > MAX || img.height > MAX) {
-                  scale = MAX / Math.max(img.width, img.height);
-                }
-                const cw = Math.round((img.width || 1024) * scale);
-                const ch = Math.round((img.height || 1024) * scale);
-                
-                const canvas = document.createElement('canvas');
-                canvas.width = cw;
-                canvas.height = ch;
-                const ctx = canvas.getContext('2d');
-                if (ctx) {
-                  ctx.drawImage(img, 0, 0, cw, ch);
-                  return canvas.toDataURL('image/webp', 0.8);
-                }
-              } catch (e) {
-                console.error('Error extracting texture URL:', e);
-              }
-              return undefined;
-            };
-            
-            if (material) {
-              if (material.color) mProps.color = `#${material.color.getHexString()}`;
-              if (material.roughness !== undefined) mProps.roughness = material.roughness;
-              if (material.metalness !== undefined) mProps.metalness = material.metalness;
-              if (material.opacity !== undefined) mProps.opacity = material.opacity;
-              
-              // Standard material props
-              const m = material as any;
-              if (m.transmission !== undefined) mProps.transmission = m.transmission;
-              if (m.ior !== undefined) mProps.ior = m.ior;
-              if (m.thickness !== undefined) mProps.thickness = m.thickness;
-              if (m.clearcoat !== undefined) mProps.clearcoat = m.clearcoat;
-              if (m.sheen !== undefined) mProps.sheen = m.sheen;
-              if (m.specularIntensity !== undefined) mProps.specularIntensity = m.specularIntensity;
-
-              // Extract textures
-              if (m.map) mProps.map = extractTextureUrl(m.map);
-              if (m.normalMap) mProps.normalMap = extractTextureUrl(m.normalMap);
-              if (m.roughnessMap) mProps.roughnessMap = extractTextureUrl(m.roughnessMap);
-              if (m.metalnessMap) mProps.metalnessMap = extractTextureUrl(m.metalnessMap);
-              if (m.alphaMap) mProps.alphaMap = extractTextureUrl(m.alphaMap);
-
-              // Extract UV properties from the main map if available
-              if (m.map) {
-                if (m.map.repeat) mProps.uvTiling = [m.map.repeat.x, m.map.repeat.y];
-                if (m.map.offset) mProps.uvOffset = [m.map.offset.x, m.map.offset.y];
-                if (m.map.rotation !== undefined) mProps.uvRotation = m.map.rotation * (180 / Math.PI);
-              }
-            }
 
             newSceneObjects.push({
               id: meshId,
@@ -5195,14 +5193,7 @@ export default function Editor() {
                 mIdx++;
                 
                 const material = Array.isArray(child.material) ? child.material[0] : child.material;
-                const mProps = { ...globalMaterialProps };
+                const mProps = { ...globalMaterialProps, ...extractMaterialProps(material) };
-                
-                if (material) {
-                  if (material.color) mProps.color = `#${material.color.getHexString()}`;
-                  if (material.roughness !== undefined) mProps.roughness = material.roughness;
-                  if (material.metalness !== undefined) mProps.metalness = material.metalness;
-                  if (material.opacity !== undefined) mProps.opacity = material.opacity;
-                }
 
                 newSceneObjects.push({
                   id: meshId,