From 97292698a649eb38a624ba3e67b85dc89de2765b Mon Sep 17 00:00:00 2001 From: Mikkel Laursen Date: Tue, 18 Jan 2022 16:11:02 -0700 Subject: [PATCH] docs(website): Better migration guide search behavior Also add a "real world" example of the custom tests on the writing tests page by linking to my template-rmd repo. --- packages/dev-utils/src/indexer/generate.ts | 12 +++++++----- packages/dev-utils/src/utils/titles.ts | 16 +++++++++++++++- .../documentation/src/guides/writing-tests.md | 8 ++++++++ 3 files changed, 30 insertions(+), 6 deletions(-) diff --git a/packages/dev-utils/src/indexer/generate.ts b/packages/dev-utils/src/indexer/generate.ts index 7d2506257b..500572a74f 100644 --- a/packages/dev-utils/src/indexer/generate.ts +++ b/packages/dev-utils/src/indexer/generate.ts @@ -56,11 +56,7 @@ function getMarkdownForRoute(route: string): string | null { function getTitleForRoute(route: string): string { const [name, pkgName] = route.split("/").reverse(); - const title = toTitle(name) - .replace("Cdn", "CDN") - .replace("V1", "v1") - .replace("Api", "API") - .replace("Sassdoc", "SassDoc"); + const title = toTitle(name); if (/Demos$/.test(title) && route.includes("form")) { return title; @@ -73,6 +69,10 @@ function getTitleForRoute(route: string): string { return `${toTitle(pkgName, "")} ${title}`; } + if (pkgName === "migration-guides") { + return `Migrate from ${title}`; + } + return title; } @@ -145,6 +145,8 @@ export async function generate( let pageUrl = route; if (route.startsWith("/guides")) { pageUrl = "/guides/[id]"; + } else if (route.startsWith("/migration-guides")) { + pageUrl = "/migration-guides/[id]"; } else if (route.startsWith("/blog/")) { pageUrl = "/blog/[id]"; } else if (route.startsWith("/packages") && !route.endsWith("demos")) { diff --git a/packages/dev-utils/src/utils/titles.ts b/packages/dev-utils/src/utils/titles.ts index c695f7b9a6..b42bf00658 100644 --- a/packages/dev-utils/src/utils/titles.ts +++ b/packages/dev-utils/src/utils/titles.ts @@ -32,7 +32,21 @@ export function toTitle(s: string, joinWith = " ", capitals = false): string { return s .split(capitals ? /(?=[A-Z])/ : "-") - .map(upperFirst) + .map((part) => { + if (/^((v\d+)|(to))$/.test(part)) { + return part; + } + + if (/^api$/i.test(part)) { + return "API"; + } + + if (/^cdn$/i.test(part)) { + return "CDN"; + } + + return upperFirst(part); + }) .join(joinWith); } diff --git a/packages/documentation/src/guides/writing-tests.md b/packages/documentation/src/guides/writing-tests.md index 4c59fd8b77..07183bcfe7 100644 --- a/packages/documentation/src/guides/writing-tests.md +++ b/packages/documentation/src/guides/writing-tests.md @@ -1,5 +1,13 @@ ## Writing Tests +> If you want to skip reading all the steps, you can check out my +> [template-rmd](https://github.com/mlaursen/template-rmd) repo for a +> "real-world" example. Check out the +> [src/test-utils.tsx](https://github.com/mlaursen/template-rmd/blob/react-md%40v4.0.3/src/test-utils.tsx) +> and +> [src/components/\_\_tests\_\_/LinkUnstyled.tsx](https://github.com/mlaursen/template-rmd/blob/react-md%40v4.0.3/src/components/__tests__/LinkUnstyled.tsx) +> for example usage. + Testing an app with `react-md` components should not require many changes to your normal testing flow. The only times weird issues might occur are when using components that rely on one of the providers included by the [Configuration