docs: improve AI Assistant (#11208)

* initial implementation

* integrate new ai assistant in other projects + ux improvements

* fix chat window on mobile devices

* fixes to mobile

* allow pre

* change shortcut to i

* improved responsiveness

* align version in navbar

www/apps/api-reference/components/Tags/Operation/CodeSection/index.tsx

@@ -36,7 +36,7 @@ const TagOperationCodeSection = ({
       >
         <div className={clsx("flex w-[calc(100%-36px)] gap-1")}>
           <MethodLabel method={method} className="h-fit" />
-          <code className="text-medusa-fg-subtle =break-words break-all">
+          <code className="text-medusa-fg-base =break-words break-all">
             {endpointPath}
           </code>
         </div>

www/apps/api-reference/components/Tags/Operation/DescriptionSection/index.tsx

@@ -53,7 +53,7 @@ const TagsOperationDescriptionSection = ({
         {operation["x-featureFlag"] && (
           <FeatureFlagNotice
             featureFlag={operation["x-featureFlag"]}
-            tooltipTextClassName="font-normal text-medusa-fg-subtle"
+            tooltipTextClassName="font-normal text-medusa-fg-base"
             badgeClassName="ml-0.5"
           />
         )}

www/apps/api-reference/components/VersionSwitcher/index.tsx

@@ -16,7 +16,7 @@ const VersionSwitcher = () => {
           location.href = process.env.NEXT_PUBLIC_API_V1_URL + pathname
         }}
       />
-      <span className={clsx("text-medusa-fg-subtle")}>V2</span>
+      <span className={clsx("text-medusa-fg-base")}>V2</span>
     </div>
   )
 }

www/apps/api-reference/providers/index.tsx

@@ -1,4 +1,5 @@
 import {
+  AiAssistantProvider,
   AnalyticsProvider,
   PageLoadingProvider,
   ScrollControllerProvider,
@@ -21,7 +22,20 @@ const Providers = ({ children }: ProvidersProps) => {
           <ScrollControllerProvider scrollableSelector="#main">
             <SidebarProvider>
               <MainNavProvider>
-                <SearchProvider>{children}</SearchProvider>
+                <SearchProvider>
+                  <AiAssistantProvider
+                    apiUrl={process.env.NEXT_PUBLIC_AI_ASSISTANT_URL || "temp"}
+                    websiteId={process.env.NEXT_PUBLIC_AI_WEBSITE_ID || "temp"}
+                    recaptchaSiteKey={
+                      process.env
+                        .NEXT_PUBLIC_AI_API_ASSISTANT_RECAPTCHA_SITE_KEY ||
+                      "temp"
+                    }
+                    chatType="popover"
+                  >
+                    {children}
+                  </AiAssistantProvider>
+                </SearchProvider>
               </MainNavProvider>
             </SidebarProvider>
           </ScrollControllerProvider>

www/apps/api-reference/providers/search.tsx

@@ -4,8 +4,6 @@ import {
   usePageLoading,
   SearchProvider as UiSearchProvider,
   searchFilters,
-  AiAssistantIcon,
-  AiAssistantProvider,
 } from "docs-ui"
 import { config } from "../config"
 import basePathUrl from "../utils/base-path-url"
@@ -53,28 +51,6 @@ const SearchProvider = ({ children }: SearchProviderProps) => {
         ),
         filterOptions: searchFilters,
       }}
-      commands={[
-        {
-          name: "ai-assistant",
-          icon: <AiAssistantIcon />,
-          component: (
-            <AiAssistantProvider
-              apiUrl={process.env.NEXT_PUBLIC_AI_ASSISTANT_URL || "temp"}
-              websiteId={process.env.NEXT_PUBLIC_AI_WEBSITE_ID || "temp"}
-              recaptchaSiteKey={
-                process.env.NEXT_PUBLIC_AI_API_ASSISTANT_RECAPTCHA_SITE_KEY ||
-                "temp"
-              }
-            />
-          ),
-          title: "AI Assistant",
-          badge: {
-            variant: "blue",
-            badgeType: "shaded",
-            children: "Beta",
-          },
-        },
-      ]}
     >
       {children}
     </UiSearchProvider>