fix(m8-ui): cancel button + job-id reconcile + truncation notice (P1-1, P2-1, P2-4)

Frontend half of the M8 codex round-1 fixes, kept in sync with the backend
contract:

- P1-1: cancelRestoreJob IPC wrapper; store cancelRestore + cancelling
  flag; Restore.vue Cancel button (gated while cancelling), CANCELLED
  terminal label, and a per-file Cancelled state. RestoreJobStatus carries
  cancelled; RestoreFileState adds "cancelled". i18n keys added (cancel,
  cancelling, progress.cancelled, file.cancelled, truncated) - all via t().
- P2-1: listRemoteTree returns RemoteTreeDto { entries, truncated }; store
  tracks treeTruncated; Restore.vue shows a "showing first N" notice.
- P2-4: store persists the returned activeJobId and reconciles via
  getRestoreJob(jobId) after start AND on (re)subscription, so a remount /
  missed terminal event recovers state instead of going stale.

vitest: remount reconciles the active job by id; cancel invokes the IPC +
reflects a terminal cancelled status.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_012CyiRqk2DVwmJjEu5gcD1m

Author: pmaxhogan

ui/src/__tests__/restore-store.test.ts

@@ -35,10 +35,16 @@ import { useRestoreStore } from "../stores/restore";
 import type {
   FileSearchHitDto,
   RemoteEntryDto,
+  RemoteTreeDto,
   RestoreJobStatus,
   SourceDto,
 } from "../ipc/types";
 
+/** Wrap entries as the RemoteTreeDto the backend now returns (M8-P2-1). */
+function tree(entries: RemoteEntryDto[], truncated = false): RemoteTreeDto {
+  return { entries, truncated };
+}
+
 function source(id: string, name: string): SourceDto {
   return {
     id,
@@ -98,7 +104,7 @@ describe("restore store", () => {
       if (cmd === "list_sources")
         return Promise.resolve([source("s1", "Documents")]);
       if (cmd === "list_remote_tree")
-        return Promise.resolve([folder("src"), file("a.txt")]);
+        return Promise.resolve(tree([folder("src"), file("a.txt")]));
       return Promise.resolve([]);
     });
 
@@ -127,10 +133,10 @@ describe("restore store", () => {
         return Promise.resolve([source("s1", "Documents")]);
       if (cmd === "list_remote_tree") {
         const prefix = (args as { prefix: string }).prefix;
-        if (prefix === "") return Promise.resolve([folder("src")]);
+        if (prefix === "") return Promise.resolve(tree([folder("src")]));
         if (prefix === "src")
-          return Promise.resolve([file("main.rs", "src")]);
-        return Promise.resolve([]);
+          return Promise.resolve(tree([file("main.rs", "src")]));
+        return Promise.resolve(tree([]));
       }
       return Promise.resolve([]);
     });
@@ -160,7 +166,7 @@ describe("restore store", () => {
     invokeMock.mockImplementation((cmd: string) => {
       if (cmd === "list_sources")
         return Promise.resolve([source("s1", "Documents")]);
-      if (cmd === "list_remote_tree") return Promise.resolve([]);
+      if (cmd === "list_remote_tree") return Promise.resolve(tree([]));
       if (cmd === "search_files") return Promise.resolve(hits);
       return Promise.resolve([]);
     });
@@ -186,7 +192,7 @@ describe("restore store", () => {
       if (cmd === "list_sources")
         return Promise.resolve([source("s1", "Documents")]);
       if (cmd === "list_remote_tree")
-        return Promise.resolve([file("a.txt"), file("b.txt")]);
+        return Promise.resolve(tree([file("a.txt"), file("b.txt")]));
       return Promise.resolve([]);
     });
     const store = useRestoreStore();
@@ -210,12 +216,35 @@ describe("restore store", () => {
   });
 
   it("restores selected files with a dialog token and accumulates progress to done", async () => {
+    // The seeded snapshot getRestoreJob returns right after start (before any
+    // live tick) - the reconcile path (M8-P2-4).
+    const seeded: RestoreJobStatus = {
+      jobId: "job-1",
+      totalFiles: 1,
+      completedFiles: 0,
+      failedFiles: 0,
+      totalBytes: 100,
+      bytesDone: 0,
+      currentFile: null,
+      done: false,
+      cancelled: false,
+      files: [
+        {
+          relativePath: "secret.bin",
+          state: "pending",
+          bytesDone: 0,
+          bytesTotal: 100,
+          errorCode: null,
+        },
+      ],
+    };
     invokeMock.mockImplementation((cmd: string) => {
       if (cmd === "list_sources")
         return Promise.resolve([source("s1", "Documents")]);
       if (cmd === "list_remote_tree")
-        return Promise.resolve([file("secret.bin")]);
+        return Promise.resolve(tree([file("secret.bin")]));
       if (cmd === "restore_files") return Promise.resolve("job-1");
+      if (cmd === "get_restore_job") return Promise.resolve(seeded);
       return Promise.resolve([]);
     });
 
@@ -250,6 +279,7 @@ describe("restore store", () => {
       bytesDone: 50,
       currentFile: "secret.bin",
       done: false,
+      cancelled: false,
       files: [
         {
           relativePath: "secret.bin",
@@ -297,4 +327,134 @@ describe("restore store", () => {
     store.unsubscribeProgress();
     expect(unlistenMock).toHaveBeenCalledTimes(1);
   });
+
+  it("reconciles the active job by id on (re)subscription after a remount (M8-P2-4)", async () => {
+    // Simulate: a restore was started (activeJobId set), then the view remounts
+    // and re-subscribes. subscribeProgress must fetch getRestoreJob(jobId) so the
+    // current state is recovered even if a terminal event was missed.
+    const terminal: RestoreJobStatus = {
+      jobId: "job-9",
+      totalFiles: 1,
+      completedFiles: 1,
+      failedFiles: 0,
+      totalBytes: 100,
+      bytesDone: 100,
+      currentFile: null,
+      done: true,
+      cancelled: false,
+      files: [
+        {
+          relativePath: "a.bin",
+          state: "done",
+          bytesDone: 100,
+          bytesTotal: 100,
+          errorCode: null,
+        },
+      ],
+    };
+    invokeMock.mockImplementation((cmd: string) => {
+      if (cmd === "list_sources")
+        return Promise.resolve([source("s1", "Documents")]);
+      if (cmd === "list_remote_tree")
+        return Promise.resolve(tree([file("a.bin")]));
+      if (cmd === "restore_files") return Promise.resolve("job-9");
+      if (cmd === "get_restore_job") return Promise.resolve(terminal);
+      return Promise.resolve([]);
+    });
+
+    const store = useRestoreStore();
+    await store.loadSources();
+    store.toggleSelect("s1", "a.bin");
+    store.setDestination("/home/u/restored", "tok-1");
+    await store.startRestore();
+    expect(store.activeJobId).toBe("job-9");
+
+    // Remount: unsubscribe then re-subscribe; the re-subscribe reconciles by id.
+    store.unsubscribeProgress();
+    await store.subscribeProgress();
+
+    const getCall = invokeMock.mock.calls.find(
+      (c) => c[0] === "get_restore_job",
+    );
+    expect(getCall?.[1]).toMatchObject({ job: "job-9" });
+    // The reconciled terminal state is reflected (controls re-enabled).
+    expect(store.job?.done).toBe(true);
+    expect(store.restoring).toBe(false);
+  });
+
+  it("cancels the active job and reflects a terminal cancelled status (M8-P1-1)", async () => {
+    invokeMock.mockImplementation((cmd: string) => {
+      if (cmd === "list_sources")
+        return Promise.resolve([source("s1", "Documents")]);
+      if (cmd === "list_remote_tree")
+        return Promise.resolve(tree([file("big.bin")]));
+      if (cmd === "restore_files") return Promise.resolve("job-c");
+      if (cmd === "cancel_restore_job") return Promise.resolve(null);
+      if (cmd === "get_restore_job")
+        return Promise.resolve({
+          jobId: "job-c",
+          totalFiles: 1,
+          completedFiles: 0,
+          failedFiles: 0,
+          totalBytes: 100,
+          bytesDone: 0,
+          currentFile: "big.bin",
+          done: false,
+          cancelled: false,
+          files: [
+            {
+              relativePath: "big.bin",
+              state: "restoring",
+              bytesDone: 0,
+              bytesTotal: 100,
+              errorCode: null,
+            },
+          ],
+        } as RestoreJobStatus);
+      return Promise.resolve([]);
+    });
+
+    const store = useRestoreStore();
+    await store.subscribeProgress();
+    await store.loadSources();
+    store.toggleSelect("s1", "big.bin");
+    store.setDestination("/home/u/restored", "tok-c");
+    await store.startRestore();
+    expect(store.activeJobId).toBe("job-c");
+
+    // Request cancel: the cancel IPC is invoked with the job id; cancelling gates.
+    await store.cancelRestore();
+    const cancelCall = invokeMock.mock.calls.find(
+      (c) => c[0] === "cancel_restore_job",
+    );
+    expect(cancelCall?.[1]).toMatchObject({ job: "job-c" });
+    expect(store.cancelling).toBe(true);
+
+    // The backend emits a terminal CANCELLED status; the store clears the flags.
+    const cancelled: RestoreJobStatus = {
+      jobId: "job-c",
+      totalFiles: 1,
+      completedFiles: 0,
+      failedFiles: 0,
+      totalBytes: 100,
+      bytesDone: 30,
+      currentFile: null,
+      done: true,
+      cancelled: true,
+      files: [
+        {
+          relativePath: "big.bin",
+          state: "cancelled",
+          bytesDone: 30,
+          bytesTotal: 100,
+          errorCode: null,
+        },
+      ],
+    };
+    progressHandler?.(cancelled);
+    expect(store.job?.cancelled).toBe(true);
+    expect(store.job?.done).toBe(true);
+    expect(store.restoring).toBe(false);
+    expect(store.cancelling).toBe(false);
+  });
 });

ui/src/ipc/commands.ts

@@ -25,7 +25,7 @@ import type {
   PickedPath,
   ReauthSession,
   ReleaseDto,
-  RemoteEntryDto,
+  RemoteTreeDto,
   RestoreItem,
   RestoreJobId,
   RestoreJobStatus,
@@ -227,7 +227,7 @@ export function activitySummary(
 export function listRemoteTree(
   sourceId: string,
   prefix: string,
-): Promise<RemoteEntryDto[]> {
+): Promise<RemoteTreeDto> {
   return invoke("list_remote_tree", { sourceId, prefix });
 }
 
@@ -258,3 +258,11 @@ export function restoreFiles(
 export function getRestoreJob(job: RestoreJobId): Promise<RestoreJobStatus> {
   return invoke("get_restore_job", { job });
 }
+
+/** Cancel a running restore job (SPEC s11.5; M8-P1-1). The backend stops the job
+ * between frames, DELETES any in-flight temp file (no partial left), and emits a
+ * terminal CANCELLED status on `restore:progress`. Idempotent: cancelling an
+ * unknown / already-finished job is a no-op. */
+export function cancelRestoreJob(job: RestoreJobId): Promise<void> {
+  return invoke("cancel_restore_job", { job });
+}

ui/src/ipc/types.ts

@@ -351,6 +351,14 @@ export interface RemoteEntryDto {
   restorable: boolean;
 }
 
+/** The result of `listRemoteTree` (mirrors src-tauri RemoteTreeDto, M8-P2-1):
+ * the immediate children plus a `truncated` flag so the UI can tell the user the
+ * listing was capped (rather than silently dropping children past the cap). */
+export interface RemoteTreeDto {
+  entries: RemoteEntryDto[];
+  truncated: boolean;
+}
+
 /** One Restore search hit (mirrors src-tauri FileSearchHitDto). */
 export interface FileSearchHitDto {
   sourceId: string;
@@ -371,8 +379,14 @@ export interface RestoreItem {
 export type RestoreJobId = string;
 
 /** Per-file lifecycle state within a restore job (mirrors src-tauri
- * RestoreFileState). */
-export type RestoreFileState = "pending" | "restoring" | "done" | "failed";
+ * RestoreFileState). `cancelled` (M8-P1-1) means the user cancelled before this
+ * file finished; any partial temp was deleted (no half-written file). */
+export type RestoreFileState =
+  | "pending"
+  | "restoring"
+  | "done"
+  | "failed"
+  | "cancelled";
 
 /** Per-file progress within a restore job (mirrors src-tauri
  * RestoreFileProgress). `errorCode` is a stable SPEC s24 i18n key when failed. */
@@ -397,5 +411,9 @@ export interface RestoreJobStatus {
   bytesDone: number;
   currentFile: string | null;
   done: boolean;
+  /** `true` when the job's terminal state is a user CANCELLATION (M8-P1-1).
+   * `done && !cancelled` is a normal finish; `done && cancelled` means the job
+   * was stopped early and any in-flight temp file was deleted (no partial). */
+  cancelled: boolean;
   files: RestoreFileProgress[];
 }

ui/src/locales/en-US.json

@@ -273,6 +273,7 @@
       "tree": "No backed-up files in this folder yet.",
       "search": "No files match your search."
     },
+    "truncated": "Showing the first {count} items in this folder. Use search to find more.",
     "node": {
       "folder": "Folder",
       "select": "Select file to restore",
@@ -282,17 +283,21 @@
     "clearSelection": "Clear selection",
     "pickDestination": "Choose destination...",
     "start": "Restore selected",
+    "cancel": "Cancel restore",
+    "cancelling": "Cancelling...",
     "progress": {
       "running": "Restoring...",
       "done": "Restore complete",
+      "cancelled": "Restore cancelled",
       "summary": "{completed} of {total} done, {failed} failed",
       "current": "Restoring: {file}"
     },
     "file": {
       "pending": "Pending",
       "restoring": "Restoring",
       "done": "Done",
-      "failed": "Failed"
+      "failed": "Failed",
+      "cancelled": "Cancelled"
     }
   },
   "errors": {