Hive - Multi-Agent Task Coordination System

A beautiful, modern dashboard for managing multi-agent task workflows built with Next.js 15, TypeScript, and Tailwind CSS.

Features

• Agent Management: Track 7 agents (Bhanu, Friday, Fury, Jarvis, Loki, Pepper, Quill) with real-time status indicators
• Kanban Board: Visual task management with 5 workflow stages (Inbox, Assigned, In Progress, Review, Done)
• Live Activity Feed: Real-time updates on task movements, assignments, and agent status changes
• Clean UI: Card-based design with subtle shadows, smooth transitions, and hover effects
• Dark Mode: Full dark mode support with proper color schemes

Tech Stack

• Framework: Next.js 15 with App Router
• Language: TypeScript
• Styling: Tailwind CSS
• UI Components: shadcn/ui
• Icons: Lucide React

Getting Started

# Install dependencies
npm install

# Run development server
npm run dev

# Build for production
npm run build

# Start production server
npm start

Open http://localhost:3000 to view the dashboard.

Project Structure

├── app/
│   ├── page.tsx              # Main dashboard (root path)
│   ├── layout.tsx            # Root layout
│   └── mission-control/      # Legacy routes (redirect to root)
├── components/
│   ├── hive/
│   │   ├── header.tsx        # Dashboard header with stats
│   │   ├── agent-card.tsx    # Agent status cards
│   │   ├── kanban-column.tsx # Kanban board columns
│   │   ├── task-card.tsx     # Individual task cards
│   │   └── activity-feed.tsx # Live activity feed
│   └── ui/                   # shadcn/ui components
├── lib/
│   └── mission-control/
│       ├── types.ts          # TypeScript interfaces
│       ├── agents.ts         # Agent data management
│       ├── tasks.ts          # Task data management
│       └── activities.ts     # Activity feed data
└── memory/
    └── mission-control/      # JSON data storage

Agents

• Bhanu - Founder
• Friday - Developer Agent
• Fury - Customer Research
• Jarvis - Squad Lead
• Loki - Content Writer
• Pepper - Email Marketing
• Quill - Social Media

Task Workflow

1. Inbox: New tasks awaiting assignment
2. Assigned: Tasks assigned to agents
3. In Progress: Active work
4. Review: Tasks pending review
5. Done: Completed tasks

Data Management

Task and agent data is stored in JSON files in the memory/mission-control/ directory:

• tasks.json - Task definitions and status
• agent-status.json - Agent availability and activity

Development

The dashboard uses Next.js 15's App Router with server components for optimal performance. All data fetching happens on the server, and the UI components are optimized for fast rendering.

License

MIT