diff --git a/.env.local.example b/.env.local.example
index b75174ae5..2fa613e3e 100644
--- a/.env.local.example
+++ b/.env.local.example
@@ -9,3 +9,8 @@ OPENAI_API_KEY=
# Get a key from https://console.anthropic.com/
# Falls back to OPENAI_API_KEY if not set
ANTHROPIC_API_KEY=
+
+# Algolia search (search API key is public/read-only)
+NEXT_PUBLIC_ALGOLIA_APP_ID=
+NEXT_PUBLIC_ALGOLIA_SEARCH_API_KEY=
+NEXT_PUBLIC_ALGOLIA_INDEX_NAME=
diff --git a/.gitignore b/.gitignore
index 8e9f00c4e..da4d2840a 100644
--- a/.gitignore
+++ b/.gitignore
@@ -5,8 +5,6 @@ node_modules
.env.local
public/sitemap*.xml
.env
-_pagefind/
-
# TypeScript
*.tsbuildinfo
diff --git a/app/_components/algolia-search.tsx b/app/_components/algolia-search.tsx
new file mode 100644
index 000000000..cf0dbdec4
--- /dev/null
+++ b/app/_components/algolia-search.tsx
@@ -0,0 +1,181 @@
+"use client";
+
+import { liteClient as algoliasearch } from "algoliasearch/lite";
+import { Search } from "lucide-react";
+import { useEffect, useState } from "react";
+import {
+ Highlight,
+ Hits,
+ InstantSearch,
+ SearchBox,
+ useInstantSearch,
+} from "react-instantsearch";
+
+type HitRecord = {
+ objectID: string;
+ title?: string;
+ description?: string;
+ url?: string;
+};
+
+const appId = process.env.NEXT_PUBLIC_ALGOLIA_APP_ID;
+const searchKey = process.env.NEXT_PUBLIC_ALGOLIA_SEARCH_API_KEY;
+const indexName = process.env.NEXT_PUBLIC_ALGOLIA_INDEX_NAME;
+
+const searchClient =
+ appId && searchKey ? algoliasearch(appId, searchKey) : null;
+
+function safeHref(url: string | undefined): string {
+ if (!url) {
+ return "/";
+ }
+ if (url.startsWith("/") || url.startsWith("https://")) {
+ return url;
+ }
+ return "/";
+}
+
+function SearchHit({ hit }: { hit: HitRecord }) {
+ return (
+
+
+ [0]["hit"]}
+ />
+
+ {hit.description && (
+
+ [0]["hit"]}
+ />
+
+ )}
+
+ );
+}
+
+function EmptyQuery() {
+ const { indexUiState } = useInstantSearch();
+ if (indexUiState.query) {
+ return null;
+ }
+ return (
+
+ Start typing to search the docs…
+
+ );
+}
+
+function NoResults() {
+ const { results } = useInstantSearch();
+ if (!results?.query || results.nbHits > 0) {
+ return null;
+ }
+ return (
+
+ No results for{" "}
+ "{results.query}"
+
+ );
+}
+
+function SearchUnavailable() {
+ return (
+
+ Add NEXT_PUBLIC_ALGOLIA_APP_ID,{" "}
+ NEXT_PUBLIC_ALGOLIA_SEARCH_API_KEY, and{" "}
+ NEXT_PUBLIC_ALGOLIA_INDEX_NAME to your
+ environment to enable search.
+
+ );
+}
+
+export function AlgoliaSearch() {
+ const [isOpen, setIsOpen] = useState(false);
+
+ useEffect(() => {
+ const handler = (e: KeyboardEvent) => {
+ if ((e.metaKey || e.ctrlKey) && e.key === "k") {
+ e.preventDefault();
+ setIsOpen((prev) => !prev);
+ }
+ if (e.key === "Escape") {
+ setIsOpen(false);
+ }
+ };
+ window.addEventListener("keydown", handler);
+ return () => window.removeEventListener("keydown", handler);
+ }, []);
+
+ return (
+ <>
+
+
+ {isOpen && (
+
+