shadow-claw 1.23.3 → 1.24.0

package/src/components/shadow-claw-files/shadow-claw-files.test.ts

@@ -41,6 +41,14 @@ jest.unstable_mockModule("../../storage/uploadGroupFile.js", () => ({
   uploadGroupFile: jest.fn(),
 }));
 
+jest.unstable_mockModule("../../db/getConfig.js", () => ({
+  getConfig: jest.fn<any>().mockResolvedValue(undefined),
+}));
+
+jest.unstable_mockModule("../../utils/ulid.js", () => ({
+  ulid: jest.fn(() => "mock-ulid"),
+}));
+
 jest.unstable_mockModule("../../storage/writeGroupFile.js", () => ({
   writeGroupFile: jest.fn(),
 }));
@@ -84,7 +92,7 @@ jest.unstable_mockModule("../../stores/orchestrator.js", () => ({
     pages: [] as Array<{ groupId: string; path: string }>,
     addPage: mockAddPage,
     removePage: mockRemovePage,
-    loadFiles: jest.fn(),
+    loadFiles: jest.fn<any>().mockResolvedValue(undefined),
     db: {},
     triggerFilesRefresh: jest.fn(),
     orchestrator: {
@@ -104,6 +112,9 @@ jest.unstable_mockModule("../../db/db.js", () => ({
   getDb: jest.fn<any>().mockResolvedValue({} as any),
 }));
 
+const { CONFIG_KEYS } = await import("../../config/config.js");
+const { getConfig } = await import("../../db/getConfig.js");
+const { uploadGroupFile } = await import("../../storage/uploadGroupFile.js");
 const { ShadowClawFiles } = await import("./shadow-claw-files.js");
 const { deleteGroupFile } = await import("../../storage/deleteGroupFile.js");
 const { renameGroupEntry } = await import("../../storage/renameGroupEntry.js");
@@ -125,6 +136,12 @@ describe("shadow-claw-files", () => {
     (orchestratorStore as any).files = [];
     (mockAddPage as any).mockResolvedValue(undefined);
     (mockRemovePage as any).mockResolvedValue(undefined);
+    (writeGroupFile as any).mockResolvedValue(undefined);
+    (createGroupDirectory as any).mockResolvedValue(undefined);
+    (renameGroupEntry as any).mockResolvedValue(undefined);
+    (copyGroupEntry as any).mockResolvedValue(undefined);
+    (moveGroupEntry as any).mockResolvedValue(undefined);
+    (uploadGroupFile as any).mockResolvedValue(undefined);
   });
 
   it("registers custom element", () => {
@@ -145,6 +162,8 @@ describe("shadow-claw-files", () => {
 
     expect(template).toContain("files__rename-dialog");
 
+    expect(template).toContain("files__upload-conflict-dialog");
+
     expect(template).toContain("files__drop-hint");
 
     expect(template).toContain("files__upload-progress");
@@ -910,4 +929,611 @@ describe("shadow-claw-files", () => {
 
     document.body.removeChild(component);
   });
+
+  it("uploads files without ULID prefix by default", async () => {
+    const component = new ShadowClawFiles();
+    document.body.appendChild(component);
+    await component.render();
+
+    (getConfig as any).mockResolvedValue(undefined);
+    (orchestratorStore as any).currentPath = ".";
+    (orchestratorStore as any).files = [];
+
+    const file = new File(["content"], "document.pdf", {
+      type: "application/pdf",
+    });
+    await component.uploadFileList({} as any, [file]);
+
+    expect(uploadGroupFile).toHaveBeenCalledWith(
+      {} as any,
+      "default",
+      "document.pdf",
+      file,
+    );
+    expect(showSuccess).toHaveBeenCalledWith("Uploaded 1 file", 3000);
+
+    document.body.removeChild(component);
+  });
+
+  it("uploads files with ULID prefix when setting is enabled", async () => {
+    const component = new ShadowClawFiles();
+    document.body.appendChild(component);
+    await component.render();
+
+    (getConfig as any).mockImplementation((_db: any, key: string) => {
+      if (key === CONFIG_KEYS.FILES_UPLOAD_APPEND_ULID) {
+        return Promise.resolve("true");
+      }
+      return Promise.resolve(undefined);
+    });
+    (orchestratorStore as any).currentPath = "subfolder";
+    (orchestratorStore as any).files = [];
+
+    const file = new File(["content"], "image.png", {
+      type: "image/png",
+    });
+    await component.uploadFileList({} as any, [file]);
+
+    expect(uploadGroupFile).toHaveBeenCalledWith(
+      {} as any,
+      "default",
+      "subfolder/mock-ulid-image.png",
+      file,
+    );
+    expect(showSuccess).toHaveBeenCalledWith("Uploaded 1 file", 3000);
+
+    document.body.removeChild(component);
+  });
+
+  it("prompts conflict dialog and overwrites existing file when selected", async () => {
+    const component = new ShadowClawFiles();
+    document.body.appendChild(component);
+    await component.render();
+
+    (getConfig as any).mockResolvedValue(undefined);
+    (orchestratorStore as any).currentPath = ".";
+    (orchestratorStore as any).files = ["existing.txt"];
+    (orchestratorStore as any).pages = [
+      { groupId: "default", path: "existing.txt" },
+    ];
+
+    jest.spyOn(component, "promptUploadConflict").mockResolvedValue({
+      action: "overwrite",
+    });
+
+    const file = new File(["new content"], "existing.txt", {
+      type: "text/plain",
+    });
+    await component.uploadFileList({} as any, [file]);
+
+    expect(component.promptUploadConflict).toHaveBeenCalledWith(
+      "existing.txt",
+      expect.any(Set),
+    );
+    expect(mockRemovePage).toHaveBeenCalledWith(
+      {} as any,
+      "existing.txt",
+      "default",
+    );
+    expect(uploadGroupFile).toHaveBeenCalledWith(
+      {} as any,
+      "default",
+      "existing.txt",
+      file,
+    );
+    expect(showSuccess).toHaveBeenCalledWith("Uploaded 1 file", 3000);
+
+    document.body.removeChild(component);
+  });
+
+  it("prompts conflict dialog and renames file when new name is chosen", async () => {
+    const component = new ShadowClawFiles();
+    document.body.appendChild(component);
+    await component.render();
+
+    (getConfig as any).mockResolvedValue(undefined);
+    (orchestratorStore as any).currentPath = "docs";
+    (orchestratorStore as any).files = ["existing.txt"];
+
+    jest.spyOn(component, "promptUploadConflict").mockResolvedValue({
+      action: "rename",
+      name: "existing-renamed.txt",
+    });
+
+    const file = new File(["content"], "existing.txt", {
+      type: "text/plain",
+    });
+    await component.uploadFileList({} as any, [file]);
+
+    expect(component.promptUploadConflict).toHaveBeenCalledWith(
+      "existing.txt",
+      expect.any(Set),
+    );
+    expect(uploadGroupFile).toHaveBeenCalledWith(
+      {} as any,
+      "default",
+      "docs/existing-renamed.txt",
+      file,
+    );
+    expect(showSuccess).toHaveBeenCalledWith("Uploaded 1 file", 3000);
+
+    document.body.removeChild(component);
+  });
+
+  it("prompts conflict dialog and skips upload when user cancels", async () => {
+    const component = new ShadowClawFiles();
+    document.body.appendChild(component);
+    await component.render();
+
+    (getConfig as any).mockResolvedValue(undefined);
+    (orchestratorStore as any).currentPath = ".";
+    (orchestratorStore as any).files = ["existing.txt"];
+
+    jest.spyOn(component, "promptUploadConflict").mockResolvedValue(null);
+
+    const file = new File(["content"], "existing.txt", {
+      type: "text/plain",
+    });
+    await component.uploadFileList({} as any, [file]);
+
+    expect(component.promptUploadConflict).toHaveBeenCalledWith(
+      "existing.txt",
+      expect.any(Set),
+    );
+    expect(uploadGroupFile).not.toHaveBeenCalled();
+
+    document.body.removeChild(component);
+  });
+
+  it("handles conflict dialog UI submission and validation", async () => {
+    const component = new ShadowClawFiles();
+    document.body.appendChild(component);
+    await component.render();
+
+    const existingNames = new Set(["existing.txt", "taken.txt"]);
+    const conflictPromise = component.promptUploadConflict(
+      "existing.txt",
+      existingNames,
+    );
+
+    const input = component.shadowRoot?.querySelector(
+      ".files__upload-conflict-rename-input",
+    ) as HTMLInputElement;
+    const form = component.shadowRoot?.querySelector(
+      ".files__upload-conflict-form",
+    ) as HTMLFormElement;
+
+    expect(input.value).toBe("existing.txt");
+
+    // 1. Try empty name
+    input.value = "   ";
+    form.dispatchEvent(new Event("submit"));
+    expect(showWarning).toHaveBeenCalledWith("Please enter a name", 3000);
+
+    // 2. Try path name
+    input.value = "folder/name.txt";
+    form.dispatchEvent(new Event("submit"));
+    expect(showWarning).toHaveBeenCalledWith(
+      "Use only a name, not a path",
+      3500,
+    );
+
+    // 3. Try already taken name
+    input.value = "taken.txt";
+    form.dispatchEvent(new Event("submit"));
+    expect(showWarning).toHaveBeenCalledWith(
+      '"taken.txt" already exists. Please choose a different name.',
+      4000,
+    );
+
+    // 4. Valid new name
+    input.value = "brand-new.txt";
+    form.dispatchEvent(new Event("submit"));
+
+    const result = await conflictPromise;
+    expect(result).toEqual({ action: "rename", name: "brand-new.txt" });
+
+    document.body.removeChild(component);
+  });
+
+  describe("files component helpers and operations", () => {
+    it("escapes html text", () => {
+      const component = new ShadowClawFiles();
+      expect(component.escapeHtml("<tag>")).toBe("&lt;tag&gt;");
+    });
+
+    it("identifies page candidate files correctly", () => {
+      const component = new ShadowClawFiles();
+      expect(component.isPageCandidateFile("index.md", false)).toBe(true);
+      expect(component.isPageCandidateFile("index.html", false)).toBe(true);
+      expect(component.isPageCandidateFile("index.htm", false)).toBe(true);
+      expect(component.isPageCandidateFile("index.xhtml", false)).toBe(true);
+      expect(component.isPageCandidateFile("index.markdown", false)).toBe(true);
+      expect(component.isPageCandidateFile("script.js", false)).toBe(false);
+      expect(component.isPageCandidateFile("folder.md", true)).toBe(false);
+    });
+
+    it("detects invalid folder paste targets", () => {
+      const component = new ShadowClawFiles();
+      expect(
+        component.isInvalidFolderPasteTarget(
+          { sourcePath: "docs", isDirectory: false },
+          "docs/sub",
+        ),
+      ).toBe(false);
+      expect(
+        component.isInvalidFolderPasteTarget(
+          { sourcePath: "docs", isDirectory: true },
+          ".",
+        ),
+      ).toBe(false);
+      expect(
+        component.isInvalidFolderPasteTarget(
+          { sourcePath: "docs", isDirectory: true },
+          "docs",
+        ),
+      ).toBe(true);
+      expect(
+        component.isInvalidFolderPasteTarget(
+          { sourcePath: "docs", isDirectory: true },
+          "docs/nested",
+        ),
+      ).toBe(true);
+      expect(
+        component.isInvalidFolderPasteTarget(
+          { sourcePath: "docs", isDirectory: true },
+          "other-dir",
+        ),
+      ).toBe(false);
+    });
+
+    it("detects drag files in DragEvent", () => {
+      const component = new ShadowClawFiles();
+      expect(component.hasDragFiles({ dataTransfer: null } as any)).toBe(false);
+      expect(
+        component.hasDragFiles({
+          dataTransfer: { types: ["text/plain"] },
+        } as any),
+      ).toBe(false);
+      expect(
+        component.hasDragFiles({ dataTransfer: { types: ["Files"] } } as any),
+      ).toBe(true);
+    });
+
+    it("handles syncHostToVM action", () => {
+      const component = new ShadowClawFiles();
+      document.body.appendChild(component);
+
+      const button = document.createElement("button");
+      button.className = "files__sync-host-btn";
+      component.shadowRoot?.appendChild(button);
+
+      (orchestratorStore as any).syncHostWorkspaceToVM = jest.fn();
+
+      component.handleSyncHostToVM();
+
+      expect(
+        (orchestratorStore as any).syncHostWorkspaceToVM,
+      ).toHaveBeenCalled();
+      expect(showSuccess).toHaveBeenCalledWith(
+        "Requested host → VM workspace sync",
+        2200,
+      );
+
+      document.body.removeChild(component);
+    });
+
+    it("handles syncVMToHost action", async () => {
+      const component = new ShadowClawFiles();
+      document.body.appendChild(component);
+
+      const button = document.createElement("button");
+      button.className = "files__sync-vm-btn";
+      component.shadowRoot?.appendChild(button);
+
+      (orchestratorStore as any).syncVMWorkspaceToHost = jest.fn();
+
+      await component.handleSyncVMToHost({} as any);
+
+      expect(
+        (orchestratorStore as any).syncVMWorkspaceToHost,
+      ).toHaveBeenCalled();
+      expect(showSuccess).toHaveBeenCalledWith(
+        "Requested VM → host workspace sync",
+        2200,
+      );
+
+      document.body.removeChild(component);
+    });
+
+    it("handles backup (download all zip) and clear all files", async () => {
+      const component = new ShadowClawFiles();
+      const db = {} as any;
+
+      const { downloadAllGroupFilesAsZip } =
+        await import("../../storage/downloadAllGroupFilesAsZip.js");
+      const { deleteAllGroupFiles } =
+        await import("../../storage/deleteAllGroupFiles.js");
+
+      // 1. Backup
+      await component.handleBackup(db);
+      expect(downloadAllGroupFilesAsZip).toHaveBeenCalledWith(db, "default");
+      expect(showSuccess).toHaveBeenCalledWith(
+        "Backup created successfully",
+        3000,
+      );
+
+      // 2. Clear all
+      component.requestConfirmation = jest.fn<any>().mockResolvedValue(true);
+      (orchestratorStore as any).resetToRootFolder = jest.fn();
+
+      await component.handleClearAll(db);
+      expect(deleteAllGroupFiles).toHaveBeenCalledWith(db, "default");
+      expect(showSuccess).toHaveBeenCalledWith("All files deleted", 3500);
+    });
+
+    it("handles create new file and folder flows with validation", async () => {
+      const component = new ShadowClawFiles() as any;
+      document.body.appendChild(component);
+      const db = {} as any;
+
+      const { writeGroupFile } =
+        await import("../../storage/writeGroupFile.js");
+      const { createGroupDirectory } =
+        await import("../../storage/createGroupDirectory.js");
+
+      const dialog = component.shadowRoot?.querySelector(".files__new-dialog");
+      if (dialog) (dialog as any).close = jest.fn();
+
+      const input = component.shadowRoot?.querySelector(
+        ".files__new-input",
+      ) as HTMLInputElement;
+      const isFolderInput = component.shadowRoot?.querySelector(
+        ".files__new-is-folder",
+      ) as HTMLInputElement;
+
+      // 1. Validation: empty name
+      if (input) input.value = "";
+      await component.handleCreateNewFile(db);
+      expect(showWarning).toHaveBeenCalledWith(
+        "Please enter a file name",
+        3000,
+      );
+
+      // 2. Validation: slashes in name
+      if (input) input.value = "folder/file.txt";
+      await component.handleCreateNewFile(db);
+      expect(showWarning).toHaveBeenCalledWith(
+        "Use only a file name, not a path",
+        3500,
+      );
+
+      // 3. Create file successfully
+      if (input) input.value = "test.txt";
+      if (isFolderInput) isFolderInput.checked = false;
+      await component.handleCreateNewFile(db);
+      expect(writeGroupFile).toHaveBeenCalledWith(
+        db,
+        "default",
+        "test.txt",
+        "",
+      );
+      expect(showSuccess).toHaveBeenCalledWith("Created file: test.txt", 3000);
+
+      // 4. Create folder successfully
+      if (input) input.value = "docs";
+      if (isFolderInput) isFolderInput.checked = true;
+      await component.handleCreateNewFile(db);
+      expect(createGroupDirectory).toHaveBeenCalledWith(db, "default", "docs");
+      expect(showSuccess).toHaveBeenCalledWith("Created folder: docs", 3000);
+
+      document.body.removeChild(component);
+    });
+
+    it("handles rename entry flow for files and folders", async () => {
+      const component = new ShadowClawFiles() as any;
+      document.body.appendChild(component);
+      const db = {} as any;
+
+      const { renameGroupEntry } =
+        await import("../../storage/renameGroupEntry.js");
+
+      const dialog = component.shadowRoot?.querySelector(
+        ".files__rename-dialog",
+      );
+      if (dialog) (dialog as any).close = jest.fn();
+
+      const input = component.shadowRoot?.querySelector(
+        ".files__rename-input",
+      ) as HTMLInputElement;
+
+      component._pendingRenamePath = "old.txt";
+      component._pendingRenameName = "old.txt";
+      component._pendingRenameIsDirectory = false;
+
+      // 1. Validation: empty name
+      if (input) input.value = "";
+      await component.handleRenameEntry(db);
+      expect(showWarning).toHaveBeenCalledWith("Please enter a name", 3000);
+
+      // 2. Validation: path with slashes
+      if (input) input.value = "sub/new.txt";
+      await component.handleRenameEntry(db);
+      expect(showWarning).toHaveBeenCalledWith(
+        "Use only a name, not a path",
+        3500,
+      );
+
+      // 3. Same name closes dialog without calling renameGroupEntry
+      if (input) input.value = "old.txt";
+      await component.handleRenameEntry(db);
+      expect(renameGroupEntry).not.toHaveBeenCalled();
+
+      // 4. Successful file rename
+      component._pendingRenamePath = "old.txt";
+      component._pendingRenameName = "old.txt";
+      component._pendingRenameIsDirectory = false;
+      if (input) input.value = "new.txt";
+      await component.handleRenameEntry(db);
+      expect(renameGroupEntry).toHaveBeenCalledWith(
+        db,
+        "default",
+        "old.txt",
+        "new.txt",
+      );
+      expect(showSuccess).toHaveBeenCalledWith(
+        "Renamed file: old.txt -> new.txt",
+        3200,
+      );
+
+      // 5. Successful folder rename
+      component._pendingRenamePath = "old-folder";
+      component._pendingRenameName = "old-folder";
+      component._pendingRenameIsDirectory = true;
+      if (input) input.value = "new-folder";
+      await component.handleRenameEntry(db);
+      expect(renameGroupEntry).toHaveBeenCalledWith(
+        db,
+        "default",
+        "old-folder",
+        "new-folder",
+      );
+      expect(showSuccess).toHaveBeenCalledWith(
+        "Renamed folder: old-folder -> new-folder",
+        3200,
+      );
+
+      document.body.removeChild(component);
+    });
+
+    it("handles restore and upload file actions", async () => {
+      const component = new ShadowClawFiles() as any;
+      document.body.appendChild(component);
+      const db = {} as any;
+
+      const { restoreAllGroupFilesFromZip } =
+        await import("../../storage/restoreAllGroupFilesFromZip.js");
+      const { uploadGroupFile } =
+        await import("../../storage/uploadGroupFile.js");
+
+      // 1. Restore non-zip warning
+      const nonZipInput = {
+        files: [{ name: "test.txt" }],
+        value: "test.txt",
+      } as any;
+      await component.handleRestore(db, nonZipInput);
+      expect(showWarning).toHaveBeenCalledWith(
+        "Please select a .zip file",
+        3500,
+      );
+
+      // 2. Restore cancelled confirmation
+      component.requestConfirmation = jest.fn<any>().mockResolvedValue(false);
+      const zipFile = new File(["zipcontent"], "backup.zip", {
+        type: "application/zip",
+      });
+      const zipInput = {
+        files: [zipFile],
+        value: "backup.zip",
+      } as any;
+      await component.handleRestore(db, zipInput);
+      expect(restoreAllGroupFilesFromZip).not.toHaveBeenCalled();
+
+      // 3. Restore confirmed
+      component.requestConfirmation = jest.fn<any>().mockResolvedValue(true);
+      await component.handleRestore(db, zipInput);
+      expect(restoreAllGroupFilesFromZip).toHaveBeenCalledWith(
+        db,
+        "default",
+        zipFile,
+      );
+      expect(showSuccess).toHaveBeenCalledWith(
+        "Files restored successfully",
+        3500,
+      );
+
+      // 4. Upload file
+      const uploadFile = new File(["content"], "upload.txt", {
+        type: "text/plain",
+      });
+      const uploadInput = {
+        files: [uploadFile],
+        value: "upload.txt",
+      } as any;
+      await component.handleUpload(db, uploadInput);
+      expect(uploadGroupFile).toHaveBeenCalledWith(
+        db,
+        "default",
+        "upload.txt",
+        uploadFile,
+      );
+      expect(showSuccess).toHaveBeenCalledWith("Uploaded 1 file", 3000);
+
+      // 5. handleSyncVMToHost
+      const syncBtn = document.createElement("button");
+      syncBtn.className = "files__sync-vm-btn";
+      component.shadowRoot?.appendChild(syncBtn);
+      await component.handleSyncVMToHost(db);
+      expect(orchestratorStore.syncVMWorkspaceToHost).toHaveBeenCalled();
+
+      // 6. handleRenameEntry
+      const { renameGroupEntry } =
+        await import("../../storage/renameGroupEntry.js");
+      component._pendingRenamePath = "docs/old.txt";
+      component._pendingRenameName = "old.txt";
+
+      const renameInput = component.shadowRoot?.querySelector(
+        ".files__rename-input",
+      ) as HTMLInputElement;
+      if (renameInput) renameInput.value = "new.txt";
+
+      await component.handleRenameEntry(db);
+      expect(renameGroupEntry).toHaveBeenCalledWith(
+        db,
+        "default",
+        "docs/old.txt",
+        "new.txt",
+      );
+
+      // 7. updateBreadcrumbs
+      (orchestratorStore as any).currentPath = "docs/guides";
+      let breadcrumbsContainer = component.shadowRoot?.querySelector(
+        "[data-breadcrumb-path]",
+      );
+      if (!breadcrumbsContainer) {
+        breadcrumbsContainer = document.createElement("div");
+        breadcrumbsContainer.setAttribute("data-breadcrumb-path", "");
+        component.shadowRoot?.appendChild(breadcrumbsContainer);
+      }
+      component.updateBreadcrumbs(db);
+
+      const breadcrumbButtons = breadcrumbsContainer.querySelectorAll(
+        ".files__breadcrumb-btn",
+      );
+      expect(breadcrumbButtons.length).toBeGreaterThan(0);
+      // Click root
+      (breadcrumbButtons[0] as HTMLButtonElement).click();
+      expect(orchestratorStore.resetToRootFolder).toHaveBeenCalled();
+
+      // 8. updateFileList
+      let listContainer = component.shadowRoot?.querySelector(".files__list");
+      if (!listContainer) {
+        listContainer = document.createElement("div");
+        listContainer.className = "files__list";
+        component.shadowRoot?.appendChild(listContainer);
+      }
+      (orchestratorStore as any).files = ["readme.md", "src/"];
+      component.updateFileList(db);
+      expect(listContainer.children.length).toBe(2);
+
+      // empty files
+      (orchestratorStore as any).files = [];
+      component.updateFileList(db);
+      expect(
+        listContainer.querySelector("shadow-claw-empty-state"),
+      ).not.toBeNull();
+
+      document.body.removeChild(component);
+    });
+  });
 });