@apify/docs-theme 1.0.244 → 1.0.245

package/src/theme/MDXComponents/Img/index.js

@@ -8,11 +8,5 @@ function transformImgClassName(className) {
 }
 
 export default function MDXImg(props) {
-    return (
-        <img
-            loading="lazy"
-            {...props}
-            className={transformImgClassName(props.className)}
-        />
-    );
+    return <img loading="lazy" {...props} className={transformImgClassName(props.className)} />;
 }

package/src/theme/MDXComponents/Img/styles.module.css

@@ -1,3 +1,3 @@
 .img {
-  height: auto;
+    height: auto;
 }

package/src/theme/MDXComponents/Ul/index.js

@@ -14,5 +14,5 @@ function transformUlClassName(className) {
 }
 
 export default function MDXUl(props) {
-    return <ul {...props} className={transformUlClassName(props.className)}/>;
+    return <ul {...props} className={transformUlClassName(props.className)} />;
 }

package/src/theme/MDXComponents/Ul/styles.module.css

@@ -1,7 +1,7 @@
 .containsTaskList {
-  list-style: none;
+    list-style: none;
 }
 
 :not(.containsTaskList > li) > .containsTaskList {
-  padding-left: 0;
+    padding-left: 0;
 }

package/src/theme/Navbar/CTA/index.jsx

@@ -15,6 +15,8 @@ function clickHandler() {
 
 export default function NavbarCTA() {
     return (
-        <a href="https://console.apify.com" onClick={clickHandler} className={styles.getStarted}>{buttonText}</a>
+        <a href="https://console.apify.com" onClick={clickHandler} className={styles.getStarted}>
+            {buttonText}
+        </a>
     );
 }

package/src/theme/Navbar/CTA/styles.module.css

@@ -1,59 +1,59 @@
 .getStarted {
-  height: 4rem;
-  padding: 0.8rem 1.6rem !important;
-  background-color: var(--color-primary-black-action);
-  border-radius: 8px;
-  color: var(--color-neutral-text-on-primary);
-  font-size: 1.6rem;
-  font-weight: 500;
-  line-height: 2.4rem;
-  border: none;
-  box-shadow: none;
-  outline: none;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: block;
-  position: relative;
-  text-align: center;
-  transition: all var(--ifm-transition-fast) var(--ifm-transition-timing-default);
-
-  &::before {
-    content: '';
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    background: var(--button-gradient);
-    opacity: 0.4;
-    border-radius: inherit;
-    transition: all var(--ifm-transition-fast) var(--ifm-transition-timing-default);
-  }
-
-  &:hover {
-    background-color: var(--color-primary-black-action-hover);
+    height: 4rem;
+    padding: 0.8rem 1.6rem !important;
+    background-color: var(--color-primary-black-action);
+    border-radius: 8px;
     color: var(--color-neutral-text-on-primary);
+    font-size: 1.6rem;
+    font-weight: 500;
+    line-height: 2.4rem;
+    border: none;
+    box-shadow: none;
+    outline: none;
+    box-sizing: border-box;
+    cursor: pointer;
+    display: block;
+    position: relative;
+    text-align: center;
+    transition: all var(--ifm-transition-fast) var(--ifm-transition-timing-default);
 
     &::before {
-      opacity: 1;
+        content: '';
+        position: absolute;
+        top: 0;
+        right: 0;
+        bottom: 0;
+        left: 0;
+        background: var(--button-gradient);
+        opacity: 0.4;
+        border-radius: inherit;
+        transition: all var(--ifm-transition-fast) var(--ifm-transition-timing-default);
+    }
+
+    &:hover {
+        background-color: var(--color-primary-black-action-hover);
+        color: var(--color-neutral-text-on-primary);
+
+        &::before {
+            opacity: 1;
+        }
     }
-  }
 }
 
 :global(.navbar-sidebar) .getStarted {
-  display: none;
+    display: none;
 }
 
 @media (max-width: 768px) {
-  .getStarted {
-    width: 100%;
-  }
+    .getStarted {
+        width: 100%;
+    }
 
-  :global(.navbar__inner) .getStarted {
-    display: none;
-  }
+    :global(.navbar__inner) .getStarted {
+        display: none;
+    }
 
-  :global(.navbar-sidebar) .getStarted {
-    display: block;
-  }
+    :global(.navbar-sidebar) .getStarted {
+        display: block;
+    }
 }

package/src/theme/Navbar/Content/index.jsx

@@ -1,8 +1,6 @@
 import { useLocation } from '@docusaurus/router';
 import { isRegexpStringMatch, useThemeConfig } from '@docusaurus/theme-common';
-import {
-    splitNavbarItems,
-} from '@docusaurus/theme-common/internal';
+import { splitNavbarItems } from '@docusaurus/theme-common/internal';
 import { usePluginData } from '@docusaurus/useGlobalData';
 import NavbarLogo from '@theme/Navbar/Logo';
 import NavbarMobileSidebarToggle from '@theme/Navbar/MobileSidebar/Toggle';
@@ -17,15 +15,14 @@ import NavbarCTA from '../CTA';
 function NavbarItems({ items }) {
     return (
         <>
-            {items.map((item, i) => <NavbarItem {...item} key={i} />)}
+            {items.map((item, i) => (
+                <NavbarItem {...item} key={i} />
+            ))}
         </>
     );
 }
 
-function NavbarContentLayout({
-    left,
-    right,
-}) {
+function NavbarContentLayout({ left, right }) {
     return (
         <div className="navbar__inner">
             <div className="navbar__container">
@@ -37,39 +34,43 @@ function NavbarContentLayout({
 }
 
 function SubNavbarTitle({ titleIcon, title }) {
-    return titleIcon
-        ? <div style={{ display: 'flex', gap: '12px', alignItems: 'center' }}>
+    return titleIcon ? (
+        <div style={{ display: 'flex', gap: '12px', alignItems: 'center' }}>
             <img src={`img/${titleIcon}`} width={24} height={24} /> {title}
         </div>
-        : title;
+    ) : (
+        title
+    );
 }
 
 function SubNavbar() {
-    const { options: { subNavbar } } = usePluginData('@apify/docs-theme');
+    const {
+        options: { subNavbar },
+    } = usePluginData('@apify/docs-theme');
     const location = useLocation();
 
-    return (
-        subNavbar && (!subNavbar?.pathRegex || isRegexpStringMatch(subNavbar.pathRegex, location.pathname)) ? (
-            <div className="navbar__inner navbar__sub">
-                <div className="navbar__container">
-                    <div className="navbar__items">
-                        <div className="navbar__sub--title">
-                            <NavbarItem
-                                label={<SubNavbarTitle title={subNavbar.title} titleIcon={subNavbar.titleIcon} />}
-                                to={subNavbar.to ?? '/'}
-                                activeBaseRegex='(?!)'
-                            />
-                        </div>
-                        <NavbarItems items={subNavbar.items} />
+    return subNavbar && (!subNavbar?.pathRegex || isRegexpStringMatch(subNavbar.pathRegex, location.pathname)) ? (
+        <div className="navbar__inner navbar__sub">
+            <div className="navbar__container">
+                <div className="navbar__items">
+                    <div className="navbar__sub--title">
+                        <NavbarItem
+                            label={<SubNavbarTitle title={subNavbar.title} titleIcon={subNavbar.titleIcon} />}
+                            to={subNavbar.to ?? '/'}
+                            activeBaseRegex="(?!)"
+                        />
                     </div>
+                    <NavbarItems items={subNavbar.items} />
                 </div>
             </div>
-        ) : null
-    );
+        </div>
+    ) : null;
 }
 
 export default function NavbarContent() {
-    const { navbar: { items } } = useThemeConfig();
+    const {
+        navbar: { items },
+    } = useThemeConfig();
     const [leftItems, rightItems] = splitNavbarItems(items);
     const searchBarItem = items.find((item) => item.type === 'search');
 

package/src/theme/Navbar/MobileSidebar/Header/index.jsx

@@ -10,7 +10,9 @@ import NavbarCTA from '../../CTA';
 export default function NavbarMobileSidebarHeader() {
     const mobileSidebar = useNavbarMobileSidebar();
 
-    const { navbar: { items } } = useThemeConfig();
+    const {
+        navbar: { items },
+    } = useThemeConfig();
     const searchBarItem = items.find((item) => item.type === 'search');
 
     function onSearchClick(event) {

package/src/theme/Navbar/MobileSidebar/PrimaryMenu/index.jsx

@@ -15,42 +15,28 @@ export default function NavbarMobilePrimaryMenu() {
     // Should we allow providing a different list of items?
     const items = useNavbarItems();
     const baseUrl = useBaseUrl('/');
-    const { options: { subNavbar } } = usePluginData('@apify/docs-theme');
+    const {
+        options: { subNavbar },
+    } = usePluginData('@apify/docs-theme');
     return (
         <>
-            {
-                subNavbar ? <>
-                    <ul className="menu__list" style={{ marginBottom: '16px', borderBottom: '1px solid #e0e0e0', paddingBottom: '16px' }}>
-                        <NavbarItem
-                            key={'title'}
-                            mobile
-                            href={baseUrl}
-                            label={subNavbar.title}
-                        />
+            {subNavbar ? (
+                <>
+                    <ul
+                        className="menu__list"
+                        style={{ marginBottom: '16px', borderBottom: '1px solid #e0e0e0', paddingBottom: '16px' }}
+                    >
+                        <NavbarItem key={'title'} mobile href={baseUrl} label={subNavbar.title} />
                         {subNavbar.items.map((item, i) => (
-                            <NavbarItem
-                                style={{ paddingLeft: '16px' }}
-                                key={i}
-                                mobile
-                                {...item}
-                            />
+                            <NavbarItem style={{ paddingLeft: '16px' }} key={i} mobile {...item} />
                         ))}
                     </ul>
-                </> : null
-            }
+                </>
+            ) : null}
             <ul className="menu__list">
-                <NavbarItem
-                    key={'title2'}
-                    mobile
-                    label='Apify documentation'
-                />
+                <NavbarItem key={'title2'} mobile label="Apify documentation" />
                 {items.map((item, i) => (
-                    <NavbarItem
-                        mobile
-                        style={{ paddingLeft: '16px' }}
-                        {...item}
-                        key={i}
-                    />
+                    <NavbarItem mobile style={{ paddingLeft: '16px' }} {...item} key={i} />
                 ))}
             </ul>
         </>

package/src/theme/NavbarItem/ComponentTypes.jsx

@@ -15,25 +15,13 @@ import React from 'react';
 // const stable = versions[0];
 const stable = '1';
 
-function DocNavbarItem({
-    docId,
-    label: staticLabel,
-    docsPluginId,
-    ...props
-}) {
+function DocNavbarItem({ docId, label: staticLabel, docsPluginId, ...props }) {
     const doc = useLayoutDoc(docId, docsPluginId);
     // Draft items are not displayed in the navbar.
     if (doc === null) {
         return null;
     }
-    return (
-        <DefaultNavbarItem
-            exact
-            {...props}
-            label={staticLabel ?? doc.id}
-            to={doc.path}
-        />
-    );
+    return <DefaultNavbarItem exact {...props} label={staticLabel ?? doc.id} to={doc.path} />;
 }
 
 function ApiNavbarItem(ctx) {
@@ -48,14 +36,7 @@ function ApiNavbarItem(ctx) {
     const { siteConfig } = useDocusaurusContext();
 
     if (siteConfig.presets[0][1].docs.disableVersioning || version.version === stable) {
-        return (
-            <DefaultNavbarItem
-                exact
-                {...ctx}
-                label={ctx.label}
-                to={`reference/${ctx.to}`}
-            />
-        );
+        return <DefaultNavbarItem exact {...ctx} label={ctx.label} to={`reference/${ctx.to}`} />;
     }
 
     // skip changelog button for older versions

package/src/theme/NavbarItem/NavbarNavLink.jsx

@@ -19,8 +19,12 @@ export default function NavbarNavLink({
     prependBaseUrlToHref,
     ...props
 }) {
-    const { navbar: { items = [] } } = useThemeConfig();
-    const { options: { subNavbar } } = usePluginData('@apify/docs-theme');
+    const {
+        navbar: { items = [] },
+    } = useThemeConfig();
+    const {
+        options: { subNavbar },
+    } = usePluginData('@apify/docs-theme');
     const allItems = [...items, ...(subNavbar?.items || [])];
     const location = useLocation();
     // TODO all this seems hacky
@@ -41,24 +45,22 @@ export default function NavbarNavLink({
     const linkContentProps = html
         ? { dangerouslySetInnerHTML: { __html: html } }
         : {
-            children: (
-                <>
-                    {label}
-                    {isExternalLink && (
-                        <IconExternalLink
-                            {...(isDropdownLink && { width: 12, height: 12 })}
-                        />
-                    )}
-                </>
-            ),
-        };
+              children: (
+                  <>
+                      {label}
+                      {isExternalLink && <IconExternalLink {...(isDropdownLink && { width: 12, height: 12 })} />}
+                  </>
+              ),
+          };
 
     // If the item is a dropdown, look for any of its children that match the current path
-    const dropDownHasActiveItem = location.pathname !== '/' && allItems
-        .filter((item) => item.type === 'dropdown')
-        .filter((item) => item.label === label)
-        .reduce((nestedItems, item) => [...nestedItems, ...item.items], [])
-        .some((item) => (item.to || item.href).endsWith(location.pathname));
+    const dropDownHasActiveItem =
+        location.pathname !== '/' &&
+        allItems
+            .filter((item) => item.type === 'dropdown')
+            .filter((item) => item.label === label)
+            .reduce((nestedItems, item) => [...nestedItems, ...item.items], [])
+            .some((item) => (item.to || item.href).endsWith(location.pathname));
 
     if (href) {
         return (
@@ -66,9 +68,10 @@ export default function NavbarNavLink({
                 href={prependBaseUrlToHref ? normalizedHref : href}
                 {...props}
                 {...(activeBaseUrl && {
-                    className: location.pathname.startsWith(`/${activeBasePath}`) || dropDownHasActiveItem
-                        ? 'navbar__item navbar__link navbar__link--active'
-                        : 'navbar__item navbar__link',
+                    className:
+                        location.pathname.startsWith(`/${activeBasePath}`) || dropDownHasActiveItem
+                            ? 'navbar__item navbar__link navbar__link--active'
+                            : 'navbar__item navbar__link',
                 })}
                 {...linkContentProps}
             />
@@ -81,9 +84,10 @@ export default function NavbarNavLink({
             isNavLink
             {...((activeBasePath || activeBaseRegex) && {
                 // eslint-disable-next-line no-shadow
-                isActive: (_match, location) => (activeBaseRegex
-                    ? isRegexpStringMatch(activeBaseRegex, location.pathname) || dropDownHasActiveItem
-                    : location.pathname.startsWith(`/${activeBasePath}`)),
+                isActive: (_match, location) =>
+                    activeBaseRegex
+                        ? isRegexpStringMatch(activeBaseRegex, location.pathname) || dropDownHasActiveItem
+                        : location.pathname.startsWith(`/${activeBasePath}`),
                 activeClassName: 'navbar__link--active',
             })}
             {...props}

package/src/theme/NotFound.jsx

@@ -10,12 +10,8 @@ export default function NotFound() {
                 <main className="container margin-vert--xl">
                     <div className="row">
                         <div className="col col--6 col--offset-3">
-                            <h1 className="hero__title">
-                                Page Not Found
-                            </h1>
-                            <p>
-                                We could not find what you were looking for 😢
-                            </p>
+                            <h1 className="hero__title">Page Not Found</h1>
+                            <p>We could not find what you were looking for 😢</p>
                         </div>
                     </div>
                 </main>

package/src/theme/RunnableCodeBlock/RunnableCodeBlock.jsx

@@ -20,11 +20,7 @@ Make sure you are importing the code block contents with the roa-loader.`);
     }
 
     if (!hash) {
-        return (
-            <CodeBlock {...props}>
-                { children.code }
-            </CodeBlock>
-        );
+        return <CodeBlock {...props}>{children.code}</CodeBlock>;
     }
 
     const href = `https://console.apify.com/actors/${actor ?? EXAMPLE_RUNNERS[type ?? 'playwright']}?runConfig=${hash}&asrc=run_on_apify`;
@@ -33,13 +29,51 @@ Make sure you are importing the code block contents with the roa-loader.`);
         <div className={clsx(styles.container, 'runnable-code-block')}>
             <Link href={href} className={styles.button} rel="follow">
                 Run on
-                <svg width="91" height="25" viewBox="0 0 91 25" fill="none" xmlns="http://www.w3.org/2000/svg" className="apify-logo-light alignMiddle_src-theme-Footer-index-module">
+                <svg
+                    width="91"
+                    height="25"
+                    viewBox="0 0 91 25"
+                    fill="none"
+                    xmlns="http://www.w3.org/2000/svg"
+                    className="apify-logo-light alignMiddle_src-theme-Footer-index-module"
+                >
                     {/* eslint-disable-next-line max-len */}
-                    <path fill="#246DFF" d="M13.785 0h9.889c.201 0 .364.163.364.363v15.074c0 .361-.47.501-.669.2L13.48.561A.363.363 0 0 1 13.785 0Z"/><path fill="#20A34E" d="M10.253 0H.364A.364.364 0 0 0 0 .363v15.074c0 .361.47.501.669.2L10.558.561A.363.363 0 0 0 10.253 0Z"/><path fill="#F86606" d="M11.85 12.069.616 23.358a.363.363 0 0 0 .259.62h22.298a.363.363 0 0 0 .26-.618L12.37 12.07a.365.365 0 0 0-.52-.001Z"/><path className="apify-logo" fill="#000" d="M77.267 3.298H73.06c-1.317 0-1.881.657-1.881 1.853V6.3h6.13l3.503 8.066L84.315 6.3h3.056l-7.335 16.859h-3.009l2.257-5.206-4.195-9.12h-3.91v9.331H68.17V8.832h-3.268V6.3h3.268V4.565c0-2.298 1.27-3.658 3.973-3.658h5.124v2.391Z"/><path className="apify-logo" fill="#000" fill-rule="evenodd" d="M53.32 6.042c3.102 0 5.641 2.321 5.641 6.19 0 3.893-2.538 6.19-5.641 6.19-2.586 0-3.88-1.594-4.114-2.063v6.776h-2.962V6.3h2.985v1.876c.212-.446 1.505-2.134 4.09-2.134Zm-.776 2.626c-2.045 0-3.362 1.524-3.362 3.564 0 2.017 1.316 3.564 3.362 3.564 2.068 0 3.385-1.547 3.385-3.564 0-2.04-1.317-3.564-3.385-3.564ZM38.44 5.995c3.69 0 5.735 1.923 5.735 4.736v4.01c0 .704.259 1.032.94 1.079v2.415h-.94c-1.48-.024-2.445-.587-2.774-1.642-.587.844-1.81 1.83-3.855 1.83-2.797 0-4.913-1.595-4.913-4.01 0-2.392 1.81-3.682 4.748-3.682h3.903c0-1.43-1.105-2.344-2.845-2.344-1.645 0-2.303.89-2.468 1.195h-3.033c.236-1.266 1.764-3.587 5.501-3.587Zm-.565 6.776c-1.387 0-2.28.516-2.28 1.595 0 1.149 1.081 1.829 2.586 1.829 1.692 0 3.103-.844 3.103-2.415V12.77h-3.409Z" clip-rule="evenodd"/><path className="apify-logo" fill="#000" d="M63.47 18.164h-3.009V6.3h3.01v11.864ZM63.518 4.4H60.39V.837h3.127v3.565Z"/>
+                    <path
+                        fill="#246DFF"
+                        d="M13.785 0h9.889c.201 0 .364.163.364.363v15.074c0 .361-.47.501-.669.2L13.48.561A.363.363 0 0 1 13.785 0Z"
+                    />
+                    <path
+                        fill="#20A34E"
+                        d="M10.253 0H.364A.364.364 0 0 0 0 .363v15.074c0 .361.47.501.669.2L10.558.561A.363.363 0 0 0 10.253 0Z"
+                    />
+                    <path
+                        fill="#F86606"
+                        d="M11.85 12.069.616 23.358a.363.363 0 0 0 .259.62h22.298a.363.363 0 0 0 .26-.618L12.37 12.07a.365.365 0 0 0-.52-.001Z"
+                    />
+                    <path
+                        className="apify-logo"
+                        fill="#000"
+                        d="M77.267 3.298H73.06c-1.317 0-1.881.657-1.881 1.853V6.3h6.13l3.503 8.066L84.315 6.3h3.056l-7.335 16.859h-3.009l2.257-5.206-4.195-9.12h-3.91v9.331H68.17V8.832h-3.268V6.3h3.268V4.565c0-2.298 1.27-3.658 3.973-3.658h5.124v2.391Z"
+                    />
+                    <path
+                        className="apify-logo"
+                        fill="#000"
+                        fill-rule="evenodd"
+                        d="M53.32 6.042c3.102 0 5.641 2.321 5.641 6.19 0 3.893-2.538 6.19-5.641 6.19-2.586 0-3.88-1.594-4.114-2.063v6.776h-2.962V6.3h2.985v1.876c.212-.446 1.505-2.134 4.09-2.134Zm-.776 2.626c-2.045 0-3.362 1.524-3.362 3.564 0 2.017 1.316 3.564 3.362 3.564 2.068 0 3.385-1.547 3.385-3.564 0-2.04-1.317-3.564-3.385-3.564ZM38.44 5.995c3.69 0 5.735 1.923 5.735 4.736v4.01c0 .704.259 1.032.94 1.079v2.415h-.94c-1.48-.024-2.445-.587-2.774-1.642-.587.844-1.81 1.83-3.855 1.83-2.797 0-4.913-1.595-4.913-4.01 0-2.392 1.81-3.682 4.748-3.682h3.903c0-1.43-1.105-2.344-2.845-2.344-1.645 0-2.303.89-2.468 1.195h-3.033c.236-1.266 1.764-3.587 5.501-3.587Zm-.565 6.776c-1.387 0-2.28.516-2.28 1.595 0 1.149 1.081 1.829 2.586 1.829 1.692 0 3.103-.844 3.103-2.415V12.77h-3.409Z"
+                        clip-rule="evenodd"
+                    />
+                    <path
+                        className="apify-logo"
+                        fill="#000"
+                        d="M63.47 18.164h-3.009V6.3h3.01v11.864ZM63.518 4.4H60.39V.837h3.127v3.565Z"
+                    />
                 </svg>
             </Link>
-            <CodeBlock {...props} className={clsx(styles.codeBlock, 'code-block', props.title != null ? 'has-title' : 'no-title')}>
-                { children.code }
+            <CodeBlock
+                {...props}
+                className={clsx(styles.codeBlock, 'code-block', props.title != null ? 'has-title' : 'no-title')}
+            >
+                {children.code}
             </CodeBlock>
         </div>
     );

package/src/theme/SearchBar/index.js

@@ -32,9 +32,7 @@ export function Link(props) {
     const { siteConfig } = useDocusaurusContext();
 
     if (matchesCurrentInstance(props.href, siteConfig.baseUrl)) {
-        return <RouterLink {...props}>
-            {props.children}
-        </RouterLink>;
+        return <RouterLink {...props}>{props.children}</RouterLink>;
     }
 
     return <a {...props}>{props.children}</a>;
@@ -45,14 +43,17 @@ export default function SearchBar({ onClick }) {
     const location = useLocation();
     const history = useHistory();
 
-    const navigate = useCallback((href) => {
-        const shortHref = href.substring('https://docs.apify.com'.length);
+    const navigate = useCallback(
+        (href) => {
+            const shortHref = href.substring('https://docs.apify.com'.length);
 
-        if (matchesCurrentInstance(shortHref, siteConfig.baseUrl)) {
-            return history.push(shortHref);
-        }
-        return window.location.assign(href);
-    }, [history, siteConfig.baseUrl]);
+            if (matchesCurrentInstance(shortHref, siteConfig.baseUrl)) {
+                return history.push(shortHref);
+            }
+            return window.location.assign(href);
+        },
+        [history, siteConfig.baseUrl],
+    );
 
     const getVersion = useCallback(() => {
         const match = location.pathname.match(/\/(\d+\.\d+|next)/);
@@ -64,17 +65,16 @@ export default function SearchBar({ onClick }) {
         <BrowserOnly>
             {() => (
                 <div className="SearchButton-Container">
-
-                <div onClick={onClick} className="AlgoliaContainer" style={{ marginRight: '12px' }}>
-                    <ApifySearch
-                        algoliaAppId={siteConfig.themeConfig.algolia.appId}
-                        algoliaIndexName='apify_sdk_v2'
-                        algoliaKey={siteConfig.themeConfig.algolia.apiKey}
-                        filters={`version:${getVersion()}`}
-                        navigate={navigate}
-                    />
-                </div>
-                <KapaAIButton />
+                    <div onClick={onClick} className="AlgoliaContainer" style={{ marginRight: '12px' }}>
+                        <ApifySearch
+                            algoliaAppId={siteConfig.themeConfig.algolia.appId}
+                            algoliaIndexName="apify_sdk_v2"
+                            algoliaKey={siteConfig.themeConfig.algolia.apiKey}
+                            filters={`version:${getVersion()}`}
+                            navigate={navigate}
+                        />
+                    </div>
+                    <KapaAIButton />
                 </div>
             )}
         </BrowserOnly>