WIP FEATURE: replace ConfigurationTreeViewHelper with fusion and adjust styling

Author: ellenrieder-queo

Neos.Neos/Resources/Private/Fusion/Backend/Configuration.Ui/Common/Tree.fusion

@@ -0,0 +1,22 @@
+prototype(Neos.Neos:Component.Tree) < prototype(Neos.Fusion:Component) {
+  configuration = ${[]}
+
+  renderer = afx`
+    <ul>
+      <Neos.Fusion:Loop items={props.configuration}>
+        <li class={'neos-tree-node' + (Type.isArray(item)? ' neos-tree-folder' : '')}>
+          <span class="node-tree-title">{itemKey}
+            <Neos.Fusion:Fragment @if.isString={!Type.isArray(item)}>{": "}</Neos.Fusion:Fragment>
+            <span @if.isArray={Type.isArray(item)}>{" "}({Array.length(item)})</span>
+          </span>
+          <Neos.Neos:Component.Tree
+            @if.isArray={Type.isArray(item)}
+            configuration={item}/>
+          <span @if.isString={!Type.isArray(item)} class={'value -is-' + Type.getType(item)}>
+            {Type.isBoolean(item) ? (item ? 'true' : 'false') : item}
+          </span>
+        </li>
+      </Neos.Fusion:Loop>
+    </ul>
+  `
+}

Neos.Neos/Resources/Private/Styles/Modules/Administration/_Configuration.scss

@@ -38,17 +38,17 @@
     }
 
     .value {
-      &[title="boolean"],
-      &[title="NULL"] {
+      &.-is-boolean,
+      &.-is-NULL {
         color: $orange;
       }
 
-      &[title="integer"],
-      &[title="double"] {
+      &.-is-integer,
+      &.-is-double {
         color: $warning;
       }
 
-      &[title="string"] {
+      &.-is-string {
         color: $blue;
       }
     }