v1.1: fix transfer freeze, session tabs, per-panel toolbars, status bar

Freeze root cause: TransfersService consumed transferUpdate through an effect that both read and wrote the jobMap signal — the first progress message spun the effect into an infinite re-run loop, pegging the webview thread while the copy completed fine bun-side. Push messages now flow through plain callback registries on RpcService (also stops signal coalescing from dropping progress snapshots). Verified live: a 60MB boot-time self-test copy streamed progress into the running UI and the post-completion panel refreshes arrived. - Tabs: workspaces (left+right PanelState pair each) in PanelsService; tab bar replaces the header; sessions persist in background tabs; Cmd+T/Cmd+W/Ctrl+Tab; closing a tab disconnects its sessions; last tab can't close - Per-panel toolbar (top, icon-only): direction-explicit copy (-> / <-), rename, new folder/file, chmod, delete; panel footers removed - VSCode-style status bar: transfer summary (spinner/percent/queued/failures, click to expand the job list) + active panel info; function bar removed - transfer details list is collapsible, auto-expands on failure Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
2026-07-11 14:50:19 +02:00
parent 76b9b621a2
commit 9eae6c58dc
12 changed files with 410 additions and 158 deletions
@@ -0,0 +1,66 @@
+import { Component, computed, inject } from '@angular/core';
+import { NgIcon } from '@ng-icons/core';
+import type { TransferSnapshot } from '@shared/types';
+import { PanelsService } from '../panels.service';
+import { TransfersService } from '../transfers.service';
+
+@Component({
+  selector: 'app-status-bar',
+  imports: [NgIcon],
+  template: `
+    <div
+      class="flex h-6 items-center justify-between gap-4 border-t border-border px-3 text-[11px] text-muted-foreground select-none"
+    >
+      <!-- transfers summary; click toggles the detailed list -->
+      <button
+        (click)="transfers.expanded.set(!transfers.expanded())"
+        class="flex min-w-0 items-center gap-1.5 hover:text-foreground"
+        title="Show transfer details"
+      >
+        @if (transfers.currentJob(); as job) {
+          <ng-icon name="mynaSpinner" size="0.8rem" class="shrink-0 animate-spin text-primary" />
+          <span class="truncate">
+            Copying {{ job.name }} · {{ percent(job) }}%
+            @if (transfers.queuedCount(); as queued) {
+              · {{ queued }} queued
+            }
+          </span>
+        } @else if (transfers.failedJobs().length; as failed) {
+          <ng-icon name="mynaXCircle" size="0.8rem" class="shrink-0 text-destructive" />
+          <span class="text-destructive">
+            {{ failed }} transfer{{ failed === 1 ? '' : 's' }} failed
+          </span>
+        } @else if (transfers.hasJobs()) {
+          <ng-icon name="mynaCheckCircle" size="0.8rem" class="shrink-0 text-success" />
+          <span>Transfers finished</span>
+        } @else {
+          <span>Ready</span>
+        }
+      </button>
+
+      <!-- active panel info -->
+      <div class="flex shrink-0 items-center gap-1.5">
+        <ng-icon
+          [name]="activePanel().sessionId() === 'local' ? 'mynaHardDrive' : 'mynaServers'"
+          size="0.8rem"
+          [class.text-primary]="activePanel().sessionId() !== 'local'"
+        />
+        <span class="max-w-56 truncate">{{ activePanel().title() }}</span>
+        <span>· {{ activePanel().sorted().length }} items</span>
+        @if (activePanel().selected().size; as count) {
+          <span>· {{ count }} selected</span>
+        }
+      </div>
+    </div>
+  `,
+})
+export class StatusBar {
+  readonly transfers = inject(TransfersService);
+  readonly panels = inject(PanelsService);
+  readonly activePanel = computed(() => this.panels.get(this.panels.activeSide()));
+
+  percent(job: TransferSnapshot): number {
+    if (!job.totalBytes) return 0;
+    return Math.min(100, Math.round((job.doneBytes / job.totalBytes) * 100));
+  }
+}