Merge branch 'main' into ab/miscTemplateResolverIssues

.github/workflows/ci.yml

@@ -122,6 +122,12 @@ jobs:
         env:
           CI: true
 
+      - name: Install Docker Compose
+        run: |
+          sudo curl -L "https://github.com/docker/compose/releases/download/1.29.2/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose
+          sudo chmod +x /usr/local/bin/docker-compose
+          docker-compose --version
+
       - name: Run tests against local FDR
         run: |
           cd servers/fdr

.github/workflows/fdr-ete.yml

@@ -41,5 +41,11 @@ jobs:
       - name: Install
         uses: ./.github/actions/install
 
+      - name: Install Docker Compose
+        run: |
+          sudo curl -L "https://github.com/docker/compose/releases/download/1.29.2/docker-compose-$(uname -s)-$(uname -m)" -o /usr/local/bin/docker-compose
+          sudo chmod +x /usr/local/bin/docker-compose
+          docker-compose --version
+
       - name: Run ete test
         run: pnpm --filter=@fern-platform/fdr test:ete

packages/commons/search-utils/package.json

@@ -39,6 +39,7 @@
     "@types/node": "^18.7.18",
     "depcheck": "^1.4.3",
     "eslint": "^8.56.0",
+    "instantsearch.js": "^4.63.0",
     "organize-imports-cli": "^0.10.0",
     "prettier": "^3.3.2",
     "stylelint": "^16.1.0",

packages/ui/app/src/search/util.ts → packages/commons/search-utils/src/getSlugForSearchRecord.ts

@@ -1,9 +1,7 @@
 import { Algolia, FernNavigation } from "@fern-api/fdr-sdk";
-import { SidebarVersionInfo } from "@fern-ui/fdr-utils";
 import { UnreachableCaseError } from "ts-essentials";
-import type { SearchRecord } from "./types";
 
-export function getSlugForSearchRecord(record: SearchRecord, basePath: string | undefined): string {
+export function getSlugForSearchRecord(record: Algolia.AlgoliaRecord, basePath: string | undefined): string {
     return visitSearchRecord<string>(record)._visit({
         v3: (record) => record.slug,
         v2: (record) =>
@@ -21,6 +19,25 @@ export function getSlugForSearchRecord(record: SearchRecord, basePath: string |
     });
 }
 
+export function getTitleForSearchRecord(record: Algolia.AlgoliaRecord): string {
+    return visitSearchRecord<string>(record)._visit({
+        v3: (record) => record.title,
+        v2: (record) =>
+            record.type === "endpoint-v2"
+                ? record.endpoint.path.parts.map((p) => (p.type === "pathParameter" ? `:${p.value}` : p.value)).join("")
+                : record.title,
+        v1: (record) => record.title,
+    });
+}
+
+export function getContentForSearchRecord(record: Algolia.AlgoliaRecord): string | undefined {
+    return visitSearchRecord<string | undefined>(record)._visit({
+        v3: (record) => record.content ?? undefined,
+        v2: (record) => (record.type === "page-v2" ? record.content : undefined),
+        v1: () => undefined,
+    });
+}
+
 function getLeadingPathForSearchRecord(record: Algolia.AlgoliaRecord): string[] {
     switch (record.type) {
         case "page":
@@ -35,10 +52,10 @@ function getLeadingPathForSearchRecord(record: Algolia.AlgoliaRecord): string[]
 }
 
 export function createSearchPlaceholderWithVersion(
-    activeVersion: SidebarVersionInfo | undefined,
+    version: string | undefined,
     sidebar: FernNavigation.SidebarRootNode | undefined,
 ): string {
-    return `Search ${activeVersion != null ? `across ${activeVersion.id} ` : ""}for ${createSearchPlaceholder(sidebar)}...`;
+    return `Search ${version != null ? `across ${version} ` : ""}for ${createSearchPlaceholder(sidebar)}...`;
 }
 
 function createSearchPlaceholder(sidebar: FernNavigation.SidebarRootNode | undefined): string {

packages/commons/search-utils/src/index.ts

@@ -1 +1,3 @@
 export * from "./SearchConfig";
+export * from "./getSlugForSearchRecord";
+export * from "./types";

packages/ui/app/package.json

@@ -50,13 +50,14 @@
     "@emotion/is-prop-valid": "^1.2.2",
     "@fern-api/fdr-sdk": "workspace:*",
     "@fern-api/template-resolver": "workspace:*",
+    "@fern-ui/chatbot": "workspace:*",
     "@fern-ui/components": "workspace:*",
     "@fern-ui/core-utils": "workspace:*",
     "@fern-ui/fdr-utils": "workspace:*",
     "@fern-ui/loadable": "workspace:*",
     "@fern-ui/next-seo": "workspace:*",
     "@fern-ui/react-commons": "workspace:*",
-    "@fern-ui/search-utils": "workspace:^",
+    "@fern-ui/search-utils": "workspace:*",
     "@headlessui/react": "^1.7.18",
     "@inkeep/widgets": "^0.2.288",
     "@next/third-parties": "^14.2.4",
@@ -73,7 +74,7 @@
     "@shikijs/transformers": "^1.2.2",
     "@types/nprogress": "^0.2.3",
     "@vercel/edge-config": "^1.1.0",
-    "algoliasearch": "^4.22.1",
+    "algoliasearch": "^4.24.0",
     "bezier-easing": "^2.1.0",
     "clsx": "^2.1.0",
     "colorjs.io": "^0.5.0",
@@ -90,7 +91,6 @@
     "hastscript": "^9.0.0",
     "httpsnippet-lite": "^3.0.5",
     "iconoir-react": "^7.7.0",
-    "instantsearch.js": "^4.63.0",
     "jose": "^5.2.3",
     "jotai": "^2.8.1",
     "jotai-devtools": "^0.10.0",
@@ -168,6 +168,7 @@
     "@vitejs/plugin-react": "^4.2.1",
     "autoprefixer": "^10.4.16",
     "chromatic": "^11.3.0",
+    "cohere-ai": "^7.9.5",
     "depcheck": "^1.4.3",
     "eslint": "^8.56.0",
     "eslint-plugin-storybook": "^0.8.0",

packages/ui/app/src/atoms/cohere.ts

@@ -0,0 +1,3 @@
+import { atom } from "jotai";
+
+export const COHERE_ASK_AI = atom(false);

packages/ui/app/src/atoms/index.ts

@@ -1,5 +1,6 @@
 export * from "./apis";
 export * from "./auth";
+export * from "./cohere";
 export * from "./docs";
 export * from "./files";
 export * from "./flags";

packages/ui/app/src/css/globals.scss

@@ -18,3 +18,4 @@
 @import "../themes";
 @import "../docs/Header";
 @import "../sidebar/Sidebar";
+@import "@fern-ui/chatbot/src/index";

packages/ui/app/src/hooks/useRouteChanged.ts

@@ -0,0 +1,15 @@
+import { Router } from "next/router";
+import { useEffect } from "react";
+
+export function useRouteChanged(callback: () => void): void {
+    useEffect(() => {
+        Router.events.on("routeChangeComplete", callback);
+        Router.events.on("routeChangeError", callback);
+        Router.events.on("hashChangeComplete", callback);
+        return () => {
+            Router.events.off("routeChangeComplete", callback);
+            Router.events.off("routeChangeError", callback);
+            Router.events.off("hashChangeComplete", callback);
+        };
+    }, [callback]);
+}

packages/ui/app/src/mdx/plugins/rehypeFernComponents.ts

@@ -14,7 +14,8 @@ export function rehypeFernComponents(): (tree: Root) => void {
                 } else if (node.name === "iframe") {
                     node.name = "IFrame";
                 } else if (node.name === "table") {
-                    node.name = "Table";
+                    // DO NOT coerce <table> into <Table> (see: https://buildwithfern.slack.com/archives/C06QKJWD4VD/p1722602687550179)
+                    // node.name = "Table";
                 }
             }
         });

packages/ui/app/src/search/SearchDialog.tsx

@@ -1,7 +1,15 @@
+import { createSearchPlaceholderWithVersion } from "@fern-ui/search-utils";
 import { useAtomValue, useSetAtom } from "jotai";
+import dynamic from "next/dynamic";
 import { PropsWithChildren, ReactElement, useMemo, useRef } from "react";
 import { InstantSearch } from "react-instantsearch";
-import { CURRENT_VERSION_ATOM, IS_MOBILE_SCREEN_ATOM, SEARCH_DIALOG_OPEN_ATOM, useSidebarNodes } from "../atoms";
+import {
+    CURRENT_VERSION_ATOM,
+    IS_MOBILE_SCREEN_ATOM,
+    SEARCH_DIALOG_OPEN_ATOM,
+    useDomain,
+    useSidebarNodes,
+} from "../atoms";
 import { useSearchConfig } from "../services/useSearchService";
 import { SidebarSearchBar } from "../sidebar/SidebarSearchBar";
 import { SearchMobileHits } from "./SearchHits";
@@ -11,10 +19,15 @@ import { useAlgoliaSearchClient } from "./algolia/useAlgoliaSearchClient";
 import { InkeepChatButton } from "./inkeep/InkeepChatButton";
 import { InkeepCustomTrigger } from "./inkeep/InkeepCustomTrigger";
 import { useSearchTrigger } from "./useSearchTrigger";
-import { createSearchPlaceholderWithVersion } from "./util";
+
+const CohereChatButton = dynamic(
+    () => import("./cohere/CohereChatButton").then(({ CohereChatButton }) => CohereChatButton),
+    { ssr: false },
+);
 
 export const SearchDialog = (): ReactElement | null => {
     const setSearchDialogState = useSetAtom(SEARCH_DIALOG_OPEN_ATOM);
+    const domain = useDomain();
     useSearchTrigger(setSearchDialogState);
 
     const [config] = useSearchConfig();
@@ -24,7 +37,12 @@ export const SearchDialog = (): ReactElement | null => {
     }
 
     if (config.inkeep == null) {
-        return <AlgoliaSearchDialog />;
+        return (
+            <>
+                <AlgoliaSearchDialog />
+                {domain.includes("cohere") && <CohereChatButton />}
+            </>
+        );
     } else {
         return (
             <>
@@ -43,7 +61,7 @@ export const SearchSidebar: React.FC<PropsWithChildren<SearchSidebar.Props>> = (
     const sidebar = useSidebarNodes();
     const activeVersion = useAtomValue(CURRENT_VERSION_ATOM);
     const placeholder = useMemo(
-        () => createSearchPlaceholderWithVersion(activeVersion, sidebar),
+        () => createSearchPlaceholderWithVersion(activeVersion?.id, sidebar),
         [activeVersion, sidebar],
     );
 

packages/ui/app/src/search/SearchHit.tsx

@@ -1,4 +1,5 @@
 import { visitDiscriminatedUnion } from "@fern-ui/core-utils";
+import { getSlugForSearchRecord, type SearchRecord } from "@fern-ui/search-utils";
 import cn from "clsx";
 import Link from "next/link";
 import { ReactElement, useMemo } from "react";
@@ -9,8 +10,6 @@ import { EndpointRecordV3 } from "./content/EndpointRecordV3";
 import { PageRecord } from "./content/PageRecord";
 import { PageRecordV2 } from "./content/PageRecordV2";
 import { PageRecordV3 } from "./content/PageRecordV3";
-import type { SearchRecord } from "./types";
-import { getSlugForSearchRecord } from "./util";
 
 export declare namespace SearchHit {
     export interface Props {

packages/ui/app/src/search/SearchHits.tsx

@@ -1,12 +1,11 @@
 import { FernScrollArea } from "@fern-ui/components";
 import { useKeyboardPress } from "@fern-ui/react-commons";
+import { getSlugForSearchRecord, type SearchRecord } from "@fern-ui/search-utils";
 import { useRouter } from "next/router";
 import React, { PropsWithChildren, useEffect, useMemo, useRef, useState } from "react";
 import { useInfiniteHits, useInstantSearch } from "react-instantsearch";
 import { useBasePath, useCloseSearchDialog } from "../atoms";
 import { SearchHit } from "./SearchHit";
-import type { SearchRecord } from "./types";
-import { getSlugForSearchRecord } from "./util";
 
 export const EmptyStateView: React.FC<PropsWithChildren> = ({ children }) => {
     return <div className="justify t-muted flex h-24 w-full flex-col items-center py-3">{children}</div>;

packages/ui/app/src/search/algolia/AlgoliaSearchDialog.tsx

@@ -1,15 +1,19 @@
-// import { Dialog, Transition } from "@headlessui/react";
+import { createSearchPlaceholderWithVersion } from "@fern-ui/search-utils";
 import * as Dialog from "@radix-ui/react-dialog";
 import { SearchClient } from "algoliasearch";
 import clsx from "clsx";
 import { useAtomValue, useSetAtom } from "jotai";
 import { ReactElement, useMemo, useRef } from "react";
 import { InstantSearch } from "react-instantsearch";
-import { CURRENT_VERSION_ATOM, POSITION_SEARCH_DIALOG_OVER_HEADER_ATOM, useSidebarNodes } from "../../atoms";
-
-import { IS_MOBILE_SCREEN_ATOM, SEARCH_DIALOG_OPEN_ATOM, useIsSearchDialogOpen } from "../../atoms";
+import {
+    CURRENT_VERSION_ATOM,
+    IS_MOBILE_SCREEN_ATOM,
+    POSITION_SEARCH_DIALOG_OVER_HEADER_ATOM,
+    SEARCH_DIALOG_OPEN_ATOM,
+    useIsSearchDialogOpen,
+    useSidebarNodes,
+} from "../../atoms";
 import { SearchHits } from "../SearchHits";
-import { createSearchPlaceholderWithVersion } from "../util";
 import { SearchBox } from "./SearchBox";
 import { useAlgoliaSearchClient } from "./useAlgoliaSearchClient";
 
@@ -52,7 +56,7 @@ function FernInstantSearch({ searchClient, indexName, inputRef }: FernInstantSea
     const sidebar = useSidebarNodes();
     const activeVersion = useAtomValue(CURRENT_VERSION_ATOM);
     const placeholder = useMemo(
-        () => createSearchPlaceholderWithVersion(activeVersion, sidebar),
+        () => createSearchPlaceholderWithVersion(activeVersion?.id, sidebar),
         [activeVersion, sidebar],
     );
     return (