fix(v2): use swizzled SearchPage component if any (#3721)

* fix(v2): use swizzled SearchPage component if any

* Fix dependency cycles warning

packages/docusaurus-theme-search-algolia/src/index.js

@@ -8,7 +8,7 @@
 const path = require('path');
 const fs = require('fs');
 const eta = require('eta');
-const {normalizeUrl} = require('@docusaurus/utils');
+const {normalizeUrl, getSwizzledComponent} = require('@docusaurus/utils');
 const openSearchTemplate = require('./templates/opensearch');
 const {validateThemeConfig} = require('./validateThemeConfig');
 const {memoize} = require('lodash');
@@ -29,7 +29,10 @@ function theme(context) {
     baseUrl,
     siteConfig: {title, url, favicon},
   } = context;
-  const pagePath = path.resolve(__dirname, './theme/SearchPage/index.js');
+  const pageComponent = './theme/SearchPage/index.js';
+  const pagePath =
+    getSwizzledComponent(pageComponent) ||
+    path.resolve(__dirname, pageComponent);
 
   return {
     name: 'docusaurus-theme-search-algolia',

packages/docusaurus-utils/src/index.ts

@@ -463,3 +463,17 @@ export function reportMessage(
       );
   }
 }
+
+export function getSwizzledComponent(
+  componentPath: string,
+): string | undefined {
+  const swizzledComponentPath = path.resolve(
+    process.cwd(),
+    'src',
+    componentPath,
+  );
+
+  return fs.existsSync(swizzledComponentPath)
+    ? swizzledComponentPath
+    : undefined;
+}

website/docs/using-themes.md

@@ -197,7 +197,7 @@ This theme provides a `@theme/SearchBar` component that integrates with Algolia
 npm install --save @docusaurus/theme-search-algolia
 ```
 
-This theme also adds search page available at `/search` path with OpenSearch support.
+This theme also adds search page available at `/search` (as swizzleable `SearchPage` component) path with OpenSearch support.
 
 :::tip