From 33443a98615c23a7166073098b35b70c087233eb Mon Sep 17 00:00:00 2001
From: Pedram Amini <pedram.amini@gmail.com>
Date: Mon, 2 Feb 2026 06:30:40 -0600
Subject: [PATCH] MAESTRO: Remove X close button from FilePreview control panel

The file tab system now handles closing via the tab's X button,
making the close button in the FilePreview header redundant.

- Removed X icon import (no longer needed)
- Removed showCloseButton prop from FilePreviewProps interface
- Removed close button JSX from FilePreview header
- Removed showCloseButton={false} prop from MainPanel.tsx
- Updated FilePreview tests (removed close button tests)

Note: onClose prop remains for Escape key handling and unsaved
changes modal confirmation.
---
 .../renderer/components/FilePreview.test.tsx   | 18 ++----------------
 src/renderer/components/FilePreview.tsx        | 14 --------------
 src/renderer/components/MainPanel.tsx          |  1 -
 3 files changed, 2 insertions(+), 31 deletions(-)

diff --git a/src/__tests__/renderer/components/FilePreview.test.tsx b/src/__tests__/renderer/components/FilePreview.test.tsx
index 274a2e5b..6863c227 100644
--- a/src/__tests__/renderer/components/FilePreview.test.tsx
+++ b/src/__tests__/renderer/components/FilePreview.test.tsx
@@ -6,7 +6,6 @@ import { FilePreview } from '../../../renderer/components/FilePreview';
 // Mock lucide-react icons
 vi.mock('lucide-react', () => ({
 	FileCode: () => <span data-testid="file-code-icon">FileCode</span>,
-	X: () => <span data-testid="x-icon">X</span>,
 	Eye: () => <span data-testid="eye-icon">Eye</span>,
 	ChevronUp: () => <span data-testid="chevron-up">ChevronUp</span>,
 	ChevronDown: () => <span data-testid="chevron-down">ChevronDown</span>,
@@ -302,21 +301,8 @@ describe('FilePreview', () => {
 			expect(screen.getByText('test.md')).toBeInTheDocument();
 		});
 
-		it('renders close button', () => {
-			render(<FilePreview {...defaultProps} />);
-
-			expect(screen.getByTestId('x-icon')).toBeInTheDocument();
-		});
-
-		it('calls onClose when close button is clicked', () => {
-			const onClose = vi.fn();
-			render(<FilePreview {...defaultProps} onClose={onClose} />);
-
-			const closeButton = screen.getByTestId('x-icon').parentElement;
-			fireEvent.click(closeButton!);
-
-			expect(onClose).toHaveBeenCalledOnce();
-		});
+		// Close button was removed - now handled by file tab's X button
+		// See Phase 8: Cleanup & Polish task for details
 
 		it('renders nothing when file is null', () => {
 			const { container } = render(<FilePreview {...defaultProps} file={null} />);
diff --git a/src/renderer/components/FilePreview.tsx b/src/renderer/components/FilePreview.tsx
index 90728211..0907300c 100644
--- a/src/renderer/components/FilePreview.tsx
+++ b/src/renderer/components/FilePreview.tsx
@@ -15,7 +15,6 @@ import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
 import { vscDarkPlus } from 'react-syntax-highlighter/dist/esm/styles/prism';
 import {
 	FileCode,
-	X,
 	Eye,
 	ChevronUp,
 	ChevronDown,
@@ -97,8 +96,6 @@ interface FilePreviewProps {
 	onOpenInGraph?: () => void;
 	/** SSH remote ID for remote file operations */
 	sshRemoteId?: string;
-	/** Whether to show the close button in the header (default: true, set to false when rendered as tab) */
-	showCloseButton?: boolean;
 	/** Current edit content (used for file tab persistence) - if provided, overrides internal state */
 	externalEditContent?: string;
 	/** Callback when edit content changes (used for file tab persistence) */
@@ -569,7 +566,6 @@ export const FilePreview = forwardRef<FilePreviewHandle, FilePreviewProps>(funct
 		hasGist,
 		onOpenInGraph,
 		sshRemoteId,
-		showCloseButton = true, // Default to true for backwards compatibility
 		externalEditContent,
 		onEditContentChange,
 		initialScrollTop,
@@ -1702,16 +1698,6 @@ export const FilePreview = forwardRef<FilePreviewHandle, FilePreviewProps>(funct
 						>
 							<FolderOpen className="w-4 h-4" />
 						</button>
-						{/* Close button - hidden when rendered as tab (tab's X handles closing) */}
-						{showCloseButton && (
-							<button
-								onClick={onClose}
-								className="p-2 rounded hover:bg-white/10 transition-colors"
-								style={{ color: theme.colors.textDim }}
-							>
-								<X className="w-5 h-5" />
-							</button>
-						)}
 					</div>
 				</div>
 				{/* File Stats subbar - hidden on scroll */}
diff --git a/src/renderer/components/MainPanel.tsx b/src/renderer/components/MainPanel.tsx
index 8b89bd57..d618c68e 100644
--- a/src/renderer/components/MainPanel.tsx
+++ b/src/renderer/components/MainPanel.tsx
@@ -1597,7 +1597,6 @@ export const MainPanel = React.memo(
 										activeSession?.sessionSshRemoteConfig?.remoteId ||
 										undefined
 									}
-									showCloseButton={false}
 									// Pass external edit content for persistence across tab switches
 									externalEditContent={activeFileTab.editContent}
 									onEditContentChange={(content) => {