diff --git a/packages/frontend-2/components/viewer/explorer/Explorer.vue b/packages/frontend-2/components/viewer/explorer/Explorer.vue index 497526d397..999cb70226 100644 --- a/packages/frontend-2/components/viewer/explorer/Explorer.vue +++ b/packages/frontend-2/components/viewer/explorer/Explorer.vue @@ -54,7 +54,6 @@ import { } from '~~/lib/viewer/composables/setup' import { markRaw } from 'vue' import { useViewerEventListener } from '~~/lib/viewer/composables/viewer' -import { SpeckleViewer } from '@speckle/shared' defineEmits(['close']) @@ -91,57 +90,39 @@ const rootNodes = computed(() => { if (!worldTree.value) return [] expandLevel.value = -1 - // Arrays to hold categorized nodes - const versionNodes = [] - const modelNodes = [] - const folderNodes = [] - const allModelNodes = [] - const objectNodes = [] - const rootNodes = worldTree.value._root.children as ExplorerNode[] - for (const node of rootNodes) { + + // Create a mapping of objectId to corresponding node for quick lookup + const nodesById = rootNodes.reduce((acc, node) => { const objectId = ((node.model as Record).id as string) .split('/') .reverse()[0] as string - const resourceItem = resourceItems.value.find((res) => res.objectId === objectId) - const raw = node.model?.raw as Record - if (resourceItem?.modelId) { - // Model resource - const model = modelsAndVersionIds.value.find( - (item) => item.model.id === resourceItem.modelId - )?.model - raw.name = model?.name - raw.type = model?.id + acc[objectId] = node + return acc + }, {} as Record) - if (resourceItem.versionId) { - versionNodes.push(node.model as ExplorerNode) - } else { - modelNodes.push(node.model as ExplorerNode) + // Order the nodes based on the order of resourceItems + const orderedNodes = resourceItems.value + .map((resourceItem) => { + const node = nodesById[resourceItem.objectId] + if (node) { + const raw = node.model?.raw as Record + if (resourceItem.modelId) { + const model = modelsAndVersionIds.value.find( + (item) => item.model.id === resourceItem.modelId + )?.model + raw.name = model?.name + raw.type = model?.id + } else { + raw.name = 'Object' + raw.type = 'Single Object' + } + return node.model as ExplorerNode } - } else if (resourceItem) { - const resource = SpeckleViewer.ViewerRoute.parseUrlParameters( - resourceItem.objectId - )[0] - - if (SpeckleViewer.ViewerRoute.isModelFolderResource(resource)) { - folderNodes.push(node.model as ExplorerNode) - } else if (SpeckleViewer.ViewerRoute.isAllModelsResource(resource)) { - allModelNodes.push(node.model as ExplorerNode) - } else if (SpeckleViewer.ViewerRoute.isObjectResource(resource)) { - raw.name = 'Object' - raw.type = 'Single Object' - objectNodes.push(node.model as ExplorerNode) - } - } - } + return null + }) + .filter((node): node is ExplorerNode => node !== null) - // Combine the categorized nodes in the same order as ViewerLayoutPanel - return [ - ...versionNodes, - ...modelNodes, - ...folderNodes, - ...allModelNodes, - ...objectNodes - ] + return orderedNodes })