diff --git a/.env.example b/.env.example index c91f7e7ae73..2970f11c33a 100644 --- a/.env.example +++ b/.env.example @@ -3,3 +3,8 @@ ALGOLIA_WRITE_API_KEY= ALGOLIA_INDEX_NAME=docs-test PUBLIC_ALGOLIA_SEARCH_APP_ID= PUBLIC_ALGOLIA_SEARCH_PUBLIC_API_KEY= + +# Google AI Search +PUBLIC_GOOGLE_PROJECT_ID= +PUBLIC_GOOGLE_APP_ID= +PUBLIC_GOOGLE_ACCESS_TOKEN= diff --git a/src/components/Header/Header.astro b/src/components/Header/Header.astro index a21efde3792..8b93eb0964f 100644 --- a/src/components/Header/Header.astro +++ b/src/components/Header/Header.astro @@ -9,6 +9,9 @@ const path = Astro.url.pathname const algoliaVars = { algoliaAppId: import.meta.env.PUBLIC_ALGOLIA_SEARCH_APP_ID || "", algoliaPublicApiKey: import.meta.env.PUBLIC_ALGOLIA_SEARCH_PUBLIC_API_KEY || "", + googleProjectId: import.meta.env.PUBLIC_GOOGLE_PROJECT_ID || "", + googleAppId: import.meta.env.PUBLIC_GOOGLE_APP_ID || "", + googleAccessToken: import.meta.env.PUBLIC_GOOGLE_ACCESS_TOKEN || "", } --- diff --git a/src/components/Header/Nav/config.tsx b/src/components/Header/Nav/config.tsx index a16f3cde6c2..5963d2888ec 100644 --- a/src/components/Header/Nav/config.tsx +++ b/src/components/Header/Nav/config.tsx @@ -58,3 +58,11 @@ export type AppConfig = { productsNav: ProductsNav subProductsNav?: SubProductsNav } & LinksConfig + +export type AlgoliaVars = { + algoliaAppId: string + algoliaPublicApiKey: string + googleProjectId: string + googleAppId: string + googleAccessToken: string +} diff --git a/src/components/Header/NavBar.tsx b/src/components/Header/NavBar.tsx index a6eaf00cd2e..9031958a9c6 100644 --- a/src/components/Header/NavBar.tsx +++ b/src/components/Header/NavBar.tsx @@ -1,9 +1,10 @@ -import React from "react" +import React, { lazy, Suspense, useEffect, useState } from "react" import { NavBar as Nav } from "./Nav/index.ts" -import { Search } from "./aiSearch/Search.tsx" import { useNavBar } from "./useNavBar/useNavBar.ts" import styles from "./scroll.module.css" -import { ProductsNav, SubProductsNav } from "./Nav/config.tsx" +import { AlgoliaVars, ProductsNav, SubProductsNav } from "./Nav/config.tsx" + +const LazySearch = lazy(() => import("./aiSearch/Search.tsx")) export const NavBar = ({ productsNav, @@ -16,9 +17,10 @@ export const NavBar = ({ subProductsNav: SubProductsNav path: string showSearch?: boolean - algoliaVars: { algoliaAppId: string; algoliaPublicApiKey: string } + algoliaVars: AlgoliaVars }) => { const navRef = React.useRef(null) + const [isClient, setIsClient] = useState(false) const { setNavBarInfo } = useNavBar() @@ -54,13 +56,23 @@ export const NavBar = ({ } } + useEffect(() => { + setIsClient(true) + }, []) + return (