mirror of https://github.com/Heretek-AI/heretek-openclaw.git synced 2026-07-01 12:23:18 -04:00

Files

T

John Doe 28868660b1 feat: Complete Collective implementation - 11 agents, web interface, user ID system

Phase 3: Missing Agents Deployment
- Add dreamer, empath, historian to docker-compose.yml
- Update litellm_config.yaml with all 11 agent endpoints
- Add volume declarations for new agents

Phase 4: Web Interface Development
- Create SvelteKit web interface in web-interface/
- Implement chat interface with agent selection
- Create agent status dashboard
- Add WebSocket support for real-time updates
- Create API routes for /api/agents, /api/chat, /api/status

Phase 5: User Identification System
- Create user-context-resolve skill
- Update user schema with UUID support
- Add multi-platform resolution (discord, phone, email, username)
- Create new user template with platforms

Phase 6: Deployment Testing Skills
- Create deployment-health-check skill
- Create deployment-smoke-test skill
- Create config-validator skill

Phase 7: Documentation Updates
- Update DEPLOYMENT_STRATEGY.md with 11-agent architecture
- Update A2A_ARCHITECTURE.md with native LiteLLM A2A support
- Update README.md with quick start guide and web interface docs

2026-03-29 17:09:42 -04:00

3.8 KiB

Raw Blame History

The Collective - Web Interface

A SvelteKit-based web interface for interacting with The Collective's 11 agents and visualizing agent-to-agent communication.

Features

Chat Interface: Send messages to any of the 11 agents
Agent Status Dashboard: Real-time status of all agents (online/offline/busy)
Message Flow Visualization: View agent-to-agent communications
Responsive Design: Works on desktop and mobile devices

Prerequisites

Node.js 18+
npm or yarn
LiteLLM Gateway running at http://localhost:4000
Agent services running on ports 8001-8011

Installation

# Navigate to the web-interface directory
cd web-interface

# Install dependencies
npm install

Development

# Start development server
npm run dev

# Open http://localhost:3000 in your browser

Production Build

# Build for production
npm run build

# Preview production build
npm run preview

Environment Variables

Variable	Default	Description
`LITELLM_URL`	`http://localhost:4000`	LiteLLM Gateway URL
`PORT`	`3000`	Server port

Project Structure

web-interface/
├── src/
│   ├── lib/
│   │   ├── components/       # Svelte components
│   │   │   ├── ChatInterface.svelte
│   │   │   ├── AgentSelector.svelte
│   │   │   ├── MessageList.svelte
│   │   │   ├── AgentStatus.svelte
│   │   │   └── MessageFlow.svelte
│   │   ├── server/           # Server-side utilities
│   │   │   ├── litellm-client.ts
│   │   │   ├── agent-registry.ts
│   │   │   └── websocket.ts
│   │   └── types.ts          # TypeScript interfaces
│   ├── routes/
│   │   ├── +page.svelte      # Main page
│   │   ├── +layout.svelte    # Layout
│   │   └── api/              # API endpoints
│   │       ├── agents/+server.ts
│   │       ├── chat/+server.ts
│   │       └── status/+server.ts
│   ├── app.html              # HTML template
│   ├── app.css               # Global styles
│   └── app.d.ts              # Type declarations
├── static/                   # Static assets
├── package.json
├── svelte.config.js
├── vite.config.ts
├── tsconfig.json
├── tailwind.config.js
└── postcss.config.js

API Endpoints

GET /api/agents

Returns list of all agents with their current status.

Response:

{
  "success": true,
  "agents": [
    {
      "id": "steward",
      "name": "Steward",
      "role": "Orchestrator",
      "status": "online",
      "port": 8001,
      "description": "Coordinates agent activities..."
    }
  ],
  "timestamp": "2024-01-01T00:00:00.000Z"
}

POST /api/chat

Send a message to an agent.

Request:

{
  "agent": "steward",
  "message": "Hello, how can you help?",
  "conversationId": "optional-conversation-id"
}