From d9d79789e67a43b94057ad0ff45c663e186cacf7 Mon Sep 17 00:00:00 2001 From: Emily Dodds Date: Wed, 21 Dec 2022 12:33:38 -0600 Subject: [PATCH] fix(composer): Allows nodes to be dropped at root level (#390) Co-authored-by: Emily Dodds --- packages/scene-composer/package.json | 2 +- .../src/components/Tree/tree.scss | 5 +++++ .../SceneHierarchyTreeItem.tsx | 21 +++++++++---------- 3 files changed, 16 insertions(+), 12 deletions(-) diff --git a/packages/scene-composer/package.json b/packages/scene-composer/package.json index e0519fb70..2e08d5e36 100644 --- a/packages/scene-composer/package.json +++ b/packages/scene-composer/package.json @@ -160,7 +160,7 @@ "lines": 77.35, "statements": 76.47, "functions": 76.8, - "branches": 63.1, + "branches": 62.98, "branchesTrue": 100 } } diff --git a/packages/scene-composer/src/components/Tree/tree.scss b/packages/scene-composer/src/components/Tree/tree.scss index 86ba2dd3c..fff36a646 100644 --- a/packages/scene-composer/src/components/Tree/tree.scss +++ b/packages/scene-composer/src/components/Tree/tree.scss @@ -42,6 +42,11 @@ $active-color: #ec7211; position: relative; user-select: none; + &:first-child { + padding-top: 1rem; + padding-bottom: 1rem; + } + &.drop, .drop { border-bottom: 3px solid #fff; diff --git a/packages/scene-composer/src/components/panels/SceneHierarchyPanel/components/SceneHierarchyTree/SceneHierarchyTreeItem.tsx b/packages/scene-composer/src/components/panels/SceneHierarchyPanel/components/SceneHierarchyTree/SceneHierarchyTreeItem.tsx index 9b983a25c..eafc037b0 100644 --- a/packages/scene-composer/src/components/panels/SceneHierarchyPanel/components/SceneHierarchyTree/SceneHierarchyTreeItem.tsx +++ b/packages/scene-composer/src/components/panels/SceneHierarchyPanel/components/SceneHierarchyTree/SceneHierarchyTreeItem.tsx @@ -1,4 +1,4 @@ -import React, { FC, useCallback, useContext, useState } from 'react'; +import React, { FC, useCallback, useContext, useMemo, useState } from 'react'; import { Object3D } from 'three'; import ISceneHierarchyNode from '../../model/ISceneHierarchyNode'; @@ -34,19 +34,18 @@ const SceneHierarchyTreeItem: FC = ({ const model = getObject3DBySceneNodeRef(key) as Object3D | undefined; const [childNodes] = useChildNodes(key); - const isValidModelRef = componentTypes?.find( - (type) => - type === KnownComponentType.ModelRef && - (type as unknown as IModelRefComponentInternal)?.modelType !== ModelType.Environment, - ); - - const [{ variation: subModelSelectionEnabled }] = useFeature(COMPOSER_FEATURES[COMPOSER_FEATURES.SubModelSelection]); - const showSubModel = subModelSelectionEnabled === 'T1' && isValidModelRef && !!model && !isViewing(); const sceneComposerId = useContext(sceneComposerIdContext); const { getSceneNodeByRef } = useSceneDocument(sceneComposerId); const node = getSceneNodeByRef(key); + const component = findComponentByType(node, KnownComponentType.ModelRef) as IModelRefComponentInternal; + const componentRef = component?.ref; + const isValidModelRef = useMemo(() => { + return component && component?.modelType !== ModelType.Environment; + }, [component]); + const [{ variation: subModelSelectionEnabled }] = useFeature(COMPOSER_FEATURES[COMPOSER_FEATURES.SubModelSelection]); + const showSubModel = subModelSelectionEnabled === 'T1' && isValidModelRef && !!model && !isViewing(); const isSubModel = !!findComponentByType(node, KnownComponentType.SubModelRef); - const componentRef = findComponentByType(node, KnownComponentType.ModelRef)?.ref; + const { searchTerms } = useSceneHierarchyData(); const isSearching = searchTerms !== ''; @@ -81,7 +80,7 @@ const SceneHierarchyTreeItem: FC = ({ labelText={} onExpand={onExpandNode} expanded={expanded} - expandable={node && (node.childRefs.length > 0 || !!showSubModel) && !isSearching} + expandable={((node && node.childRefs.length > 0) || showSubModel) && !isSearching} selected={selected === key} selectionMode={selectionMode} onSelected={isViewing() ? onActivated : onToggle}