feat: add models category (#8231)

* models category * [autofix.ci] apply automated fixes * change paths * [autofix.ci] apply automated fixes * test: comment out visibility check for disclosure-embeddings * test: comment out visibility check for disclosure-embeddings * test: update selector for OpenAI language models in decision flow integration test * test: update selector for NVIDIA models to use language model identifier * test: update selector for OpenAI language models in regression test * models category (#8238) * Update styleUtils.ts * Update test_xai.py * test: update selectors for OpenAI language models to use 'languagemodelsOpenAI' * Update test_embedding_model_component.py * test: update test IDs for NVIDIA and Ollama language models to use 'languagemodels' * test: update test IDs to use 'languagemodels' prefix for consistency --------- Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com> Co-authored-by: Deon Sanchez <69873175+deon-sanchez@users.noreply.github.com> Co-authored-by: deon-sanchez <deon.sanchez@datastax.com>
2025-05-28 14:09:15 -04:00 · 2025-05-28 14:09:15 -04:00 · b14189ed05
commit b14189ed05
parent 09a65f6f41
64 changed files with 152 additions and 143 deletions
--- a/src/frontend/src/utils/styleUtils.ts
+++ b/src/frontend/src/utils/styleUtils.ts
@ -208,11 +208,11 @@ export const SIDEBAR_CATEGORIES = [
  { display_name: "Inputs", name: "inputs", icon: "Download" },
  { display_name: "Outputs", name: "outputs", icon: "Upload" },
  { display_name: "Prompts", name: "prompts", icon: "TerminalSquare" },
+  { display_name: "Models", name: "models", icon: "BrainCog" },
  { display_name: "Data", name: "data", icon: "Database" },
  { display_name: "Processing", name: "processing", icon: "ListFilter" },
-  { display_name: "Models", name: "models", icon: "BrainCircuit" },
+
  { display_name: "Vector Stores", name: "vectorstores", icon: "Layers" },
-  { display_name: "Embeddings", name: "embeddings", icon: "Binary" },
  { display_name: "Agents", name: "agents", icon: "Bot" },
  { display_name: "Chains", name: "chains", icon: "Link" },
  { display_name: "Loaders", name: "documentloaders", icon: "Paperclip" },
@ -229,6 +229,12 @@ export const SIDEBAR_CATEGORIES = [
 ];

 export const SIDEBAR_BUNDLES = [
+  {
+    display_name: "Language Models",
+    name: "languagemodels",
+    icon: "BrainCircuit",
+  },
+  { display_name: "Embeddings", name: "embeddings", icon: "Binary" },
  { display_name: "Amazon", name: "amazon", icon: "Amazon" },
  { display_name: "Gmail", name: "gmail", icon: "Gmail" },
  { display_name: "GitHub", name: "github", icon: "Github" },
@ -309,7 +315,7 @@ export const nodeIconToDisplayIconMap: Record<string, string> = {
  outputs: "Upload",
  prompts: "TerminalSquare",
  data: "Database",
-  models: "BrainCircuit",
+  models: "BrainCog",
  helpers: "Wand2",
  vectorstores: "Layers",
  embeddings: "Binary",
@ -332,6 +338,8 @@ export const nodeIconToDisplayIconMap: Record<string, string> = {
  //Integration Icons
  AIML: "AI/ML",
  AgentQL: "AgentQL",
+  LanguageModels: "BrainCircuit",
+  EmbeddingModels: "Binary",
  AirbyteJSONLoader: "Airbyte",
  AmazonBedrockEmbeddings: "AWS",
  Amazon: "AWS",
--- a/src/frontend/tests/core/features/filterSidebar.spec.ts
+++ b/src/frontend/tests/core/features/filterSidebar.spec.ts
@ -119,7 +119,6 @@ test(
    await expect(page.getByTestId("disclosure-helpers")).toBeVisible();
    await expect(page.getByTestId("disclosure-vector stores")).toBeVisible();
    await expect(page.getByTestId("disclosure-prototypes")).toBeVisible();
-    await expect(page.getByTestId("disclosure-embeddings")).toBeVisible();
    await expect(page.getByTestId("disclosure-tools")).toBeVisible();

    await expect(page.getByTestId("dataAPI Request")).toBeVisible();
--- a/src/frontend/tests/core/features/globalVariables.spec.ts
+++ b/src/frontend/tests/core/features/globalVariables.spec.ts
@ -16,12 +16,12 @@ test(
    await page.getByTestId("sidebar-search-input").click();
    await page.getByTestId("sidebar-search-input").fill("openai");

-    await page.waitForSelector('[data-testid="modelsOpenAI"]', {
+    await page.waitForSelector('[data-testid="languagemodelsOpenAI"]', {
      timeout: 1000,
    });

    await page
-      .getByTestId("modelsOpenAI")
+      .getByTestId("languagemodelsOpenAI")
      .hover()
      .then(async () => {
        await page.getByTestId("add-component-button-openai").last().click();
--- a/src/frontend/tests/core/integrations/decisionFlow.spec.ts
+++ b/src/frontend/tests/core/integrations/decisionFlow.spec.ts
@ -164,11 +164,14 @@ test(
    //---------------------------------- OPENAI
    await page.getByTestId("sidebar-search-input").click();
    await page.getByTestId("sidebar-search-input").fill("openai");
-    await page.waitForSelector('[data-testid="modelsOpenAI"]', {
-      timeout: 2000,
-    });
+    await page.waitForSelector(
+      '[data-testid="languagemodels_openai_draggable"]',
+      {
+        timeout: 2000,
+      },
+    );
    await page
-      .getByTestId("modelsOpenAI")
+      .getByTestId("languagemodelsOpenAI")
      .dragTo(page.locator('//*[@id="react-flow-id"]'), {
        targetPosition: { x: 500, y: 300 },
      });
--- a/src/frontend/tests/core/integrations/textInputOutput.spec.ts
+++ b/src/frontend/tests/core/integrations/textInputOutput.spec.ts
@ -34,7 +34,7 @@ test.skip(
    await page.getByTestId("sidebar-search-input").fill("openai");
    await page.waitForTimeout(1000);
    await page
-      .getByTestId("modelsOpenAI")
+      .getByTestId("languagemodelsOpenAI")
      .dragTo(page.locator('//*[@id="react-flow-id"]'));
    await page.mouse.up();
    await page.mouse.down();
--- a/src/frontend/tests/core/unit/floatComponent.spec.ts
+++ b/src/frontend/tests/core/unit/floatComponent.spec.ts
@ -14,12 +14,12 @@ test(
    await page.getByTestId("sidebar-search-input").click();
    await page.getByTestId("sidebar-search-input").fill("nvidia");

-    await page.waitForSelector('[data-testid="modelsNVIDIA"]', {
+    await page.waitForSelector('[data-testid="languagemodelsNVIDIA"]', {
      timeout: 30000,
    });

    await page
-      .getByTestId("modelsNVIDIA")
+      .getByTestId("languagemodelsNVIDIA")
      .hover()
      .then(async () => {
        // Wait for the API request to complete after clicking the add button
--- a/src/frontend/tests/core/unit/intComponent.spec.ts
+++ b/src/frontend/tests/core/unit/intComponent.spec.ts
@ -12,12 +12,12 @@ test("IntComponent", { tag: ["@release", "@workspace"] }, async ({ page }) => {
  await page.getByTestId("sidebar-search-input").click();
  await page.getByTestId("sidebar-search-input").fill("openai");

-  await page.waitForSelector('[data-testid="modelsOpenAI"]', {
+  await page.waitForSelector('[data-testid="languagemodelsOpenAI"]', {
    timeout: 3000,
  });

  await page
-    .getByTestId("modelsOpenAI")
+    .getByTestId("languagemodelsOpenAI")
    .first()
    .dragTo(page.locator('//*[@id="react-flow-id"]'));

--- a/src/frontend/tests/core/unit/queryInputComponent.spec.ts
+++ b/src/frontend/tests/core/unit/queryInputComponent.spec.ts
@ -17,12 +17,12 @@ test(
    await page.getByTestId("sidebar-search-input").click();
    await page.getByTestId("sidebar-search-input").fill("openai");

-    await page.waitForSelector('[data-testid="modelsOpenAI"]', {
+    await page.waitForSelector('[data-testid="languagemodelsOpenAI"]', {
      timeout: 3000,
    });

    await page
-      .getByTestId("modelsOpenAI")
+      .getByTestId("languagemodelsOpenAI")
      .dragTo(page.locator('//*[@id="react-flow-id"]'));
    await page.mouse.up();
    await page.mouse.down();
--- a/src/frontend/tests/core/unit/sliderComponent.spec.ts
+++ b/src/frontend/tests/core/unit/sliderComponent.spec.ts
@ -17,12 +17,12 @@ test(
    await page.getByTestId("sidebar-search-input").click();
    await page.getByTestId("sidebar-search-input").fill("ollama");

-    await page.waitForSelector('[data-testid="modelsOllama"]', {
+    await page.waitForSelector('[data-testid="languagemodelsOllama"]', {
      timeout: 3000,
    });

    await page
-      .getByTestId("modelsOllama")
+      .getByTestId("languagemodelsOllama")
      .dragTo(page.locator('//*[@id="react-flow-id"]'));
    await page.mouse.up();
    await page.mouse.down();
--- a/src/frontend/tests/extended/features/auto-save-off.spec.ts
+++ b/src/frontend/tests/extended/features/auto-save-off.spec.ts
@ -31,12 +31,12 @@ test(
    await page.getByTestId("sidebar-search-input").click();
    await page.getByTestId("sidebar-search-input").fill("NVIDIA");

-    await page.waitForSelector('[data-testid="modelsNVIDIA"]', {
+    await page.waitForSelector('[data-testid="languagemodelsNVIDIA"]', {
      timeout: 3000,
    });

    await page
-      .getByTestId("modelsNVIDIA")
+      .getByTestId("languagemodelsNVIDIA")
      .dragTo(page.locator('//*[@id="react-flow-id"]'));
    await page.mouse.up();
    await page.mouse.down();
@ -85,7 +85,7 @@ test(
    await page.keyboard.press("Escape");
    await page.locator('//*[@id="react-flow-id"]').click();

-    const lastNvidiaModel = page.getByTestId("modelsNVIDIA").last();
+    const lastNvidiaModel = page.getByTestId("languagemodelsNVIDIA").last();
    await lastNvidiaModel.scrollIntoViewIfNeeded();

    try {
@ -128,12 +128,12 @@ test(
    await page.getByTestId("sidebar-search-input").click();
    await page.getByTestId("sidebar-search-input").fill("NVIDIA");

-    await page.waitForSelector('[data-testid="modelsNVIDIA"]', {
+    await page.waitForSelector('[data-testid="languagemodelsNVIDIA"]', {
      timeout: 3000,
    });

    await page
-      .getByTestId("modelsNVIDIA")
+      .getByTestId("languagemodelsNVIDIA")
      .dragTo(page.locator('//*[@id="react-flow-id"]'));
    await page.mouse.up();
    await page.mouse.down();
--- a/src/frontend/tests/extended/features/filterEdge-shard-1.spec.ts
+++ b/src/frontend/tests/extended/features/filterEdge-shard-1.spec.ts
@ -62,7 +62,6 @@ test(
      "disclosure-models",
      "disclosure-helpers",
      "disclosure-vector stores",
-      "disclosure-embeddings",
      "disclosure-agents",
      "disclosure-memories",
      "disclosure-logic",
@ -99,23 +98,23 @@ test(
    await page.getByTestId("sidebar-search-input").click();

    const visibleModelSpecsTestIds = [
-      "modelsAIML",
-      "modelsAnthropic",
-      "modelsAzure OpenAI",
-      "modelsCohere",
-      "modelsGoogle Generative AI",
-      "modelsGroq",
-      "modelsHuggingFace",
-      "modelsLM Studio",
-      "modelsMaritalk",
-      "modelsMistralAI",
-      "modelsNVIDIA",
-      "modelsOllama",
-      "modelsOpenAI",
-      "modelsPerplexity",
-      "modelsQianfan",
-      "modelsSambaNova",
-      "modelsVertex AI",
+      "languagemodelsAIML",
+      "languagemodelsAnthropic",
+      "languagemodelsAzure OpenAI",
+      "languagemodelsCohere",
+      "languagemodelsGoogle Generative AI",
+      "languagemodelsGroq",
+      "languagemodelsHuggingFace",
+      "languagemodelsLM Studio",
+      "languagemodelsMaritalk",
+      "languagemodelsMistralAI",
+      "languagemodelsNVIDIA",
+      "languagemodelsOllama",
+      "languagemodelsOpenAI",
+      "languagemodelsPerplexity",
+      "languagemodelsQianfan",
+      "languagemodelsSambaNova",
+      "languagemodelsVertex AI",
    ];

    await Promise.all(
--- a/src/frontend/tests/extended/features/langflowShortcuts.spec.ts
+++ b/src/frontend/tests/extended/features/langflowShortcuts.spec.ts
@ -16,12 +16,12 @@ test(
    await page.getByTestId("sidebar-search-input").click();
    await page.getByTestId("sidebar-search-input").fill("ollama");

-    await page.waitForSelector('[data-testid="modelsOllama"]', {
+    await page.waitForSelector('[data-testid="languagemodelsOllama"]', {
      timeout: 3000,
    });

    await page
-      .getByTestId("modelsOllama")
+      .getByTestId("languagemodelsOllama")
      .dragTo(page.locator('//*[@id="react-flow-id"]'));
    await page.mouse.up();
    await page.mouse.down();
--- a/src/frontend/tests/extended/regression/general-bugs-dropdown-select-not-in-list.spec.ts
+++ b/src/frontend/tests/extended/regression/general-bugs-dropdown-select-not-in-list.spec.ts
@ -14,12 +14,12 @@ test(
    await page.getByTestId("sidebar-search-input").click();
    await page.getByTestId("sidebar-search-input").fill("openai");

-    await page.waitForSelector('[data-testid="modelsOpenAI"]', {
+    await page.waitForSelector('[data-testid="languagemodelsOpenAI"]', {
      timeout: 1000,
    });

    await page
-      .getByTestId("modelsOpenAI")
+      .getByTestId("languagemodelsOpenAI")
      .hover()
      .then(async () => {
        await page.getByTestId("add-component-button-openai").last().click();
--- a/src/frontend/tests/extended/regression/generalBugs-shard-3.spec.ts
+++ b/src/frontend/tests/extended/regression/generalBugs-shard-3.spec.ts
@ -55,7 +55,7 @@ test(
    await page.getByTestId("sidebar-search-input").fill("openai");

    await page
-      .getByTestId("modelsOpenAI")
+      .getByTestId("languagemodelsOpenAI")
      .dragTo(page.locator('//*[@id="react-flow-id"]'), {
        targetPosition: { x: 100, y: 200 },
      });