Algolia search/side panel

[swastik7805]

Description

This PR integrates the Algolia Ask AI Sidepanel (<DocSearchSidepanel />) into the MetaMask documentation, adding a floating "Ask AI" button that enables users to query Algolia's AI directly from the docs.

Key changes include:

• Algolia Sidepanel Integration: Added the @docsearch/react Sidepanel component to src/theme/Root.tsx to globally render the floating button. Dynamically mapped credentials from themeConfig.algolia.
• UI/Styling Tweaks: Override deafult styles of Ask-AI Sidepanel in src/scss/theme/_doc-search.scss to fix Sidepanel specific regressions—such as oversized textareas, misaligned submit icons, and transparent backgrounds. Tailored the chat UI to follow MetaMask's design tokens.
• Prevent SSR hydration errors by wrapping DocSearchSidepanel with useIsBrowser.
• Fix Sidepanel CSS overrides bleeding into the main search modal.

Feature Requested

Algolia Ask AI floating button feature

Fixes #2756 proposed by @bgravenorst

Preview

Algolia-Ask-Ai.mp4

Checklist

• If this PR updates or adds documentation content that changes or adds technical meaning, it has received an approval from an engineer or DevRel from the relevant team.
• If this PR updates or adds documentation content, it has received an approval from a technical writer.

External contributor checklist

• I've read the contribution guidelines.
• I've created a new issue (or assigned myself to an existing issue) describing what this PR addresses.

---

Note

Medium Risk
Adds a new globally rendered third-party UI component (DocSearchSidepanel) and associated styling overrides, which could impact site-wide rendering and bundle behavior if Algolia config or CSS conflicts occur.

Overview
Integrates Algolia’s Ask AI sidepanel by conditionally rendering @docsearch/react/sidepanel from src/theme/Root.tsx, wiring credentials from themeConfig.algolia (supporting both assistantId and askAi.assistantId).

Adds @docsearch/react/@docsearch/css dependencies (and updates the lockfile accordingly) and introduces extensive SCSS overrides in _doc-search.scss to restyle the sidepanel/chat UI (textarea sizing, input wrapper, submit/stop buttons, related sources, footer/disclaimer, plus light-mode variants).

^{Reviewed by Cursor Bugbot for commit 0c7ecc5. Bugbot is set up for automated code reviews on this repo. Configure here.}

[vercel]

@swastik7805 is attempting to deploy a commit to the Consensys Team on Vercel.

A member of the Team first needs to authorize it.

[socket-security]

Review the following changes in direct dependencies. Learn more about Socket for GitHub.

Diff	Package	Supply Chain Security	Vulnerability	Quality	Maintenance	License
	@​docsearch/​css@​4.2.0 ⏵ 4.6.2	+1		+1
	@​docsearch/​react@​4.2.0 ⏵ 4.6.2	-1		+1

View full report

[cursor]

Cursor Bugbot has reviewed your changes and found 2 potential issues.

^{Reviewed by Cursor Bugbot for commit 0c7ecc5. Configure here.}

[swastik7805]

@bgravenorst @alexandratran @AyushBherwani1998 @yashovardhan hey guys, i have successfully integrated the Algolia Ask Ai sidepanel.Tested it out and resolved SSG error builds and styling css bleed as suggessted by cursorbot.

PR is not updated and ready for review.