feat: implement proto-gen platform
- Config loader with env var expansion and validation - SQLite database with tasks and toolchain_versions tables - Gitea REST API client for repository and branch operations - K8s client for Job lifecycle management (with noop fallback for local dev) - REST API: tasks CRUD, retry, plugins, version management - Worker/scheduler with polling, concurrency control, and job tracking - Static frontend: generate, tasks, settings pages - Toolchain images: Go and Node.js Dockerfiles with entrypoint scripts - Helm chart with deployment, service, configmap, ingress, PVC - Multi-stage Dockerfile for service - Unit tests for config, database, gitclient, k8s, api, worker - E2E tests for idempotency, version switch, failure recovery
This commit is contained in:
@@ -0,0 +1,141 @@
|
||||
const API_BASE = '/api/v1';
|
||||
|
||||
async function api(method, path, body) {
|
||||
const options = {
|
||||
method,
|
||||
headers: { 'Content-Type': 'application/json' }
|
||||
};
|
||||
if (body) options.body = JSON.stringify(body);
|
||||
const res = await fetch(API_BASE + path, options);
|
||||
if (!res.ok) {
|
||||
const err = await res.json();
|
||||
throw new Error(err.error || 'Request failed');
|
||||
}
|
||||
return res.json();
|
||||
}
|
||||
|
||||
function showMessage(text, type = 'success') {
|
||||
const msg = document.getElementById('message');
|
||||
if (!msg) return;
|
||||
msg.textContent = text;
|
||||
msg.className = `message ${type}`;
|
||||
setTimeout(() => msg.className = 'hidden', 5000);
|
||||
}
|
||||
|
||||
function formatDate(dateStr) {
|
||||
if (!dateStr) return '-';
|
||||
return new Date(dateStr).toLocaleString();
|
||||
}
|
||||
|
||||
function statusBadge(status) {
|
||||
const colors = {
|
||||
pending: '#f39c12',
|
||||
running: '#3498db',
|
||||
success: '#27ae60',
|
||||
failed: '#e74c3c'
|
||||
};
|
||||
return `<span class="badge" style="background:${colors[status] || '#999'}">${status}</span>`;
|
||||
}
|
||||
|
||||
async function initGeneratePage() {
|
||||
try {
|
||||
const plugins = await api('GET', '/plugins');
|
||||
const select = document.getElementById('language');
|
||||
plugins.forEach(p => {
|
||||
const opt = document.createElement('option');
|
||||
opt.value = p.language;
|
||||
opt.textContent = p.language;
|
||||
select.appendChild(opt);
|
||||
});
|
||||
} catch (e) {
|
||||
console.error('Failed to load plugins:', e);
|
||||
}
|
||||
|
||||
document.getElementById('generateForm').addEventListener('submit', async (e) => {
|
||||
e.preventDefault();
|
||||
const btn = e.target.querySelector('button[type="submit"]');
|
||||
btn.disabled = true;
|
||||
btn.textContent = 'Generating...';
|
||||
|
||||
try {
|
||||
const task = await api('POST', '/tasks', {
|
||||
language: document.getElementById('language').value,
|
||||
proto_repo: document.getElementById('protoRepo').value,
|
||||
proto_branch: document.getElementById('protoBranch').value,
|
||||
target_repo: document.getElementById('targetRepo').value || undefined
|
||||
});
|
||||
showMessage(`Task created: ${task.id}`, 'success');
|
||||
e.target.reset();
|
||||
document.getElementById('protoBranch').value = 'main';
|
||||
} catch (err) {
|
||||
showMessage(err.message, 'error');
|
||||
} finally {
|
||||
btn.disabled = false;
|
||||
btn.textContent = 'Generate';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
async function initTasksPage() {
|
||||
await refreshTasks();
|
||||
document.getElementById('statusFilter').addEventListener('change', refreshTasks);
|
||||
setInterval(refreshTasks, 10000);
|
||||
}
|
||||
|
||||
async function refreshTasks() {
|
||||
const status = document.getElementById('statusFilter').value;
|
||||
const params = status ? `?status=${status}` : '';
|
||||
try {
|
||||
const tasks = await api('GET', `/tasks${params}`);
|
||||
const tbody = document.getElementById('tasksBody');
|
||||
const noTasks = document.getElementById('noTasks');
|
||||
|
||||
if (!tasks || tasks.length === 0) {
|
||||
tbody.innerHTML = '';
|
||||
noTasks.classList.remove('hidden');
|
||||
return;
|
||||
}
|
||||
|
||||
noTasks.classList.add('hidden');
|
||||
tbody.innerHTML = tasks.map(t => `
|
||||
<tr>
|
||||
<td><code>${t.id.substring(0, 8)}</code></td>
|
||||
<td>${t.language}</td>
|
||||
<td>${t.proto_repo}</td>
|
||||
<td>${t.target_repo}</td>
|
||||
<td>${statusBadge(t.status)}</td>
|
||||
<td>${formatDate(t.created_at)}</td>
|
||||
<td>
|
||||
${t.status === 'failed' ? `<button onclick="retryTask('${t.id}')" class="btn-small">Retry</button>` : ''}
|
||||
</td>
|
||||
</tr>
|
||||
`).join('');
|
||||
} catch (err) {
|
||||
console.error('Failed to load tasks:', err);
|
||||
}
|
||||
}
|
||||
|
||||
async function retryTask(id) {
|
||||
try {
|
||||
await api('POST', `/tasks/${id}/retry`);
|
||||
showMessage('Task queued for retry');
|
||||
refreshTasks();
|
||||
} catch (err) {
|
||||
showMessage(err.message, 'error');
|
||||
}
|
||||
}
|
||||
|
||||
async function initSettingsPage() {
|
||||
try {
|
||||
const plugins = await api('GET', '/plugins');
|
||||
const container = document.getElementById('pluginsList');
|
||||
container.innerHTML = plugins.map(p => `
|
||||
<div class="plugin-card">
|
||||
<h3>${p.language}</h3>
|
||||
<p>Image: <code>${p.image}</code></p>
|
||||
</div>
|
||||
`).join('');
|
||||
} catch (err) {
|
||||
console.error('Failed to load plugins:', err);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,56 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Proto-Gen Platform</title>
|
||||
<link rel="stylesheet" href="/style.css">
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<a href="/" class="logo">Proto-Gen</a>
|
||||
<div class="nav-links">
|
||||
<a href="/" class="active">Generate</a>
|
||||
<a href="/tasks.html">Tasks</a>
|
||||
<a href="/settings.html">Settings</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main>
|
||||
<h1>Generate Code</h1>
|
||||
<form id="generateForm">
|
||||
<div class="form-group">
|
||||
<label for="protoRepo">Proto Repository</label>
|
||||
<input type="text" id="protoRepo" placeholder="e.g., owner/yoresee_doc" required>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="protoBranch">Branch</label>
|
||||
<input type="text" id="protoBranch" value="main" required>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="language">Target Language</label>
|
||||
<select id="language" required>
|
||||
<option value="">Select language...</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label for="targetRepo">Target Repository</label>
|
||||
<input type="text" id="targetRepo" placeholder="Auto-generated if empty">
|
||||
<small>Leave empty to auto-generate: {proto_repo}-gen-{lang}</small>
|
||||
</div>
|
||||
|
||||
<button type="submit" class="btn-primary">Generate</button>
|
||||
</form>
|
||||
|
||||
<div id="message" class="hidden"></div>
|
||||
</main>
|
||||
|
||||
<script src="/app.js"></script>
|
||||
<script>
|
||||
initGeneratePage();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,30 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Settings - Proto-Gen Platform</title>
|
||||
<link rel="stylesheet" href="/style.css">
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<a href="/" class="logo">Proto-Gen</a>
|
||||
<div class="nav-links">
|
||||
<a href="/">Generate</a>
|
||||
<a href="/tasks.html">Tasks</a>
|
||||
<a href="/settings.html" class="active">Settings</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main>
|
||||
<h1>Settings</h1>
|
||||
<h2>Toolchain Versions</h2>
|
||||
<div id="pluginsList"></div>
|
||||
</main>
|
||||
|
||||
<script src="/app.js"></script>
|
||||
<script>
|
||||
initSettingsPage();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,191 @@
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
|
||||
background: #f5f5f5;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
nav {
|
||||
background: #2c3e50;
|
||||
padding: 1rem 2rem;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.logo {
|
||||
color: #ecf0f1;
|
||||
font-size: 1.5rem;
|
||||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.nav-links a {
|
||||
color: #bdc3c7;
|
||||
text-decoration: none;
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.nav-links a:hover,
|
||||
.nav-links a.active {
|
||||
color: #ecf0f1;
|
||||
background: rgba(255,255,255,0.1);
|
||||
}
|
||||
|
||||
main {
|
||||
max-width: 900px;
|
||||
margin: 2rem auto;
|
||||
padding: 0 1rem;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin-bottom: 1.5rem;
|
||||
color: #2c3e50;
|
||||
}
|
||||
|
||||
h2 {
|
||||
margin: 1.5rem 0 1rem;
|
||||
color: #34495e;
|
||||
}
|
||||
|
||||
.form-group {
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
label {
|
||||
display: block;
|
||||
margin-bottom: 0.5rem;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
input, select {
|
||||
width: 100%;
|
||||
padding: 0.75rem;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 4px;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
input:focus, select:focus {
|
||||
outline: none;
|
||||
border-color: #3498db;
|
||||
}
|
||||
|
||||
small {
|
||||
color: #7f8c8d;
|
||||
font-size: 0.85rem;
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 0.75rem 1.5rem;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
font-size: 1rem;
|
||||
}
|
||||
|
||||
.btn-primary {
|
||||
background: #3498db;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-primary:hover {
|
||||
background: #2980b9;
|
||||
}
|
||||
|
||||
.btn-secondary {
|
||||
background: #95a5a6;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.btn-small {
|
||||
padding: 0.25rem 0.75rem;
|
||||
font-size: 0.85rem;
|
||||
background: #e74c3c;
|
||||
color: white;
|
||||
}
|
||||
|
||||
.badge {
|
||||
display: inline-block;
|
||||
padding: 0.25rem 0.75rem;
|
||||
border-radius: 12px;
|
||||
color: white;
|
||||
font-size: 0.85rem;
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.filters {
|
||||
display: flex;
|
||||
gap: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
|
||||
.filters select {
|
||||
width: auto;
|
||||
}
|
||||
|
||||
table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
background: white;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
th, td {
|
||||
padding: 0.75rem 1rem;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid #eee;
|
||||
}
|
||||
|
||||
th {
|
||||
background: #f8f9fa;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
code {
|
||||
background: #f0f0f0;
|
||||
padding: 0.15rem 0.4rem;
|
||||
border-radius: 3px;
|
||||
font-size: 0.9rem;
|
||||
}
|
||||
|
||||
.message {
|
||||
padding: 1rem;
|
||||
margin-top: 1rem;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.message.success {
|
||||
background: #d4edda;
|
||||
color: #155724;
|
||||
}
|
||||
|
||||
.message.error {
|
||||
background: #f8d7da;
|
||||
color: #721c24;
|
||||
}
|
||||
|
||||
.hidden {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.plugin-card {
|
||||
background: white;
|
||||
padding: 1rem;
|
||||
margin-bottom: 1rem;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
|
||||
}
|
||||
|
||||
.plugin-card h3 {
|
||||
margin-bottom: 0.5rem;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
@@ -0,0 +1,56 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Tasks - Proto-Gen Platform</title>
|
||||
<link rel="stylesheet" href="/style.css">
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<a href="/" class="logo">Proto-Gen</a>
|
||||
<div class="nav-links">
|
||||
<a href="/">Generate</a>
|
||||
<a href="/tasks.html" class="active">Tasks</a>
|
||||
<a href="/settings.html">Settings</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<main>
|
||||
<h1>Tasks</h1>
|
||||
<div class="filters">
|
||||
<select id="statusFilter">
|
||||
<option value="">All Status</option>
|
||||
<option value="pending">Pending</option>
|
||||
<option value="running">Running</option>
|
||||
<option value="success">Success</option>
|
||||
<option value="failed">Failed</option>
|
||||
</select>
|
||||
<button onclick="refreshTasks()" class="btn-secondary">Refresh</button>
|
||||
</div>
|
||||
|
||||
<table id="tasksTable">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>ID</th>
|
||||
<th>Language</th>
|
||||
<th>Proto Repo</th>
|
||||
<th>Target Repo</th>
|
||||
<th>Status</th>
|
||||
<th>Created</th>
|
||||
<th>Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody id="tasksBody">
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div id="noTasks" class="hidden">No tasks found</div>
|
||||
</main>
|
||||
|
||||
<script src="/app.js"></script>
|
||||
<script>
|
||||
initTasksPage();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user