From eb8db05634186d9d7c266ca2421dcbae8c30ca29 Mon Sep 17 00:00:00 2001 From: Mendon Kissling <59585235+mendonk@users.noreply.github.com> Date: Tue, 18 Feb 2025 16:06:56 -0500 Subject: [PATCH] docs: replace mendable with algolia (#6694) * add-algolia-to-config * remove-mendable-search-bar * remove-mendable-yarn-lockfile * yarn-lockfile * replace-mendable-in-footer-component * Update yarn.lock to use Yarn registry URLs * lockfile-use-npm-registry --- docs/docusaurus.config.js | 12 +- docs/src/theme/Footer.js | 105 +- docs/src/theme/SearchBar.js | 23 - docs/yarn.lock | 2544 ++++++++++++++++++----------------- 4 files changed, 1406 insertions(+), 1278 deletions(-) delete mode 100644 docs/src/theme/SearchBar.js diff --git a/docs/docusaurus.config.js b/docs/docusaurus.config.js index ff3486768..7aefca05b 100644 --- a/docs/docusaurus.config.js +++ b/docs/docusaurus.config.js @@ -20,9 +20,6 @@ const config = { projectName: "langflow", trailingSlash: false, staticDirectories: ["static"], - customFields: { - mendableAnonKey: "b7f52734-297c-41dc-8737-edbd13196394", // Mendable Anon Client-side key, safe to expose to the public - }, i18n: { defaultLocale: "en", locales: ["en"], @@ -258,6 +255,15 @@ const config = { hideable: false, }, }, + algolia: { + appId: 'UZK6BDPCVY', + // public key, safe to commit + apiKey: 'adbd7686dceb1cd510d5ce20d04bf74c', + indexName: 'langflow', + contextualSearch: true, + searchParameters: {}, + searchPagePath: 'search', + }, }), }; diff --git a/docs/src/theme/Footer.js b/docs/src/theme/Footer.js index 4ab5dea20..aed2e940b 100644 --- a/docs/src/theme/Footer.js +++ b/docs/src/theme/Footer.js @@ -1,52 +1,77 @@ -import React from "react"; +import React, { useState } from "react"; import Footer from "@theme-original/Footer"; -import { MendableFloatingButton } from "@mendable/search"; -import useDocusaurusContext from "@docusaurus/useDocusaurusContext"; +import { useDocSearchKeyboardEvents } from '@docsearch/react'; export default function FooterWrapper(props) { - const iconSpan1 = React.createElement( - "img", - { - src: "/img/langflow-icon-black-transparent.svg", - srcDark: "", - style: { width: "40px" }, - }, - null - ); + const [isHovered, setIsHovered] = useState(false); + const searchButtonRef = React.useRef(null); - const icon = React.createElement( - "div", - { - style: { - color: "#000000", - fontSize: "22px", - width: "48px", - height: "48px", - margin: "0px", - padding: "0px", - display: "flex", - alignItems: "center", - justifyContent: "center", - textAlign: "center", - }, + useDocSearchKeyboardEvents({ + isOpen: false, + onOpen: () => { + searchButtonRef.current?.click(); }, - [iconSpan1] - ); - const { - siteConfig: { customFields }, - } = useDocusaurusContext(); - - const mendableFloatingButton = React.createElement(MendableFloatingButton, { - floatingButtonStyle: { color: "#000000", backgroundColor: "#f6f6f6" }, - anon_key: customFields.mendableAnonKey, - showSimpleSearch: true, - icon: icon, }); + const searchButton = ( +
{ + // This will trigger Docusaurus's default search modal + document.querySelector('.DocSearch-Button')?.click(); + }} + onMouseEnter={() => setIsHovered(true)} + onMouseLeave={() => setIsHovered(false)} + style={{ + position: 'fixed', + right: '20px', + bottom: '20px', + zIndex: 100, + display: 'flex', + alignItems: 'center', + gap: '10px', + cursor: 'pointer', + }} + > + {isHovered && ( +
+ Hi, how can I help you? +
+ )} +
+ Search +
+
+ ); + return ( <> -