fix(ask_sb): Fix '413 content too large' error (#416)

CHANGELOG.md

@@ -7,6 +7,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ## [Unreleased]
 
+### Fixed
+- [ask sb] Fixed "413 content too large" error when starting a new chat with many repos selected. [#416](https://github.com/sourcebot-dev/sourcebot/pull/416)
+
 ## [4.6.1] - 2025-07-29
 
 ### Added

packages/web/src/app/[domain]/chat/[id]/components/chatThreadPanel.tsx

@@ -2,12 +2,12 @@
 
 import { ResizablePanel } from '@/components/ui/resizable';
 import { ChatThread } from '@/features/chat/components/chatThread';
-import { LanguageModelInfo, SBChatMessage, SearchScope, SET_CHAT_STATE_QUERY_PARAM, SetChatStatePayload } from '@/features/chat/types';
+import { LanguageModelInfo, SBChatMessage, SearchScope, SET_CHAT_STATE_SESSION_STORAGE_KEY, SetChatStatePayload } from '@/features/chat/types';
 import { RepositoryQuery, SearchContextQuery } from '@/lib/types';
 import { CreateUIMessage } from 'ai';
-import { useRouter, useSearchParams } from 'next/navigation';
 import { useEffect, useState } from 'react';
 import { useChatId } from '../../useChatId';
+import { useSessionStorage } from 'usehooks-ts';
 
 interface ChatThreadPanelProps {
     languageModels: LanguageModelInfo[];
@@ -29,9 +29,8 @@ export const ChatThreadPanel = ({
     // @note: we are guaranteed to have a chatId because this component will only be
     // mounted when on a /chat/[id] route.
     const chatId = useChatId()!;
-    const router = useRouter();
-    const searchParams = useSearchParams();
     const [inputMessage, setInputMessage] = useState<CreateUIMessage<SBChatMessage> | undefined>(undefined);
+    const [chatState, setChatState] = useSessionStorage<SetChatStatePayload | null>(SET_CHAT_STATE_SESSION_STORAGE_KEY, null);
     
     // Use the last user's last message to determine what repos and contexts we should select by default.
     const lastUserMessage = messages.findLast((message) => message.role === "user");
@@ -39,24 +38,20 @@ export const ChatThreadPanel = ({
     const [selectedSearchScopes, setSelectedSearchScopes] = useState<SearchScope[]>(defaultSelectedSearchScopes);
     
     useEffect(() => {
-        const setChatState = searchParams.get(SET_CHAT_STATE_QUERY_PARAM);
+        if (!chatState) {
-        if (!setChatState) {
             return;
         }
 
         try {
-            const { inputMessage, selectedSearchScopes } = JSON.parse(setChatState) as SetChatStatePayload;
+            setInputMessage(chatState.inputMessage);
-            setInputMessage(inputMessage);
+            setSelectedSearchScopes(chatState.selectedSearchScopes);
-            setSelectedSearchScopes(selectedSearchScopes);
         } catch {
-            console.error('Invalid message in URL');
+            console.error('Invalid chat state in session storage');
+        } finally {
+            setChatState(null);
         }
 
-        // Remove the message from the URL
+    }, [chatState, setChatState]);
-        const newSearchParams = new URLSearchParams(searchParams.toString());
-        newSearchParams.delete(SET_CHAT_STATE_QUERY_PARAM);
-        router.replace(`?${newSearchParams.toString()}`, { scroll: false });
-    }, [searchParams, router]);
 
     return (
         <ResizablePanel

packages/web/src/features/chat/types.ts

@@ -158,7 +158,7 @@ declare module 'slate' {
 /////////////////////////
 
 // Misc //
-export const SET_CHAT_STATE_QUERY_PARAM = 'setChatState';
+export const SET_CHAT_STATE_SESSION_STORAGE_KEY = 'setChatState';
 
 export type SetChatStatePayload = {
     inputMessage: CreateUIMessage<SBChatMessage>;

packages/web/src/features/chat/useCreateNewChatThread.ts

@@ -10,7 +10,8 @@ import { useRouter } from "next/navigation";
 import { createChat } from "./actions";
 import { isServiceError } from "@/lib/utils";
 import { createPathWithQueryParams } from "@/lib/utils";
-import { SearchScope, SET_CHAT_STATE_QUERY_PARAM, SetChatStatePayload } from "./types";
+import { SearchScope, SET_CHAT_STATE_SESSION_STORAGE_KEY, SetChatStatePayload } from "./types";
+import { useSessionStorage } from "usehooks-ts";
 
 export const useCreateNewChatThread = () => {
     const domain = useDomain();
@@ -18,6 +19,9 @@ export const useCreateNewChatThread = () => {
     const { toast } = useToast();
     const router = useRouter();
 
+    const [, setChatState] = useSessionStorage<SetChatStatePayload | null>(SET_CHAT_STATE_SESSION_STORAGE_KEY, null);
+
+
     const createNewChatThread = useCallback(async (children: Descendant[], selectedSearchScopes: SearchScope[]) => {
         const text = slateContentToString(children);
         const mentions = getAllMentionElements(children);
@@ -34,16 +38,16 @@ export const useCreateNewChatThread = () => {
             return;
         }
 
-        const url = createPathWithQueryParams(`/${domain}/chat/${response.id}`,
+        setChatState({
-            [SET_CHAT_STATE_QUERY_PARAM, JSON.stringify({
             inputMessage,
             selectedSearchScopes,
-            } satisfies SetChatStatePayload)],
+        });
-        );
+
+        const url = createPathWithQueryParams(`/${domain}/chat/${response.id}`);
 
         router.push(url);
         router.refresh();
-    }, [domain, router, toast]);
+    }, [domain, router, toast, setChatState]);
 
     return {
         createNewChatThread,