rails_mcp_engine 0.1.0

data/app/views/rails_mcp_engine/chat/show.html.erb

@@ -0,0 +1,478 @@
+<div class="chat-container">
+  <div class="chat-header">
+    <h2>Chat with LLM</h2>
+    <div class="chat-controls">
+      <div class="control-group">
+        <label for="model-select">Model:</label>
+        <select id="model-select">
+          <% @models.each do |model| %>
+            <option value="<%= model %>" <%= 'selected' if model == 'gpt-4o' %>><%= model %></option>
+          <% end %>
+        </select>
+      </div>
+      <div class="control-group">
+        <span class="tools-count"><%= @tools.length %> tools available</span>
+      </div>
+      <div class="control-group">
+        <button id="clear-chat-button" onclick="clearConversation()" class="clear-button">Clear Chat</button>
+      </div>
+    </div>
+  </div>
+
+  <div class="chat-messages" id="chat-messages">
+    <div class="welcome-message">
+      <h3>Welcome to LLM Chat Testing</h3>
+      <p>This interface allows you to chat with OpenAI models using all registered tools.</p>
+      <p><strong>Available tools:</strong></p>
+      <ul>
+        <% @tools.each do |tool| %>
+          <li><code><%= tool[:name] %></code> - <%= tool[:description] %></li>
+        <% end %>
+      </ul>
+      <p>Select a model and start chatting!</p>
+    </div>
+  </div>
+
+  <div class="chat-input-container">
+    <textarea id="chat-input" placeholder="Type your message..." rows="3"></textarea>
+    <div class="button-row">
+      <button id="send-button" onclick="sendMessage()">Send</button>
+    </div>
+  </div>
+
+</div>
+
+<script>
+let conversationHistory = [];
+
+// Load conversation history from localStorage on page load
+function initializeChat() {
+  // Restore conversation history
+  const savedHistory = localStorage.getItem('chat_conversation_history');
+  if (savedHistory) {
+    try {
+      conversationHistory = JSON.parse(savedHistory);
+      // Restore messages to UI
+      conversationHistory.forEach(msg => {
+        addMessageToUI(msg.role, msg.content);
+      });
+    } catch (e) {
+      console.error('Failed to load conversation history:', e);
+      conversationHistory = [];
+    }
+  }
+
+  // Restore selected model
+  const savedModel = localStorage.getItem('chat_selected_model');
+  if (savedModel) {
+    const modelSelect = document.getElementById('model-select');
+    if (modelSelect) {
+      modelSelect.value = savedModel;
+    }
+  }
+
+  // Save model selection on change
+  const modelSelect = document.getElementById('model-select');
+  if (modelSelect) {
+    modelSelect.addEventListener('change', (e) => {
+      localStorage.setItem('chat_selected_model', e.target.value);
+    });
+  }
+}
+
+document.addEventListener('DOMContentLoaded', initializeChat);
+
+  function setupChatInput() {
+    const chatInput = document.getElementById('chat-input');
+    if (!chatInput) return;
+
+    // Idempotent attachment
+    if (chatInput.dataset.listenerAttached === 'true') return;
+
+    chatInput.addEventListener('keydown', handleChatInputKeydown);
+    chatInput.dataset.listenerAttached = 'true';
+  }
+
+  function handleChatInputKeydown(e) {
+    if (e.key === 'Enter' && !e.shiftKey) {
+      if (e.isComposing) return;
+      e.preventDefault();
+      sendMessage();
+    }
+  }
+
+  // Initialize
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', setupChatInput);
+  } else {
+    setupChatInput();
+  }
+
+function sendMessage() {
+  const input = document.getElementById('chat-input');
+  const message = input.value.trim();
+  const model = document.getElementById('model-select').value;
+
+  if (!message) return;
+
+  // Clear input
+  input.value = '';
+
+  // Add user message to UI
+  addMessageToUI('user', message);
+
+  // Disable send button
+  const sendButton = document.getElementById('send-button');
+  sendButton.disabled = true;
+  sendButton.textContent = 'Sending...';
+
+  // Send to server
+  fetch('<%= chat_send_path %>', {
+    method: 'POST',
+    headers: {
+      'Content-Type': 'application/json',
+      'X-CSRF-Token': document.querySelector('[name="csrf-token"]').content
+    },
+    body: JSON.stringify({
+      message: message,
+      model: model,
+      conversation_history: JSON.stringify(conversationHistory)
+    })
+  })
+  .then(response => response.json())
+  .then(data => {
+    if (data.error) {
+      addMessageToUI('error', data.error);
+    } else {
+      conversationHistory = data.conversation_history;
+      
+      // Save to localStorage
+      localStorage.setItem('chat_conversation_history', JSON.stringify(conversationHistory));
+
+      // Display tool results if any
+      if (data.tool_results && data.tool_results.length > 0) {
+        data.tool_results.forEach(toolResult => {
+          addToolResultToUI(toolResult);
+        });
+      }
+
+      // Display final assistant message
+      const lastMessage = conversationHistory[conversationHistory.length - 1];
+      if (lastMessage && lastMessage.role === 'assistant') {
+        addMessageToUI('assistant', lastMessage.content);
+      }
+    }
+  })
+  .catch(error => {
+    addMessageToUI('error', 'Network error: ' + error.message);
+  })
+  .finally(() => {
+    sendButton.disabled = false;
+    sendButton.textContent = 'Send';
+  });
+}
+
+function addMessageToUI(role, content) {
+  const messagesContainer = document.getElementById('chat-messages');
+  const messageDiv = document.createElement('div');
+  messageDiv.className = `message message-${role}`;
+
+  const roleLabel = document.createElement('div');
+  roleLabel.className = 'message-role';
+  roleLabel.textContent = role === 'user' ? 'You' : role === 'assistant' ? 'Assistant' : 'Error';
+
+  const contentDiv = document.createElement('div');
+  contentDiv.className = 'message-content';
+  contentDiv.textContent = content || '(no content)';
+
+  messageDiv.appendChild(roleLabel);
+  messageDiv.appendChild(contentDiv);
+  messagesContainer.appendChild(messageDiv);
+
+  // Scroll to bottom
+  messagesContainer.scrollTop = messagesContainer.scrollHeight;
+}
+
+function addToolResultToUI(toolResult) {
+  const messagesContainer = document.getElementById('chat-messages');
+  const toolDiv = document.createElement('div');
+  toolDiv.className = 'message message-tool';
+
+  const toolHeader = document.createElement('div');
+  toolHeader.className = 'tool-header';
+  toolHeader.innerHTML = `<strong>🔧 Tool Call:</strong> <code>${toolResult.name}</code>`;
+
+  const toolContent = document.createElement('div');
+  toolContent.className = 'tool-content';
+
+  const argsDiv = document.createElement('div');
+  argsDiv.innerHTML = `<strong>Arguments:</strong> <pre>${JSON.stringify(toolResult.arguments, null, 2)}</pre>`;
+
+  const resultDiv = document.createElement('div');
+  resultDiv.innerHTML = `<strong>Result:</strong> <pre>${toolResult.content}</pre>`;
+
+  toolContent.appendChild(argsDiv);
+  toolContent.appendChild(resultDiv);
+
+  toolDiv.appendChild(toolHeader);
+  toolDiv.appendChild(toolContent);
+  messagesContainer.appendChild(toolDiv);
+
+  // Scroll to bottom
+  messagesContainer.scrollTop = messagesContainer.scrollHeight;
+}
+
+function clearConversation() {
+  if (confirm('Clear all conversation history?')) {
+    conversationHistory = [];
+    localStorage.removeItem('chat_conversation_history');
+    
+    // Clear UI - remove all messages except welcome message
+    const messagesContainer = document.getElementById('chat-messages');
+    const messages = messagesContainer.querySelectorAll('.message');
+    messages.forEach(msg => msg.remove());
+  }
+}
+</script>
+
+<style>
+.chat-container {
+  height: calc(100vh - 8rem);
+  display: flex;
+  flex-direction: column;
+  background: white;
+  border-radius: 12px;
+  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
+}
+
+.chat-header {
+  padding: 1rem 1.5rem;
+  border-bottom: 1px solid #e5e7eb;
+  background: #f9fafb;
+  border-radius: 12px 12px 0 0;
+}
+
+.chat-header h2 {
+  margin: 0 0 0.75rem 0;
+  font-size: 1.25rem;
+}
+
+.chat-controls {
+  display: flex;
+  gap: 1rem;
+  flex-wrap: wrap;
+  align-items: center;
+}
+
+.control-group {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+}
+
+.control-group label {
+  font-size: 0.9rem;
+  font-weight: 500;
+  color: #374151;
+}
+
+.control-group select {
+  padding: 0.4rem 0.6rem;
+  border: 1px solid #d1d5db;
+  border-radius: 6px;
+  font-size: 0.9rem;
+}
+
+.tools-count {
+  font-size: 0.85rem;
+  color: #6b7280;
+  padding: 0.4rem 0.8rem;
+  background: #eef2ff;
+  border-radius: 6px;
+}
+
+.clear-button {
+  padding: 0.4rem 0.8rem;
+  background: #ef4444;
+  color: white;
+  border: none;
+  border-radius: 6px;
+  font-size: 0.85rem;
+  font-weight: 500;
+  cursor: pointer;
+  transition: background 0.2s;
+}
+
+.clear-button:hover {
+  background: #dc2626;
+}
+
+.chat-messages {
+  flex: 1;
+  overflow-y: auto;
+  padding: 1.5rem;
+  background: #ffffff;
+}
+
+.welcome-message {
+  background: #f0f9ff;
+  border: 1px solid #bae6fd;
+  border-radius: 8px;
+  padding: 1.5rem;
+  color: #0c4a6e;
+}
+
+.welcome-message h3 {
+  margin-top: 0;
+  color: #0369a1;
+}
+
+.welcome-message ul {
+  margin: 0.5rem 0;
+}
+
+.welcome-message code {
+  background: #e0f2fe;
+  padding: 0.15rem 0.4rem;
+  border-radius: 3px;
+  font-size: 0.9rem;
+}
+
+.message {
+  margin-bottom: 1.5rem;
+  animation: fadeIn 0.3s;
+}
+
+@keyframes fadeIn {
+  from { opacity: 0; transform: translateY(10px); }
+  to { opacity: 1; transform: translateY(0); }
+}
+
+.message-role {
+  font-weight: 600;
+  font-size: 0.85rem;
+  margin-bottom: 0.5rem;
+  color: #6b7280;
+}
+
+.message-user .message-role {
+  color: #3730a3;
+}
+
+.message-assistant .message-role {
+  color: #059669;
+}
+
+.message-error .message-role {
+  color: #dc2626;
+}
+
+.message-content {
+  background: #f3f4f6;
+  padding: 0.75rem 1rem;
+  border-radius: 8px;
+  line-height: 1.6;
+  white-space: pre-wrap;
+}
+
+.message-user .message-content {
+  background: #eef2ff;
+  color: #1e1b4b;
+}
+
+.message-assistant .message-content {
+  background: #f0fdf4;
+  color: #14532d;
+}
+
+.message-error .message-content {
+  background: #fef2f2;
+  color: #7f1d1d;
+}
+
+.message-tool {
+  background: #fffbeb;
+  border: 1px solid #fde68a;
+  border-radius: 8px;
+  padding: 1rem;
+  margin-bottom: 1.5rem;
+}
+
+.tool-header {
+  margin-bottom: 0.75rem;
+  color: #78350f;
+}
+
+.tool-header code {
+  background: #fef3c7;
+  padding: 0.15rem 0.5rem;
+  border-radius: 4px;
+}
+
+.tool-content {
+  font-size: 0.9rem;
+}
+
+.tool-content pre {
+  background: #fefce8;
+  padding: 0.5rem;
+  border-radius: 4px;
+  overflow-x: auto;
+  margin: 0.25rem 0;
+  font-size: 0.85rem;
+}
+
+.chat-input-container {
+  padding: 1rem 1.5rem;
+  border-top: 1px solid #e5e7eb;
+  background: #f9fafb;
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem;
+  border-radius: 0 0 12px 12px;
+}
+
+.button-row {
+  display: flex;
+  justify-content: flex-end;
+  width: 100%;
+}
+
+
+#chat-input {
+  width: 100%;
+  padding: 0.75rem;
+  border: 1px solid #d1d5db;
+  border-radius: 8px;
+  font-family: inherit;
+  font-size: 0.95rem;
+  resize: none;
+  box-sizing: border-box;
+}
+
+#chat-input:focus {
+  outline: none;
+  border-color: #3b82f6;
+  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
+}
+
+#send-button {
+  padding: 0.75rem 1.5rem;
+  background: #3b82f6;
+  color: white;
+  border: none;
+  border-radius: 8px;
+  font-weight: 600;
+  cursor: pointer;
+  transition: background 0.2s;
+}
+
+#send-button:hover:not(:disabled) {
+  background: #2563eb;
+}
+
+#send-button:disabled {
+  background: #9ca3af;
+  cursor: not-allowed;
+}
+</style>

data/app/views/rails_mcp_engine/playground/show.html.erb

@@ -0,0 +1,138 @@
+
+<div class="card">
+  <h2>Registered tools</h2>
+  <% if @tools.empty? %>
+    <p>No tools have been registered yet. Start by adding one above.</p>
+  <% else %>
+    <ul class="tool-list">
+      <% @tools.each_with_index do |tool, index| %>
+        <li class="tool-item">
+          <div class="tool-header">
+            <div onclick="toggleToolDetails(<%= index %>)" style="flex: 1; display: flex; align-items: center; cursor: pointer;">
+              <span class="pill"><%= tool[:name] %></span>
+              <strong><%= tool[:description] %></strong>
+              <span class="expand-icon" id="expand-icon-<%= index %>">▼</span>
+            </div>
+            <%= button_to 'Delete', playground_delete_tool_path(tool[:name]), 
+                method: :delete, 
+                class: 'delete-tool-btn',
+                data: { confirm: "Are you sure you want to delete '#{tool[:name]}'?" } %>
+          </div>
+          <div class="tool-details" id="tool-details-<%= index %>" style="display: none;">
+            <div class="detail-section">
+              <h4>Parameters</h4>
+              <% if tool[:params].empty? %>
+                <p class="no-params">No parameters</p>
+              <% else %>
+                <table class="params-table">
+                  <thead>
+                    <tr>
+                      <th>Name</th>
+                      <th>Type</th>
+                      <th>Required</th>
+                      <th>Description</th>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    <% tool[:params].each do |param| %>
+                      <tr>
+                        <td><code><%= param[:name] %></code></td>
+                        <td><span class="type-badge"><%= param[:type] %></span></td>
+                        <td><%= param[:required] ? '✓' : '✗' %></td>
+                        <td><%= param[:description] || '-' %></td>
+                      </tr>
+                      <% if param[:enum].present? %>
+                        <tr class="enum-row">
+                          <td colspan="4">
+                            <strong>Allowed values:</strong> <%= param[:enum].join(', ') %>
+                          </td>
+                        </tr>
+                      <% end %>
+                      <% if param[:children].present? %>
+                        <tr class="children-row">
+                          <td colspan="4">
+                            <strong>Nested fields:</strong>
+                            <ul class="nested-params">
+                              <% param[:children].each do |child| %>
+                                <li>
+                                  <code><%= child[:name] %></code>
+                                  (<span class="type-badge"><%= child[:type] %></span>)
+                                  <%= child[:required] ? '[required]' : '[optional]' %>
+                                  - <%= child[:description] || 'No description' %>
+                                </li>
+                              <% end %>
+                            </ul>
+                          </td>
+                        </tr>
+                      <% end %>
+                    <% end %>
+                  </tbody>
+                </table>
+              <% end %>
+            </div>
+            <div class="detail-section">
+              <h4>Return Type</h4>
+              <p><span class="type-badge"><%= tool[:return_type][:type] %></span></p>
+            </div>
+            <div class="detail-section">
+              <h4>Full Schema</h4>
+              <pre><%= JSON.pretty_generate(tool.except(:service_class)) %></pre>
+            </div>
+          </div>
+        </li>
+      <% end %>
+    </ul>
+  <% end %>
+</div>
+
+<div class="card">
+  <h2>Register a tool service</h2>
+  <p>Paste a Ruby class that extends <code>ToolMeta</code> and has a Sorbet signature. The controller will evaluate it and register both RubyLLM and FastMCP tool wrappers.</p>
+  <%= form_with url: playground_register_path, method: :post do %>
+    <label for="source">Tool class source code</label><br>
+    <%= text_area_tag :source, params[:source], placeholder: "class Tools::EchoService\n  extend T::Sig\n  extend ToolMeta\n\n  tool_description 'Echoes the provided payload'\n  tool_param :message, description: 'Message to return'\n\n  sig { params(message: String).returns(String) }\n  def call(message:)\n    message\n  end\nend" %>
+    <div class="actions">
+      <%= submit_tag 'Register tool' %>
+    </div>
+  <% end %>
+
+  <% if @register_result.present? %>
+    <h3>Registration response</h3>
+    <pre><%= JSON.pretty_generate(@register_result) %></pre>
+  <% end %>
+</div>
+
+<div class="card">
+  <h2>Run a tool</h2>
+  <p>Select a tool and provide JSON arguments to send through the generated RubyLLM wrapper.</p>
+  <%= form_with url: playground_run_path, method: :post do %>
+    <label for="tool_name">Tool name</label><br>
+    <%= select_tag :tool_name, options_for_select(@tools.map { |schema| [schema[:name], schema[:name]] }, params[:tool_name]), prompt: 'Choose a tool' %>
+    <br><br>
+    <label for="arguments">Arguments (JSON)</label><br>
+    <%= text_area_tag :arguments, params[:arguments], placeholder: '{"message": "Hello"}' %>
+    <div class="actions">
+      <%= submit_tag 'Run tool' %>
+    </div>
+  <% end %>
+
+  <% if @test_result.present? %>
+    <h3>Execution response</h3>
+    <pre><%= JSON.pretty_generate(@test_result) %></pre>
+  <% end %>
+</div>
+
+<script>
+function toggleToolDetails(index) {
+  const details = document.getElementById('tool-details-' + index);
+  const icon = document.getElementById('expand-icon-' + index);
+  
+  if (details.style.display === 'none') {
+    details.style.display = 'block';
+    icon.textContent = '▲';
+  } else {
+    details.style.display = 'none';
+    icon.textContent = '▼';
+  }
+}
+</script>

data/config/routes.rb

@@ -0,0 +1,9 @@
+RailsMcpEngine::Engine.routes.draw do
+  get 'playground', to: 'playground#show', as: :playground
+  post 'playground/register', to: 'playground#register', as: :playground_register
+  post 'playground/run', to: 'playground#run', as: :playground_run
+  delete 'playground/delete/:tool_name', to: 'playground#delete_tool', as: :playground_delete_tool
+
+  get 'chat', to: 'chat#show', as: :chat
+  post 'chat/send', to: 'chat#send_message', as: :chat_send
+end

data/lib/rails_mcp_engine/engine.rb

@@ -0,0 +1,42 @@
+require 'rails'
+require 'ruby_llm'
+require 'fast_mcp'
+
+module RailsMcpEngine
+  class Engine < ::Rails::Engine
+    isolate_namespace RailsMcpEngine
+
+    # Define the base class expected by the engine, inheriting from the real gem
+    # This ensures ApplicationTool is available to the host app and the engine
+    initializer 'rails_mcp_engine.define_base_class' do
+      unless defined?(::ApplicationTool)
+        class ::ApplicationTool < FastMcp::Tool
+        end
+      end
+    end
+
+    # Add engine directories to LOAD_PATH so internal requires work
+    config.before_configuration do
+      $LOAD_PATH.unshift root.join('app/lib').to_s
+      $LOAD_PATH.unshift root.join('app/services').to_s
+    end
+
+    # Trigger tool generation on boot and reload
+    config.to_prepare do
+      RailsMcpEngine::Engine.build_tools!
+    end
+
+    def self.build_tools!
+      # Ensure all services are loaded so they register in ToolMeta
+      # This is critical for development mode where autoloading is lazy
+      # and for test mode where eager_load is false
+      Rails.application.eager_load! unless Rails.application.config.eager_load
+
+      ToolMeta.registry.each do |service_class|
+        schema = ToolSchema::Builder.build(service_class)
+        ToolSchema::RubyLlmFactory.build(service_class, schema)
+        ToolSchema::FastMcpFactory.build(service_class, schema)
+      end
+    end
+  end
+end

data/lib/rails_mcp_engine/version.rb

@@ -0,0 +1,3 @@
+module RailsMcpEngine
+  VERSION = '0.1.0'
+end

data/lib/rails_mcp_engine.rb

@@ -0,0 +1,6 @@
+require 'rails_mcp_engine/version'
+require 'rails_mcp_engine/engine'
+
+module RailsMcpEngine
+  # Your code goes here...
+end