From c14d345ac50d4b4ead1a81976e0400607c8518b3 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Sun, 26 Jul 2026 06:26:48 +0000
Subject: [PATCH 1/4] Initial plan


From bd61498f849c827e26b235157befb1b16c033926 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Sun, 26 Jul 2026 06:31:47 +0000
Subject: [PATCH 2/4] Fix review comments from PR #59: connection-manager,
 App.tsx, connection-dialog, and test file

---
 src/App.tsx                                   |  10 +-
 .../connection-dialog-folder.test.tsx         | 111 ++++++++++++++++++
 src/components/connection-dialog.tsx          |  11 +-
 src/components/connection-manager.tsx         |  17 ++-
 4 files changed, 143 insertions(+), 6 deletions(-)
 create mode 100644 src/__tests__/connection-dialog-folder.test.tsx

diff --git a/src/App.tsx b/src/App.tsx
index 2c5eacb2..d5fc6cb9 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -60,6 +60,7 @@ function AppContent() {
 
   // Modal states
   const [connectionDialogOpen, setConnectionDialogOpen] = useState(false);
+  const [connectionInitialFolder, setConnectionInitialFolder] = useState<string | undefined>();
   const [settingsModalOpen, setSettingsModalOpen] = useState(false);
   const [editingConnection, setEditingConnection] = useState<ConnectionConfig | null>(null);
   const [updateCheckSignal, setUpdateCheckSignal] = useState(0);
@@ -670,7 +671,8 @@ function AppContent() {
     }
   }, [state.groups, dispatch]);
 
-  const handleNewTab = useCallback(() => {
+  const handleNewTab = useCallback((folderPath?: string) => {
+    setConnectionInitialFolder(typeof folderPath === 'string' ? folderPath : undefined);
     setConnectionDialogOpen(true);
     setEditingConnection(null);
   }, []);
@@ -1699,9 +1701,13 @@ function AppContent() {
       {/* Modals */}
       <ConnectionDialog
         open={connectionDialogOpen}
-        onOpenChange={setConnectionDialogOpen}
+        onOpenChange={(open) => {
+          setConnectionDialogOpen(open);
+          if (!open) setConnectionInitialFolder(undefined);
+        }}
         onConnect={handleConnectionDialogConnect}
         editingConnection={editingConnection}
+        initialFolder={connectionInitialFolder}
       />
 
       <SettingsModal
diff --git a/src/__tests__/connection-dialog-folder.test.tsx b/src/__tests__/connection-dialog-folder.test.tsx
new file mode 100644
index 00000000..e4bd3f71
--- /dev/null
+++ b/src/__tests__/connection-dialog-folder.test.tsx
@@ -0,0 +1,111 @@
+/**
+ * Tests for ConnectionDialog folder pre-selection via initialFolder prop:
+ * - Pre-select folder when initialFolder is provided (new connection from folder context menu)
+ * - Ignore initialFolder when editing an existing connection
+ * - Default to 'All Connections' when no initialFolder is set
+ */
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { render, screen } from '@testing-library/react';
+import { type ComponentProps } from 'react';
+import { ConnectionDialog } from '../components/connection-dialog';
+
+vi.mock('@tauri-apps/api/core', () => ({
+  invoke: vi.fn(),
+}));
+
+vi.mock('sonner', () => ({
+  toast: { error: vi.fn(), info: vi.fn(), success: vi.fn() },
+}));
+
+const mockFolders = [
+  { path: 'All Connections' },
+  { path: 'Work' },
+  { path: 'Personal' },
+  { path: 'Work/ProjectA' },
+];
+
+vi.mock('../lib/connection-storage', () => ({
+  ConnectionStorageManager: {
+    getValidFolders: vi.fn(() => mockFolders),
+  },
+}));
+
+vi.mock('../lib/connection-profiles', () => ({
+  ConnectionProfileManager: {
+    getProfiles: vi.fn(() => []),
+  },
+}));
+
+const defaultConnection = {
+  name: 'My Server',
+  host: '192.168.1.1',
+  port: 22,
+  username: 'admin',
+  protocol: 'SSH' as const,
+  authMethod: 'password' as const,
+  folder: 'Personal',
+  id: 'conn-1',
+};
+
+beforeEach(() => {
+  vi.clearAllMocks();
+});
+
+/**
+ * Helper: get the folder select trigger (second combobox - first is protocol).
+ * The dialog has two <Select>s: protocol (SSH/Telnet/...) and folder.
+ * We use getAllByRole('combobox') and take the second one.
+ */
+function getFolderSelect() {
+  const combos = screen.getAllByRole('combobox');
+  // combos[0] = protocol select (shows "SSH"), combos[1] = folder select
+  return combos[1];
+}
+
+describe('ConnectionDialog folder pre-selection', () => {
+  function renderDialog(props: Partial<ComponentProps<typeof ConnectionDialog>> = {}) {
+    return render(
+      <ConnectionDialog
+        open={true}
+        onOpenChange={vi.fn()}
+        onConnect={vi.fn()}
+        editingConnection={null}
+        {...props}
+      />,
+    );
+  }
+
+  it('pre-selects the folder when initialFolder is provided', () => {
+    renderDialog({ initialFolder: 'Work' });
+
+    const folderSelect = getFolderSelect();
+    expect(folderSelect.textContent).toContain('Work');
+  });
+
+  it('defaults to "All Connections" when no initialFolder is set', () => {
+    renderDialog({ initialFolder: undefined });
+
+    const folderSelect = getFolderSelect();
+    expect(folderSelect.textContent).toContain('All Connections');
+  });
+
+  it('hides the folder select when editing (initialFolder is ignored gracefully)', () => {
+    renderDialog({
+      initialFolder: 'Work',
+      editingConnection: { ...defaultConnection, folder: 'Personal' },
+    });
+
+    // When editing, saveAsConnection is false, so the folder select is not rendered.
+    // Only the protocol select (combobox) should exist.
+    const combos = screen.getAllByRole('combobox');
+    expect(combos).toHaveLength(1);
+    expect(combos[0].textContent).toContain('SSH');
+  });
+
+  it('uses folder from initialFolder over default "All Connections"', () => {
+    renderDialog({ initialFolder: 'Work/ProjectA' });
+
+    const folderSelect = getFolderSelect();
+    expect(folderSelect.textContent).toContain('Work/ProjectA');
+  });
+});
diff --git a/src/components/connection-dialog.tsx b/src/components/connection-dialog.tsx
index 4a0d2d0d..a03b49d3 100644
--- a/src/components/connection-dialog.tsx
+++ b/src/components/connection-dialog.tsx
@@ -30,6 +30,7 @@ interface ConnectionDialogProps {
   onOpenChange: (open: boolean) => void;
   onConnect: (config: ConnectionConfig) => void;
   editingConnection?: ConnectionConfig | null;
+  initialFolder?: string;
 }
 
 export interface ConnectionConfig {
@@ -72,7 +73,8 @@ export function ConnectionDialog({
   open,
   onOpenChange,
   onConnect,
-  editingConnection
+  editingConnection,
+  initialFolder
 }: ConnectionDialogProps) {
   const defaultConfig: ConnectionConfig = {
     name: '',
@@ -140,6 +142,13 @@ export function ConnectionDialog({
     }
   }, [open, editingConnection]);
 
+  // Dedicated effect: pre-select folder when initialFolder is provided (new connection from folder context menu)
+  useEffect(() => {
+    if (open && !editingConnection && initialFolder) {
+      setConnectionFolder(initialFolder);
+    }
+  }, [open, editingConnection, initialFolder]);
+
   const _handleSaveProfile = () => {
     try {
       const profile = ConnectionProfileManager.saveProfile({
diff --git a/src/components/connection-manager.tsx b/src/components/connection-manager.tsx
index a7659103..4453564a 100644
--- a/src/components/connection-manager.tsx
+++ b/src/components/connection-manager.tsx
@@ -64,7 +64,7 @@ interface ConnectionManagerProps {
   onConnectionConnect?: (connection: ConnectionNode) => void;
   selectedConnectionId: string | null;
   activeConnections?: Set<string>;
-  onNewConnection?: () => void;
+  onNewConnection?: (folderPath?: string) => void;
   onEditConnection?: (connection: ConnectionNode) => void;
   onDeleteConnection?: (connectionId: string) => void;
   onDuplicateConnection?: (connection: ConnectionNode) => void;
@@ -733,6 +733,17 @@ export function ConnectionManager({
               {nodeContent}
             </ContextMenuTrigger>
             <ContextMenuContent>
+              {onNewConnection && (
+                <>
+                  <ContextMenuItem
+                    onClick={() => onNewConnection(node.path)}
+                  >
+                    <Plus className="w-4 h-4 mr-2" />
+                    {t('connectionManager.newConnection')}
+                  </ContextMenuItem>
+                  <ContextMenuSeparator />
+                </>
+              )}
               <ContextMenuItem
                 onClick={() => openNewFolderDialog(node.path)}
               >
@@ -847,7 +858,7 @@ export function ConnectionManager({
                 <Button
                   variant="ghost"
                   size="sm"
-                  onClick={onNewConnection}
+                  onClick={() => onNewConnection?.()}
                   className="h-6 w-6 p-0"
                 >
                   <Plus className="w-3.5 h-3.5" />
@@ -866,7 +877,7 @@ export function ConnectionManager({
             <div className="flex flex-col items-center justify-center h-full p-4 text-center">
               <p className="text-sm text-muted-foreground mb-4">{t('connectionManager.noConnectionsYet')}</p>
               {onNewConnection && (
-                <Button onClick={onNewConnection} size="sm" variant="outline">
+                <Button onClick={() => onNewConnection?.()} size="sm" variant="outline">
                   <Plus className="w-4 h-4 mr-2" />
                   {t('connectionManager.newConnection')}
                 </Button>

From f04974b9605baecdc5c009a4cc8872a66b4e7b7e Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Sun, 26 Jul 2026 06:42:23 +0000
Subject: [PATCH 3/4] Address remaining review comments from PRs #61 and #62

PR #61:
- Add aria-label and aria-expanded to folder chevron button for accessibility
- Restore activeConnectionIds memoization to prevent unnecessary re-renders
- Fix expand/collapse state preservation using flat map for deep tree support

PR #62:
- Replace parseInt with Number() + integer floor for number inputs
- Reset to protocol-specific default port when field is cleared
- Use getDefaultPort(protocol) for port fallback when editing connections
---
 src/App.tsx                           |  9 +++++-
 src/components/connection-dialog.tsx  | 35 +++++++++++++++++-----
 src/components/connection-manager.tsx | 42 +++++++++++++++++++++++++--
 src/locales/en.json                   |  4 ++-
 src/locales/zh-CN.json                |  4 ++-
 5 files changed, 81 insertions(+), 13 deletions(-)

diff --git a/src/App.tsx b/src/App.tsx
index d5fc6cb9..326d0cc9 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -96,6 +96,13 @@ function AppContent() {
     return Object.values(state.groups).flatMap(g => g.tabs);
   }, [state.groups]);
 
+  // Memoized set of active connection IDs — stable reference prevents
+  // ConnectionManager from rebuilding its tree on every parent render.
+  const activeConnectionIds = useMemo(
+    () => new Set(allTabs.map(tab => tab.id)),
+    [allTabs],
+  );
+
   // Apply stored language preference (follows OS locale when set to "auto")
   useEffect(() => {
     void applyLanguageFromPreference();
@@ -1580,7 +1587,7 @@ function AppContent() {
                   onConnectionSelect={handleConnectionSelect}
                   onConnectionConnect={handleConnectionConnect}
                   selectedConnectionId={selectedConnection?.id || null}
-                  activeConnections={new Set(allTabs.map(tab => tab.id))}
+                  activeConnections={activeConnectionIds}
                   onNewConnection={handleNewTab}
                   onEditConnection={handleEditConnection}
                   recentConnections={recentConnections}
diff --git a/src/components/connection-dialog.tsx b/src/components/connection-dialog.tsx
index a03b49d3..38964539 100644
--- a/src/components/connection-dialog.tsx
+++ b/src/components/connection-dialog.tsx
@@ -125,10 +125,15 @@ export function ConnectionDialog({
 
       // Load editing connection data into config when dialog opens
       if (editingConnection) {
-        setConfig({
+        const mergedConfig = {
           ...defaultConfig,
-          ...editingConnection
-        });
+          ...editingConnection,
+        };
+        // If editingConnection omits port, derive it from the protocol
+        if (editingConnection.port === undefined) {
+          mergedConfig.port = getDefaultPort(mergedConfig.protocol);
+        }
+        setConfig(mergedConfig);
         // When editing, don't show "save as connection" since it already exists
         setSaveAsConnection(false);
       } else {
@@ -563,7 +568,11 @@ export function ConnectionDialog({
                       id="port"
                       type="number"
                       value={config.port}
-                      onChange={(e) => updateConfig({ port: parseInt(e.target.value) || 22 })}
+                      onChange={(e) => {
+                        const val = e.target.value;
+                        const num = val === '' ? getDefaultPort(config.protocol) : Math.floor(Number(val));
+                        if (!Number.isNaN(num)) updateConfig({ port: num });
+                      }}
                     />
                   </div>
                 </div>
@@ -818,7 +827,11 @@ export function ConnectionDialog({
                           id="proxy-port"
                           type="number"
                           value={config.proxyPort}
-                          onChange={(e) => updateConfig({ proxyPort: parseInt(e.target.value) || 8080 })}
+                          onChange={(e) => {
+                            const val = e.target.value;
+                            const num = val === '' ? 8080 : Math.floor(Number(val));
+                            if (!Number.isNaN(num)) updateConfig({ proxyPort: num });
+                          }}
                         />
                       </div>
                     </div>
@@ -925,7 +938,11 @@ export function ConnectionDialog({
                                   id="keep-alive-interval"
                                   type="number"
                                   value={config.keepAliveInterval}
-                                  onChange={(e) => updateConfig({ keepAliveInterval: parseInt(e.target.value) || 60 })}
+                                  onChange={(e) => {
+                                    const val = e.target.value;
+                                    const num = val === '' ? 60 : Math.floor(Number(val));
+                                    if (!Number.isNaN(num)) updateConfig({ keepAliveInterval: num });
+                                  }}
                                 />
                               </div>
                               <div className="space-y-2">
@@ -934,7 +951,11 @@ export function ConnectionDialog({
                                   id="max-count"
                                   type="number"
                                   value={config.serverAliveCountMax}
-                                  onChange={(e) => updateConfig({ serverAliveCountMax: parseInt(e.target.value) || 3 })}
+                                  onChange={(e) => {
+                                    const val = e.target.value;
+                                    const num = val === '' ? 3 : Math.floor(Number(val));
+                                    if (!Number.isNaN(num)) updateConfig({ serverAliveCountMax: num });
+                                  }}
                                 />
                               </div>
                             </div>
diff --git a/src/components/connection-manager.tsx b/src/components/connection-manager.tsx
index 4453564a..e25d880e 100644
--- a/src/components/connection-manager.tsx
+++ b/src/components/connection-manager.tsx
@@ -113,9 +113,39 @@ export function ConnectionManager({
   const suppressClickRef = useRef(false);
   const treeContainerRef = useRef<HTMLDivElement>(null);
 
-  // Reload connections when active connections change
+  // Reload connections when active connections change, preserving expand state
   useEffect(() => {
-    setConnections(loadConnections());
+    const newTree = loadConnections();
+    setConnections(prev => {
+      // Build a flat map of id → isExpanded from the previous tree (deep)
+      const expandedMap = new Map<string, boolean>();
+      const collectExpanded = (nodes: ConnectionNode[]) => {
+        for (const node of nodes) {
+          if (node.type === 'folder') {
+            expandedMap.set(node.id, node.isExpanded ?? true);
+          }
+          if (node.children) {
+            collectExpanded(node.children);
+          }
+        }
+      };
+      collectExpanded(prev);
+
+      // Apply preserved expand state to the new tree (deep)
+      const applyExpanded = (nodes: ConnectionNode[]): ConnectionNode[] =>
+        nodes.map(node => {
+          const expanded = expandedMap.get(node.id);
+          const merged: ConnectionNode = {
+            ...node,
+            isExpanded: expanded !== undefined ? expanded : node.isExpanded,
+          };
+          if (node.children) {
+            merged.children = applyExpanded(node.children);
+          }
+          return merged;
+        });
+      return applyExpanded(newTree);
+    });
   }, [activeConnections]);
 
   // Handle connection deletion
@@ -655,7 +685,13 @@ export function ConnectionManager({
           <div className="absolute bottom-0 right-0 h-0.5 bg-primary rounded" style={{ left: `${level * 16 + 8}px` }} />
         )}
         {node.type === 'folder' && (
-          <Button variant="ghost" size="sm" className="p-0 h-4 w-4">
+          <Button
+            variant="ghost"
+            size="sm"
+            className="p-0 h-4 w-4"
+            aria-label={node.isExpanded ? t('connectionManager.collapseFolder') : t('connectionManager.expandFolder')}
+            aria-expanded={node.isExpanded}
+          >
             {node.isExpanded ?
               <ChevronDown className="w-3 h-3" /> :
               <ChevronRight className="w-3 h-3" />
diff --git a/src/locales/en.json b/src/locales/en.json
index 658901ca..b021ba60 100644
--- a/src/locales/en.json
+++ b/src/locales/en.json
@@ -767,7 +767,9 @@
     "connectionDetails": "Connection Details",
     "noConnectionSelected": "No connection selected",
     "movedToRoot": "Moved \"{{name}}\" to All Connections",
-    "failedToReorder": "Failed to reorder items"
+    "failedToReorder": "Failed to reorder items",
+    "expandFolder": "Expand folder",
+    "collapseFolder": "Collapse folder"
   },
   "filePanel": {
     "selectDirectory": "Select a directory to view its contents",
diff --git a/src/locales/zh-CN.json b/src/locales/zh-CN.json
index 40d4c218..711765ae 100644
--- a/src/locales/zh-CN.json
+++ b/src/locales/zh-CN.json
@@ -767,7 +767,9 @@
     "connectionDetails": "连接详情",
     "noConnectionSelected": "未选择连接",
     "movedToRoot": "已将\"{{name}}\"移动到所有连接",
-    "failedToReorder": "重新排序失败"
+    "failedToReorder": "重新排序失败",
+    "expandFolder": "展开文件夹",
+    "collapseFolder": "折叠文件夹"
   },
   "filePanel": {
     "selectDirectory": "选择目录以查看其内容",

From 5d11e430284cfce52a3111bb9288278b6d04cf96 Mon Sep 17 00:00:00 2001
From: "copilot-swe-agent[bot]" <198982749+Copilot@users.noreply.github.com>
Date: Sun, 26 Jul 2026 06:44:26 +0000
Subject: [PATCH 4/4] Restore .gitignore test-results/ entry and add onClick
 handler to chevron button

---
 .gitignore                            | 1 +
 src/components/connection-manager.tsx | 4 ++++
 2 files changed, 5 insertions(+)

diff --git a/.gitignore b/.gitignore
index a6f0529a..84755c86 100644
--- a/.gitignore
+++ b/.gitignore
@@ -13,6 +13,7 @@ dist-ssr
 *.local
 target
 .qoder
+test-results/
 
 # Editor directories and files
 .vscode/*
diff --git a/src/components/connection-manager.tsx b/src/components/connection-manager.tsx
index e25d880e..a4e989d8 100644
--- a/src/components/connection-manager.tsx
+++ b/src/components/connection-manager.tsx
@@ -691,6 +691,10 @@ export function ConnectionManager({
             className="p-0 h-4 w-4"
             aria-label={node.isExpanded ? t('connectionManager.collapseFolder') : t('connectionManager.expandFolder')}
             aria-expanded={node.isExpanded}
+            onClick={(e) => {
+              e.stopPropagation();
+              toggleExpanded(node.id);
+            }}
           >
             {node.isExpanded ?
               <ChevronDown className="w-3 h-3" /> :