llama_bot_rails 0.1.3 → 0.1.5

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 34248e0bbf8e8047cad5836f03e4f37a4b0cc84a5f152a9fcc486f7c32de50ed
-  data.tar.gz: 0e4a0a1f0d0939d042e21cd1e2745daeae241e33877febe7f45740679b94ff50
+  metadata.gz: 2e2df41e770f0dbcc740af59357462c33b0bcb87d3dd0394e343729d4d1a4a45
+  data.tar.gz: b7032c39fe95fc8e5dc5ab892c8abd28366c77db7c4826a29f6096511124e9ca
 SHA512:
-  metadata.gz: d5cee45f49487fcbf2203d326b62431c4c7fb540004e0004a7929b7ec6fe2487124ed146237333a10b5f75db0f2508d1f1b7e91c7fe41afc7eb67f02a6395231
-  data.tar.gz: a67f3f5278245e15a0b868a22b27bc56e317cdd3f2aa456ef9c60100bb4547abfabd50e6a37a84cc7a7cdf97e37e45a06ce17a9b1e4dd3cc9c55125834262d40
+  metadata.gz: 5b4ad9c9ce5bbb3bbb3d645c3db6e87cff9fc398c0ce412c75d7687c79b7532c751518add6f583566ebb20423e465a1b6f81611448ddf08de4a97d2f5704fc79
+  data.tar.gz: 172d5d32f0b0742ca51f6c47468019c628d7043e20b212324fc4f8da987a3aabd0e06dd5375375bf645cb62377f7ca2b12b227f640ff54b494dc52c050a18484

data/README.md

@@ -27,7 +27,6 @@ Chat with a powerful agent that has access to your models, your application cont
 
 ## 🚀 **Quickstart** →
 
-
 ```bash
 
 # 1. Add the gem
@@ -38,14 +37,29 @@ rails generate llama_bot_rails:install
 
 # 3. Clone & run the LangGraph backend
 git clone https://github.com/kodykendall/llamabot
+
 cd llamabot
-OPENAI_API_KEY=your_key 
-cd backend && uvicorn app:app --reload
 
-# Start your Rails server
+# 4. Set up your environment
+python3 -m venv venv
+
+source venv/bin/activate
+
+pip install -r requirements.txt
+
+echo "OPENAI_API_KEY=your_openai_api_key_here" > .env
+
+# 5. Run the agent
+cd backend
+uvicorn app:app --reload
+
+# 6. Confirm our agent is running properly. You should see: Hello, World! 🦙💬
+curl http://localhost:8000/hello
+
+# 7. Start your Rails server.
 rails server
 
-# Visit the chat interface and start chatting.
+# 8. Visit the chat interface and start chatting.
 open http://localhost:3000/llama_bot/agent/chat
 
 ```

data/app/views/llama_bot_rails/agent/chat.html.erb

@@ -405,10 +405,121 @@
       font-size: 1em;
       color: var(--text-secondary);
     }
+
+    /* Clean loading indicator - just animated text */
+    .loading-indicator {
+      display: none;
+      align-items: center;
+      padding: 16px 20px;
+      color: var(--text-secondary);
+      font-size: 14px;
+      margin-bottom: 10px;
+      background: rgba(255, 255, 255, 0.02);
+      border-radius: 8px;
+      border: 1px solid rgba(255, 255, 255, 0.08);
+    }
+
+    .loading-indicator.visible {
+      display: flex;
+    }
+
+    .loading-text {
+      font-style: italic;
+    }
+
+    .loading-dots::after {
+      content: '';
+      animation: dots 1.5s steps(4, end) infinite;
+    }
+
+    @keyframes dots {
+      0%, 20% { content: ''; }
+      40% { content: '.'; }
+      60% { content: '..'; }
+      80%, 100% { content: '...'; }
+    }
+
+    /* Suggested Prompts Styling - Always visible above input */
+    .suggested-prompts {
+      margin-bottom: 16px;
+      padding: 0 4px;
+    }
+
+    .prompts-label {
+      font-size: 13px;
+      color: var(--text-secondary);
+      margin-bottom: 8px;
+      font-weight: 500;
+      letter-spacing: 0.3px;
+    }
+
+    .prompts-container {
+      display: flex;
+      flex-direction: column;
+      gap: 6px;
+    }
+
+    .prompts-row {
+      display: flex;
+      gap: 8px;
+      overflow-x: auto;
+      padding: 2px;
+      scrollbar-width: none; /* Firefox */
+      -ms-overflow-style: none; /* IE and Edge */
+    }
+
+    .prompts-row::-webkit-scrollbar {
+      display: none; /* Chrome, Safari, Opera */
+    }
+
+    .prompt-button {
+      background: rgba(255, 255, 255, 0.03);
+      border: 1px solid rgba(255, 255, 255, 0.08);
+      border-radius: 6px;
+      padding: 8px 12px;
+      color: var(--text-secondary);
+      font-size: 13px;
+      cursor: pointer;
+      transition: all 0.2s ease;
+      font-family: inherit;
+      white-space: nowrap;
+      flex-shrink: 0;
+      min-width: fit-content;
+    }
+
+    .prompt-button:hover {
+      background: rgba(33, 150, 243, 0.08);
+      border-color: rgba(33, 150, 243, 0.2);
+      color: var(--text-primary);
+      transform: translateY(-1px);
+    }
+
+    .prompt-button:active {
+      transform: translateY(0);
+    }
+
+    @media (max-width: 768px) {
+      .prompts-grid {
+        grid-template-columns: 1fr;
+      }
+      
+      .prompt-button {
+        font-size: 13px;
+        padding: 10px 14px;
+      }
+    }
   </style>
-  <%= javascript_importmap_tags %>
+
+  <% if defined?(javascript_importmap_tags) %> <!-- Rails 7+ -->
+    <%= javascript_importmap_tags %>
+  <% else %> <!-- Rails 6 -->
+    <%= javascript_include_tag "application" %>
+  <% end %>
+  
   <%= javascript_include_tag "llama_bot_rails/application" %>
-  <%= action_cable_meta_tag %>
+  <% if defined?(action_cable_meta_tag) %>
+    <%= action_cable_meta_tag %>
+  <% end %>
   <!-- Add Snarkdown CDN -->
   <script src="https://unpkg.com/snarkdown/dist/snarkdown.umd.js"></script>
 </head>
@@ -431,7 +542,7 @@
           </button>
           <div class="logo-container">
             <img src="https://service-jobs-images.s3.us-east-2.amazonaws.com/7rl98t1weu387r43il97h6ipk1l7" alt="LlamaBot Logo" class="logo">
-            <div id="connectionStatusIconForLlamaBot" class="connection-status status-green"></div>
+            <div id="connectionStatusIconForLlamaBot" class="connection-status status-yellow"></div>
           </div>
           <h1>LlamaBot Chat</h1>
         </div>
@@ -445,6 +556,30 @@
       <div class="chat-messages" id="chat-messages">
         <!-- Messages will be added here dynamically -->
       </div>
+      
+      <!-- Simple loading indicator with just animated text -->
+      <div class="loading-indicator" id="loading-indicator">
+        <span class="loading-text">LlamaBot is thinking<span class="loading-dots"></span></span>
+      </div>
+      
+      <!-- Suggested Prompts - Always visible above input -->
+      <div class="suggested-prompts" id="suggested-prompts">
+        <div class="prompts-label">Quick actions:</div>
+        <div class="prompts-container">
+          <div class="prompts-row">
+            <button class="prompt-button" onclick="selectPrompt(this)">What models are defined in this app?</button>
+            <button class="prompt-button" onclick="selectPrompt(this)">What routes exist?</button>
+            <button class="prompt-button" onclick="selectPrompt(this)">How many users are in the database?</button>
+            <button class="prompt-button" onclick="selectPrompt(this)">Show me the schema for the User model</button>
+          </div>
+          <div class="prompts-row">
+            <button class="prompt-button" onclick="selectPrompt(this)">Send a text with Twilio</button>
+            <button class="prompt-button" onclick="selectPrompt(this)">Create a BlogPost with title and body fields</button>
+            <button class="prompt-button" onclick="selectPrompt(this)">Generate a scaffolded Page model</button>
+          </div>
+        </div>
+      </div>
+      
       <div class="input-container">
         <input type="text" id="message-input" placeholder="Type your message...">
         <button onclick="sendMessage()">Send</button>
@@ -478,7 +613,9 @@
     }
     
     waitForCableConnection((consumer) => {
-      subscription = consumer.subscriptions.create('LlamaBotRails::ChatChannel', {
+      const sessionId = crypto.randomUUID();
+
+      subscription = consumer.subscriptions.create({channel: 'LlamaBotRails::ChatChannel', session_id: sessionId}, {
         connected() {
           console.log('Connected to chat channel');
           lastPongTime = Date.now();
@@ -692,11 +829,6 @@
       
       // Show welcome message
       showWelcomeMessage();
-      
-      // Clear active thread selection
-      document.querySelectorAll('.thread-item').forEach(item => {
-        item.classList.remove('active');
-      });
     }
 
     function showWelcomeMessage() {
@@ -710,6 +842,33 @@
       messagesDiv.appendChild(welcomeDiv);
     }
 
+    function showLoadingIndicator() {
+      const loadingIndicator = document.getElementById('loading-indicator');
+      loadingIndicator.classList.add('visible');
+    }
+
+    function hideLoadingIndicator() {
+      const loadingIndicator = document.getElementById('loading-indicator');
+      loadingIndicator.classList.remove('visible');
+    }
+
+    function selectPrompt(buttonElement) {
+      const promptText = buttonElement.textContent;
+      const messageInput = document.getElementById('message-input');
+      
+      // Populate the input field
+      messageInput.value = promptText;
+      
+      // Focus the input field for better UX
+      messageInput.focus();
+      
+      // Add a subtle animation to show the prompt was selected
+      buttonElement.style.transform = 'scale(0.98)';
+      setTimeout(() => {
+        buttonElement.style.transform = '';
+      }, 150);
+    }
+
     function sendMessage() {
       const input = document.getElementById('message-input');
       const message = input.value.trim();
@@ -731,6 +890,9 @@
         addMessage(message, 'human');
         input.value = '';
 
+        // Show loading indicator
+        showLoadingIndicator();
+
         // Generate timestamp-based thread ID if we don't have one
         let threadId = currentThreadId;
         if (!threadId || threadId === 'global_thread_id') {
@@ -764,6 +926,11 @@
     function addMessage(text, sender, base_message=null) {
       console.log('🧠 Message from LlamaBot:', text, sender, base_message);
 
+      // Hide loading indicator when we receive an AI response
+      if (sender === 'ai') {
+        hideLoadingIndicator();
+      }
+
       const messagesDiv = document.getElementById('chat-messages');
       const messageDiv = document.createElement('div');
       messageDiv.className = `message ${sender}-message`;

data/lib/generators/llama_bot_rails/install/install_generator.rb

@@ -3,6 +3,11 @@ module LlamaBotRails
     module Generators
       class InstallGenerator < Rails::Generators::Base
         source_root File.expand_path("templates", __dir__)
+
+        def create_config_file
+            empty_directory "config/llama_bot"
+            copy_file "agent_prompt.txt", "config/llama_bot/agent_prompt.txt"
+        end
   
         def mount_engine
             say <<~MSG, :yellow
@@ -32,6 +37,7 @@ module LlamaBotRails
           create_file "config/initializers/llama_bot_rails.rb", <<~RUBY
             Rails.application.configure do
               config.llama_bot_rails.websocket_url = ENV.fetch("LLAMABOT_WEBSOCKET_URL", "ws://localhost:8000/ws")
+              config.llama_bot_rails.llamabot_api_url = ENV.fetch("LLAMABOT_API_URL", "http://localhost:8000")
               config.llama_bot_rails.enable_console_tool = !Rails.env.production?
             end
           RUBY

data/lib/generators/llama_bot_rails/install/templates/agent_prompt.txt

@@ -0,0 +1 @@
+You are LlamaBot, a helpful assistant inside a Ruby on Rails app.

data/lib/llama_bot_rails/agent_state_builder.rb

@@ -10,6 +10,7 @@ module LlamaBotRails
           user_message: @params[:message], # Rails param from JS/chat UI
           thread_id: @context[:thread_id],
           api_token: @context[:api_token],
+          agent_prompt: LlamaBotRails.agent_prompt_text,
           agent_name: "llamabot" #Very important. This routes to the appropriate LangGraph agent as defined in langgraph.json
         }
       end

data/lib/llama_bot_rails/engine.rb

@@ -14,7 +14,7 @@ module LlamaBotRails
     config.llama_bot_rails.websocket_url = 'ws://localhost:8000/ws' # <-- default
     config.llama_bot_rails.llamabot_api_url = "http://localhost:8000"
     config.llama_bot_rails.enable_console_tool = true
-
+    
     initializer "llama_bot_rails.assets.precompile" do |app|
       app.config.assets.precompile += %w( llama_bot_rails/application.js )
     end

data/lib/llama_bot_rails/version.rb

@@ -1,3 +1,3 @@
 module LlamaBotRails
-  VERSION = "0.1.3"
+  VERSION = "0.1.5"
 end

data/lib/llama_bot_rails.rb

@@ -6,5 +6,22 @@ module LlamaBotRails
     def config
       Rails.application.config.llama_bot_rails
     end
+
+    def agent_prompt_path
+      Rails.root.join("config", "llama_bot", "agent_prompt.txt")
+    end
+
+    def agent_prompt_text
+      if File.exist?(agent_prompt_path)
+        File.read(agent_prompt_path)
+      else
+        "You are LlamaBot, a helpful assistant." #Fallback default.
+      end
+    end
+
+    def add_instruction_to_agent_prompt!(new_instruction)
+      FileUtils.mkdir_p(agent_prompt_path.dirname)
+      File.write(agent_prompt_path, "\n#{new_instruction}", mode: 'a')
+    end
   end
 end

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: llama_bot_rails
 version: !ruby/object:Gem::Version
-  version: 0.1.3
+  version: 0.1.5
 platform: ruby
 authors:
 - Kody Kendall
@@ -15,7 +15,7 @@ dependencies:
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: '7.0'
+        version: '6.0'
     - - "<"
       - !ruby/object:Gem::Version
         version: '9.0'
@@ -25,7 +25,7 @@ dependencies:
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: '7.0'
+        version: '6.0'
     - - "<"
       - !ruby/object:Gem::Version
         version: '9.0'
@@ -35,7 +35,7 @@ dependencies:
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: '7.0'
+        version: '6.0'
     - - "<"
       - !ruby/object:Gem::Version
         version: '9.0'
@@ -45,7 +45,7 @@ dependencies:
     requirements:
     - - ">="
       - !ruby/object:Gem::Version
-        version: '7.0'
+        version: '6.0'
     - - "<"
       - !ruby/object:Gem::Version
         version: '9.0'
@@ -122,6 +122,7 @@ files:
 - config/initializers/llama_bot_rails.rb
 - config/routes.rb
 - lib/generators/llama_bot_rails/install/install_generator.rb
+- lib/generators/llama_bot_rails/install/templates/agent_prompt.txt
 - lib/llama_bot_rails.rb
 - lib/llama_bot_rails/agent_state_builder.rb
 - lib/llama_bot_rails/engine.rb