queen-mq 0.1.0

package/dashboard/src/views/Queues.vue

@@ -0,0 +1,333 @@
+<template>
+  <div class="queues-view">
+    <Card class="queues-card">
+      <template #content>
+        <DataTable 
+        :value="queues" 
+        :loading="loading"
+        :paginator="true"
+        :rows="10"
+        :rowsPerPageOptions="[10, 20, 50]"
+        responsiveLayout="scroll"
+        filterDisplay="row"
+        :globalFilterFields="['name', 'namespace', 'task']"
+        class="dark-table-v3"
+      >
+        <template #header>
+          <div class="table-header">
+            <h2>Queue Management</h2>
+            <div class="table-actions">
+              <span class="p-input-icon-left">
+                <i class="pi pi-search" />
+                <InputText v-model="filters.global" placeholder="Search queues..." class="search-input" />
+              </span>
+              <Button icon="pi pi-refresh" @click="fetchQueues" :loading="loading" class="p-button-text" />
+            </div>
+          </div>
+        </template>
+
+        <Column field="name" header="Queue Name" :sortable="true">
+          <template #body="{ data }">
+            <div class="queue-name-cell">
+              <div class="queue-icon">Q</div>
+              <router-link :to="`/queues/${data.name}`" class="queue-link">
+                {{ data.name }}
+              </router-link>
+            </div>
+          </template>
+        </Column>
+        
+        <Column field="namespace" header="Namespace" :sortable="true">
+          <template #body="{ data }">
+            <Tag v-if="data.namespace" :value="data.namespace" class="namespace-tag" />
+            <span v-else class="text-muted">-</span>
+          </template>
+        </Column>
+        
+        <Column field="task" header="Task" :sortable="true">
+          <template #body="{ data }">
+            <Tag v-if="data.task" :value="data.task" class="task-tag" />
+            <span v-else class="text-muted">-</span>
+          </template>
+        </Column>
+        
+        <Column header="Status">
+          <template #body="{ data }">
+            <div class="status-badges">
+              <span class="status-pending">{{ data.stats?.pending || 0 }} pending</span>
+              <span class="status-processing">{{ data.stats?.processing || 0 }} processing</span>
+            </div>
+          </template>
+        </Column>
+        
+        <Column field="stats.completed" header="Completed" :sortable="true">
+          <template #body="{ data }">
+            <span class="status-completed">{{ data.stats?.completed || 0 }}</span>
+          </template>
+        </Column>
+        
+        <Column field="stats.failed" header="Failed" :sortable="true">
+          <template #body="{ data }">
+            <span class="status-failed">{{ data.stats?.failed || 0 }}</span>
+          </template>
+        </Column>
+        
+        <Column header="Actions" :exportable="false" style="min-width: 8rem">
+          <template #body="{ data }">
+            <Button 
+              icon="pi pi-cog" 
+              class="p-button-text p-button-sm action-btn"
+              @click="configureQueue(data)"
+              v-tooltip="'Configure'"
+            />
+            <Button 
+              icon="pi pi-trash" 
+              class="p-button-text p-button-sm p-button-danger action-btn"
+              @click="deleteQueue(data)"
+              v-tooltip="'Delete'"
+            />
+          </template>
+        </Column>
+      </DataTable>
+      </template>
+    </Card>
+  </div>
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue'
+import { useRouter } from 'vue-router'
+import { useToast } from 'primevue/usetoast'
+import { useConfirm } from 'primevue/useconfirm'
+import DataTable from 'primevue/datatable'
+import Column from 'primevue/column'
+import InputText from 'primevue/inputtext'
+import Button from 'primevue/button'
+import Tag from 'primevue/tag'
+import Card from 'primevue/card'
+import api from '../services/api.js'
+
+const router = useRouter()
+const toast = useToast()
+const confirm = useConfirm()
+
+const loading = ref(false)
+const queues = ref([])
+const filters = ref({
+  global: ''
+})
+
+const fetchQueues = async () => {
+  try {
+    loading.value = true
+    const data = await api.getQueues()
+    
+    if (data?.queues && Array.isArray(data.queues)) {
+      // Process the actual API format: {queues: [{name, namespace, task, messages: {total, pending, processing}}]}
+      queues.value = data.queues.map(queue => ({
+        id: queue.id,
+        name: queue.name,
+        namespace: queue.namespace,
+        task: queue.task,
+        createdAt: queue.createdAt,
+        partitions: queue.partitions,
+        stats: {
+          pending: queue.messages?.pending || 0,
+          processing: queue.messages?.processing || 0,
+          completed: (queue.messages?.total || 0) - (queue.messages?.pending || 0) - (queue.messages?.processing || 0),
+          failed: queue.messages?.failed || 0,
+          total: queue.messages?.total || 0
+        }
+      }))
+    } else {
+      // Fallback to empty array
+      queues.value = []
+    }
+  } catch (error) {
+    console.error('Failed to fetch queues:', error)
+    toast.add({
+      severity: 'error',
+      summary: 'Error',
+      detail: 'Failed to load queues',
+      life: 3000
+    })
+    queues.value = []
+  } finally {
+    loading.value = false
+  }
+}
+
+const configureQueue = (queue) => {
+  router.push(`/queues/${queue.name}/configure`)
+}
+
+const deleteQueue = (queue) => {
+  confirm.require({
+    message: `Are you sure you want to delete queue "${queue.name}"?`,
+    header: 'Delete Queue',
+    icon: 'pi pi-exclamation-triangle',
+    acceptClass: 'p-button-danger',
+    accept: async () => {
+      try {
+        await api.deleteQueue(queue.name)
+        toast.add({
+          severity: 'success',
+          summary: 'Success',
+          detail: `Queue "${queue.name}" deleted`,
+          life: 3000
+        })
+        fetchQueues()
+      } catch (error) {
+        toast.add({
+          severity: 'error',
+          summary: 'Error',
+          detail: 'Failed to delete queue',
+          life: 3000
+        })
+      }
+    }
+  })
+}
+
+onMounted(() => {
+  fetchQueues()
+})
+</script>
+
+<style scoped>
+.queues-view {
+  padding: 0;
+}
+
+.queues-card {
+  background: transparent !important;
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  border-radius: 16px;
+  box-shadow: none !important;
+}
+
+:deep(.p-card-content) {
+  padding: 0;
+}
+
+.table-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 1.5rem;
+  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
+}
+
+.table-header h2 {
+  font-size: 1.25rem;
+  font-weight: 600;
+  color: var(--surface-700);
+  margin: 0;
+}
+
+.table-actions {
+  display: flex;
+  gap: 1rem;
+  align-items: center;
+}
+
+.search-input {
+  background: rgba(255, 255, 255, 0.05);
+  border: 1px solid rgba(255, 255, 255, 0.1);
+  color: var(--surface-600);
+}
+
+.queue-name-cell {
+  display: flex;
+  align-items: center;
+  gap: 0.75rem;
+}
+
+.queue-icon {
+  width: 32px;
+  height: 32px;
+  border-radius: 8px;
+  background: linear-gradient(135deg, #ec4899 0%, #db2777 100%);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  color: white;
+  font-weight: 600;
+  font-size: 0.875rem;
+}
+
+.queue-link {
+  color: var(--primary-500);
+  text-decoration: none;
+  font-weight: 500;
+}
+
+.queue-link:hover {
+  text-decoration: underline;
+}
+
+.namespace-tag,
+.task-tag {
+  background: rgba(236, 72, 153, 0.15);
+  color: var(--primary-500);
+  border: 1px solid rgba(236, 72, 153, 0.3);
+}
+
+.status-badges {
+  display: flex;
+  gap: 0.5rem;
+}
+
+.text-muted {
+  color: var(--surface-400);
+}
+
+.action-btn {
+  color: var(--surface-500) !important;
+}
+
+.action-btn:hover {
+  background: rgba(236, 72, 153, 0.1) !important;
+  color: var(--primary-500) !important;
+}
+
+.action-btn.p-button-danger:hover {
+  background: rgba(239, 68, 68, 0.1) !important;
+  color: var(--danger-color) !important;
+}
+
+/* DataTable dark theme overrides */
+:deep(.dark-table-v3) {
+  background: transparent !important;
+  border: none !important;
+}
+
+:deep(.dark-table-v3 .p-datatable-header) {
+  background: transparent !important;
+  border: none !important;
+}
+
+:deep(.dark-table-v3 .p-datatable-thead > tr > th) {
+  background: transparent !important;
+  color: var(--surface-400) !important;
+  border-color: rgba(255, 255, 255, 0.1) !important;
+}
+
+:deep(.dark-table-v3 .p-datatable-tbody > tr) {
+  background: transparent !important;
+}
+
+:deep(.dark-table-v3 .p-datatable-tbody > tr:hover) {
+  background: rgba(236, 72, 153, 0.05) !important;
+}
+
+:deep(.dark-table-v3 .p-datatable-tbody > tr > td) {
+  color: var(--surface-600) !important;
+  border-color: rgba(255, 255, 255, 0.05) !important;
+}
+
+:deep(.p-paginator) {
+  background: transparent !important;
+  border-top: 1px solid rgba(255, 255, 255, 0.1) !important;
+}
+</style>

package/dashboard/vite.config.js

@@ -0,0 +1,30 @@
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+
+// https://vite.dev/config/
+export default defineConfig({
+  plugins: [vue()],
+  server: {
+    port: 4000,
+    proxy: {
+      '/api': {
+        target: 'http://localhost:6632',
+        changeOrigin: true
+      },
+      '/health': {
+        target: 'http://localhost:6632',
+        changeOrigin: true
+      },
+      '/metrics': {
+        target: 'http://localhost:6632',
+        changeOrigin: true
+      }
+    }
+  },
+  base: '/dashboard/',
+  build: {
+    outDir: 'dist',
+    assetsDir: 'assets',
+    sourcemap: false
+  }
+})

package/debug-namespace.js

@@ -0,0 +1,110 @@
+import pg from 'pg';
+import config from './src/config.js';
+
+const pool = new pg.Pool({
+  host: config.DATABASE.HOST,
+  port: config.DATABASE.PORT,
+  database: config.DATABASE.NAME,
+  user: config.DATABASE.USER,
+  password: config.DATABASE.PASSWORD
+});
+
+async function debug() {
+  try {
+    // Check if test queues have namespace/task set
+    console.log('=== Checking queues with namespace ===');
+    const queues = await pool.query(`
+      SELECT name, namespace, task 
+      FROM queen.queues 
+      WHERE namespace IS NOT NULL OR task IS NOT NULL
+    `);
+    console.log('Queues with namespace/task:', queues.rows);
+    
+    // Check messages in those queues
+    console.log('\n=== Checking messages in namespaced queues ===');
+    const messages = await pool.query(`
+      SELECT m.id, m.transaction_id, q.name as queue_name, q.namespace, q.task, p.name as partition_name
+      FROM queen.messages m
+      JOIN queen.partitions p ON m.partition_id = p.id
+      JOIN queen.queues q ON p.queue_id = q.id
+      WHERE q.namespace IS NOT NULL
+      LIMIT 10
+    `);
+    console.log('Messages in namespaced queues:', messages.rows);
+    
+    // Test the actual query used in popMessagesWithFilters
+    console.log('\n=== Testing popMessagesWithFilters query ===');
+    const actualConsumerGroup = '__QUEUE_MODE__';
+    const namespace = 'test-namespace';
+    const batch = 3;
+    
+    const testQuery = `
+      WITH available_messages AS (
+        SELECT m.id, m.transaction_id, m.trace_id, m.payload, m.is_encrypted, m.created_at,
+               p.id as partition_id, p.name as partition_name, q.name as queue_name,
+               q.priority, q.lease_time, q.retry_limit, q.delayed_processing,
+               q.window_buffer, q.max_wait_time_seconds, q.namespace, q.task
+        FROM queen.messages m
+        JOIN queen.partitions p ON m.partition_id = p.id
+        JOIN queen.queues q ON p.queue_id = q.id
+        LEFT JOIN queen.messages_status ms ON m.id = ms.message_id AND ms.consumer_group = $1
+        WHERE (ms.id IS NULL OR ms.status = 'pending')
+          AND m.created_at <= NOW() - INTERVAL '1 second' * q.delayed_processing
+          AND (q.max_wait_time_seconds = 0 OR 
+               m.created_at > NOW() - INTERVAL '1 second' * q.max_wait_time_seconds)
+          AND (q.window_buffer = 0 OR NOT EXISTS (
+            SELECT 1 FROM queen.messages m2 
+            WHERE m2.partition_id = p.id 
+              AND m2.created_at > NOW() - INTERVAL '1 second' * q.window_buffer
+          ))
+          AND NOT EXISTS (
+            -- Check for active partition leases
+            SELECT 1 FROM queen.partition_leases pl
+            WHERE pl.partition_id = p.id
+              AND pl.consumer_group = $1
+              AND pl.released_at IS NULL
+              AND pl.lease_expires_at > NOW()
+          )
+          AND q.namespace = $2
+        ORDER BY q.priority DESC, m.created_at ASC LIMIT $3 FOR UPDATE OF m SKIP LOCKED
+      )
+      SELECT * FROM available_messages
+    `;
+    
+    const result = await pool.query(testQuery, [actualConsumerGroup, namespace, batch]);
+    console.log('Query result count:', result.rows.length);
+    if (result.rows.length > 0) {
+      console.log('Sample message:', result.rows[0]);
+    }
+    
+    // Check for any blocking issues
+    console.log('\n=== Checking for blocking issues ===');
+    const statusCheck = await pool.query(`
+      SELECT ms.*, m.transaction_id
+      FROM queen.messages_status ms
+      JOIN queen.messages m ON ms.message_id = m.id
+      WHERE ms.consumer_group = $1
+      AND ms.status != 'completed'
+      LIMIT 10
+    `, [actualConsumerGroup]);
+    console.log('Pending/processing messages:', statusCheck.rows);
+    
+    const leaseCheck = await pool.query(`
+      SELECT pl.*, p.name as partition_name, q.name as queue_name
+      FROM queen.partition_leases pl
+      JOIN queen.partitions p ON pl.partition_id = p.id
+      JOIN queen.queues q ON p.queue_id = q.id
+      WHERE pl.consumer_group = $1
+      AND pl.released_at IS NULL
+      AND pl.lease_expires_at > NOW()
+    `, [actualConsumerGroup]);
+    console.log('Active partition leases:', leaseCheck.rows);
+    
+  } catch (error) {
+    console.error('Error:', error);
+  } finally {
+    await pool.end();
+  }
+}
+
+debug();

package/docs/long-polling.md

@@ -0,0 +1,159 @@
+# Long Polling in Queen Client
+
+## Overview
+
+The Queen client implements efficient long polling for real-time message consumption. When configured with `wait: true`, the client will maintain a persistent connection to the server, waiting for messages to arrive.
+
+## Continuous Polling Behavior
+
+The client has been optimized for continuous long polling without unnecessary delays:
+
+### Timeout Handling
+
+When a long polling request times out (no messages received within the timeout period), the client **immediately** starts a new request without any delay. This ensures:
+
+- **Zero message loss**: No gap between polling requests where messages could be missed
+- **Minimal latency**: Messages are received as soon as they're available
+- **Efficient resource usage**: No unnecessary waiting or reconnection overhead
+
+### Implementation Details
+
+```javascript
+// The consume function handles timeouts gracefully
+const stop = client.consume({
+  ns: 'myapp',
+  task: 'processing',
+  queue: 'orders',
+  handler: async (message) => {
+    // Process message
+  },
+  options: {
+    wait: true,         // Enable long polling
+    timeout: 30000,     // 30 second timeout
+    batch: 10,          // Get up to 10 messages at once
+    stopOnError: false  // Continue on errors
+  }
+});
+```
+
+### How It Works
+
+1. **Normal Operation**: When messages are available, they are immediately returned and processed
+2. **Timeout Scenario**: If no messages arrive within the timeout period:
+   - Server returns an empty response (not an error)
+   - Client immediately starts a new long polling request
+   - No delay or backoff is applied
+3. **Error Handling**: Only actual errors (network issues, server errors) trigger retry delays
+
+### Client-Server Timeout Coordination
+
+The client automatically adds a buffer to its timeout when long polling:
+- Server timeout: 30 seconds (configured value)
+- Client timeout: 35 seconds (server timeout + 5 second buffer)
+
+This prevents premature client-side timeouts and ensures the server has time to respond.
+
+## Example Usage
+
+### Basic Consumer
+
+```javascript
+import { createQueenClient } from '@queen/client';
+
+const client = createQueenClient({
+  baseUrl: 'http://localhost:6632'
+});
+
+// Start continuous consumer
+const stop = client.consume({
+  ns: 'production',
+  task: 'orders',
+  queue: 'processing',
+  handler: async (message) => {
+    console.log('Received:', message);
+    // Process the message
+  },
+  options: {
+    wait: true,      // Enable long polling
+    timeout: 30000,  // 30 second timeout
+    batch: 5         // Process up to 5 messages at once
+  }
+});
+
+// Stop when needed
+// stop();
+```
+
+### Advanced Consumer with Statistics
+
+```javascript
+const stats = { processed: 0, errors: 0 };
+
+const stop = client.consume({
+  ns: 'production',
+  task: 'orders',
+  queue: 'processing',
+  handler: async (message) => {
+    try {
+      await processOrder(message.data);
+      stats.processed++;
+    } catch (error) {
+      stats.errors++;
+      throw error; // Re-throw to trigger failed acknowledgment
+    }
+  },
+  options: {
+    wait: true,
+    timeout: 30000,
+    batch: 10,
+    stopOnError: false  // Continue even if individual messages fail
+  }
+});
+
+// Monitor statistics
+setInterval(() => {
+  console.log(`Processed: ${stats.processed}, Errors: ${stats.errors}`);
+}, 60000);
+```
+
+## Benefits
+
+1. **Real-time Processing**: Messages are processed immediately upon arrival
+2. **Efficient**: No wasted time between polling cycles
+3. **Reliable**: Automatic reconnection on network issues
+4. **Scalable**: Supports multiple concurrent consumers
+5. **Simple**: No complex configuration required
+
+## Configuration Options
+
+| Option | Default | Description |
+|--------|---------|-------------|
+| `wait` | `false` | Enable long polling |
+| `timeout` | `30000` | Polling timeout in milliseconds |
+| `batch` | `1` | Number of messages to retrieve per request |
+| `stopOnError` | `false` | Stop consumer on handler errors |
+
+## Best Practices
+
+1. **Set Appropriate Timeouts**: Use 30-60 second timeouts for long polling
+2. **Handle Errors Gracefully**: Implement proper error handling in your message handler
+3. **Use Batching**: Process multiple messages per request for better throughput
+4. **Monitor Performance**: Track message processing rates and errors
+5. **Graceful Shutdown**: Always call the stop function when shutting down
+
+## Comparison with Traditional Polling
+
+### Traditional Polling (with delays)
+```
+Request -> Response -> Wait 5s -> Request -> Response -> Wait 5s -> ...
+```
+- Messages may wait up to 5 seconds before being processed
+- Unnecessary requests when no messages are available
+
+### Long Polling (Queen implementation)
+```
+Request -> Wait for message/timeout -> Response -> Immediately Request -> ...
+```
+- Messages processed immediately upon arrival
+- No delays between requests
+- Efficient use of resources