Dynamic import mobile panels in new-chat page

[MODSetter]

Description

The new-chat page statically imports MobileEditorPanel, MobileHitlEditPanel, and MobileReportPanel (lines 40-42). These pull in PlateEditor, MarkdownViewer, and other heavy dependencies for every chat session, even though these panels are only shown behind user interaction on mobile. The RightPanel component already uses next/dynamic for similar content.

File to change

• surfsense_web/app/dashboard/[search_space_id]/new-chat/[[...chat_id]]/page.tsx (lines 40-42)

Current code

import { MobileEditorPanel } from "@/components/editor-panel/editor-panel";
import { MobileHitlEditPanel } from "@/components/hitl-edit-panel/hitl-edit-panel";
import { MobileReportPanel } from "@/components/report-panel/report-panel";

What to do

import dynamic from "next/dynamic";

const MobileEditorPanel = dynamic(
  () => import("@/components/editor-panel/editor-panel").then(m => ({ default: m.MobileEditorPanel })),
  { ssr: false }
);
const MobileHitlEditPanel = dynamic(
  () => import("@/components/hitl-edit-panel/hitl-edit-panel").then(m => ({ default: m.MobileHitlEditPanel })),
  { ssr: false }
);
const MobileReportPanel = dynamic(
  () => import("@/components/report-panel/report-panel").then(m => ({ default: m.MobileReportPanel })),
  { ssr: false }
);

Acceptance criteria

• Mobile panels load only when opened
• Chat page initial load is faster
• Editor, report, and HITL panels still work on mobile