Yaml Editor: Auto-fold section in RKE2 cluster config (rancher#10108)

shell/components/ResourceYaml.vue

@@ -190,6 +190,11 @@ export default {
 
       cm.foldLinesMatching(/managedFields/);
 
+      // Allow the model to supply an array of json paths to fold other sections in the YAML for the given resource type
+      if (this.value?.yamlFolding) {
+        this.value.yamlFolding.forEach((path) => cm.foldYaml(path));
+      }
+
       // regardless of edit or create we should probably fold all the comments so they dont get out of hand.
       const saved = cm.getMode().fold;
 

shell/models/provisioning.cattle.io.cluster.js

@@ -901,4 +901,11 @@ export default class ProvCluster extends SteveModel {
 
     return null;
   }
+
+  // JSON Paths that should be folded in the YAML editor by default
+  get yamlFolding() {
+    return [
+      'spec.rkeConfig.machinePools.dynamicSchemaSpec',
+    ];
+  }
 }

shell/plugins/codemirror.js

@@ -125,6 +125,47 @@ CodeMirror.defineExtension('foldLinesMatching', function(regex) {
   });
 });
 
+function countSpaces(line) {
+  for (let i = 0; i < line.length; i++) {
+    if (line[i] !== ' ') {
+      return i;
+    }
+  }
+
+  return line.length;
+}
+
+CodeMirror.defineExtension('foldYaml', function(path) {
+  this.operation(() => {
+    let elements = [];
+
+    for (let i = this.firstLine(), e = this.lastLine(); i <= e; i++) {
+      const line = this.getLine(i);
+      const index = countSpaces(line);
+      const trimmed = line.trim();
+
+      if (trimmed.endsWith(':') || trimmed.endsWith(': >-')) {
+        const name = trimmed.split(':')[0].substr(0, trimmed.length - 1);
+
+        // Remove all elements of the same are greater index
+        elements = elements.filter((e) => e.index < index);
+
+        // Add on this one
+        elements.push({
+          index,
+          name
+        });
+
+        const currentPath = elements.map((e) => e.name).join('.');
+
+        if (currentPath === path) {
+          this.foldCode(CodeMirror.Pos(i, 0), null, 'fold');
+        }
+      }
+    }
+  });
+});
+
 CodeMirror.registerHelper('fold', 'yamlcomments', (cm, start) => {
   if ( !isLineComment(cm, start.line) ) {
     return;

shell/plugins/dashboard-store/resource-class.js

@@ -1927,4 +1927,11 @@ export default class Resource {
   get creationTimestamp() {
     return this.metadata?.creationTimestamp;
   }
+
+  /**
+   * Allows model to specify JSON Paths that should be folded in the YAML editor by default
+   */
+  get yamlFolding() {
+    return [];
+  }
 }