PoolBot Office

Visual monitoring & management frontend for PoolBot Multi-Agent system

Version: 0.1.0
Status: 🚧 In Development
Target Release: v1.0.0 (Q2 2026)

🎯 Overview

PoolBot Office is a comprehensive visual dashboard for monitoring and managing your PoolBot Multi-Agent system. It features:

• 2D Office View - Isometric floor plan with agent desks and collaboration visualization
• 3D Office View - Full 3D scene with animated characters and holographic displays
• Chat Interface - Real-time chat with agents, streaming support, and message history
• Console Dashboard - Complete management for agents, channels, skills, and cron jobs

🚀 Quick Start

# Install dependencies
cd apps/office
pnpm install

# Development mode
pnpm dev

# Build for production
pnpm build

# Start production server
pnpm start

📋 Features

Virtual Office

• [x] 2D isometric floor plan
• [x] 3D scene with React Three Fiber
• [x] Agent avatars with status animations
• [x] Collaboration lines (message flow visualization)
• [x] Furniture (desks, chairs, plants)
• [x] Spawn/despawn effects

Chat Interface

• [x] Bottom-docked chat bar
• [x] Real-time message streaming
• [x] Agent selector with status
• [x] Message history with search
• [x] Copy message functionality
• [x] Typing indicators

Console Dashboard

• [x] Overview stats (agents, channels, skills, cron)
• [x] Alert banners
• [x] Quick actions
• [x] Agent management (CRUD)
• [x] Channel management (connect/disconnect)
• [x] Skills marketplace (install/uninstall)
• [x] Cron job management (run/pause/delete)
• [x] Settings (gateway, theme, language)

🛠️ Tech Stack

| Layer | Technology | |-------|------------| | Build Tool | Vite 6 | | UI Framework | React 19 | | 2D Rendering | SVG + CSS | | 3D Rendering | React Three Fiber + Drei | | State Management | React useState/useEffect | | Styling | CSS + Inline styles | | Language | TypeScript 5 |

📁 Project Structure

apps/office/
├── bin/                          # CLI executables
│   ├── poolbot-office.js
│   ├── poolbot-office-config.js
│   └── poolbot-office-server.js
├── src/
│   ├── components/
│   │   ├── chat/                 # Chat interface components
│   │   ├── console/              # Console dashboard pages
│   │   ├── office-2d/            # 2D office components
│   │   └── office-3d/            # 3D office components
│   ├── gateway/                  # WebSocket client
│   ├── styles/                   # Global styles
│   ├── App.tsx                   # Main app component
│   └── main.tsx                  # Entry point
├── public/                       # Static assets
├── index.html                    # HTML template
├── package.json
├── tsconfig.json
└── vite.config.ts

🔧 CLI Options

poolbot-office [options]

Options:
  -t, --token <token>     Gateway auth token (auto-detected)
  -g, --gateway <url>     Gateway WebSocket URL
  -p, --port <port>       Server port (default: 5180)
  --host <host>           Bind address (default: 0.0.0.0)
  -h, --help              Show help

📊 Progress

Current Status: 60% Complete (9/15 phases)

Completed Phases

• [x] Phase 1: Setup do Projeto
• [x] Phase 2: CLI e Servidor
• [x] Phase 3: Gateway WebSocket Client
• [x] Phase 4: 2D Office Layout
• [x] Phase 5: 3D Office Layout
• [x] Phase 6: Chat Interface
• [x] Phase 7: Console Dashboard
• [x] Phase 8: Polish & Integration
• [x] Phase 9: Documentation

Remaining Phases

• [ ] Phase 10: Testing (Unit/E2E)
• [ ] Phase 11: Release Preparation

📝 License

MIT License - see LICENSE for details.

🙏 Acknowledgments

PoolBot Office is inspired by and based on the architecture of OpenClaw Office.

Documentation: https://docs.molt.bot/office
GitHub: https://github.com/poolbot/poolbot