feat(v2): introduce DocSearch v3 search

packages/docusaurus-theme-search-algolia/package.json

@@ -8,10 +8,10 @@
   },
   "license": "MIT",
   "dependencies": {
-    "algoliasearch": "^3.24.5",
+    "@docsearch/react": "^1.0.0-alpha.24",
+    "algoliasearch": "^4.0.0",
     "algoliasearch-helper": "^3.1.1",
     "clsx": "^1.1.1",
-    "docsearch.js": "^2.6.3",
     "eta": "^1.1.1"
   },
   "peerDependencies": {

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

@@ -31,26 +31,6 @@ module.exports = function (context) {
       return [pagePath];
     },
 
-    configureWebpack() {
-      // Ensure that algolia docsearch styles is its own chunk.
-      return {
-        optimization: {
-          splitChunks: {
-            cacheGroups: {
-              algolia: {
-                name: 'algolia',
-                test: /algolia\.css$/,
-                chunks: `all`,
-                enforce: true,
-                // Set priority higher than docusaurus single-css extraction.
-                priority: 60,
-              },
-            },
-          },
-        },
-      };
-    },
-
     async contentLoaded({actions: {addRoute}}) {
       addRoute({
         path: normalizeUrl([baseUrl, 'search']),

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

@@ -223,6 +223,12 @@ function Search() {
     makeSearch(searchResultState.lastPage);
   }, [searchResultState.lastPage]);
 
+  useEffect(() => {
+    if (searchValue && searchValue !== searchQuery) {
+      setSearchQuery(searchValue);
+    }
+  }, [searchValue]);
+
   return (
     <Layout title={getTitle()}>
       <div className="container margin-vert--lg">