iframe 页面优化

frontend-web/src/pages/IframeChatPage.tsx

@@ -38,10 +38,57 @@ type BrainyChatSubmitMessage = {
   type?: string;
   payload?: {
     text?: string;
+    prompt?: string;
+    pageContext?: {
+      title?: string;
+      content?: string;
+      url?: string;
+    };
   };
   requestId?: string;
 };
 
+function buildIframeMessageText({
+  text,
+  prompt,
+  pageContext,
+}: {
+  text: string;
+  prompt: string;
+  pageContext?:
+    | {
+        title?: string;
+        content?: string;
+        url?: string;
+      }
+    | undefined;
+}) {
+  const primaryText = text || prompt;
+  const sections = [primaryText];
+
+  if (prompt && prompt !== primaryText) {
+    sections.push(`<extension_prompt>\n${prompt}\n</extension_prompt>`);
+  }
+
+  if (pageContext) {
+    const pageContextParts = [
+      pageContext.title ? `<title>\n${pageContext.title}\n</title>` : null,
+      pageContext.url ? `<url>\n${pageContext.url}\n</url>` : null,
+      pageContext.content
+        ? `<content>\n${pageContext.content}\n</content>`
+        : null,
+    ].filter(Boolean);
+
+    if (pageContextParts.length > 0) {
+      sections.push(
+        `<page_context>\n${pageContextParts.join("\n\n")}\n</page_context>`,
+      );
+    }
+  }
+
+  return sections.join("\n\n");
+}
+
 export default function IframeChatPage() {
   const routeBase = useRouteBase();
   const router = useRouter();
@@ -116,7 +163,10 @@ export default function IframeChatPage() {
   }, [selectedArtifact, thread.values.artifacts]);
 
   const handleSubmit = useCallback(
-    (message: PromptInputMessage) => {
+    (
+      message: PromptInputMessage,
+      externalContext?: Record<string, unknown>,
+    ) => {
       if (
         selectedAgentId &&
         isNewThread &&
@@ -152,6 +202,9 @@ export default function IframeChatPage() {
       if (settings.context.writing_mode && writingArtifactPath) {
         extraContext.writing_artifact_path = writingArtifactPath;
       }
+      if (externalContext) {
+        Object.assign(extraContext, externalContext);
+      }
       void sendMessage(
         threadId,
         message,
@@ -194,9 +247,42 @@ export default function IframeChatPage() {
       if (data?.type !== "brainy:chat-submit") return;
 
       const text = data.payload?.text?.trim() ?? "";
-      if (!text) return;
+      const prompt = data.payload?.prompt?.trim() ?? "";
+      const rawPageContext = data.payload?.pageContext;
+      const pageContext = rawPageContext
+        ? {
+            ...(rawPageContext.title?.trim()
+              ? { title: rawPageContext.title.trim() }
+              : {}),
+            ...(rawPageContext.content?.trim()
+              ? { content: rawPageContext.content.trim() }
+              : {}),
+            ...(rawPageContext.url?.trim()
+              ? { url: rawPageContext.url.trim() }
+              : {}),
+          }
+        : undefined;
+      const hasPageContext =
+        !!pageContext &&
+        Object.values(pageContext).some((value) => value.length > 0);
+      const submitText = buildIframeMessageText({ text, prompt, pageContext });
+      console.log("收到插件消息", {
+        text,
+        prompt,
+        pageContext,
+        requestId: data.requestId,
+      });
+      if (!submitText) return;
 
-      handleSubmit({ text, files: [] });
+      const iframeContext: Record<string, unknown> = {};
+      if (data.requestId) {
+        iframeContext.brainy_request_id = data.requestId;
+      }
+
+      handleSubmit(
+        { text: submitText, files: [] },
+        Object.keys(iframeContext).length > 0 ? iframeContext : undefined,
+      );
     };
 
     window.addEventListener("message", handleMessage);
@@ -224,7 +310,7 @@ export default function IframeChatPage() {
   return (
     <ThreadContext.Provider value={{ thread, isMock }}>
       <ChatBox threadId={threadId} disableArtifacts>
-        <div className="relative flex size-full min-h-0 justify-between">
+        <div className="relative flex size-full min-h-0 justify-between overflow-hidden">
           <header
             className={cn(
               "absolute top-0 right-0 left-0 z-30 flex h-12 shrink-0 items-center border-b px-4",
@@ -244,7 +330,7 @@ export default function IframeChatPage() {
               <ExportTrigger threadId={threadId} />
             </div>
           </header>
-          <main className="flex min-h-0 max-w-full grow flex-col">
+          <main className="flex min-h-0 max-w-full grow flex-col overflow-hidden">
             <div className="flex size-full justify-center">
               {!isLandingState && (
                 <MessageList

frontend-web/src/pages/WorkspaceRoutes.tsx

@@ -41,6 +41,7 @@ import StudioNotebooksPage from "./StudioNotebooksPage";
 import StudioNotebookDetailPage from "./StudioNotebookDetailPage";
 import RoundtablePlanningPage from "@/roundtable-planning/pages/RoundtablePlanningPage";
 import "@/roundtable-planning/styles/roundtable-planning.css";
+import { cn } from "@/lib/utils";
 
 export function WorkspaceLayout({
   children,
@@ -48,12 +49,16 @@ export function WorkspaceLayout({
   pageSidebarHidden = false,
   headerHidden = false,
   compactWorkspaceSidebar = false,
+  wrapperOverflowHidden = false,
+  insetOverflowHidden = false,
 }: {
   children: ReactNode;
   pageSidebarCollapsed: boolean;
   pageSidebarHidden?: boolean;
   headerHidden?: boolean;
   compactWorkspaceSidebar?: boolean;
+  wrapperOverflowHidden?: boolean;
+  insetOverflowHidden?: boolean;
 }) {
   const pageSidebarWidth = pageSidebarHidden
     ? "0rem"
@@ -63,7 +68,10 @@ export function WorkspaceLayout({
 
   return (
     <SidebarProvider
-      className="h-full w-full overflow-x-hidden [&_[data-slot=sidebar-container]]:left-[var(--page-sidebar-width)]"
+      className={[
+        "h-full w-full [&_[data-slot=sidebar-container]]:left-[var(--page-sidebar-width)]",
+        wrapperOverflowHidden ? "overflow-hidden" : "overflow-x-hidden",
+      ].join(" ")}
       style={
         {
           "--page-sidebar-width": pageSidebarWidth,
@@ -76,7 +84,11 @@ export function WorkspaceLayout({
       defaultOpen
     >
       <WorkspaceSidebar compactChrome={compactWorkspaceSidebar} />
-      <SidebarInset className="min-w-0">{children}</SidebarInset>
+      <SidebarInset
+        className={cn("min-w-0", insetOverflowHidden && "overflow-hidden")}
+      >
+        {children}
+      </SidebarInset>
       <CommandPalette />
       <Toaster position="top-center" />
     </SidebarProvider>
@@ -146,7 +158,11 @@ export default function WorkspaceRoutes({
       <Route
         path="chats_iframe/:thread_id"
         element={
-          <WorkspaceLayout {...layoutProps}>
+          <WorkspaceLayout
+            {...layoutProps}
+            wrapperOverflowHidden
+            insetOverflowHidden
+          >
             <ChatRuntime>
               <IframeChatPage />
             </ChatRuntime>