diff --git a/client/src/components/ResourcesTab.tsx b/client/src/components/ResourcesTab.tsx index 35742799..2491e1c5 100644 --- a/client/src/components/ResourcesTab.tsx +++ b/client/src/components/ResourcesTab.tsx @@ -248,6 +248,18 @@ const ResourcesTab = ({ id={key} placeholder={`Enter ${key}`} value={templateValues[key] || ""} + emptyMessage={ + <div className="px-6"> + This resource does not support{" "} + <a + href="https://modelcontextprotocol.io/specification/2025-03-26/server/utilities/completion" + target="_blank" + > + completions + </a> + . + </div> + } onChange={(value) => handleTemplateValueChange(key, value) } diff --git a/client/src/components/__tests__/combobox.tsx b/client/src/components/__tests__/combobox.tsx new file mode 100644 index 00000000..167eee66 --- /dev/null +++ b/client/src/components/__tests__/combobox.tsx @@ -0,0 +1,41 @@ +import { render, screen, fireEvent } from "@testing-library/react"; +import "@testing-library/jest-dom"; +import { describe, it } from "@jest/globals"; +import { Combobox } from "../ui/combobox"; + +describe("combobox", () => { + it("should render custom empty message", async () => { + const customMessage = ( + <div data-testid="custom-empty">Custom empty message</div> + ); + render( + <Combobox + value="" + onChange={() => {}} + onInputChange={() => {}} + options={[]} + emptyMessage={customMessage} + />, + ); + + fireEvent.click(screen.getByRole("combobox")); + + expect(await screen.findByTestId("custom-empty")).toBeInTheDocument(); + expect(screen.getByText("Custom empty message")).toBeInTheDocument(); + }); + + it("should render default empty message", async () => { + render( + <Combobox + value="" + onChange={() => {}} + onInputChange={() => {}} + options={[]} + />, + ); + + fireEvent.click(screen.getByRole("combobox")); + + expect(await screen.findByText("No results found.")).toBeInTheDocument(); + }); +}); diff --git a/client/src/components/ui/combobox.tsx b/client/src/components/ui/combobox.tsx index 02624086..337c566b 100644 --- a/client/src/components/ui/combobox.tsx +++ b/client/src/components/ui/combobox.tsx @@ -21,7 +21,7 @@ interface ComboboxProps { onInputChange: (value: string) => void; options: string[]; placeholder?: string; - emptyMessage?: string; + emptyMessage?: string | React.ReactNode; id?: string; } diff --git a/client/src/index.css b/client/src/index.css index 858f9e7f..3c00cad1 100644 --- a/client/src/index.css +++ b/client/src/index.css @@ -91,7 +91,7 @@ h1 { --muted-foreground: 215 20.2% 65.1%; --accent: 217.2 32.6% 17.5%; --accent-foreground: 210 40% 98%; - --destructive: 0 62.8% 30.6%; + --destructive: 0 81.8% 54.6%; --destructive-foreground: 210 40% 98%; --border: 217.2 24% 24%; --input: 217.2 24% 24%;