feat: Add navigation bar and multi-page dashboard
- Add navigation bar with 4 main sections: Tasks, Wiki, Agents, Usage - Implement Wiki page with task documentation viewer - Implement Agents page showing workspace, tools, and current tasks - Implement Usage page displaying providers, models, and quotas - Add API endpoints: /api/agents, /api/usage, /api/wiki - Add agent heartbeat endpoint for task assignment - Update Docker compose with volume mounts for agent and config data - Add comprehensive CSS for all pages and responsive design - Add JavaScript navigation and dynamic content loading 🚀 Features: - 📋 Kanban task board (existing) - 📚 Wiki documentation viewer - 🤖 Agent fleet management dashboard - 📊 Provider usage and quota monitoring - 🔗 Real-time WebSocket updates - 📱 Responsive mobile design
This commit is contained in:
265
server.js
265
server.js
@@ -9,6 +9,8 @@ const PORT = process.env.PORT || 8395;
|
||||
const DB_PATH = process.env.DB_PATH || path.join(__dirname, 'data', 'tasks.db');
|
||||
const WIKI_DIR = process.env.WIKI_DIR || '/home/bear/.openclaw/workspace/wiki';
|
||||
|
||||
const AGENTS_DIR = process.env.AGENTS_DIR || '/home/bear/.openclaw/agents';
|
||||
const OPENCLAW_CONFIG = process.env.OPENCLAW_CONFIG || '/home/bear/.openclaw/openclaw.json';
|
||||
const VALID_STATUSES = ['Backlog', 'Todo', 'In Progress', 'Review', 'Done'];
|
||||
const VALID_PRIORITIES = ['Low', 'Medium', 'High', 'Critical'];
|
||||
|
||||
@@ -227,6 +229,140 @@ app.patch('/api/tasks/:id', (req, res) => {
|
||||
} catch (wikiErr) {
|
||||
console.error('wiki_creation_error', wikiErr);
|
||||
}
|
||||
|
||||
// Agents endpoint
|
||||
app.get('/api/agents', (req, res) => {
|
||||
try {
|
||||
const agents = [];
|
||||
|
||||
if (fs.existsSync(AGENTS_DIR)) {
|
||||
const agentDirs = fs.readdirSync(AGENTS_DIR).filter(d => {
|
||||
return fs.statSync(path.join(AGENTS_DIR, d)).isDirectory();
|
||||
});
|
||||
|
||||
agentDirs.forEach(agentName => {
|
||||
const agentPath = path.join(AGENTS_DIR, agentName);
|
||||
const workspacePath = path.join(agentPath, 'workspace');
|
||||
|
||||
const agent = {
|
||||
name: agentName,
|
||||
status: 'active',
|
||||
currentTask: null,
|
||||
tools: [],
|
||||
files: [],
|
||||
permissions: []
|
||||
};
|
||||
|
||||
// Read workspace files
|
||||
if (fs.existsSync(workspacePath)) {
|
||||
const files = fs.readdirSync(workspacePath);
|
||||
agent.files = files.filter(f => f.endsWith('.md'));
|
||||
|
||||
// Read MEMORY.md for tools
|
||||
const memoryPath = path.join(workspacePath, 'MEMORY.md');
|
||||
if (fs.existsSync(memoryPath)) {
|
||||
const memory = fs.readFileSync(memoryPath, 'utf8');
|
||||
// Extract tools from memory
|
||||
const toolMatches = memory.match(/##\s+Tools([\s\S]*?)(?=##|$)/i);
|
||||
if (toolMatches) {
|
||||
agent.tools = toolMatches[1].split('\n')
|
||||
.filter(line => line.trim().startsWith('-'))
|
||||
.map(line => line.replace(/^-\s*/, '').trim());
|
||||
}
|
||||
}
|
||||
|
||||
// Read HEARTBEAT.md for current task
|
||||
const heartbeatPath = path.join(workspacePath, 'HEARTBEAT.md');
|
||||
if (fs.existsSync(heartbeatPath)) {
|
||||
const heartbeat = fs.readFileSync(heartbeatPath, 'utf8');
|
||||
const taskMatch = heartbeat.match(/Current Task:\s*(.+)/i);
|
||||
if (taskMatch) {
|
||||
agent.currentTask = taskMatch[1].trim();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
agents.push(agent);
|
||||
});
|
||||
}
|
||||
|
||||
res.json(agents);
|
||||
} catch (err) {
|
||||
console.error('Error reading agents:', err);
|
||||
res.status(500).json({ error: 'failed_to_fetch_agents' });
|
||||
}
|
||||
});
|
||||
|
||||
// Usage endpoint
|
||||
app.get('/api/usage', (req, res) => {
|
||||
try {
|
||||
const usage = {
|
||||
providers: [],
|
||||
lastUpdated: new Date().toISOString()
|
||||
};
|
||||
|
||||
// Read OpenClaw config
|
||||
if (fs.existsSync(OPENCLAW_CONFIG)) {
|
||||
const config = JSON.parse(fs.readFileSync(OPENCLAW_CONFIG, 'utf8'));
|
||||
|
||||
// Extract provider information
|
||||
if (config.models) {
|
||||
const providerMap = {};
|
||||
|
||||
Object.entries(config.models).forEach(([modelName, modelConfig]) => {
|
||||
const provider = modelConfig.provider || 'unknown';
|
||||
|
||||
if (!providerMap[provider]) {
|
||||
providerMap[provider] = {
|
||||
name: provider,
|
||||
models: [],
|
||||
quota: {
|
||||
requests: 0,
|
||||
tokens: 0,
|
||||
limit: 'unlimited'
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
providerMap[provider].models.push({
|
||||
name: modelName,
|
||||
type: modelConfig.type || 'chat',
|
||||
contextWindow: modelConfig.context_window || 'unknown'
|
||||
});
|
||||
});
|
||||
|
||||
usage.providers = Object.values(providerMap);
|
||||
}
|
||||
}
|
||||
|
||||
res.json(usage);
|
||||
} catch (err) {
|
||||
console.error('Error reading usage:', err);
|
||||
res.status(500).json({ error: 'failed_to_fetch_usage' });
|
||||
}
|
||||
});
|
||||
|
||||
// Heartbeat endpoint for agents
|
||||
app.get('/api/heartbeat/:agent', (req, res) => {
|
||||
const agent = req.params.agent;
|
||||
|
||||
db.all(
|
||||
'SELECT * FROM tasks WHERE assignee = ? AND status IN (?, ?, ?) ORDER BY priority DESC, created_at ASC',
|
||||
[agent, 'Todo', 'In Progress', 'Review'],
|
||||
(err, rows) => {
|
||||
if (err) {
|
||||
return res.status(500).json({ error: 'failed_to_fetch_tasks' });
|
||||
}
|
||||
|
||||
const tasks = rows.map(normalizeTask);
|
||||
res.json({
|
||||
agent,
|
||||
pending_tasks: tasks.length,
|
||||
tasks
|
||||
});
|
||||
}
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
broadcast('task_updated', task);
|
||||
@@ -237,6 +373,135 @@ app.patch('/api/tasks/:id', (req, res) => {
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// Agents endpoint
|
||||
app.get('/api/agents', (req, res) => {
|
||||
try {
|
||||
const agents = [];
|
||||
|
||||
if (fs.existsSync(AGENTS_DIR)) {
|
||||
const agentDirs = fs.readdirSync(AGENTS_DIR).filter(d => {
|
||||
return fs.statSync(path.join(AGENTS_DIR, d)).isDirectory();
|
||||
});
|
||||
|
||||
agentDirs.forEach(agentName => {
|
||||
const agentPath = path.join(AGENTS_DIR, agentName);
|
||||
const workspacePath = path.join(agentPath, 'workspace');
|
||||
|
||||
const agent = {
|
||||
name: agentName,
|
||||
status: 'active',
|
||||
currentTask: null,
|
||||
tools: [],
|
||||
files: [],
|
||||
permissions: []
|
||||
};
|
||||
|
||||
if (fs.existsSync(workspacePath)) {
|
||||
const files = fs.readdirSync(workspacePath);
|
||||
agent.files = files.filter(f => f.endsWith('.md'));
|
||||
|
||||
const memoryPath = path.join(workspacePath, 'MEMORY.md');
|
||||
if (fs.existsSync(memoryPath)) {
|
||||
const memory = fs.readFileSync(memoryPath, 'utf8');
|
||||
const toolMatches = memory.match(/##\\s+Tools([\\s\\S]*?)(?=##|$)/i);
|
||||
if (toolMatches) {
|
||||
agent.tools = toolMatches[1].split('\\n')
|
||||
.filter(line => line.trim().startsWith('-'))
|
||||
.map(line => line.replace(/^-\\s*/, '').trim());
|
||||
}
|
||||
}
|
||||
|
||||
const heartbeatPath = path.join(workspacePath, 'HEARTBEAT.md');
|
||||
if (fs.existsSync(heartbeatPath)) {
|
||||
const heartbeat = fs.readFileSync(heartbeatPath, 'utf8');
|
||||
const taskMatch = heartbeat.match(/Current Task:\\s*(.+)/i);
|
||||
if (taskMatch) {
|
||||
agent.currentTask = taskMatch[1].trim();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
agents.push(agent);
|
||||
});
|
||||
}
|
||||
|
||||
res.json(agents);
|
||||
} catch (err) {
|
||||
console.error('Error reading agents:', err);
|
||||
res.status(500).json({ error: 'failed_to_fetch_agents' });
|
||||
}
|
||||
});
|
||||
|
||||
// Usage endpoint
|
||||
app.get('/api/usage', (req, res) => {
|
||||
try {
|
||||
const usage = {
|
||||
providers: [],
|
||||
lastUpdated: new Date().toISOString()
|
||||
};
|
||||
|
||||
if (fs.existsSync(OPENCLAW_CONFIG)) {
|
||||
const config = JSON.parse(fs.readFileSync(OPENCLAW_CONFIG, 'utf8'));
|
||||
|
||||
if (config.models) {
|
||||
const providerMap = {};
|
||||
|
||||
Object.entries(config.models).forEach(([modelName, modelConfig]) => {
|
||||
const provider = modelConfig.provider || 'unknown';
|
||||
|
||||
if (!providerMap[provider]) {
|
||||
providerMap[provider] = {
|
||||
name: provider,
|
||||
models: [],
|
||||
quota: {
|
||||
requests: 0,
|
||||
tokens: 0,
|
||||
limit: 'unlimited'
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
providerMap[provider].models.push({
|
||||
name: modelName,
|
||||
type: modelConfig.type || 'chat',
|
||||
contextWindow: modelConfig.context_window || 'unknown'
|
||||
});
|
||||
});
|
||||
|
||||
usage.providers = Object.values(providerMap);
|
||||
}
|
||||
}
|
||||
|
||||
res.json(usage);
|
||||
} catch (err) {
|
||||
console.error('Error reading usage:', err);
|
||||
res.status(500).json({ error: 'failed_to_fetch_usage' });
|
||||
}
|
||||
});
|
||||
|
||||
// Heartbeat endpoint for agents
|
||||
app.get('/api/heartbeat/:agent', (req, res) => {
|
||||
const agent = req.params.agent;
|
||||
|
||||
db.all(
|
||||
'SELECT * FROM tasks WHERE assignee = ? AND status IN (?, ?, ?) ORDER BY priority DESC, created_at ASC',
|
||||
[agent, 'Todo', 'In Progress', 'Review'],
|
||||
(err, rows) => {
|
||||
if (err) {
|
||||
return res.status(500).json({ error: 'failed_to_fetch_tasks' });
|
||||
}
|
||||
|
||||
const tasks = rows.map(normalizeTask);
|
||||
res.json({
|
||||
agent,
|
||||
pending_tasks: tasks.length,
|
||||
tasks
|
||||
});
|
||||
}
|
||||
);
|
||||
});
|
||||
|
||||
wss.on('connection', (socket) => {
|
||||
socket.send(JSON.stringify({ type: 'connected', payload: { ok: true } }));
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user