From c4ab7f589a0c88c67051a4f4774ae355afa52423 Mon Sep 17 00:00:00 2001 From: Glavin Wiechert Date: Fri, 17 Apr 2020 02:28:26 -0300 Subject: [PATCH] See #246. Improve page meta descriptions --- scripts/generate-docs/BeautifierDoc.ts | 30 +++++++++++++++++++ scripts/generate-docs/ContributingExamples.ts | 3 ++ scripts/generate-docs/Doc.ts | 10 +++++-- scripts/generate-docs/ExecutableDoc.ts | 3 ++ scripts/generate-docs/LanguageDoc.ts | 30 +++++++++++++++++++ scripts/generate-docs/LanguagesListDoc.ts | 12 ++++++++ scripts/generate-docs/OptionsDoc.ts | 6 ++++ scripts/generate-docs/OptionsListDoc.ts | 9 ++++-- 8 files changed, 98 insertions(+), 5 deletions(-) diff --git a/scripts/generate-docs/BeautifierDoc.ts b/scripts/generate-docs/BeautifierDoc.ts index 1c1760ae..83d3560a 100644 --- a/scripts/generate-docs/BeautifierDoc.ts +++ b/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) })) diff --git a/scripts/generate-docs/ContributingExamples.ts b/scripts/generate-docs/ContributingExamples.ts index 3c006552..42c791b7 100644 --- a/scripts/generate-docs/ContributingExamples.ts +++ b/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"; } diff --git a/scripts/generate-docs/Doc.ts b/scripts/generate-docs/Doc.ts index 56744273..e11e13d3 100644 --- a/scripts/generate-docs/Doc.ts +++ b/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 { return this.title; } @@ -28,16 +29,19 @@ export default abstract class Doc { ); } protected get frontMatter(): Promise { - 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") ); } } diff --git a/scripts/generate-docs/ExecutableDoc.ts b/scripts/generate-docs/ExecutableDoc.ts index 54e9e15d..63e4be88 100644 --- a/scripts/generate-docs/ExecutableDoc.ts +++ b/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}`); } diff --git a/scripts/generate-docs/LanguageDoc.ts b/scripts/generate-docs/LanguageDoc.ts index bb28d2d5..9492769b 100644 --- a/scripts/generate-docs/LanguageDoc.ts +++ b/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) })) diff --git a/scripts/generate-docs/LanguagesListDoc.ts b/scripts/generate-docs/LanguagesListDoc.ts index 4714f4db..391c1f01 100644 --- a/scripts/generate-docs/LanguagesListDoc.ts +++ b/scripts/generate-docs/LanguagesListDoc.ts @@ -7,6 +7,13 @@ 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(); @@ -14,6 +21,11 @@ export default class LanguagesListDoc extends Doc { 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"; } diff --git a/scripts/generate-docs/OptionsDoc.ts b/scripts/generate-docs/OptionsDoc.ts index ada675a7..a9c8a056 100644 --- a/scripts/generate-docs/OptionsDoc.ts +++ b/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; } diff --git a/scripts/generate-docs/OptionsListDoc.ts b/scripts/generate-docs/OptionsListDoc.ts index 74b74bb7..1eb40b8d 100644 --- a/scripts/generate-docs/OptionsListDoc.ts +++ b/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("| --- | --- | --- | --- |");