Slack Block Kit UI Responses

Render rich, interactive Block Kit messages in Slack from AI agent tool results.

Problem Statement

Plain text responses limit how agents can present information. Block Kit enables rich formatting - headers, sections, images, buttons - making agent responses more useful and actionable.

When to Use

• Displaying structured data (weather, reports, dashboards) in Slack
• Adding interactive buttons to agent responses
• Rendering multi-section content with formatting
• Keywords: block kit, slack blocks, rich messages, interactive messages, slack ui

Quick Start

# MCP tool returns Block Kit as resource
WidgetTemplateService.hydrate_for_tool_result(
  template: :weatherCurrent,
  slack_blocks_template: :slackBlockKitWeatherCurrent,
  data: { location: "Toronto", temperature: "-5°C" },
  text: "Current weather in Toronto"
)

Architecture

Tool Call → MCP Server → Tool Result with slack://blocks/ resource
    ↓
SlackResourceExtractor detects blocks
    ↓
SlackTaskResponseService sends chat_postMessage with blocks

Resource Format

{
  type: "resource",
  resource: {
    uri: "slack://blocks/weather/uuid",
    mimeType: "application/vnd.slack.blocks+json",
    text: '{ "blocks": [...] }'
  }
}

Key Constants

# app/mcp_servers/base_mcp_server.rb
SLACK_BLOCKS_MIME_TYPE = "application/vnd.slack.blocks+json"
SLACK_BLOCKS_URI_PREFIX = "slack://blocks/"

Testing Strategy

RSpec.describe SlackResourceExtractor do
  let(:message) { create(:message, metadata: block_kit_metadata) }

  it "detects block kit resources" do
    expect(described_class.has_blocks?(message)).to be true
  end

  it "extracts blocks array" do
    result = described_class.extract_blocks(message)
    expect(result[:blocks]).to be_an(Array)
  end
end

Block Kit Limits

• Maximum 50 blocks per message
• Maximum 3000 characters per text field
• Maximum 10 elements per actions block

Common Pitfalls

• Text fallback required: Always provide text: for notifications
• Text type matters: Use mrkdwn for formatting, plain_text for buttons
• Image URLs: Must be HTTPS and publicly accessible
• Action IDs: Must be unique within the message

Reference Files

• extractor.md - SlackResourceExtractor for detecting/extracting blocks
• response-service.md - SlackTaskResponseService orchestration
• mrkdwn.md - Markdown to mrkdwn conversion
• templates.md - YAML Block Kit template patterns
• actions.md - Handling button interactions