Merge branch 'main' into zeno/rnd-7450-mobile-toc-chat-layout

Author: zenoachtig

.changeset/funny-dodos-speak.md

@@ -0,0 +1,5 @@
+---
+"gitbook": patch
+---
+
+Fix search results cursor

.changeset/social-moles-film.md

@@ -0,0 +1,5 @@
+---
+"gitbook": patch
+---
+
+Support `greeting` and fix suggested questions if there are no custom ones defined

packages/gitbook/src/components/AI/useAI.tsx

@@ -17,6 +17,10 @@ export type AIConfig = {
     aiMode: CustomizationAIMode;
     suggestions?: string[];
     trademark: boolean;
+    greeting?: {
+        title: string;
+        subtitle: string;
+    };
 };
 
 export type Assistant = Omit<GitBookAssistant, 'icon'> & {
@@ -50,10 +54,10 @@ export type Assistant = Omit<GitBookAssistant, 'icon'> & {
 const AIContext = React.createContext<AIConfig | null>(null);
 
 export function AIContextProvider(props: React.PropsWithChildren<AIConfig>): React.ReactElement {
-    const { aiMode, trademark, suggestions, children } = props;
+    const { aiMode, trademark, suggestions, greeting, children } = props;
     const value = React.useMemo(
-        () => ({ aiMode, trademark, suggestions }),
-        [aiMode, trademark, suggestions]
+        () => ({ aiMode, trademark, suggestions, greeting }),
+        [aiMode, trademark, suggestions, greeting]
     );
     return <AIContext.Provider value={value}>{children}</AIContext.Provider>;
 }

packages/gitbook/src/components/AIChat/AIChat.tsx

@@ -201,8 +201,12 @@ export function AIChatBody(props: {
     chat: AIChatState;
     welcomeMessage?: string;
     suggestions?: string[];
+    greeting?: {
+        title: string;
+        subtitle: string;
+    };
 }) {
-    const { chatController, chat, suggestions } = props;
+    const { chatController, chat, suggestions, greeting } = props;
     const { trademark } = useAI().config;
 
     const [input, setInput] = React.useState('');
@@ -241,19 +245,20 @@ export function AIChatBody(props: {
                                     className="size-8 text-primary [@container(min-height:400px)]:size-16"
                                 />
                             </div>
-                            <div className="flex flex-col items-start [@container(min-height:400px)]:items-center">
+                            <div className="flex flex-col items-start gap-1 [@container(min-height:400px)]:items-center">
                                 <h5
-                                    className="animate-blur-in-slow font-bold text-lg text-tint-strong [@container(min-height:400px)]:text-center"
+                                    className="animate-blur-in-slow font-bold text-lg text-tint-strong leading-tight [@container(min-height:400px)]:text-center"
                                     style={{ animationDelay: '.5s' }}
                                     data-testid="ai-chat-time-greeting"
                                 >
-                                    {timeGreeting}
+                                    {greeting?.title || timeGreeting}
                                 </h5>
                                 <p
-                                    className="animate-blur-in-slow text-tint [@container(min-height:400px)]:text-center"
+                                    className="animate-blur-in-slow text-tint leading-tight [@container(min-height:400px)]:text-center"
                                     style={{ animationDelay: '.6s' }}
                                 >
-                                    {t(language, 'ai_chat_assistant_description')}
+                                    {greeting?.subtitle ||
+                                        t(language, 'ai_chat_assistant_description')}
                                 </p>
                             </div>
                         </div>

packages/gitbook/src/components/AIChat/AIChatSuggestedQuestions.tsx

@@ -7,14 +7,16 @@ export default function AIChatSuggestedQuestions(props: {
     suggestions?: string[];
 }) {
     const language = useLanguage();
-    const {
-        chatController,
-        suggestions = [
-            tString(language, 'ai_chat_suggested_questions_about_this_page'),
-            tString(language, 'ai_chat_suggested_questions_read_next'),
-            tString(language, 'ai_chat_suggested_questions_example'),
-        ],
-    } = props;
+    const { chatController, suggestions: _suggestions } = props;
+
+    const suggestions =
+        _suggestions && _suggestions.length > 0
+            ? _suggestions
+            : [
+                  tString(language, 'ai_chat_suggested_questions_about_this_page'),
+                  tString(language, 'ai_chat_suggested_questions_read_next'),
+                  tString(language, 'ai_chat_suggested_questions_example'),
+              ];
 
     return (
         <div className="flex flex-col items-start gap-2 self-start">

packages/gitbook/src/components/Embeddable/EmbeddableAIChat.tsx

@@ -98,6 +98,7 @@ export function EmbeddableAIChat(props: EmbeddableAIChatProps) {
                         chatController={chatController}
                         chat={chat}
                         suggestions={configuration.suggestions}
+                        greeting={configuration.greeting}
                     />
                 </EmbeddableFrameBody>
             </EmbeddableFrameMain>

packages/gitbook/src/components/Search/useSearchResults.ts

@@ -173,7 +173,11 @@ export function useSearchResults(props: {
                     return;
                 }
 
-                setResultsState({ results, fetching: false, error: false });
+                const aiEnrichedResults = withAI
+                    ? withAskTriggers(results, query, assistants)
+                    : results;
+
+                setResultsState({ results: aiEnrichedResults, fetching: false, error: false });
 
                 trackEvent({
                     type: 'search_type_query',
@@ -194,14 +198,7 @@ export function useSearchResults(props: {
         };
     }, [query, scope, trackEvent, withAI, siteSpaceId, siteSpaceIds, disabled, suggestions]);
 
-    const aiEnrichedResults: ResultType[] = React.useMemo(() => {
-        if (!withAI) {
-            return resultsState.results;
-        }
-        return withAskTriggers(resultsState.results, query, assistants);
-    }, [resultsState.results, query, withAI, assistants]);
-
-    return { ...resultsState, results: aiEnrichedResults };
+    return resultsState;
 }
 
 /**

packages/gitbook/src/components/TableOfContents/styles.ts

@@ -25,7 +25,7 @@ export const ToggleableLinkItemStyles = [
     'text-balance font-normal text-sm text-tint-strong/7 hover:bg-tint-hover hover:text-tint-strong contrast-more:text-tint-strong',
     'contrast-more:hover:text-tint-strong contrast-more:hover:ring-1 contrast-more:hover:ring-tint-12',
     'before:contents[] before:-left-px before:absolute before:inset-y-0',
-    'sidebar-list-line:rounded-l-none sidebar-list-line:before:w-px [&+div_a]:sidebar-list-default:rounded-l-none [&+div_a]:pl-5 [&+div_a]:sidebar-list-default:before:w-px',
+    'sidebar-list-line:rounded-l-none! sidebar-list-line:before:w-px [&+div_a]:sidebar-list-default:rounded-l-none [&+div_a]:pl-5 [&+div_a]:sidebar-list-default:before:w-px',
 ];
 
 export const ToggleableLinkItemActiveStyles = [