#1143: Make flat patterns on view all pages optional

JosefBredereck · JosefBredereck · commit 2022f642e6c0 · 2020-07-01T19:30:48.000+02:00
diff --git a/packages/cli/test/fixtures/patternlab-config.json b/packages/cli/test/fixtures/patternlab-config.json
@@ -73,6 +73,7 @@
 	"patternExportDirectory": "./pattern_exports/",
 	"patternExportPatternPartials": [],
 	"patternMergeVariantArrays": true,
+	"renderFlatPatternsOnViewAllPages": false,
 	"serverOptions": {
 		"wait": 1000
 	},
diff --git a/packages/core/patternlab-config.json b/packages/core/patternlab-config.json
@@ -76,6 +76,7 @@
   "patternExportPreserveDirectoryStructure": true,
   "patternExportRaw": false,
   "patternMergeVariantArrays": true,
+  "renderFlatPatternsOnViewAllPages": false,
   "serverOptions": {
     "wait": 1000
   },
diff --git a/packages/core/src/lib/ui_builder.js b/packages/core/src/lib/ui_builder.js
@@ -417,7 +417,12 @@ const ui_builder = function() {
         groupedPatterns.patternGroups[pattern.patternGroup] = {};
         pattern.isSubtypePattern = false;
         addPatternType(patternlab, pattern);
-        addPatternItem(patternlab, pattern, true);
+        if (
+          !pattern.isFlatPattern ||
+          patternlab.config.renderFlatPatternsOnViewAllPages
+        ) {
+          addPatternItem(patternlab, pattern, true);
+        }
         addToViewAllPaths(patternlab, pattern);
       }
 
@@ -629,15 +634,17 @@ const ui_builder = function() {
                   patternType
                 );
 
-                // Check if this is a flat pattern group
-                typePatterns = sortedFlatPatterns.concat(typePatterns);
+                if (patternlab.config.renderFlatPatternsOnViewAllPages) {
+                  // Check if this is a flat pattern group
+                  typePatterns = sortedFlatPatterns.concat(typePatterns);
+                }
 
                 // get the appropriate patternType
                 const anyPatternOfType = _.find(typePatterns, function(pat) {
                   return pat.patternType && pat.patternType !== '';
                 });
 
-                if (!anyPatternOfType) {
+                if (!anyPatternOfType || !typePatterns.length) {
                   logger.debug(
                     `skipping ${patternType} as flat patterns do not have view all pages`
                   );
@@ -676,8 +683,12 @@ const ui_builder = function() {
                         `Omitting ${patternType} from  building a viewall page because its patternGroup is specified in styleguideExcludes.`
                       );
                     } else {
-                      patterns = sortedFlatPatterns;
-                      patterns = patterns.concat(styleguideTypePatterns);
+                      if (patternlab.config.renderFlatPatternsOnViewAllPages) {
+                        patterns = sortedFlatPatterns;
+                        patterns = patterns.concat(styleguideTypePatterns);
+                      } else {
+                        patterns = styleguideTypePatterns;
+                      }
                     }
                     return Promise.resolve(patterns);
                   })
@@ -698,10 +709,14 @@ const ui_builder = function() {
       }
     );
 
-    return Promise.all(allPatternTypePromises).catch(reason => {
-      console.log(reason);
-      logger.error('Error during buildViewAllPages');
-    });
+    return Promise.all(allPatternTypePromises)
+      .then(allPatterns =>
+        Promise.resolve(_.filter(allPatterns, p => p.length))
+      )
+      .catch(reason => {
+        console.log(reason);
+        logger.error('Error during buildViewAllPages');
+      });
   }
 
   /**
diff --git a/packages/core/test/ui_builder_tests.js b/packages/core/test/ui_builder_tests.js
@@ -527,7 +527,7 @@ tap.test('resetUIBuilderState - reset global objects', function(test) {
 });
 
 tap.test(
-  'buildViewAllPages - adds viewall page for each type and subtype',
+  'buildViewAllPages - adds viewall page for each type and subtype NOT! for flat patterns',
   function(test) {
     //arrange
     const mainPageHeadHtml = '<head></head>';
@@ -554,6 +554,76 @@ tap.test(
 
     const styleguidePatterns = ui.groupPatterns(patternlab, uikit);
 
+    //act
+    ui.buildViewAllPages(
+      mainPageHeadHtml,
+      patternlab,
+      styleguidePatterns,
+      uikit
+    ).then(allPatterns => {
+      // assert
+      // this was a nuanced one. buildViewAllPages() had return false; statements
+      // within _.forOwn(...) loops, causing premature termination of the entire loop
+      // when what was intended was a continue
+      // we expect 10 here because:
+      //   - foo.mustache is flat and therefore does not have a viewall page
+      //   - the colors.mustache files make 6
+      //   - patternSubType1 and patternSubType2 make 8
+      //   - the general view all page make 9
+      // while most of that heavy lifting occurs inside groupPatterns and not buildViewAllPages,
+      // it's important to ensure that this method does not get prematurely terminated
+      // we choose to do that by checking it's return number of patterns
+
+      const uniquePatterns = ui.uniqueAllPatterns(allPatterns, patternlab);
+
+      /**
+       * - view-patternType1-all
+       * -- viewall-patternType1-patternSubType1
+       * --- blue
+       * --- red
+       * --- yellow
+       * -- viewall-patternType1-patternSubType2
+       * --- black
+       * --- grey
+       * --- white
+       */
+      test.equals(uniquePatterns.length, 9, '3 viewall pages should be added');
+
+      test.end();
+    });
+  }
+);
+
+tap.test(
+  'buildViewAllPages - adds viewall page for each type and subtype FOR! flat patterns',
+  function(test) {
+    //arrange
+    const mainPageHeadHtml = '<head></head>';
+    const patternlab = createFakePatternLab({
+      patterns: [],
+      patternGroups: {},
+      subtypePatterns: {},
+      footer: {},
+      userFoot: {},
+      cacheBuster: 1234,
+    });
+
+    patternlab.config.renderFlatPatternsOnViewAllPages = true;
+
+    patternlab.patterns.push(
+      //this flat pattern is found and causes trouble for the rest of the crew
+      new Pattern('00-test/foo.mustache'),
+      new Pattern('patternType1/patternSubType1/blue.mustache'),
+      new Pattern('patternType1/patternSubType1/red.mustache'),
+      new Pattern('patternType1/patternSubType1/yellow.mustache'),
+      new Pattern('patternType1/patternSubType2/black.mustache'),
+      new Pattern('patternType1/patternSubType2/grey.mustache'),
+      new Pattern('patternType1/patternSubType2/white.mustache')
+    );
+    ui.resetUIBuilderState(patternlab);
+
+    const styleguidePatterns = ui.groupPatterns(patternlab, uikit);
+
     //act
     ui.buildViewAllPages(
       mainPageHeadHtml,
@@ -569,6 +639,8 @@ tap.test(
       //   - foo.mustache is flat and therefore does not have a viewall page
       //   - the colors.mustache files make 6
       //   - patternSubType1 and patternSubType2 make 8
+      //   - the general view all page make 9
+      //   - the view-all page of test and test-foo make 11
       // while most of that heavy lifting occurs inside groupPatterns and not buildViewAllPages,
       // it's important to ensure that this method does not get prematurely terminated
       // we choose to do that by checking it's return number of patterns
diff --git a/packages/core/test/util/patternlab-config.json b/packages/core/test/util/patternlab-config.json
@@ -58,6 +58,7 @@
   "patternExportDirectory": "./pattern_exports/",
   "patternExtension": "mustache",
   "patternMergeVariantArrays": true,
+  "renderFlatPatternsOnViewAllPages": false,
   "cacheBust": true,
   "outputFileSuffixes": {
     "rendered": ".rendered",
diff --git a/packages/development-edition-engine-handlebars/patternlab-config.json b/packages/development-edition-engine-handlebars/patternlab-config.json
@@ -70,7 +70,8 @@
   "patternExportPatternPartials": [],
   "patternExportPreserveDirectoryStructure": true,
   "patternExportRaw": false,
-  "patternMergeVariantArrays": true,
+  "patternMergeVariantArrays": false,
+  "renderFlatPatternsOnViewAllPages": false,
   "serverOptions": {
     "wait": 1000
   },
diff --git a/packages/development-edition-engine-react/patternlab-config.json b/packages/development-edition-engine-react/patternlab-config.json
@@ -76,6 +76,7 @@
   "patternExportDirectory": "./pattern_exports/",
   "patternExportPatternPartials": [],
   "patternMergeVariantArrays": true,
+  "renderFlatPatternsOnViewAllPages": false,
   "serverOptions": {
     "wait": 1000
   },
diff --git a/packages/development-edition-engine-twig/patternlab-config.json b/packages/development-edition-engine-twig/patternlab-config.json
@@ -81,6 +81,7 @@
   "patternExportDirectory": "pattern_exports",
   "patternExportPatternPartials": [],
   "patternMergeVariantArrays": true,
+  "renderFlatPatternsOnViewAllPages": false,
   "serverOptions": {
     "wait": 1000
   },
diff --git a/packages/docs/src/docs/advanced-config-options.md b/packages/docs/src/docs/advanced-config-options.md
@@ -199,6 +199,19 @@ Used to override the merge behavior of pattern variants. For more information se
 
 **default**: `true` | `undefined`
 
+### renderFlatPatternsOnViewAllPages
+
+Used to activate rendering flat patterns on view all pages and generate view all pages if only flat patterns are available
+
+- `true` will render flat patterns on view all pages
+- `false` will make flat patterns available only in the menu
+
+```javascript
+"renderFlatPatternsOnViewAllPages": true,
+```
+
+**default**: `false` | `undefined`
+
 ### serverOptions
 
 Sets live-server options. See the [live-server documentation](https://github.com/pattern-lab/live-server#usage-from-node) for more details.
diff --git a/packages/edition-node-gulp/patternlab-config.json b/packages/edition-node-gulp/patternlab-config.json
@@ -76,6 +76,7 @@
   "patternExportPreserveDirectoryStructure": true,
   "patternExportRaw": false,
   "patternMergeVariantArrays": true,
+  "renderFlatPatternsOnViewAllPages": false,
   "serverOptions": {
     "wait": 1000
   },
diff --git a/packages/edition-node/patternlab-config.json b/packages/edition-node/patternlab-config.json
@@ -76,6 +76,7 @@
   "patternExportPreserveDirectoryStructure": true,
   "patternExportRaw": false,
   "patternMergeVariantArrays": true,
+  "renderFlatPatternsOnViewAllPages": false,
   "serverOptions": {
     "wait": 1000
   },
diff --git a/packages/edition-twig/patternlab-config.json b/packages/edition-twig/patternlab-config.json
@@ -140,6 +140,7 @@
   "patternExportPreserveDirectoryStructure": true,
   "patternExportRaw": false,
   "patternMergeVariantArrays": true,
+  "renderFlatPatternsOnViewAllPages": false,
   "serverOptions": {
     "wait": 1000
   },
