Fixing non functional view plan button (#3073)

e2e-tests/plan_mode.spec.ts

@@ -201,3 +201,38 @@ testSkipIfWindows(
     await po.snapshotServerDump("last-message");
   },
 );
+
+testSkipIfWindows(
+  "plan mode - view plan button opens preview panel when collapsed",
+  async ({ po }) => {
+    // Set up app
+    await po.setUpDyadPro({ localAgent: true });
+    await po.importApp("minimal");
+
+    // Switch to plan mode
+    await po.chatActions.selectChatMode("plan");
+
+    // Generate a plan by sending a prompt that triggers plan generation
+    await po.sendPrompt("tc=local-agent/accept-plan");
+
+    // Wait for the "View Plan" button to appear
+    const viewPlanButton = po.page.getByRole("button", { name: "View Plan" });
+    await expect(viewPlanButton).toBeVisible({ timeout: Timeout.MEDIUM });
+
+    // Verify plan content is visible
+    const planContent = po.previewPanel.getPlanContent();
+    await expect(planContent).toBeVisible({ timeout: Timeout.MEDIUM });
+
+    // Collapse the preview panel
+    await po.previewPanel.clickTogglePreviewPanel();
+
+    // Verify the preview panel is actually closed (plan content should be hidden)
+    await expect(planContent).not.toBeVisible();
+
+    // Click the "View Plan" button
+    await viewPlanButton.click();
+
+    // Assert that the plan content is visible (button opened the panel and switched to plan mode)
+    await expect(planContent).toBeVisible({ timeout: Timeout.MEDIUM });
+  },
+);

src/components/chat/DyadWritePlan.tsx

@@ -2,6 +2,7 @@ import React, { useState } from "react";
 import { FileText, Eye, ChevronDown, ChevronUp, Loader2 } from "lucide-react";
 import { useSetAtom } from "jotai";
 import { previewModeAtom } from "@/atoms/appAtoms";
+import { isPreviewOpenAtom } from "@/atoms/viewAtoms";
 import { CustomTagState } from "./stateTypes";
 import { usePlan } from "@/hooks/usePlan";
 
@@ -21,6 +22,7 @@ export const DyadWritePlan: React.FC<DyadWritePlanProps> = ({ node }) => {
   const { title, summary, complete, state } = node.properties;
   const [showSummary, setShowSummary] = useState(false);
   const setPreviewMode = useSetAtom(previewModeAtom);
+  const setIsPreviewOpen = useSetAtom(isPreviewOpenAtom);
 
   // Consider in progress if state is pending OR complete is explicitly "false"
   const isInProgress = state === "pending" || complete === "false";
@@ -63,7 +65,10 @@ export const DyadWritePlan: React.FC<DyadWritePlanProps> = ({ node }) => {
           {!isInProgress && hasPlan && (
             <button
               type="button"
-              onClick={() => setPreviewMode("plan")}
+              onClick={() => {
+                setPreviewMode("plan");
+                setIsPreviewOpen(true);
+              }}
               className="flex items-center gap-1.5 text-xs font-medium text-primary-foreground px-4 py-1.5 bg-primary rounded-md hover:bg-primary/90 transition-colors"
             >
               <Eye size={14} />