See #246. Improve page meta descriptions

scripts/generate-docs/BeautifierDoc.ts

@@ -17,6 +17,7 @@ import {
   slugify,
   websiteEditUrl,
   badgesForRepository,
+  optionKeyToTitle,
 } from "./utils";
 import Doc from "./Doc";
 import MarkdownBuilder from "./MarkdownBuilder";
@@ -40,6 +41,20 @@ export default class BeautifierDoc extends Doc {
   public get title(): string {
     return `${this.beautifierName} Beautifier`;
   }
+  protected get description(): string {
+    const { supportedOptions } = this;
+    return `${this.beautifierName} supports ${
+      this.languages.length
+    } languages (e.g. ${this.languages
+      .map(lang => lang.name)
+      .slice(0, 3)
+      .join(", ")}) and ${
+      supportedOptions.length
+    } configuration options (e.g. ${supportedOptions
+      .map(op => op.title)
+      .slice(0, 3)
+      .join(", ")}).`;
+  }
   public get sidebarLabel(): string {
     return this.beautifierName;
   }
@@ -354,6 +369,21 @@ export default class BeautifierDoc extends Doc {
     });
     return builder;
   }
+  private get supportedOptions() {
+    return _.uniqBy(
+      Object.keys(this.optionsLookup).reduce(
+        (options, langKey) => [
+          ...options,
+          ...Object.keys(this.optionsLookup[langKey]).map(key => ({
+            title: optionKeyToTitle(key),
+            ...this.optionsLookup[langKey][key],
+          })),
+        ],
+        []
+      ),
+      op => op.title
+    );
+  }
   private createOptionsLookup(): OptionsLookup {
     return this.languages
       .map(language => ({ language, options: this.options(language) }))

scripts/generate-docs/ContributingExamples.ts

@@ -16,6 +16,9 @@ export default class ContributingExamplesDoc extends Doc {
   public get title(): string {
     return "Contributing Examples";
   }
+  protected get description() {
+    return undefined;
+  }
   public get sidebarLabel(): string {
     return "Examples";
   }

scripts/generate-docs/Doc.ts

@@ -15,6 +15,7 @@ export default abstract class Doc {
     return slugify(this.title);
   }
   protected abstract get title(): string;
+  protected abstract get description(): string | undefined;
   protected get sidebarLabel(): string | Promise<string> {
     return this.title;
   }
@@ -28,16 +29,19 @@ export default abstract class Doc {
     );
   }
   protected get frontMatter(): Promise<string> {
-    return Promise.all([this.id, this.title, this.sidebarLabel]).then(
-      ([id, title, sidebarLabel]) =>
+    return Promise.all([this.id, this.title, this.description, this.sidebarLabel]).then(
+      ([id, title, description, sidebarLabel]) =>
         [
           "---",
           `id: ${id}`,
           `title: ${title}`,
+          description ? `description: ${description}` : '',
           `sidebar_label: ${sidebarLabel}`,
           this.customEditUrl ? `custom_edit_url: ${this.customEditUrl}` : "",
           "---",
-        ].join("\n")
+        ]
+          .filter(Boolean)
+          .join("\n")
     );
   }
 }

scripts/generate-docs/ExecutableDoc.ts

@@ -26,6 +26,9 @@ export default class ExecutableDoc extends Doc {
   public get title(): string {
     return `${this.executable.name} Executable`;
   }
+  protected get description() {
+    return undefined;
+  }
   protected get slug(): string {
     return slugify(`${this.beautifier.name}-${this.executable.name}`);
   }

scripts/generate-docs/LanguageDoc.ts

@@ -14,6 +14,7 @@ import {
   coreLanguagesEditUrl,
   badgesForRepository,
   globsForLanguage,
+  optionKeyToTitle,
 } from "./utils";
 import Doc from "./Doc";
 import MarkdownBuilder from "./MarkdownBuilder";
@@ -34,6 +35,19 @@ export default class LanguageDoc extends Doc {
   public get title(): string {
     return this.language.name;
   }
+  protected get description(): string {
+    const { supportedOptions } = this;
+    return `${this.language.name} language supports ${
+      this.beautifiers.length
+    } beautifiers ${this.beautifiers
+      .map(beautifier => beautifier.name)
+      .join(", ")} and ${
+      supportedOptions.length
+    } options including ${supportedOptions
+      .map(op => op.title)
+      .slice(0, 3)
+      .join(", ")}`;
+  }
   protected get body(): string {
     const builder = new MarkdownBuilder();
     this.appendSelectorInfo(builder);
@@ -140,6 +154,22 @@ export default class LanguageDoc extends Doc {
     }, 1);
     return builder;
   }
+
+  private get supportedOptions() {
+    return _.uniqBy(
+      Object.keys(this.optionsLookup).reduce(
+        (options, langKey) => [
+          ...options,
+          ...Object.keys(this.optionsLookup[langKey]).map(key => ({
+            title: optionKeyToTitle(key),
+            ...this.optionsLookup[langKey][key],
+          })),
+        ],
+        []
+      ),
+      op => op.title
+    );
+  }
   private createOptionsLookup(): OptionsLookup {
     return this.beautifiers
       .map(beautifier => ({ beautifier, options: this.options(beautifier) }))

scripts/generate-docs/LanguagesListDoc.ts

@@ -7,13 +7,25 @@ import {
   linkForBeautifier,
   linkForLanguage,
 } from "./utils";
+
+const siteConfig = require("../../website/siteConfig");
+const topLanguages: Array<{
+  name: string;
+}> =
+  siteConfig.languages;
+
 export default class LanguagesListDoc extends Doc {
   constructor(private languages: Language[]) {
     super();
   }
   public get title(): string {
     return "Supported Languages";
   }
+  protected get description(): string {
+    return `Unibeautify supports ${
+      this.languages.length
+    } languages including ${topLanguages.map(lang => lang.name).join(", ")}.`;
+  }
   protected get id(): string {
     return "languages";
   }

scripts/generate-docs/OptionsDoc.ts

@@ -59,6 +59,12 @@ export default class OptionsDoc extends Doc {
     return title;
   }
 
+  protected get description(): string {
+    return `${this.option.description}. Configuration option for beautifiers ${this.beautifiers
+      .map(beautifier => beautifier.name)
+      .join(", ")} and languages ${this.languages.map(lang => lang.name).join(', ')}`;
+  }
+
   protected get customEditUrl() {
     return coreOptionsEditUrl;
   }

scripts/generate-docs/OptionsListDoc.ts

@@ -9,6 +9,11 @@ export default class OptionsListDoc extends Doc {
   public get title(): string {
     return "Language Options";
   }
+  protected get description(): string {
+    return `Unibeautify supports ${
+      Object.keys(this.allOptions).length
+    } configuration options. Click on an option title below for more information including how to configure and examples.`;
+  }
   protected get id(): string {
     return "options-for-languages";
   }
@@ -21,8 +26,8 @@ export default class OptionsListDoc extends Doc {
   protected get body(): string {
     const builder = new MarkdownBuilder();
     builder.append(
-      "Click on an option title below for more information including configuration an" +
-        "d examples."
+      "Click on an option title below for more information including how to configure" +
+        " and examples."
     );
     builder.append("| # | Title | Config Key | Description |");
     builder.append("| --- | --- | --- | --- |");