Shopify Store Assistant — MCP server demo (ChatGPT App · Grok Bot connector · Muse-ready)

Portfolio demo by Tomi (https://ziy.one/). Default data is SAMPLE data from a fictional store (“Kopi & Co. Demo Store”). Not affiliated with Shopify.

A TypeScript MCP server (official @modelcontextprotocol/sdk 1.32, Streamable HTTP) that lets a store owner query products, inventory and orders from ChatGPT, Grok Bot or Cursor, and draft discount codes. Every tool has explicit safety bounds.

Architecture

flowchart LR
  subgraph Clients
    C1[ChatGPT Developer Mode]
    C2[Grok Bot / Cursor]
    C3[Muse connector / MCP Inspector]
  end
  C1 & C2 & C3 -- "OAuth 2.1 (DCR + PKCE S256)" --> AS[Built-in demo Authorization Server/register /authorize /token]
  C1 & C2 & C3 -- "Bearer token · Streamable HTTP POST /mcp" --> MW[Bearer middleware401 + WWW-Authenticate resource_metadata]
  MW --> MCP[McpServer per request6 tools + UI resource]
  MCP --> SAFE[Safety layerscope checks · 20% discount cap · PII masking · no refund/delete]
  SAFE --> AUD[(logs/audit.jsonl)]
  SAFE --> DATA{Store adapter}
  DATA -->|default| MOCK[Mock sample store]
  DATA -->|SHOPIFY_STORE_DOMAIN + SHOPIFY_ADMIN_TOKEN| SHOP[Shopify Admin GraphQLread-only, untested live]
  MCP --> UI[ui://shopify-assistant/product-list-v1.htmltext/html;profile=mcp-app]

Screenshots

These were captured with headless Chromium (Playwright) against the local server. All tool output is real; all store data is sample data. Regenerate them with npx tsx scripts/screenshots.ts.

Demo transcript covers product search with cards, order lookup with masked PII, a 15% discount draft that succeeds, an 80% discount blocked by the cap, and a rejected refund:

Walkthrough video: screenshots/walkthrough.mp4 (webm)

Tools

Safety bounds:

• There are no refund, delete, cancel or customer-edit tools.
• Discount drafts live in server memory and never change Shopify.
• Every call is appended to an audit log (JSONL, no tokens, no raw PII).
• Input is validated with zod.