### Run Letta-Flask Application

Source: https://github.com/letta-ai/letta-flask/blob/main/examples/simple_application/README.md

Starts the Letta-Flask application using uv run. The application will typically be accessible at http://localhost:5002.

```bash
uv run app.py
```

--------------------------------

### Install Dependencies with uv

Source: https://github.com/letta-ai/letta-flask/blob/main/examples/simple_application/README.md

Installs project dependencies listed in pyproject.toml using the uv dependency manager. Ensure your virtual environment is activated.

```bash
uv pip install -r pyproject.toml
```

--------------------------------

### Install Letta-Flask Package

Source: https://github.com/letta-ai/letta-flask/blob/main/README.md

Installs the `letta-flask` package along with its required dependencies `flask`, `requests`, and `letta-client` using pip.

```bash
pip install flask requests letta-client letta-flask
```

--------------------------------

### Setup Python Virtual Environment

Source: https://github.com/letta-ai/letta-flask/blob/main/examples/simple_application/README.md

Creates and activates a Python virtual environment using the built-in venv module. This isolates project dependencies.

```bash
python3 -m venv myenv
source myenv/bin/activate
```

--------------------------------

### Initialize and Use LettaFlask Extension

Source: https://github.com/letta-ai/letta-flask/blob/main/README.md

Demonstrates the initialization of the `LettaFlask` extension with configuration parameters such as `base_url` and `api_key`. It shows how to attach the extension to a Flask application and set up a basic route.

```python
from flask import Flask, send_from_directory

from letta_flask import LettaFlask, LettaFlaskConfig

app = Flask(__name__)

# Initialize

letta_flask = LettaFlask(config=LettaFlaskConfig(
    base_url="http://localhost:8283",
    api_key="OPTIONAL_LETTA_API_KEY"
))

# Attach to app
letta_flask.init_app(app)

# do your routing
@app.route('/')
def index():
    return send_from_directory('index.html')
```

--------------------------------

### JavaScript: Agent Interaction and Chat Handling

Source: https://github.com/letta-ai/letta-flask/blob/main/examples/simple_application/index.html

This JavaScript code fetches agent details and messages from API endpoints, updates the UI, and handles real-time chat message streaming from the server. It relies on specific DOM elements for rendering and user input.

```javascript
const agentId = 'agent-af102103-2012-432f-9f49-10ee160910b8'; // Initialize Letta SDK
fetch(`/v1/agents/${agentId}`)
  .then(response => response.json())
  .then(data => {
    document.getElementById('agent-name').innerText = data.name;
  });

function addMessage(content, type) {
  const messagesElement = document.getElementById('messages');
  const messageElement = document.createElement('div');
  messageElement.classList.add('message');
  messageElement.classList.add(type === 'user_message' ? 'user-message' : 'assistant-message');
  messageElement.innerText = content;
  messagesElement.appendChild(messageElement);
  return messageElement;
}

function addMessages(messages = []) {
  messages
    .filter(message => message.message_type === 'assistant_message' || message.message_type === 'user_message')
    .forEach(message => {
      addMessage(message.content, message.message_type);
    });
}

fetch(`/v1/agents/${agentId}/messages`)
  .then(response => response.json())
  .then(data => {
    addMessages(data);
  });

const form = document.getElementById('message-form');
form.addEventListener('submit', async (event) => {
  event.preventDefault();
  const input = form.querySelector('input');
  const message = input.value;
  input.value = ''; // Add user message to UI
  addMessage(message, 'user_message');
  try {
    const response = await fetch('/stream', {
      method: "POST",
      cache: "no-cache",
      keepalive: true,
      headers: {
        'Content-Type': 'application/json',
        "Accept": "text/event-stream",
      },
      body: JSON.stringify({ content: message })
    });
    const reader = response.body.getReader();
    const decoder = new TextDecoder();
    let assistantMessage = null;
    let currentContent = '';
    while (true) {
      const { value, done } = await reader.read();
      if (done) break;
      const chunk = decoder.decode(value);
      const lines = chunk.split('\n');
      for (const line of lines) {
        if (line.startsWith('data: ')) {
          try {
            const data = JSON.parse(line.slice(6)); // line.slice(6) removes the "data: " prefix
            if (data.content) {
              currentContent += data.content;
              if (!assistantMessage) {
                assistantMessage = addMessage(currentContent, 'assistant_message');
              } else {
                assistantMessage.innerText = currentContent;
              }
            }
            if (data.error) {
              console.error('Stream error:', data.error);
              addMessage('Error: ' + data.error, 'assistant_message');
            }
          } catch (e) {
            console.error('Error parsing JSON:', e, line);
          }
        }
      }
    }
  } catch (error) {
    console.error('Fetch error:', error);
    addMessage('Error: Could not get response', 'assistant_message');
  }
});
```

=== COMPLETE CONTENT === This response contains all available snippets from this library. No additional content exists. Do not make further requests.