We should create an alias for searching last version of docs on DocSe…

…arch/Algolia, so that on new version publish, search still works even if new version is not already indexed (#3391)
facebook · Sep 2, 2020 · 5ec985c · 5ec985c
1 parent 9857f7b
commit 5ec985c
Show file tree

Hide file tree

Showing 6 changed files with 50 additions and 23 deletions.
diff --git a/packages/docusaurus-plugin-content-docs/src/plugin-content-docs.d.ts b/packages/docusaurus-plugin-content-docs/src/plugin-content-docs.d.ts
@@ -15,6 +15,7 @@ declare module '@docusaurus/plugin-content-docs-types' {
   export type PropVersionMetadata = {
     version: string;
     label: string;
+    isLast: boolean;
     docsSidebars: PropSidebars;
     permalinkToSidebar: PermalinkToSidebar;
   };

diff --git a/packages/docusaurus-plugin-content-docs/src/props.ts b/packages/docusaurus-plugin-content-docs/src/props.ts
@@ -67,6 +67,7 @@ export function toVersionMetadataProp(
   return {
     version: loadedVersion.versionName,
     label: loadedVersion.versionLabel,
+    isLast: loadedVersion.isLast,
     docsSidebars: toSidebarsProp(loadedVersion),
     permalinkToSidebar: loadedVersion.permalinkToSidebar,
   };

diff --git a/packages/docusaurus-theme-classic/src/theme/DocPage/index.tsx b/packages/docusaurus-theme-classic/src/theme/DocPage/index.tsx
@@ -18,6 +18,7 @@ import NotFound from '@theme/NotFound';
 import type {DocumentRoute} from '@theme/DocItem';
 import type {Props} from '@theme/DocPage';
 import {matchPath} from '@docusaurus/router';
+import Head from '@docusaurus/Head';
 
 import styles from './styles.module.css';
 
@@ -27,34 +28,61 @@ type DocPageContentProps = {
   readonly children: ReactNode;
 };
 
+// This theme is not coupled to Algolia, but can we do something else?
+// Note the last version is also indexed with "last", to avoid breaking search on new releases
+// See https://github.com/facebook/docusaurus/issues/3391
+function DocSearchVersionHeader({
+  version,
+  isLast,
+}: {
+  version: string;
+  isLast: boolean;
+}) {
+  const versions = isLast ? [version, 'last'] : version;
+  return (
+    <Head>
+      <meta
+        name="docsearch:version"
+        content={
+          // See https://github.com/facebook/docusaurus/issues/3391#issuecomment-685594160
+          versions instanceof Array ? JSON.stringify(versions) : version
+        }
+      />
+    </Head>
+  );
+}
+
 function DocPageContent({
   currentDocRoute,
   versionMetadata,
   children,
 }: DocPageContentProps): JSX.Element {
   const {siteConfig, isClient} = useDocusaurusContext();
-  const {permalinkToSidebar, docsSidebars, version} = versionMetadata;
+  const {permalinkToSidebar, docsSidebars, version, isLast} = versionMetadata;
   const sidebarName = permalinkToSidebar[currentDocRoute.path];
   const sidebar = docsSidebars[sidebarName];
   return (
-    <Layout version={version} key={isClient}>
-      <div className={styles.docPage}>
-        {sidebar && (
-          <div className={styles.docSidebarContainer} role="complementary">
-            <DocSidebar
-              sidebar={sidebar}
-              path={currentDocRoute.path}
-              sidebarCollapsible={
-                siteConfig.themeConfig?.sidebarCollapsible ?? true
-              }
-            />
-          </div>
-        )}
-        <main className={styles.docMainContainer}>
-          <MDXProvider components={MDXComponents}>{children}</MDXProvider>
-        </main>
-      </div>
-    </Layout>
+    <>
+      <DocSearchVersionHeader version={version} isLast={isLast} />
+      <Layout key={isClient}>
+        <div className={styles.docPage}>
+          {sidebar && (
+            <div className={styles.docSidebarContainer} role="complementary">
+              <DocSidebar
+                sidebar={sidebar}
+                path={currentDocRoute.path}
+                sidebarCollapsible={
+                  siteConfig.themeConfig?.sidebarCollapsible ?? true
+                }
+              />
+            </div>
+          )}
+          <main className={styles.docMainContainer}>
+            <MDXProvider components={MDXComponents}>{children}</MDXProvider>
+          </main>
+        </div>
+      </Layout>
+    </>
   );
 }
 

diff --git a/packages/docusaurus-theme-classic/src/theme/Layout/index.tsx b/packages/docusaurus-theme-classic/src/theme/Layout/index.tsx
@@ -43,7 +43,6 @@ function Layout(props: Props): JSX.Element {
     image,
     keywords,
     permalink,
-    version,
   } = props;
   const metaTitle = title ? `${title} | ${siteTitle}` : siteTitle;
   const metaImage = image || defaultImage;
@@ -63,7 +62,6 @@ function Layout(props: Props): JSX.Element {
         {description && (
           <meta property="og:description" content={description} />
         )}
-        {version && <meta name="docsearch:version" content={version} />}
         {keywords && keywords.length && (
           <meta name="keywords" content={keywords.join(',')} />
         )}

diff --git a/packages/docusaurus-theme-classic/src/types.d.ts b/packages/docusaurus-theme-classic/src/types.d.ts
@@ -245,7 +245,6 @@ declare module '@theme/Layout' {
     image?: string;
     keywords?: string[];
     permalink?: string;
-    version?: string;
   };
 
   const Layout: (props: Props) => JSX.Element;

diff --git a/website/docusaurus.config.js b/website/docusaurus.config.js
@@ -235,7 +235,7 @@ module.exports = {
       apiKey: '47ecd3b21be71c5822571b9f59e52544',
       indexName: 'docusaurus-2',
       searchParameters: {
-        facetFilters: [`version:${versions[0]}`],
+        facetFilters: [`version:last`],
       },
     },
     navbar: {