Method display

src/gui/ModelDirectoryModal.ts:46–101

()

  }

  private display() {
    this.contentEl.empty();
    this.modalEl.addClass("qa-ai-wide-modal");
    this.contentEl.addClass("qa-ai-scroll-content");

    this.contentEl.createEl("h2", {
      text: `Browse models for ${this.provider.name}`,
      cls: "qa-modal-title",
    });

    // Search/filter
    new Setting(this.contentEl)
      .setName("Search")
      .addText((text) => {
        text.setPlaceholder("Filter by name").onChange((value) => {
          const q = value.trim().toLowerCase();
          this.filtered = this.allModels.filter((m) => m.name.toLowerCase().includes(q));
          this.renderList();
        });
      })
      .addExtraButton((btn) => {
        btn.setIcon("check");
        btn.setTooltip("Select all");
        btn.onClick(() => {
          this.filtered.forEach((m) => this.selectedIds.add(m.name));
          this.renderList();
        });
      })
      .addExtraButton((btn) => {
        btn.setIcon("x");
        btn.setTooltip("Clear selection");
        btn.onClick(() => {
          this.selectedIds.clear();
          this.renderList();
        });
      });

    // Mode toggle
    new Setting(this.contentEl)
      .setName("Import mode")
      .setDesc("Add will append new models. Replace will overwrite existing models with the selected list.")
      .addDropdown((dd) => {
        dd.addOption("add", "Add only");
        dd.addOption("replace", "Replace existing");
        dd.setValue(this.mode);
        dd.onChange((v) => (this.mode = v as "add" | "replace"));
      })
      .addButton((b) => {
        b.setButtonText("Import selected").setCta().onClick(() => this.importSelected());
      });

    // List container
    this.contentEl.createDiv({ cls: "qa-model-directory" });

    this.renderList();
  }

  private renderList() {