Remove studio obj3d type (#9179)

* mvp for removing objs

* license

* i18n

Author: HexaField

packages/client-core/i18n/en/editor.json

@@ -181,9 +181,13 @@
       "info": "Takes a screenshot of your scene at the current view."
     }
   },
+  "materialProperties": {
+    "title": "Material",
+    "info": "Access and edit detailed information about materials in the scene."
+  },
   "properties": {
     "title": "Properties",
-    "info": "Propeties let you access and edit detailed information about objects in your scene.",
+    "info": "Propeties let you access and edit detailed information about objects in the scene.",
     "lbl-visible": "Visible",
     "lbl-preventBake": "Prevent Bake",
     "lbl-dynamicLoad": "Load Children Dynamically",

packages/client-core/src/components/InstanceChat/index.module.scss

@@ -218,8 +218,7 @@
     flex-direction: column;
     padding: 0 10px;
     margin-bottom: 5px;
-    overflow-y: auto;
-    overflow-x: clip;
+    overflow: clip auto;
 
     @media (max-width: 1024px) {
       margin: 15px 15px 20px;

packages/client-core/src/components/UserMediaWindow/index.module.scss

@@ -190,8 +190,7 @@
         padding: 8px;
         border-radius: 50px;
         display: flex;
-        justify-content: center;
-        align-content: center;
+        place-content: center center;
         width: 30px;
       }
     }

packages/client/src/pages/styles.scss

@@ -275,8 +275,7 @@
 body {
   overflow: hidden;
   color: var(--textColor);
-  overscroll-behavior-y: contain;
-  overscroll-behavior-x: none;
+  overscroll-behavior: none contain;
   background-color: var(--mainBackground);
 }
 

packages/editor/src/classes/EditorCameraState.ts

@@ -25,14 +25,14 @@ Ethereal Engine. All Rights Reserved.
 
 import { Vector3 } from 'three'
 
-import { EntityOrObjectUUID } from '@etherealengine/engine/src/ecs/functions/EntityTree'
+import { Entity } from '@etherealengine/engine/src/ecs/classes/Entity'
 import { defineState } from '@etherealengine/hyperflux'
 
 export const EditorCameraState = defineState({
   name: 'EditorCameraState',
   initial: {
     zoomDelta: 0,
-    focusedObjects: [] as EntityOrObjectUUID[],
+    focusedObjects: [] as Entity[],
     isPanning: false,
     cursorDeltaX: 0,
     cursorDeltaY: 0,

packages/editor/src/components/EditorContainer.tsx

@@ -79,6 +79,7 @@ import { GraphPanelTitle } from './graph/GraphPanelTitle'
 import HierarchyPanelContainer from './hierarchy/HierarchyPanelContainer'
 import { HierarchyPanelTitle } from './hierarchy/HierarchyPanelTitle'
 import { PanelDragContainer, PanelIcon, PanelTitle } from './layout/Panel'
+import MaterialProperties, { MaterialPropertyTitle } from './materials/MaterialEditor'
 import MaterialLibraryPanel from './materials/MaterialLibraryPanel'
 import { MaterialLibraryPanelTitle } from './materials/MaterialLibraryPanelTitle'
 import PropertiesPanelContainer from './properties/PropertiesPanelContainer'
@@ -491,6 +492,11 @@ const defaultLayout: LayoutData = {
                 id: 'graphPanel',
                 title: <GraphPanelTitle />,
                 content: <GraphPanel />
+              },
+              {
+                id: 'graphPanel',
+                title: <MaterialPropertyTitle />,
+                content: <MaterialProperties />
               }
             ]
           }

packages/editor/src/components/hierarchy/HeirarchyTreeWalker.ts

@@ -23,22 +23,15 @@ All portions of the code written by the Ethereal Engine team are Copyright © 20
 Ethereal Engine. All Rights Reserved.
 */
 
-import { Object3D } from 'three'
-
 import { Entity } from '@etherealengine/engine/src/ecs/classes/Entity'
 import { getComponent, hasComponent } from '@etherealengine/engine/src/ecs/functions/ComponentFunctions'
-import { EntityOrObjectUUID, EntityTreeComponent } from '@etherealengine/engine/src/ecs/functions/EntityTree'
+import { EntityTreeComponent } from '@etherealengine/engine/src/ecs/functions/EntityTree'
 
 export type HeirarchyTreeNodeType = {
   depth: number
-  entityNode: EntityOrObjectUUID
+  entity: Entity
   childIndex: number
   lastChild: boolean
-  /**
-   * @param obj3d is used for exploding models, it will eventually be replaced when
-   *   the scene graph is implemented on the ECS instead of threejs
-   */
-  obj3d?: Object3D
   isLeaf?: boolean
   isCollapsed?: boolean
   selected?: boolean
@@ -53,18 +46,18 @@ export type HeirarchyTreeCollapsedNodeType = { [key: number]: boolean }
  * @param  {entityNode}    collapsedNodes
  */
 export function* heirarchyTreeWalker(
-  treeNode: EntityOrObjectUUID,
-  selectedEntities: (Entity | string)[],
+  treeNode: Entity,
+  selectedEntities: Entity[],
   collapsedNodes: HeirarchyTreeCollapsedNodeType
 ): Generator<HeirarchyTreeNodeType> {
   if (!treeNode) return
 
   const stack = [] as HeirarchyTreeNodeType[]
 
-  stack.push({ depth: 0, entityNode: treeNode, childIndex: 0, lastChild: true })
+  stack.push({ depth: 0, entity: treeNode, childIndex: 0, lastChild: true })
 
   while (stack.length !== 0) {
-    const { depth, entityNode, childIndex, lastChild } = stack.pop() as HeirarchyTreeNodeType
+    const { depth, entity: entityNode, childIndex, lastChild } = stack.pop() as HeirarchyTreeNodeType
     const isCollapsed = collapsedNodes[entityNode]
 
     const entityTreeComponent = getComponent(entityNode as Entity, EntityTreeComponent)
@@ -73,7 +66,7 @@ export function* heirarchyTreeWalker(
       isLeaf: entityTreeComponent.children.length === 0,
       isCollapsed,
       depth,
-      entityNode,
+      entity: entityNode,
       selected: selectedEntities.includes(entityNode),
       active: selectedEntities.length > 0 && entityNode === selectedEntities[selectedEntities.length - 1],
       childIndex,
@@ -87,7 +80,7 @@ export function* heirarchyTreeWalker(
         if (node) {
           stack.push({
             depth: depth + 1,
-            entityNode: entityTreeComponent.children[i],
+            entity: entityTreeComponent.children[i],
             childIndex: i,
             lastChild: i === 0
           })