From b7c7b951d03180e5db3353413d5b2bfa04bc1e17 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Sebastian=20Kurf=C3=BCrst?=
 <sebastian.kurfuerst@sandstorm.de>
Date: Wed, 4 Apr 2018 10:39:02 +0200
Subject: [PATCH] BUGFIX: Improve performance of switching between nodes in
 NodeTree

without this fix, all nodes in the node tree get redrawn everytime
the user selects a different node; which leads to prohibitive performance
when switching nodes.
---
 .../LeftSideBar/NodeTree/Node/index.js        | 28 +++++++++----------
 1 file changed, 13 insertions(+), 15 deletions(-)

diff --git a/packages/neos-ui/src/Containers/LeftSideBar/NodeTree/Node/index.js b/packages/neos-ui/src/Containers/LeftSideBar/NodeTree/Node/index.js
index f3f1fc99d3..5ed1bef0fc 100644
--- a/packages/neos-ui/src/Containers/LeftSideBar/NodeTree/Node/index.js
+++ b/packages/neos-ui/src/Containers/LeftSideBar/NodeTree/Node/index.js
@@ -55,8 +55,8 @@ export default class Node extends PureComponent {
         isLastChild: PropTypes.bool,
         childNodes: PropTypes.object,
         level: PropTypes.number.isRequired,
-        currentDocumentNodeContextPath: PropTypes.string,
-        focusedNodeContextPath: PropTypes.string,
+        isActive: PropTypes.bool,
+        isFocused: PropTypes.bool,
         toggledNodeContextPaths: PropTypes.object,
         hiddenContextPaths: PropTypes.object,
         intermediateContextPaths: PropTypes.object,
@@ -79,7 +79,7 @@ export default class Node extends PureComponent {
 
     componentDidMount() {
         // Always request scroll on first render if given node is focused
-        if (this.props.focusedNodeContextPath === $get('contextPath', this.props.node)) {
+        if (this.props.isFocused) {
             this.setState({
                 shouldScrollIntoView: true
             });
@@ -88,9 +88,9 @@ export default class Node extends PureComponent {
 
     componentWillReceiveProps(nextProps) {
         // If focused node changed
-        if (this.props.focusedNodeContextPath !== nextProps.focusedNodeContextPath) {
+        if (this.props.isFocused !== nextProps.isFocused) {
             // And it is the current node
-            if (nextProps.focusedNodeContextPath === $get('contextPath', nextProps.node)) {
+            if (nextProps.isFocused) {
                 // Request scrolling itself into view
                 this.setState({
                     shouldScrollIntoView: true
@@ -160,17 +160,17 @@ export default class Node extends PureComponent {
     }
 
     isFocused() {
-        const {node, focusedNodeContextPath} = this.props;
+        const {isFocused} = this.props;
 
-        return focusedNodeContextPath === $get('contextPath', node);
+        return isFocused;
     }
 
     isActive() {
-        const {node, currentDocumentNodeContextPath, isContentTreeNode} = this.props;
+        const {isActive, isContentTreeNode} = this.props;
         if (isContentTreeNode) {
             return this.isFocused();
         }
-        return currentDocumentNodeContextPath === $get('contextPath', node);
+        return isActive;
     }
 
     isCollapsed() {
@@ -323,9 +323,8 @@ export const PageTreeNode = withNodeTypeRegistryAndI18nRegistry(connect(
             loadingDepth: neos.configuration.nodeTree.loadingDepth,
             childNodes: childrenOfSelector(state, getContextPath(node)),
             hasChildren: hasChildrenSelector(state, getContextPath(node)),
-            currentDocumentNodeContextPath: selectors.UI.ContentCanvas.getCurrentContentCanvasContextPath(state),
-            currentDocumentNode: selectors.UI.ContentCanvas.documentNodeSelector(state),
-            focusedNodeContextPath: selectors.UI.PageTree.getFocused(state),
+            isActive: selectors.UI.ContentCanvas.getCurrentContentCanvasContextPath(state) === $get('contextPath', node),
+            isFocused: selectors.UI.PageTree.getFocused(state) === $get('contextPath', node),
             toggledNodeContextPaths: selectors.UI.PageTree.getToggled(state),
             hiddenContextPaths: selectors.UI.PageTree.getHidden(state),
             intermediateContextPaths: selectors.UI.PageTree.getIntermediate(state),
@@ -365,9 +364,8 @@ export const ContentTreeNode = withNodeTypeRegistryAndI18nRegistry(connect(
             loadingDepth: neos.configuration.structureTree.loadingDepth,
             childNodes: childrenOfSelector(state, getContextPath(node)),
             hasChildren: hasChildrenSelector(state, getContextPath(node)),
-            currentDocumentNodeContextPath: selectors.UI.ContentCanvas.getCurrentContentCanvasContextPath(state),
-            currentDocumentNode: selectors.UI.ContentCanvas.documentNodeSelector(state),
-            focusedNodeContextPath: $get('cr.nodes.focused.contextPath', state),
+            isActive: selectors.UI.ContentCanvas.getCurrentContentCanvasContextPath(state) === $get('contextPath', node),
+            isFocused: $get('cr.nodes.focused.contextPath', state) === $get('contextPath', node),
             toggledNodeContextPaths: selectors.UI.ContentTree.getToggled(state),
             isNodeDirty: isContentNodeDirtySelector(state, $get('contextPath', node)),
             canBeInsertedAlongside: canBeMovedAlongsideSelector(state, {