FEATURE: Placeholder-Insert: Exclude specific NodeTypes from the drop…

…down

Load all form-elements recursively. Check if the elements are allowed to shown in the
Placeholder-Insert-Dropdown.
Disallow `Neos.Form.Builder:ElementCollection` and `Neos.Form.Builder:ValidatorCollection` by default. (The section is excluded in the yaml file)

Resolves: neos#99

Configuration/NodeTypes.Finishers.Confirmation.yaml

@@ -21,6 +21,11 @@
           # Alternatively enable a rich text editor:
           # editor: 'Neos.Neos/Inspector/Editors/RichTextEditor'
           # editorOptions:
+          #   excludeNodeTypes:
+          #     'Neos.Form.Builder:ElementCollection':
+          #       exclude: true # excludes only the element
+          #       excludeChildren: false # includes all child-elements
+          #     'Neos.Form.Builder:ValidatorCollection': true # excludes the element and all child-elements
           #   formatting:
           #     placeholderInsert: true
           #     strong: true

Configuration/NodeTypes.Finishers.Email.yaml

@@ -35,6 +35,11 @@
           # Alternatively enable a rich text editor:
           # editor: 'Neos.Neos/Inspector/Editors/RichTextEditor'
           # editorOptions:
+          #   excludeNodeTypes:
+          #     'Neos.Form.Builder:ElementCollection':
+          #       exclude: true # excludes only the element
+          #       excludeChildren: false # includes all child-elements
+          #     'Neos.Form.Builder:ValidatorCollection': true # excludes the element and all child-elements
           #   formatting:
           #     placeholderInsert: true
           #     strong: true

README.md

@@ -378,3 +378,45 @@ selectable:
         }
     }
 ```
+
+## Example: Exclude NodeTypes from the Placeholder-Insert
+
+If you do not want that some of your own NodeTypes are visible in the `Placeholder-Insert`-Dropdown then you can hide them easily.
+
+This option requires the RichText-Editor.
+
+Edit the YAML-Configuration of the Confirmation or Email-Finisher:
+
+```yaml
+'Neos.Form.Builder:EmailFinisher':
+  properties:
+    'templateSource':
+      ui:
+        inspector:
+          editor: 'Neos.Neos/Inspector/Editors/RichTextEditor'
+          editorOptions:
+            excludeNodeTypes:
+              'Foo.Bar:GridCollection':
+                exclude: true # excludes only the element
+                excludeChildren: false # includes all child-elements
+              'Neos.Form.Builder:ValidatorCollection': true # excludes the element and all child-elements
+```
+
+At the path `templateSource.ui.inspector.editorOption.excludeNodeTypes` you can hide or show specific NodeTypes.
+
+If you use the NodeType-Name as the key and a boolean value as the value, these settings has an effekt on the whole element and his child-elements.<br>
+```yaml
+excludeNodeTypes:
+  'Foo.Bar:GridCollection': true # hides the element and all child-elements
+```
+
+If you want only hide the element and not the child-elements (or the opposite) you can specify the setting a little more:<br>
+`exclude`: hides or shows the element, has no effect on the child-elements
+`excludeChildren`: hides or shows the child-elements, has no effect on the parent-element
+
+```yaml
+excludeNodeTypes:
+  'Foo.Bar:GridCollection':
+    exclude: true # excludes only the element
+    excludeChildren: false # includes all child-elements
+```

Resources/Private/PlaceholderInsert/src/PlaceholderInsertDropdown.js

@@ -48,13 +48,7 @@ export default class PlaceholderInsertDropdown extends PureComponent {
     if (!elementsNode) {
       return null;
     }
-    const options = elementsNode.children
-      .map(node => this.props.nodesByContextPath[node.contextPath])
-      .map(node => ({
-        value: node.properties.identifier || node.identifier,
-        label:
-          node.properties.label || node.properties.identifier || node.identifier
-      }));
+    const options = this.getOptionsRecursively(elementsNode.children);
 
     if (options.length === 0) {
       return null;
@@ -74,4 +68,62 @@ export default class PlaceholderInsertDropdown extends PureComponent {
       />
     );
   }
+
+  getOptionsRecursively(elements) {
+    const returnValues = [];
+    const excludeSettings = this.props.inlineEditorOptions.excludeNodeTypes;
+
+    elements.forEach((childNode) => {
+      const currentNode = this.props.nodesByContextPath[childNode.contextPath];
+      const childChildNodes = this.props.nodesByContextPath[childNode.contextPath].children;
+      let skipMode = 'includeAll';
+
+      if (excludeSettings) {
+        if (excludeSettings.hasOwnProperty(childNode.nodeType)) {
+          const nodeTypeSettings = excludeSettings[childNode.nodeType];
+
+          if (typeof nodeTypeSettings === 'boolean') {
+            if (nodeTypeSettings) {
+              // exclude all
+              return;
+            }
+          }
+          else if (nodeTypeSettings.hasOwnProperty('exclude') || nodeTypeSettings.hasOwnProperty('excludeChildren')) {
+            if (nodeTypeSettings.exclude && nodeTypeSettings.excludeChildren) {
+              // exclude all
+              return;
+            }
+            else if (nodeTypeSettings.exclude && !nodeTypeSettings.excludeChildren) {
+              // exclude only current element, not children
+              skipMode = 'skipChildren'
+            }
+            else if (!nodeTypeSettings.exclude && nodeTypeSettings.excludeChildren) {
+              // exclude only children
+              skipMode = 'skipParent'
+            }
+          }
+        }
+      }
+
+      if (skipMode === 'includeAll' || skipMode === 'skipParent') {
+        returnValues.push({
+          value: currentNode.properties.identifier || currentNode.identifier,
+          label:
+              currentNode.properties.label || currentNode.properties.identifier || currentNode.identifier
+        });
+      }
+
+      if (skipMode === 'includeAll' || skipMode === 'skipChildren') {
+        const childOptions = this.getOptionsRecursively(childChildNodes);
+
+        if (Array.isArray(childOptions)) {
+          childOptions.forEach(childOption => {
+            returnValues.push(childOption);
+          });
+        }
+      }
+    });
+
+    return returnValues;
+  }
 }