podman-desktop-extension-ai-lab icon indicating copy to clipboard operation
podman-desktop-extension-ai-lab copied to clipboard

feat(playground): mcp servers listed

Open manusa opened this issue 6 months ago • 2 comments

What does this PR do?

Adds a UI element to be able to (later) activate/deactivate MCP Servers and their specific tools (even later).

This is the first iteration just to validate that the UI is aligned with the current expectation. The next immediate iteration would be to add functionality to the checkboxes of the servers. With this regard it would be good to know what effect we want for them. For example, do we want them to be mapped to the file entries and update them there?

Screenshot / video of UI

https://github.com/user-attachments/assets/0597fa21-759f-42fe-a867-60158f22cec8

What issues does this PR fix or reference?

Part of #2885

How to test this PR?

  • Create or update a file ~/.local/share/containers/podman-desktop/extensions-storage/redhat.ai-lab/mcp-settings.json.
  • Set the following content to the file:
    {
      "servers": {
        "time": {
          "enabled": true,
          "type": "stdio",
          "command": "podman",
          "args": ["run", "-i", "--rm", "docker.io/mcp/time"]
        }
      }
    }
    
  • Create a new playground.
  • A new button with label MCP Servers should be visible in the Settings pane.
  • Press the button
  • A modal window should be visible with the list of servers and a checkbox nest to each entry.
    • The checkbox has no effect at the moment.
  • By modifying the file: enabling/disabling entries, adding new entries, etc.
    • Entries in the list should get automatically updated
    • If no entries are enabled, the button shouldn't be visible.

manusa avatar May 22 '25 10:05 manusa

Works as described, only similar thing that comes to my mind is changing contexts: image

  • now you can select only one context, but we might want to update it to support checkboxes?

gastoner avatar May 22 '25 13:05 gastoner

For additional reference, this is how a similar UI looks like in VSCode:

image

I tried to use the DropDown component first, but (besides some issues with the parent component's overflow-y:auto) it seemed incompatible with what we're aiming for here.

manusa avatar May 22 '25 13:05 manusa

LGTM codewise as well! probs needs a rebase

bmahabirbu avatar Jun 16 '25 13:06 bmahabirbu

Hi, sorry for the delayed reply, it's been a really busy week

the style for the MCP servers is not aligned with other sections titles in the left pane

image Maybe an optical effect? or are you referring to something else?

when clicking on MCP servers, the UI is displayed in the middle of the page which seems strange to me

Where would you want to locate it. Maybe top of the screen?

once the MCP servers are displayed, clicking Escape to close will close the playground and return to the list of playgrounds

Looking into it.

manusa avatar Jun 19 '25 11:06 manusa