tabby-sftp-ui 0.2.4 → 0.2.6

package/dist/index.js

@@ -237,6 +237,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var tabby_core__WEBPACK_IMPORTED_MODULE_6___default = /*#__PURE__*/__webpack_require__.n(tabby_core__WEBPACK_IMPORTED_MODULE_6__);
 /* harmony import */ var _local_transfers__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./local-transfers */ "./src/local-transfers.ts");
 /* harmony import */ var _sftp_service__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./sftp.service */ "./src/sftp.service.ts");
+/* harmony import */ var _sftp_recovery_provider__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./sftp-recovery-provider */ "./src/sftp-recovery-provider.ts");
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
@@ -255,6 +256,7 @@ var __metadata = (undefined && undefined.__metadata) || function (k, v) {
 
 
 
+
 let SftpManagerTabComponent = class SftpManagerTabComponent extends tabby_core__WEBPACK_IMPORTED_MODULE_6__.BaseTabComponent {
     constructor(injector, sftp, profilesService, app) {
         // Tabby runtime BaseTabComponent expects Injector in constructor, but typings in this SDK may differ.
@@ -265,7 +267,9 @@ let SftpManagerTabComponent = class SftpManagerTabComponent extends tabby_core__
         this.app = app;
         // injected from the SSH tab when opened via SFTP-UI button
         this.sshSession = null;
+        this.shellSession = null;
         this.profile = null;
+        this.recoveredStub = false;
         this.connecting = false;
         this.connected = false;
         // legacy UI fields kept for now (not used when opened from SSH tab)
@@ -278,6 +282,7 @@ let SftpManagerTabComponent = class SftpManagerTabComponent extends tabby_core__
         this.remotePath = '/';
         this.remoteEntries = [];
         this.sftpSession = null;
+        this.connectPromise = null;
         this.localDropActive = false;
         this.remoteDropActive = false;
         this.transfers = [];
@@ -353,9 +358,9 @@ let SftpManagerTabComponent = class SftpManagerTabComponent extends tabby_core__
         // If there's no live SSH session, this tab was likely restored across
         // restart or opened in an invalid context. Close it immediately to avoid
         // an empty, nameless SFTP tab lingering after restart.
-        if (!this.sshSession) {
+        if (this.recoveredStub || !this.sshSession) {
             try {
-                this.app.closeTab(this);
+                this.app.closeTab(this.topmostParent ?? this);
             }
             catch (e) {
                 console.error('[SFTP-UI] Failed to close invalid SFTP tab', e);
@@ -365,11 +370,32 @@ let SftpManagerTabComponent = class SftpManagerTabComponent extends tabby_core__
         this.remotePathInput = this.remotePath;
         this.localPathInput = this.localPath;
         if (this.sshSession) {
-            void this.connect();
+            void this.waitForConnection();
         }
         this.loadRecentProfiles();
     }
     async connect() {
+        if (this.connected) {
+            return;
+        }
+        if (this.connectPromise) {
+            return this.connectPromise;
+        }
+        this.connectPromise = this.connectInternal();
+        try {
+            await this.connectPromise;
+        }
+        finally {
+            this.connectPromise = null;
+        }
+    }
+    async waitForConnection() {
+        if (this.connected) {
+            return;
+        }
+        await this.connect();
+    }
+    async connectInternal() {
         if (this.connecting || this.connected) {
             return;
         }
@@ -381,17 +407,30 @@ let SftpManagerTabComponent = class SftpManagerTabComponent extends tabby_core__
         try {
             this.sftpSession = await this.sftp.openFromSSHSession(this.sshSession);
             this.connected = true;
-            this.remotePath = this.getDefaultRemotePath();
-            this.remotePathInput = this.remotePath;
+            await this.initializeRemotePath();
             await this.refreshRemote();
         }
         catch (e) {
             console.error('[SFTP-UI] SFTP connection failed', e);
+            this.connected = false;
+            this.sftpSession = null;
         }
         finally {
             this.connecting = false;
         }
     }
+    async initializeRemotePath() {
+        this.remotePath = await this.resolveDefaultRemotePath();
+        this.remotePathInput = this.remotePath;
+        if (await this.ensureRemoteDirectoryReady()) {
+            return;
+        }
+        // Shell CWD may not be ready yet when SFTP-UI opens immediately after SSH connect.
+        await new Promise(resolve => setTimeout(resolve, 500));
+        this.remotePath = await this.resolveDefaultRemotePath();
+        this.remotePathInput = this.remotePath;
+        await this.ensureRemoteDirectoryReady();
+    }
     async disconnect() {
         this.sftpSession = null;
         this.connected = false;
@@ -410,14 +449,26 @@ let SftpManagerTabComponent = class SftpManagerTabComponent extends tabby_core__
         }
     }
     remoteUp() {
-        if (!this.connected || this.remotePath === '/') {
+        if (!this.canRemoteUp()) {
             return;
         }
-        const next = path__WEBPACK_IMPORTED_MODULE_0__.posix.dirname(this.remotePath);
-        this.remotePath = next === '.' ? '/' : next;
+        const next = this.remoteParentPath(this.remotePath);
+        this.remotePath = next;
         this.remotePathInput = this.remotePath;
         void this.refreshRemote();
     }
+    canRemoteUp() {
+        if (!this.connected) {
+            return false;
+        }
+        if (this.remotePath === '/') {
+            return false;
+        }
+        if (this.isWindowsSftpPath(this.remotePath)) {
+            return !/^\/[A-Za-z]:\/?$/.test(this.remotePath);
+        }
+        return true;
+    }
     async refreshLocal() {
         try {
             const names = await fs_promises__WEBPACK_IMPORTED_MODULE_2__.readdir(this.localPath);
@@ -630,10 +681,12 @@ let SftpManagerTabComponent = class SftpManagerTabComponent extends tabby_core__
     async onDropOnRemote(ev) {
         ev.preventDefault();
         this.remoteDropActive = false;
-        if (!this.connected) {
+        await this.waitForConnection();
+        if (!this.connected || !this.sftpSession) {
             return;
         }
-        if (!this.sftpSession) {
+        if (!(await this.ensureRemoteDirectoryReady())) {
+            console.error('[SFTP-UI] Remote path is not ready for upload');
             return;
         }
         // Drag & drop from OS file manager (Explorer/Finder) into the remote pane
@@ -1367,6 +1420,9 @@ let SftpManagerTabComponent = class SftpManagerTabComponent extends tabby_core__
         }
     }
     getRemoteBreadcrumbs() {
+        if (this.isWindowsSftpPath(this.remotePath)) {
+            return this.getWindowsSftpBreadcrumbs(this.remotePath);
+        }
         const parts = this.remotePath.split('/').filter(Boolean);
         const crumbs = [];
         let current = '/';
@@ -1391,9 +1447,7 @@ let SftpManagerTabComponent = class SftpManagerTabComponent extends tabby_core__
         if (!this.connected) {
             return;
         }
-        const target = this.normalizeRemotePath(this.remotePathInput || '/');
-        this.remotePath = target;
-        this.remotePathInput = target;
+        this.syncRemotePathFromInput();
         void this.refreshRemote();
     }
     goToLocalPathInput() {
@@ -1580,21 +1634,169 @@ let SftpManagerTabComponent = class SftpManagerTabComponent extends tabby_core__
         if (!p) {
             return '/';
         }
-        let result = p.trim();
+        let result = p.trim().replace(/\\/g, '/');
+        const winDrive = result.match(/^\/([A-Za-z]):(?:\/(.*))?$/);
+        if (winDrive) {
+            const rest = winDrive[2] ?? '';
+            return rest
+                ? `/${winDrive[1]}:/${rest}`.replace(/\/+/g, '/')
+                : `/${winDrive[1]}:/`;
+        }
+        const bareDrive = result.match(/^([A-Za-z]):(?:\/(.*))?$/);
+        if (bareDrive) {
+            const rest = bareDrive[2] ?? '';
+            return rest
+                ? `/${bareDrive[1]}:/${rest}`.replace(/\/+/g, '/')
+                : `/${bareDrive[1]}:/`;
+        }
         if (!result.startsWith('/')) {
             result = '/' + result;
         }
-        // remove duplicate slashes
-        result = result.replace(/\/+/g, '/');
-        return result;
+        return result.replace(/\/+/g, '/');
     }
-    getDefaultRemotePath() {
-        const username = (this.profile && (this.profile.options?.username || this.profile.options?.user)) || '';
-        if (username) {
-            return `/home/${username}`;
+    async resolveDefaultRemotePath() {
+        const canonical = await this.canonicalizeRemotePath('.');
+        if (canonical) {
+            const normalized = this.normalizeRemotePath(canonical);
+            if (await this.remotePathExists(normalized)) {
+                return normalized;
+            }
+        }
+        if (this.shellSession) {
+            try {
+                const cwd = await this.shellSession.getWorkingDirectory?.();
+                if (cwd) {
+                    const normalized = this.toRemoteSftpPath(cwd);
+                    if (await this.remotePathExists(normalized)) {
+                        return normalized;
+                    }
+                }
+            }
+            catch {
+                // fall through to SFTP-based detection
+            }
+        }
+        const username = this.getRemoteUsername();
+        for (const candidate of this.buildDefaultRemotePathCandidates(username)) {
+            if (await this.remotePathExists(candidate)) {
+                return candidate;
+            }
         }
         return '/';
     }
+    syncRemotePathFromInput() {
+        const normalized = this.normalizeRemotePath(this.remotePathInput || this.remotePath || '/');
+        this.remotePath = normalized;
+        this.remotePathInput = normalized;
+    }
+    async ensureRemoteDirectoryReady() {
+        if (!this.sftpSession) {
+            return false;
+        }
+        this.syncRemotePathFromInput();
+        if (await this.remotePathExists(this.remotePath)) {
+            return true;
+        }
+        const resolved = await this.resolveDefaultRemotePath();
+        this.remotePath = resolved;
+        this.remotePathInput = resolved;
+        return await this.remotePathExists(resolved);
+    }
+    getRemoteUsername() {
+        return (this.profile && (this.profile.options?.username || this.profile.options?.user)) || '';
+    }
+    buildDefaultRemotePathCandidates(username) {
+        const candidates = [];
+        if (username) {
+            candidates.push(`/C:/Users/${username}`);
+            if (username.toLowerCase() === 'administrator') {
+                candidates.push('/C:/Users/Administrator');
+            }
+            if (username === 'root') {
+                candidates.push('/root');
+            }
+            else {
+                candidates.push(`/home/${username}`);
+            }
+        }
+        candidates.push('/');
+        return candidates;
+    }
+    async canonicalizeRemotePath(p) {
+        const session = this.sftpSession;
+        const candidates = [
+            session?.canonicalize?.bind(session),
+            session?.realpath?.bind(session),
+            session?.sftp?.canonicalize?.bind(session.sftp),
+            session?.sftp?.realpath?.bind(session.sftp),
+        ].filter((fn) => typeof fn === 'function');
+        for (const fn of candidates) {
+            try {
+                return await fn(p);
+            }
+            catch {
+                // try the next available SFTP realpath implementation
+            }
+        }
+        return null;
+    }
+    async remotePathExists(p) {
+        if (!this.sftpSession) {
+            return false;
+        }
+        try {
+            if (this.sftpSession.stat) {
+                const st = await this.sftpSession.stat(p);
+                return st.isDirectory;
+            }
+            await this.sftpSession.readdir(p);
+            return true;
+        }
+        catch {
+            return false;
+        }
+    }
+    toRemoteSftpPath(p) {
+        return this.normalizeRemotePath(p);
+    }
+    isWindowsSftpPath(p) {
+        return /^\/[A-Za-z]:\//.test(p) || /^\/[A-Za-z]:\/?$/.test(p);
+    }
+    getWindowsSftpBreadcrumbs(remotePath) {
+        const match = remotePath.match(/^\/([A-Za-z]):\/?(.*)$/);
+        if (!match) {
+            return [{ label: '/', path: '/' }];
+        }
+        const drive = match[1].toUpperCase();
+        const crumbs = [
+            { label: `${drive}:`, path: `/${drive}:/` },
+        ];
+        let current = `/${drive}:/`;
+        for (const part of match[2].split('/').filter(Boolean)) {
+            current = `${current}${part}/`;
+            crumbs.push({ label: part, path: current.replace(/\/+$/, '') || `/${drive}:/` });
+        }
+        return crumbs;
+    }
+    remoteParentPath(p) {
+        if (this.isWindowsSftpPath(p)) {
+            const match = p.match(/^\/([A-Za-z]):\/?(.*)$/);
+            if (!match) {
+                return '/';
+            }
+            const drive = match[1].toUpperCase();
+            const parts = match[2].split('/').filter(Boolean);
+            if (!parts.length) {
+                return '/';
+            }
+            parts.pop();
+            return parts.length
+                ? `/${drive}:/${parts.join('/')}`
+                : `/${drive}:/`;
+        }
+        const next = path__WEBPACK_IMPORTED_MODULE_0__.posix.dirname(p);
+        return next === '.' ? '/' : next;
+    }
     loadRecentProfiles() {
         try {
             const rec = this.profilesService.getRecentProfiles?.();
@@ -2036,12 +2238,16 @@ let SftpManagerTabComponent = class SftpManagerTabComponent extends tabby_core__
         }
         super.destroy();
     }
-    // Prevent Tabby from restoring SFTP-UI tabs across restarts, since they rely
-    // on a live SSH session from a terminal tab.
-    // Typинги допускают RecoveryToken | null, нам достаточно всегда возвращать null.
+    // A custom recovery token ensures that a SplitTab wrapper won't become empty
+    // after restart. On recovery we restore a stub SFTP tab which immediately
+    // closes its `topmostParent` (the SplitTab wrapper).
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     async getRecoveryToken(_options) {
-        return null;
+        return {
+            type: _sftp_recovery_provider__WEBPACK_IMPORTED_MODULE_9__.SFTP_RECOVERY_TYPE,
+            version: 1,
+            state: {},
+        };
     }
     async confirmDelete() {
         if (!this.deleteConfirmVisible) {
@@ -2339,388 +2545,388 @@ __decorate([
 SftpManagerTabComponent = __decorate([
     (0,_angular_core__WEBPACK_IMPORTED_MODULE_5__.Component)({
         selector: 'tabby-sftp-manager-tab',
-        template: `
-    <div class="sftp-root" tabindex="0" (keydown)="onKeyDown($event)">
-      <div class="top-profiles" *ngIf="profile || recentProfiles.length">
-        <div class="current" *ngIf="profile">
-          <span class="label">Device:</span>
-          <span class="value">{{ getProfileLabel(profile) }}</span>
-        </div>
-        <div class="recent" *ngIf="recentProfiles.length">
-          <span class="label">Recent:</span>
-          <button
-            class="profile-chip"
-            *ngFor="let p of recentProfiles"
-            (click)="launchProfileFromSFTP(p)"
-          >
-            {{ getProfileLabel(p) }}
-          </button>
-        </div>
-      </div>
-      <div class="sftp-body">
-        <div class="pane">
-          <div class="pane-title">
-            <div class="pane-label">Local</div>
-            <div class="pane-path">
-              <input
-                [(ngModel)]="localPathInput"
-                (keyup.enter)="goToLocalPathInput()"
-              />
-            </div>
-            <div class="pane-actions">
-              <select class="path-preset" (change)="onLocalPresetChange($event.target.value)">
-                <option value="">Go to…</option>
-                <option *ngFor="let p of localPathPresets" [value]="p.id">
-                  {{ p.label }}
-                </option>
-              </select>
-              <button
-                class="fav-toggle"
-                [class.active]="isCurrentFavorite()"
-                (click)="toggleCurrentFavorite()"
-                title="Toggle favorite for this path"
-              >
-                ★
-              </button>
-              <select class="path-favorite" (change)="onLocalFavoriteSelect($event.target.value)">
-                <option value="">Favorites…</option>
-                <option *ngFor="let f of localFavorites" [value]="f.id">
-                  {{ f.label }}
-                </option>
-              </select>
-              <button (click)="localUp()" [disabled]="!canLocalUp()">Up</button>
-              <button (click)="goToLocalPathInput()">Go</button>
-              <button (click)="refreshLocal()">Refresh</button>
-            </div>
-          </div>
-          <div class="pane-filters">
-            <div class="breadcrumbs">
-              <ng-container *ngFor="let part of getLocalBreadcrumbs(); let i = index; let last = last">
-                <button
-                  class="crumb-button"
-                  (click)="navigateLocalBreadcrumb(i)"
-                  (contextmenu)="onLocalBreadcrumbContextMenu(i, $event)"
-                >
-                  {{ part.label }}
-                </button>
-                <span class="crumb-separator" *ngIf="!last">›</span>
-              </ng-container>
-            </div>
-            <input [(ngModel)]="localFilter" placeholder="Filter files..." />
-            <label class="show-hidden-toggle">
-              <input type="checkbox" [(ngModel)]="showHiddenLocal" />
-              <span>Show hidden</span>
-            </label>
-          </div>
-          <div class="pane-list"
-            (dragover)="onDragOver($event)"
-            (drop)="onDropOnLocal($event)"
-          >
-            <div class="entry header">
-              <span class="icon"></span>
-              <span class="name sortable" (click)="setLocalSort('name')">Name</span>
-              <span class="size sortable" (click)="setLocalSort('size')">Size</span>
-              <span class="date sortable" (click)="setLocalSort('modified')">Modified</span>
-            </div>
-            <div
-              class="entry"
-              *ngIf="canLocalUp()"
-              (dblclick)="localUp()"
-            >
-              <span class="icon">⬆</span>
-              <span class="name">Go up</span>
-              <span class="size"></span>
-              <span class="date"></span>
-            </div>
-            <div
-              class="entry"
-              *ngFor="let e of getFilteredLocalEntries()"
-              (click)="selectLocal(e, $event)"
-              (dblclick)="openLocal(e)"
-              (mousedown)="onLocalMouseDown(e, $event)"
-              (contextmenu)="onLocalContextMenu(e, $event)"
-              (dragover)="onLocalEntryDragOver(e, $event)"
-              (drop)="onLocalEntryDrop(e, $event)"
-              [class.drop-target]="localDropActive"
-              [class.selected]="isLocalSelected(e)"
-              [draggable]="true"
-              (dragstart)="onDragStartLocal($event, e)"
-            >
-              <span class="icon">{{ e.isDirectory ? '📁' : '📄' }}</span>
-              <span class="name">{{ e.name }}</span>
-              <span class="size">{{ getLocalSizeDisplay(e) }}</span>
-              <span class="date">{{ e.mtimeMs ? (e.mtimeMs | date:'yyyy-MM-dd HH:mm') : '' }}</span>
-            </div>
-          </div>
-          <div class="pane-actions-bar">
-            <div class="selection" *ngIf="selectedLocal.length">
-              Selected: {{ selectedLocal.length === 1 ? selectedLocal[0].name : (selectedLocal.length + ' items') }}
-            </div>
-            <div class="action-inputs">
-              <input [(ngModel)]="localActionName" placeholder="Name / new name" />
-              <input [(ngModel)]="localActionPerms" placeholder="Perms (e.g. 755)" />
-            </div>
-            <div class="action-buttons">
-              <button (click)="localRename()" [disabled]="selectedLocal.length !== 1">Rename</button>
-              <button (click)="refreshLocal()">Refresh</button>
-              <button (click)="localDelete()" [disabled]="!selectedLocal.length">Delete</button>
-              <button (click)="localNewFolder()">New Folder</button>
-              <button (click)="localEditPermissions()" [disabled]="selectedLocal.length !== 1 || !localActionPerms">Edit Permissions</button>
-              <button (click)="localShowSize()" [disabled]="selectedLocal.length !== 1 || !selectedLocal[0].isDirectory">Show Size</button>
-            </div>
-          </div>
-        </div>
-
-        <div class="pane">
-          <div class="pane-title">
-            <div class="pane-label">
-              Remote
-              <span *ngIf="connected && profile?.options?.host" class="pane-sub">
-                — {{ profile.options.host }}
-              </span>
-            </div>
-            <div class="pane-path">
-              <input
-                [(ngModel)]="remotePathInput"
-                (keyup.enter)="goToRemotePathInput()"
-                [disabled]="!connected"
-              />
-            </div>
-            <div class="pane-actions">
-              <button (click)="remoteUp()" [disabled]="!connected || remotePath === '/'">Up</button>
-              <button (click)="goToRemotePathInput()" [disabled]="!connected">Go</button>
-              <button (click)="refreshRemote()" [disabled]="!connected">Refresh</button>
-            </div>
-          </div>
-          <div class="pane-filters">
-            <div class="breadcrumbs" *ngIf="connected">
-              <ng-container *ngFor="let part of getRemoteBreadcrumbs(); let i = index; let last = last">
-                <button
-                  class="crumb-button"
-                  (click)="navigateRemoteBreadcrumb(i)"
-                >
-                  {{ part.label }}
-                </button>
-                <span class="crumb-separator" *ngIf="!last">›</span>
-              </ng-container>
-            </div>
-            <input [(ngModel)]="remoteFilter" placeholder="Filter files..." />
-            <label class="show-hidden-toggle">
-              <input type="checkbox" [(ngModel)]="showHiddenRemote" />
-              <span>Show hidden</span>
-            </label>
-          </div>
-          <div class="pane-list"
-            (dragover)="onDragOver($event)"
-            (drop)="onDropOnRemote($event)"
-          >
-            <div class="entry dim" *ngIf="!connected">
-              <span class="name">Not connected</span>
-            </div>
-            <div class="entry header" *ngIf="connected">
-              <span class="icon"></span>
-              <span class="name sortable" (click)="setRemoteSort('name')">Name</span>
-              <span class="size sortable" (click)="setRemoteSort('size')">Size</span>
-              <span class="date sortable" (click)="setRemoteSort('modified')">Modified</span>
-            </div>
-            <div
-              class="entry"
-              *ngIf="connected && remotePath !== '/'"
-              (dblclick)="remoteUp()"
-            >
-              <span class="icon">⬆</span>
-              <span class="name">Go up</span>
-              <span class="size"></span>
-              <span class="date"></span>
-            </div>
-            <div
-              class="entry"
-              *ngFor="let e of getFilteredRemoteEntries()"
-              (click)="selectRemote(e, $event)"
-              (dblclick)="openRemote(e)"
-              (mousedown)="onRemoteMouseDown(e, $event)"
-              (contextmenu)="onRemoteContextMenu(e, $event)"
-              (dragover)="onRemoteEntryDragOver(e, $event)"
-              (drop)="onRemoteEntryDrop(e, $event)"
-              [class.drop-target]="remoteDropActive"
-              [class.selected]="isRemoteSelected(e)"
-              [draggable]="connected"
-              (dragstart)="onDragStartRemote($event, e)"
-            >
-              <span class="icon">{{ e.isDirectory ? '📁' : '📄' }}</span>
-              <span class="name">{{ e.name }}</span>
-              <span class="size">{{ getRemoteSizeDisplay(e) }}</span>
-              <span class="date">{{ e.modified | date:'yyyy-MM-dd HH:mm' }}</span>
-            </div>
-          </div>
-          <div class="pane-actions-bar">
-            <div class="selection" *ngIf="selectedRemote.length">
-              Selected: {{ selectedRemote.length === 1 ? selectedRemote[0].name : (selectedRemote.length + ' items') }}
-            </div>
-            <div class="action-inputs">
-              <input [(ngModel)]="remoteActionName" placeholder="Name / new name" />
-              <input [(ngModel)]="remoteActionPerms" placeholder="Perms (e.g. 755)" />
-            </div>
-            <div class="action-buttons">
-              <button (click)="remoteRename()" [disabled]="selectedRemote.length !== 1">Rename</button>
-              <button (click)="refreshRemote()" [disabled]="!connected">Refresh</button>
-              <button (click)="remoteDelete()" [disabled]="!selectedRemote.length">Delete</button>
-              <button (click)="remoteNewFolder()" [disabled]="!connected">New Folder</button>
-              <button (click)="remoteEditPermissions()" [disabled]="selectedRemote.length !== 1 || !remoteActionPerms">Edit Permissions</button>
-              <button (click)="remoteShowSize()" [disabled]="selectedRemote.length !== 1 || !selectedRemote[0].isDirectory">Show Size</button>
-              <button (click)="remoteDownload()" [disabled]="!selectedRemote.length">Download</button>
-            </div>
-          </div>
-        </div>
-      </div>
-      <div class="sftp-transfers" *ngIf="transfers.length">
-        <div class="transfer" *ngFor="let t of transfers">
-          <div class="transfer-main">
-            <div class="transfer-title">
-              <span class="direction">{{ t.direction === 'upload' ? 'Upload' : 'Download' }}</span>
-              <span class="name">{{ t.name }}</span>
-            </div>
-            <div class="transfer-path">
-              <span class="label">Remote:</span>
-              <span class="value">{{ t.remotePath }}</span>
-            </div>
-            <div class="transfer-path">
-              <span class="label">Local:</span>
-              <span class="value">{{ t.localPath }}</span>
-            </div>
-            <div class="bar">
-              <div class="fill" [style.width.%]="getTransferProgress(t.transfer)"></div>
-            </div>
-          </div>
-          <div class="transfer-stats">
-            <div class="percent">{{ getTransferProgress(t.transfer) | number:'1.0-0' }}%</div>
-            <div class="speed">{{ formatSpeed(t.transfer.getSpeed()) }}</div>
-            <button class="btn-cancel" (click)="cancelTransfer(t)" [disabled]="t.transfer.isComplete() || t.transfer.isCancelled()">Cancel</button>
-          </div>
-        </div>
-      </div>
-
-      <div class="delete-overlay" *ngIf="deleteConfirmVisible">
-        <div class="delete-dialog">
-          <div class="delete-text">{{ deleteConfirmText }}</div>
-          <div class="delete-buttons">
-            <button class="danger" (click)="confirmDelete()">Delete</button>
-            <button (click)="cancelDelete()">Cancel</button>
-          </div>
-        </div>
-      </div>
-
-      <div class="delete-overlay" *ngIf="replaceConfirmVisible">
-        <div class="delete-dialog">
-          <div class="delete-text">{{ replaceConfirmText }}</div>
-          <div class="delete-buttons">
-            <button class="danger" (click)="confirmReplace()">Replace</button>
-            <button (click)="cancelReplace()">Cancel</button>
-          </div>
-        </div>
-      </div>
-
-      <div class="delete-overlay" *ngIf="inputDialogVisible">
-        <div class="delete-dialog" (click)="$event.stopPropagation()">
-          <div class="delete-text">{{ inputDialogTitle }}</div>
-          <input
-            class="dialog-input"
-            [(ngModel)]="inputDialogValue"
-            [placeholder]="inputDialogPlaceholder"
-            (keyup.enter)="confirmInputDialog()"
-          />
-          <div class="delete-buttons">
-            <button class="danger" (click)="confirmInputDialog()" [disabled]="!inputDialogValue.trim()">OK</button>
-            <button (click)="cancelInputDialog()">Cancel</button>
-          </div>
-        </div>
-      </div>
-
-      <div
-        class="local-menu"
-        *ngIf="localMenuVisible"
-        [style.left.px]="localMenuX"
-        [style.top.px]="localMenuY"
-        (click)="$event.stopPropagation()"
-      >
-        <div class="local-menu-item" *ngFor="let item of localMenuItems" (click)="onLocalMenuItemClick(item)">
-          {{ item.label }}
-        </div>
-      </div>
-    </div>
+        template: `
+    <div class="sftp-root" tabindex="0" (keydown)="onKeyDown($event)">
+      <div class="top-profiles" *ngIf="profile || recentProfiles.length">
+        <div class="current" *ngIf="profile">
+          <span class="label">Device:</span>
+          <span class="value">{{ getProfileLabel(profile) }}</span>
+        </div>
+        <div class="recent" *ngIf="recentProfiles.length">
+          <span class="label">Recent:</span>
+          <button
+            class="profile-chip"
+            *ngFor="let p of recentProfiles"
+            (click)="launchProfileFromSFTP(p)"
+          >
+            {{ getProfileLabel(p) }}
+          </button>
+        </div>
+      </div>
+      <div class="sftp-body">
+        <div class="pane">
+          <div class="pane-title">
+            <div class="pane-label">Local</div>
+            <div class="pane-path">
+              <input
+                [(ngModel)]="localPathInput"
+                (keyup.enter)="goToLocalPathInput()"
+              />
+            </div>
+            <div class="pane-actions">
+              <select class="path-preset" (change)="onLocalPresetChange($event.target.value)">
+                <option value="">Go to…</option>
+                <option *ngFor="let p of localPathPresets" [value]="p.id">
+                  {{ p.label }}
+                </option>
+              </select>
+              <button
+                class="fav-toggle"
+                [class.active]="isCurrentFavorite()"
+                (click)="toggleCurrentFavorite()"
+                title="Toggle favorite for this path"
+              >
+                ★
+              </button>
+              <select class="path-favorite" (change)="onLocalFavoriteSelect($event.target.value)">
+                <option value="">Favorites…</option>
+                <option *ngFor="let f of localFavorites" [value]="f.id">
+                  {{ f.label }}
+                </option>
+              </select>
+              <button (click)="localUp()" [disabled]="!canLocalUp()">Up</button>
+              <button (click)="goToLocalPathInput()">Go</button>
+              <button (click)="refreshLocal()">Refresh</button>
+            </div>
+          </div>
+          <div class="pane-filters">
+            <div class="breadcrumbs">
+              <ng-container *ngFor="let part of getLocalBreadcrumbs(); let i = index; let last = last">
+                <button
+                  class="crumb-button"
+                  (click)="navigateLocalBreadcrumb(i)"
+                  (contextmenu)="onLocalBreadcrumbContextMenu(i, $event)"
+                >
+                  {{ part.label }}
+                </button>
+                <span class="crumb-separator" *ngIf="!last">›</span>
+              </ng-container>
+            </div>
+            <input [(ngModel)]="localFilter" placeholder="Filter files..." />
+            <label class="show-hidden-toggle">
+              <input type="checkbox" [(ngModel)]="showHiddenLocal" />
+              <span>Show hidden</span>
+            </label>
+          </div>
+          <div class="pane-list"
+            (dragover)="onDragOver($event)"
+            (drop)="onDropOnLocal($event)"
+          >
+            <div class="entry header">
+              <span class="icon"></span>
+              <span class="name sortable" (click)="setLocalSort('name')">Name</span>
+              <span class="size sortable" (click)="setLocalSort('size')">Size</span>
+              <span class="date sortable" (click)="setLocalSort('modified')">Modified</span>
+            </div>
+            <div
+              class="entry"
+              *ngIf="canLocalUp()"
+              (dblclick)="localUp()"
+            >
+              <span class="icon">⬆</span>
+              <span class="name">Go up</span>
+              <span class="size"></span>
+              <span class="date"></span>
+            </div>
+            <div
+              class="entry"
+              *ngFor="let e of getFilteredLocalEntries()"
+              (click)="selectLocal(e, $event)"
+              (dblclick)="openLocal(e)"
+              (mousedown)="onLocalMouseDown(e, $event)"
+              (contextmenu)="onLocalContextMenu(e, $event)"
+              (dragover)="onLocalEntryDragOver(e, $event)"
+              (drop)="onLocalEntryDrop(e, $event)"
+              [class.drop-target]="localDropActive"
+              [class.selected]="isLocalSelected(e)"
+              [draggable]="true"
+              (dragstart)="onDragStartLocal($event, e)"
+            >
+              <span class="icon">{{ e.isDirectory ? '📁' : '📄' }}</span>
+              <span class="name">{{ e.name }}</span>
+              <span class="size">{{ getLocalSizeDisplay(e) }}</span>
+              <span class="date">{{ e.mtimeMs ? (e.mtimeMs | date:'yyyy-MM-dd HH:mm') : '' }}</span>
+            </div>
+          </div>
+          <div class="pane-actions-bar">
+            <div class="selection" *ngIf="selectedLocal.length">
+              Selected: {{ selectedLocal.length === 1 ? selectedLocal[0].name : (selectedLocal.length + ' items') }}
+            </div>
+            <div class="action-inputs">
+              <input [(ngModel)]="localActionName" placeholder="Name / new name" />
+              <input [(ngModel)]="localActionPerms" placeholder="Perms (e.g. 755)" />
+            </div>
+            <div class="action-buttons">
+              <button (click)="localRename()" [disabled]="selectedLocal.length !== 1">Rename</button>
+              <button (click)="refreshLocal()">Refresh</button>
+              <button (click)="localDelete()" [disabled]="!selectedLocal.length">Delete</button>
+              <button (click)="localNewFolder()">New Folder</button>
+              <button (click)="localEditPermissions()" [disabled]="selectedLocal.length !== 1 || !localActionPerms">Edit Permissions</button>
+              <button (click)="localShowSize()" [disabled]="selectedLocal.length !== 1 || !selectedLocal[0].isDirectory">Show Size</button>
+            </div>
+          </div>
+        </div>
+
+        <div class="pane">
+          <div class="pane-title">
+            <div class="pane-label">
+              Remote
+              <span *ngIf="connected && profile?.options?.host" class="pane-sub">
+                — {{ profile.options.host }}
+              </span>
+            </div>
+            <div class="pane-path">
+              <input
+                [(ngModel)]="remotePathInput"
+                (keyup.enter)="goToRemotePathInput()"
+                [disabled]="!connected"
+              />
+            </div>
+            <div class="pane-actions">
+              <button (click)="remoteUp()" [disabled]="!connected || !canRemoteUp()">Up</button>
+              <button (click)="goToRemotePathInput()" [disabled]="!connected">Go</button>
+              <button (click)="refreshRemote()" [disabled]="!connected">Refresh</button>
+            </div>
+          </div>
+          <div class="pane-filters">
+            <div class="breadcrumbs" *ngIf="connected">
+              <ng-container *ngFor="let part of getRemoteBreadcrumbs(); let i = index; let last = last">
+                <button
+                  class="crumb-button"
+                  (click)="navigateRemoteBreadcrumb(i)"
+                >
+                  {{ part.label }}
+                </button>
+                <span class="crumb-separator" *ngIf="!last">›</span>
+              </ng-container>
+            </div>
+            <input [(ngModel)]="remoteFilter" placeholder="Filter files..." />
+            <label class="show-hidden-toggle">
+              <input type="checkbox" [(ngModel)]="showHiddenRemote" />
+              <span>Show hidden</span>
+            </label>
+          </div>
+          <div class="pane-list"
+            (dragover)="onDragOver($event)"
+            (drop)="onDropOnRemote($event)"
+          >
+            <div class="entry dim" *ngIf="!connected">
+              <span class="name">Not connected</span>
+            </div>
+            <div class="entry header" *ngIf="connected">
+              <span class="icon"></span>
+              <span class="name sortable" (click)="setRemoteSort('name')">Name</span>
+              <span class="size sortable" (click)="setRemoteSort('size')">Size</span>
+              <span class="date sortable" (click)="setRemoteSort('modified')">Modified</span>
+            </div>
+            <div
+              class="entry"
+              *ngIf="connected && canRemoteUp()"
+              (dblclick)="remoteUp()"
+            >
+              <span class="icon">⬆</span>
+              <span class="name">Go up</span>
+              <span class="size"></span>
+              <span class="date"></span>
+            </div>
+            <div
+              class="entry"
+              *ngFor="let e of getFilteredRemoteEntries()"
+              (click)="selectRemote(e, $event)"
+              (dblclick)="openRemote(e)"
+              (mousedown)="onRemoteMouseDown(e, $event)"
+              (contextmenu)="onRemoteContextMenu(e, $event)"
+              (dragover)="onRemoteEntryDragOver(e, $event)"
+              (drop)="onRemoteEntryDrop(e, $event)"
+              [class.drop-target]="remoteDropActive"
+              [class.selected]="isRemoteSelected(e)"
+              [draggable]="connected"
+              (dragstart)="onDragStartRemote($event, e)"
+            >
+              <span class="icon">{{ e.isDirectory ? '📁' : '📄' }}</span>
+              <span class="name">{{ e.name }}</span>
+              <span class="size">{{ getRemoteSizeDisplay(e) }}</span>
+              <span class="date">{{ e.modified | date:'yyyy-MM-dd HH:mm' }}</span>
+            </div>
+          </div>
+          <div class="pane-actions-bar">
+            <div class="selection" *ngIf="selectedRemote.length">
+              Selected: {{ selectedRemote.length === 1 ? selectedRemote[0].name : (selectedRemote.length + ' items') }}
+            </div>
+            <div class="action-inputs">
+              <input [(ngModel)]="remoteActionName" placeholder="Name / new name" />
+              <input [(ngModel)]="remoteActionPerms" placeholder="Perms (e.g. 755)" />
+            </div>
+            <div class="action-buttons">
+              <button (click)="remoteRename()" [disabled]="selectedRemote.length !== 1">Rename</button>
+              <button (click)="refreshRemote()" [disabled]="!connected">Refresh</button>
+              <button (click)="remoteDelete()" [disabled]="!selectedRemote.length">Delete</button>
+              <button (click)="remoteNewFolder()" [disabled]="!connected">New Folder</button>
+              <button (click)="remoteEditPermissions()" [disabled]="selectedRemote.length !== 1 || !remoteActionPerms">Edit Permissions</button>
+              <button (click)="remoteShowSize()" [disabled]="selectedRemote.length !== 1 || !selectedRemote[0].isDirectory">Show Size</button>
+              <button (click)="remoteDownload()" [disabled]="!selectedRemote.length">Download</button>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="sftp-transfers" *ngIf="transfers.length">
+        <div class="transfer" *ngFor="let t of transfers">
+          <div class="transfer-main">
+            <div class="transfer-title">
+              <span class="direction">{{ t.direction === 'upload' ? 'Upload' : 'Download' }}</span>
+              <span class="name">{{ t.name }}</span>
+            </div>
+            <div class="transfer-path">
+              <span class="label">Remote:</span>
+              <span class="value">{{ t.remotePath }}</span>
+            </div>
+            <div class="transfer-path">
+              <span class="label">Local:</span>
+              <span class="value">{{ t.localPath }}</span>
+            </div>
+            <div class="bar">
+              <div class="fill" [style.width.%]="getTransferProgress(t.transfer)"></div>
+            </div>
+          </div>
+          <div class="transfer-stats">
+            <div class="percent">{{ getTransferProgress(t.transfer) | number:'1.0-0' }}%</div>
+            <div class="speed">{{ formatSpeed(t.transfer.getSpeed()) }}</div>
+            <button class="btn-cancel" (click)="cancelTransfer(t)" [disabled]="t.transfer.isComplete() || t.transfer.isCancelled()">Cancel</button>
+          </div>
+        </div>
+      </div>
+
+      <div class="delete-overlay" *ngIf="deleteConfirmVisible">
+        <div class="delete-dialog">
+          <div class="delete-text">{{ deleteConfirmText }}</div>
+          <div class="delete-buttons">
+            <button class="danger" (click)="confirmDelete()">Delete</button>
+            <button (click)="cancelDelete()">Cancel</button>
+          </div>
+        </div>
+      </div>
+
+      <div class="delete-overlay" *ngIf="replaceConfirmVisible">
+        <div class="delete-dialog">
+          <div class="delete-text">{{ replaceConfirmText }}</div>
+          <div class="delete-buttons">
+            <button class="danger" (click)="confirmReplace()">Replace</button>
+            <button (click)="cancelReplace()">Cancel</button>
+          </div>
+        </div>
+      </div>
+
+      <div class="delete-overlay" *ngIf="inputDialogVisible">
+        <div class="delete-dialog" (click)="$event.stopPropagation()">
+          <div class="delete-text">{{ inputDialogTitle }}</div>
+          <input
+            class="dialog-input"
+            [(ngModel)]="inputDialogValue"
+            [placeholder]="inputDialogPlaceholder"
+            (keyup.enter)="confirmInputDialog()"
+          />
+          <div class="delete-buttons">
+            <button class="danger" (click)="confirmInputDialog()" [disabled]="!inputDialogValue.trim()">OK</button>
+            <button (click)="cancelInputDialog()">Cancel</button>
+          </div>
+        </div>
+      </div>
+
+      <div
+        class="local-menu"
+        *ngIf="localMenuVisible"
+        [style.left.px]="localMenuX"
+        [style.top.px]="localMenuY"
+        (click)="$event.stopPropagation()"
+      >
+        <div class="local-menu-item" *ngFor="let item of localMenuItems" (click)="onLocalMenuItemClick(item)">
+          {{ item.label }}
+        </div>
+      </div>
+    </div>
   `,
-        styles: [`
-    .sftp-root { display: flex; flex-direction: column; height: 100%; padding: 10px; gap: 10px; position: relative; }
-    button { padding: 6px 10px; border-radius: 6px; border: 1px solid rgba(255,255,255,0.15); background: rgba(255,255,255,0.06); color: inherit; cursor: pointer; }
-    button:disabled { opacity: 0.5; cursor: default; }
-    .top-profiles { display: flex; justify-content: space-between; align-items: center; padding: 4px 8px 8px; gap: 12px; font-size: 11px; opacity: 0.9; }
-    .top-profiles .current .label,
-    .top-profiles .recent .label { text-transform: uppercase; letter-spacing: 0.05em; opacity: 0.7; margin-right: 4px; }
-    .top-profiles .value { font-weight: 600; }
-    .top-profiles .profile-chip { padding: 2px 8px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.18); background: rgba(255,255,255,0.04); color: inherit; cursor: pointer; font-size: 11px; }
-    .top-profiles .profile-chip:hover { background: rgba(255,255,255,0.12); }
-    .sftp-body { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; flex: 1; min-height: 0; }
-    .pane { display: flex; flex-direction: column; border: 1px solid rgba(255,255,255,0.12); border-radius: 10px; overflow: hidden; min-height: 0; }
-    .pane-title { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 8px 10px; background: rgba(255,255,255,0.04); border-bottom: 1px solid rgba(255,255,255,0.08); }
-    .pane-label { font-weight: 600; display: flex; align-items: baseline; gap: 6px; }
-    .pane-sub { font-weight: 400; font-size: 11px; opacity: 0.75; }
-    .pane-path { opacity: 0.8; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-    .pane-path input { width: 100%; padding: 4px 6px; border-radius: 4px; border: 1px solid rgba(255,255,255,0.18); background: rgba(0,0,0,0.3); color: inherit; font-family: inherit; font-size: 12px; }
-    .pane-actions { display: flex; gap: 8px; align-items: center; }
-    .pane-actions .path-preset,
-    .pane-actions .path-favorite { max-width: 150px; padding: 3px 6px; border-radius: 4px; border: 1px solid rgba(255,255,255,0.22); background: rgba(20,20,20,0.95); color: inherit; font-size: 11px; }
-    .pane-actions .path-preset option { background: #151515; color: #f5f5f5; }
-    .pane-actions .path-favorite option { background: #151515; color: #f5f5f5; }
-    .pane-actions .fav-toggle { padding: 2px 6px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.25); background: rgba(255,255,255,0.05); font-size: 11px; line-height: 1; }
-    .pane-actions .fav-toggle.active { background: rgba(255,215,0,0.2); border-color: rgba(255,215,0,0.6); color: #ffd700; }
-    .pane-filters { display: flex; align-items: center; gap: 8px; padding: 4px 8px; border-bottom: 1px solid rgba(255,255,255,0.06); background: rgba(0,0,0,0.12); }
-    .pane-filters input { flex: 1; padding: 4px 6px; border-radius: 4px; border: 1px solid rgba(255,255,255,0.18); background: rgba(0,0,0,0.3); color: inherit; font-size: 12px; }
-    .show-hidden-toggle { display: flex; align-items: center; gap: 4px; font-size: 11px; opacity: 0.8; white-space: nowrap; }
-    .show-hidden-toggle input[type="checkbox"] { margin: 0; }
-    .breadcrumbs { display: flex; flex-wrap: wrap; gap: 4px; font-size: 11px; opacity: 0.9; align-items: center; }
-    .crumb-button { padding: 2px 6px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.18); background: rgba(255,255,255,0.04); color: inherit; cursor: pointer; font-size: 11px; }
-    .crumb-button:hover { background: rgba(255,255,255,0.10); }
-    .crumb-separator { opacity: 0.6; }
-    .pane-list { flex: 1; overflow: auto; padding: 4px; }
-    .entry { display: grid; grid-template-columns: 24px minmax(0, 1.5fr) 80px 140px; gap: 8px; padding: 6px 8px; border-radius: 8px; user-select: none; align-items: center; }
-    .entry:hover { background: rgba(255,255,255,0.06); }
-    .entry.drop-target { outline: 1px dashed rgba(255,255,255,0.35); background: rgba(80, 160, 255, 0.10); }
-    .entry.dim { opacity: 0.7; }
-    .icon { text-align: center; opacity: 0.85; }
-    .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-    .size { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; text-align: right; opacity: 0.8; }
-    .date { font-size: 11px; opacity: 0.75; text-align: right; white-space: nowrap; }
-    .entry.header { font-weight: 600; opacity: 0.9; background: rgba(255,255,255,0.02); }
-    .sortable { cursor: pointer; }
-    .entry.selected { background: rgba(80,160,255,0.18); }
-    .pane-actions-bar { display: flex; flex-direction: column; gap: 4px; padding: 6px 8px; border-top: 1px solid rgba(255,255,255,0.06); background: rgba(0,0,0,0.18); }
-    .pane-actions-bar .selection { font-size: 11px; opacity: 0.85; }
-    .pane-actions-bar .action-inputs { display: flex; gap: 6px; }
-    .pane-actions-bar .action-inputs input { flex: 1; padding: 3px 6px; border-radius: 4px; border: 1px solid rgba(255,255,255,0.18); background: rgba(0,0,0,0.3); color: inherit; font-size: 11px; }
-    .pane-actions-bar .action-buttons { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
-    .sftp-transfers { margin-top: 8px; display: flex; flex-direction: column; gap: 6px; max-height: 120px; overflow-y: auto; }
-    .transfer { display: grid; grid-template-columns: 1fr auto; gap: 8px; padding: 6px 8px; border-radius: 8px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); font-size: 11px; }
-    .transfer-title { display: flex; gap: 6px; align-items: baseline; margin-bottom: 2px; }
-    .transfer-title .direction { text-transform: uppercase; letter-spacing: 0.04em; opacity: 0.7; font-weight: 600; font-size: 10px; }
-    .transfer-title .name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
-    .transfer-path { display: flex; gap: 4px; opacity: 0.75; }
-    .transfer-path .label { min-width: 48px; }
-    .transfer-path .value { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
-    .bar { position: relative; height: 4px; border-radius: 999px; background: rgba(255,255,255,0.07); margin-top: 4px; overflow: hidden; }
-    .bar .fill { position: absolute; left: 0; top: 0; bottom: 0; border-radius: inherit; background: linear-gradient(90deg, #4dabff, #78ffce); transition: width 0.15s linear; }
-    .transfer-stats { display: flex; flex-direction: column; justify-content: center; align-items: flex-end; gap: 4px; opacity: 0.8; }
-    .transfer-stats .percent { font-weight: 600; }
-    .transfer-stats .speed { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
-    .btn-cancel { padding: 2px 6px; font-size: 10px; border-radius: 999px; }
-    .delete-overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.55); display: flex; align-items: center; justify-content: center; z-index: 20; }
-    .delete-dialog { min-width: 260px; max-width: 360px; padding: 14px 16px; border-radius: 10px; background: rgba(20,20,20,0.96); border: 1px solid rgba(255,255,255,0.15); box-shadow: 0 18px 45px rgba(0,0,0,0.75); display: flex; flex-direction: column; gap: 10px; }
-    .delete-text { font-size: 13px; }
-    .dialog-input { width: 100%; padding: 8px 10px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.18); background: rgba(0,0,0,0.3); color: inherit; font-size: 13px; }
-    .delete-buttons { display: flex; justify-content: flex-end; gap: 8px; }
-    .delete-buttons .danger { background: rgba(255,80,80,0.85); border-color: rgba(255,120,120,0.85); }
-    .local-menu { position: absolute; min-width: 180px; max-width: 260px; max-height: 260px; overflow-y: auto; padding: 4px 0; border-radius: 10px; background: rgba(18,18,22,0.98); border: 1px solid rgba(255,255,255,0.16); box-shadow: 0 18px 45px rgba(0,0,0,0.8); z-index: 30; backdrop-filter: blur(12px); }
-    .local-menu-item { padding: 6px 12px; font-size: 12px; cursor: pointer; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
-    .local-menu-item:hover { background: linear-gradient(90deg, rgba(120,200,255,0.24), rgba(120,255,206,0.15)); }
+        styles: [`
+    .sftp-root { display: flex; flex-direction: column; height: 100%; padding: 10px; gap: 10px; position: relative; }
+    button { padding: 6px 10px; border-radius: 6px; border: 1px solid rgba(255,255,255,0.15); background: rgba(255,255,255,0.06); color: inherit; cursor: pointer; }
+    button:disabled { opacity: 0.5; cursor: default; }
+    .top-profiles { display: flex; justify-content: space-between; align-items: center; padding: 4px 8px 8px; gap: 12px; font-size: 11px; opacity: 0.9; }
+    .top-profiles .current .label,
+    .top-profiles .recent .label { text-transform: uppercase; letter-spacing: 0.05em; opacity: 0.7; margin-right: 4px; }
+    .top-profiles .value { font-weight: 600; }
+    .top-profiles .profile-chip { padding: 2px 8px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.18); background: rgba(255,255,255,0.04); color: inherit; cursor: pointer; font-size: 11px; }
+    .top-profiles .profile-chip:hover { background: rgba(255,255,255,0.12); }
+    .sftp-body { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; flex: 1; min-height: 0; }
+    .pane { display: flex; flex-direction: column; border: 1px solid rgba(255,255,255,0.12); border-radius: 10px; overflow: hidden; min-height: 0; }
+    .pane-title { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 10px; padding: 8px 10px; background: rgba(255,255,255,0.04); border-bottom: 1px solid rgba(255,255,255,0.08); }
+    .pane-label { font-weight: 600; display: flex; align-items: baseline; gap: 6px; }
+    .pane-sub { font-weight: 400; font-size: 11px; opacity: 0.75; }
+    .pane-path { opacity: 0.8; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+    .pane-path input { width: 100%; padding: 4px 6px; border-radius: 4px; border: 1px solid rgba(255,255,255,0.18); background: rgba(0,0,0,0.3); color: inherit; font-family: inherit; font-size: 12px; }
+    .pane-actions { display: flex; gap: 8px; align-items: center; }
+    .pane-actions .path-preset,
+    .pane-actions .path-favorite { max-width: 150px; padding: 3px 6px; border-radius: 4px; border: 1px solid rgba(255,255,255,0.22); background: rgba(20,20,20,0.95); color: inherit; font-size: 11px; }
+    .pane-actions .path-preset option { background: #151515; color: #f5f5f5; }
+    .pane-actions .path-favorite option { background: #151515; color: #f5f5f5; }
+    .pane-actions .fav-toggle { padding: 2px 6px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.25); background: rgba(255,255,255,0.05); font-size: 11px; line-height: 1; }
+    .pane-actions .fav-toggle.active { background: rgba(255,215,0,0.2); border-color: rgba(255,215,0,0.6); color: #ffd700; }
+    .pane-filters { display: flex; align-items: center; gap: 8px; padding: 4px 8px; border-bottom: 1px solid rgba(255,255,255,0.06); background: rgba(0,0,0,0.12); }
+    .pane-filters input { flex: 1; padding: 4px 6px; border-radius: 4px; border: 1px solid rgba(255,255,255,0.18); background: rgba(0,0,0,0.3); color: inherit; font-size: 12px; }
+    .show-hidden-toggle { display: flex; align-items: center; gap: 4px; font-size: 11px; opacity: 0.8; white-space: nowrap; }
+    .show-hidden-toggle input[type="checkbox"] { margin: 0; }
+    .breadcrumbs { display: flex; flex-wrap: wrap; gap: 4px; font-size: 11px; opacity: 0.9; align-items: center; }
+    .crumb-button { padding: 2px 6px; border-radius: 999px; border: 1px solid rgba(255,255,255,0.18); background: rgba(255,255,255,0.04); color: inherit; cursor: pointer; font-size: 11px; }
+    .crumb-button:hover { background: rgba(255,255,255,0.10); }
+    .crumb-separator { opacity: 0.6; }
+    .pane-list { flex: 1; overflow: auto; padding: 4px; }
+    .entry { display: grid; grid-template-columns: 24px minmax(0, 1.5fr) 80px 140px; gap: 8px; padding: 6px 8px; border-radius: 8px; user-select: none; align-items: center; }
+    .entry:hover { background: rgba(255,255,255,0.06); }
+    .entry.drop-target { outline: 1px dashed rgba(255,255,255,0.35); background: rgba(80, 160, 255, 0.10); }
+    .entry.dim { opacity: 0.7; }
+    .icon { text-align: center; opacity: 0.85; }
+    .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+    .size { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; text-align: right; opacity: 0.8; }
+    .date { font-size: 11px; opacity: 0.75; text-align: right; white-space: nowrap; }
+    .entry.header { font-weight: 600; opacity: 0.9; background: rgba(255,255,255,0.02); }
+    .sortable { cursor: pointer; }
+    .entry.selected { background: rgba(80,160,255,0.18); }
+    .pane-actions-bar { display: flex; flex-direction: column; gap: 4px; padding: 6px 8px; border-top: 1px solid rgba(255,255,255,0.06); background: rgba(0,0,0,0.18); }
+    .pane-actions-bar .selection { font-size: 11px; opacity: 0.85; }
+    .pane-actions-bar .action-inputs { display: flex; gap: 6px; }
+    .pane-actions-bar .action-inputs input { flex: 1; padding: 3px 6px; border-radius: 4px; border: 1px solid rgba(255,255,255,0.18); background: rgba(0,0,0,0.3); color: inherit; font-size: 11px; }
+    .pane-actions-bar .action-buttons { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
+    .sftp-transfers { margin-top: 8px; display: flex; flex-direction: column; gap: 6px; max-height: 120px; overflow-y: auto; }
+    .transfer { display: grid; grid-template-columns: 1fr auto; gap: 8px; padding: 6px 8px; border-radius: 8px; background: rgba(255,255,255,0.04); border: 1px solid rgba(255,255,255,0.08); font-size: 11px; }
+    .transfer-title { display: flex; gap: 6px; align-items: baseline; margin-bottom: 2px; }
+    .transfer-title .direction { text-transform: uppercase; letter-spacing: 0.04em; opacity: 0.7; font-weight: 600; font-size: 10px; }
+    .transfer-title .name { font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+    .transfer-path { display: flex; gap: 4px; opacity: 0.75; }
+    .transfer-path .label { min-width: 48px; }
+    .transfer-path .value { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
+    .bar { position: relative; height: 4px; border-radius: 999px; background: rgba(255,255,255,0.07); margin-top: 4px; overflow: hidden; }
+    .bar .fill { position: absolute; left: 0; top: 0; bottom: 0; border-radius: inherit; background: linear-gradient(90deg, #4dabff, #78ffce); transition: width 0.15s linear; }
+    .transfer-stats { display: flex; flex-direction: column; justify-content: center; align-items: flex-end; gap: 4px; opacity: 0.8; }
+    .transfer-stats .percent { font-weight: 600; }
+    .transfer-stats .speed { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
+    .btn-cancel { padding: 2px 6px; font-size: 10px; border-radius: 999px; }
+    .delete-overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.55); display: flex; align-items: center; justify-content: center; z-index: 20; }
+    .delete-dialog { min-width: 260px; max-width: 360px; padding: 14px 16px; border-radius: 10px; background: rgba(20,20,20,0.96); border: 1px solid rgba(255,255,255,0.15); box-shadow: 0 18px 45px rgba(0,0,0,0.75); display: flex; flex-direction: column; gap: 10px; }
+    .delete-text { font-size: 13px; }
+    .dialog-input { width: 100%; padding: 8px 10px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.18); background: rgba(0,0,0,0.3); color: inherit; font-size: 13px; }
+    .delete-buttons { display: flex; justify-content: flex-end; gap: 8px; }
+    .delete-buttons .danger { background: rgba(255,80,80,0.85); border-color: rgba(255,120,120,0.85); }
+    .local-menu { position: absolute; min-width: 180px; max-width: 260px; max-height: 260px; overflow-y: auto; padding: 4px 0; border-radius: 10px; background: rgba(18,18,22,0.98); border: 1px solid rgba(255,255,255,0.16); box-shadow: 0 18px 45px rgba(0,0,0,0.8); z-index: 30; backdrop-filter: blur(12px); }
+    .local-menu-item { padding: 6px 12px; font-size: 12px; cursor: pointer; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
+    .local-menu-item:hover { background: linear-gradient(90deg, rgba(120,200,255,0.24), rgba(120,255,206,0.15)); }
   `],
     }),
     __metadata("design:paramtypes", [_angular_core__WEBPACK_IMPORTED_MODULE_5__.Injector,
@@ -2731,6 +2937,57 @@ SftpManagerTabComponent = __decorate([
 
 
 
+/***/ },
+
+/***/ "./src/sftp-recovery-provider.ts"
+/*!***************************************!*\
+  !*** ./src/sftp-recovery-provider.ts ***!
+  \***************************************/
+(__unused_webpack_module, __webpack_exports__, __webpack_require__) {
+
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   SFTP_RECOVERY_TYPE: () => (/* binding */ SFTP_RECOVERY_TYPE),
+/* harmony export */   SftpTabRecoveryProvider: () => (/* binding */ SftpTabRecoveryProvider)
+/* harmony export */ });
+/* harmony import */ var _angular_core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @angular/core */ "@angular/core");
+/* harmony import */ var _angular_core__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_angular_core__WEBPACK_IMPORTED_MODULE_0__);
+/* harmony import */ var tabby_core__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! tabby-core */ "tabby-core");
+/* harmony import */ var tabby_core__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(tabby_core__WEBPACK_IMPORTED_MODULE_1__);
+/* harmony import */ var _sftp_manager_tab_component__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./sftp-manager-tab.component */ "./src/sftp-manager-tab.component.ts");
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+
+
+
+const SFTP_RECOVERY_TYPE = 'tabby-sftp-ui:sftp-tab';
+let SftpTabRecoveryProvider = class SftpTabRecoveryProvider extends tabby_core__WEBPACK_IMPORTED_MODULE_1__.TabRecoveryProvider {
+    async applicableTo(recoveryToken) {
+        return recoveryToken?.type === SFTP_RECOVERY_TYPE;
+    }
+    async recover(_recoveryToken) {
+        // Restore a stub tab that immediately closes itself and its SplitTab wrapper.
+        return {
+            type: _sftp_manager_tab_component__WEBPACK_IMPORTED_MODULE_2__.SftpManagerTabComponent,
+            inputs: {
+                sshSession: null,
+                profile: null,
+                recoveredStub: true,
+            },
+        };
+    }
+};
+SftpTabRecoveryProvider = __decorate([
+    (0,_angular_core__WEBPACK_IMPORTED_MODULE_0__.Injectable)()
+], SftpTabRecoveryProvider);
+
+
+
+
 /***/ },
 
 /***/ "./src/sftp-terminal-decorator.ts"
@@ -2768,7 +3025,13 @@ let SftpTerminalDecorator = class SftpTerminalDecorator extends tabby_terminal__
     attach(terminal) {
         super.attach(terminal);
         // Best-effort DOM injection: place button near the existing Reconnect button if present.
+        // Only inject for SSH tabs (with a live sshSession property).
         const tryInsert = () => {
+            // Skip for local terminals (PowerShell, CMD, etc.) - only SSH tabs need this button.
+            const sshSession = terminal.sshSession;
+            if (!sshSession) {
+                return false;
+            }
             try {
                 const host = terminal.element?.nativeElement ?? null;
                 if (!host) {
@@ -2905,6 +3168,7 @@ let SftpUiService = class SftpUiService {
                     inputs: {
                         sshSession,
                         profile,
+                        shellSession: sourceTab?.session ?? null,
                     },
                 });
                 tab.setTitle(`${baseTitle} + SFTP`);
@@ -3162,6 +3426,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _sftp_hotkey__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./sftp-hotkey */ "./src/sftp-hotkey.ts");
 /* harmony import */ var _sftp_ui_service__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./sftp-ui.service */ "./src/sftp-ui.service.ts");
 /* harmony import */ var _sftp_terminal_decorator__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./sftp-terminal-decorator */ "./src/sftp-terminal-decorator.ts");
+/* harmony import */ var _sftp_recovery_provider__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./sftp-recovery-provider */ "./src/sftp-recovery-provider.ts");
 var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
     var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
     if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
@@ -3181,6 +3446,7 @@ var __metadata = (undefined && undefined.__metadata) || function (k, v) {
 
 
 
+
 let SftpUiModule = class SftpUiModule {
     constructor(_) { }
 };
@@ -3197,6 +3463,7 @@ SftpUiModule = __decorate([
             { provide: tabby_core__WEBPACK_IMPORTED_MODULE_3__.TabContextMenuItemProvider, useClass: _sftp_context_menu__WEBPACK_IMPORTED_MODULE_6__.SftpContextMenuProvider, multi: true },
             { provide: tabby_core__WEBPACK_IMPORTED_MODULE_3__.HotkeyProvider, useClass: _sftp_hotkey__WEBPACK_IMPORTED_MODULE_7__.SftpUiHotkeyProvider, multi: true },
             { provide: tabby_terminal__WEBPACK_IMPORTED_MODULE_4__.TerminalDecorator, useClass: _sftp_terminal_decorator__WEBPACK_IMPORTED_MODULE_9__.SftpTerminalDecorator, multi: true },
+            { provide: tabby_core__WEBPACK_IMPORTED_MODULE_3__.TabRecoveryProvider, useClass: _sftp_recovery_provider__WEBPACK_IMPORTED_MODULE_10__.SftpTabRecoveryProvider, multi: true },
             _sftp_ui_service__WEBPACK_IMPORTED_MODULE_8__.SftpUiService,
         ],
     }),