# mcp-apps-generative-ui-showcase (Docker)

Empacotamento em container do **MCP Apps Generative UI Showcase** — reserve voos, hotéis,
monte portfólios e gerencie um kanban **dentro do chat**. Cada ferramenta do servidor MCP é
ligada a um app HTML/JS que a interface monta como um **iframe sandbox** na conversa
(MCP Apps Extension, SEP-1865). Front **Next.js** com **CopilotKit** + **AG-UI** e um
**servidor MCP** Node/Express que registra as ferramentas e serve os apps.

- **Upstream (Apache-2.0):** [Shubhamsaboo/awesome-llm-apps](https://github.com/Shubhamsaboo/awesome-llm-apps) — `generative_ui_agents/mcp-apps-generative-ui-showcase`
- **Imagem:** `ghcr.io/marcelofmatos/mcp-apps-generative-ui-showcase`
- **Stack Portainer:** [`marcelofmatos/portainer-stacks`](https://github.com/marcelofmatos/portainer-stacks) → `mcp-apps-showcase/`

## Arquitetura da imagem

Imagem **combinada node-only** (um único container roda os dois processos Node):

| Processo | Porta | Papel |
|---|---|---|
| Next.js (`next start`) | `3000` | UI web (exposta) — CopilotKit runtime; detém a `OPENAI_API_KEY`; fala com o MCP via `MCP_SERVER_URL` |
| MCP server (`node dist/server.js`) | `3001` | Interno — registra ferramentas e serve os apps HTML em `/mcp`; `GET /health` |

O `entrypoint.sh` sobe o servidor MCP em background e serve o front em foreground; se qualquer
um dos dois cair, o container encerra (o orquestrador reinicia).

## Variáveis de ambiente

| Variável | Obrigatória | Default | Descrição |
|---|:---:|---|---|
| `OPENAI_API_KEY` | ✅ | — | Chave OpenAI usada pelo CopilotKit runtime (front) |
| `MCP_SERVER_URL` | ❌ | `http://localhost:3001/mcp` | URL front→servidor MCP |

## Uso rápido (Docker)

```bash
docker run --rm -p 3000:3000 \
  -e OPENAI_API_KEY=sk-... \
  ghcr.io/marcelofmatos/mcp-apps-generative-ui-showcase:latest
# abra http://localhost:3000
```

Experimente um dos prompts: *"Book a flight from JFK to LAX on January 20th for 2 passengers"*,
*"Create a $10,000 tech-focused portfolio"*, *"Create a kanban board for my software project"*.

## Build e release

Imagem publicada pelo workflow **🚀 Release and build** (`workflow_dispatch`): calcula a
próxima versão SemVer, cria tag + release e publica em `ghcr.io/marcelofmatos/mcp-apps-generative-ui-showcase`
com as tags `x.y.z`, `x.y`, `x` e `latest`. Build local:

```bash
docker build -t ghcr.io/marcelofmatos/mcp-apps-generative-ui-showcase:dev .
```

## Licença

Código da aplicação sob **Apache-2.0** (do upstream awesome-llm-apps). Ver [LICENSE](LICENSE).