/**
 * File browser tests — tree, file viewer, editor, image/pdf/csv support.
 */

describe("File browser", () => {
  it("should render the file browser container", async () => {
    // File browser lives inside a project card tab
    const fb = await $(".file-browser");
    if (await fb.isExisting()) {
      expect(await fb.isDisplayed()).toBe(true);
    }
  });

  it("should show the tree panel", async () => {
    const tree = await $(".fb-tree");
    if (await tree.isExisting()) {
      expect(await tree.isDisplayed()).toBe(true);
    }
  });

  it("should show the viewer panel", async () => {
    const viewer = await $(".fb-viewer");
    if (await viewer.isExisting()) {
      expect(await viewer.isDisplayed()).toBe(true);
    }
  });

  it("should show directory rows in tree", async () => {
    const dirs = await $$(".fb-dir");
    if (dirs.length > 0) {
      expect(dirs[0]).toBeDefined();
      expect(await dirs[0].isDisplayed()).toBe(true);
    }
  });

  it("should show file rows in tree", async () => {
    const files = await $$(".fb-file");
    if (files.length > 0) {
      expect(files[0]).toBeDefined();
    }
  });

  it("should show 'Select a file' placeholder when no file selected", async () => {
    const empty = await $(".fb-empty");
    if (await empty.isExisting()) {
      const text = await empty.getText();
      expect(text.toLowerCase()).toContain("select");
    }
  });

  it("should expand a directory on click", async () => {
    const dirs = await $$(".fb-dir");
    if (dirs.length === 0) return;

    await dirs[0].click();
    await browser.pause(500);

    // Check if chevron rotated (open class)
    const chevron = await dirs[0].$(".fb-chevron");
    if (await chevron.isExisting()) {
      const cls = await chevron.getAttribute("class");
      expect(cls).toContain("open");
    }
  });

  it("should select a file and show editor header", async () => {
    const files = await $$(".fb-file");
    if (files.length === 0) return;

    await files[0].click();
    await browser.pause(500);

    // Should show either editor header or image or empty
    const header = await $(".fb-editor-header");
    const image = await $(".fb-image-wrap");
    const error = await $(".fb-error");
    const loading = await $(".fb-empty");

    const anyVisible =
      (await header.isExisting() && await header.isDisplayed()) ||
      (await image.isExisting() && await image.isDisplayed()) ||
      (await error.isExisting()) ||
      (await loading.isExisting());

    expect(anyVisible).toBe(true);
  });

  it("should show file type icon in tree", async () => {
    const icons = await $$(".file-type");
    if (icons.length > 0) {
      const text = await icons[0].getText();
      expect(text.length).toBeGreaterThan(0);
    }
  });

  it("should show selected state on clicked file", async () => {
    const files = await $$(".fb-file");
    if (files.length === 0) return;

    await files[0].click();
    await browser.pause(300);

    const cls = await files[0].getAttribute("class");
    expect(cls).toContain("selected");
  });
});