Add algolia search (#1398)

Author: jgonet

docs/docusaurus.config.js

@@ -37,6 +37,13 @@ module.exports = {
     ],
   ],
   themeConfig: {
+    algolia: {
+      apiKey: 'd738e28e9c67a26dd7933b011fe2b9e4',
+      indexName: 'react-native-gesture-handler',
+
+      contextualSearch: true,
+      searchParameters: {},
+    },
     colorMode: { disableSwitch: true },
     prism: {
       theme: {

docs/package.json

@@ -15,13 +15,13 @@
     "@docusaurus/core": "2.0.0-alpha.63",
     "@docusaurus/preset-classic": "2.0.0-alpha.63",
     "@mdx-js/react": "^1.5.8",
+    "classnames": "^2.2.6",
     "clsx": "^1.1.1",
+    "gh-pages": "^2.2.0",
     "react": "^16.8.4",
     "react-dom": "^16.8.4",
     "react-github-btn": "^1.2.0",
-    "webfontloader": "^1.6.28",
-    "classnames": "^2.2.6",
-    "gh-pages": "^2.2.0"
+    "webfontloader": "^1.6.28"
   },
   "browserslist": {
     "production": [

docs/src/theme/Navbar/index.js

@@ -26,10 +26,10 @@ const DefaultNavItemPosition = 'right'; // If split links by left/right
 
 function splitNavItemsByPosition(items) {
   const leftItems = items.filter(
-    item => (item.position ?? DefaultNavItemPosition) === 'left'
+    (item) => (item.position ?? DefaultNavItemPosition) === 'left'
   );
   const rightItems = items.filter(
-    item => (item.position ?? DefaultNavItemPosition) === 'right'
+    (item) => (item.position ?? DefaultNavItemPosition) === 'right'
   );
   return {
     leftItems,
@@ -60,7 +60,7 @@ function Navbar() {
     setSidebarShown(false);
   }, [setSidebarShown]);
   const onToggleChange = useCallback(
-    e => (e.target.checked ? setDarkTheme() : setLightTheme()),
+    (e) => (e.target.checked ? setDarkTheme() : setLightTheme()),
     [setLightTheme, setDarkTheme]
   );
   const windowSize = useWindowSize();
@@ -128,6 +128,12 @@ function Navbar() {
         </div>
 
         <div className="navbar__items navbar__items--right">
+          <div className={styles.searchBarMargin}>
+            <SearchBar
+              handleSearchBarToggle={setIsSearchBarExpanded}
+              isSearchBarExpanded={isSearchBarExpanded}
+            />
+          </div>
           {/* modified */}
           {leftItems.map((item, i) => (
             <NavbarItem {...item} key={i} />
@@ -153,10 +159,6 @@ function Navbar() {
               onChange={onToggleChange}
             />
           )}
-          <SearchBar
-            handleSearchBarToggle={setIsSearchBarExpanded}
-            isSearchBarExpanded={isSearchBarExpanded}
-          />
         </div>
       </div>
       <div

docs/src/theme/Navbar/styles.module.css

@@ -24,3 +24,7 @@
 .navbarHidden {
   top: calc(var(--ifm-navbar-height) * -1) !important;
 }
+
+.searchBarMargin {
+  margin: 0 16px 0 0;
+}

docs/yarn.lock

@@ -2765,9 +2765,9 @@ caniuse-api@^3.0.0:
     lodash.uniq "^4.5.0"
 
 caniuse-lite@^1.0.0, caniuse-lite@^1.0.30000981, caniuse-lite@^1.0.30001035, caniuse-lite@^1.0.30001109, caniuse-lite@^1.0.30001124:
-  version "1.0.30001124"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001124.tgz#5d9998190258e11630d674fc50ea8e579ae0ced2"
-  integrity sha512-zQW8V3CdND7GHRH6rxm6s59Ww4g/qGWTheoboW9nfeMg7sUoopIfKCcNZUjwYRCOrvereh3kwDpZj4VLQ7zGtA==
+  version "1.0.30001199"
+  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001199.tgz"
+  integrity sha512-ifbK2eChUCFUwGhlEzIoVwzFt1+iriSjyKKFYNfv6hN34483wyWpLLavYQXhnR036LhkdUYaSDpHg1El++VgHQ==
 
 ccount@^1.0.0, ccount@^1.0.3:
   version "1.0.5"