feat: delete task/account, edit endpoint, richer event log

- store: DeleteAccount, DeleteTask, UpdateEndpoint (+ cascade/update tests)
- httpapi: DELETE /tasks/{id}, DELETE /tasks/{id}/accounts/{accountId},
  PUT /endpoints/{id}; delete guarded with 409 while task running
- orchestrator: enrich WS events with login/host/port/error (test + run + errors)
- web: delete buttons (task, account) with confirm, endpoint edit form,
  human-readable event log (source/dest, host:port, error text)

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01MMHQTtnQtQqL8muAXHr9kd
This commit is contained in:
2026-07-02 09:23:14 +07:00
parent 9019511d6f
commit b88f88c1a3
13 changed files with 344 additions and 36 deletions
+58 -4
View File
@@ -1,16 +1,45 @@
import { useEffect, useRef, useState, type ChangeEvent, type FormEvent } from 'react'
import { createAccount, getTask, importCSV, runTask, testAccounts, type TaskDetail as TaskDetailData } from '../api'
import { createAccount, deleteAccount, getTask, importCSV, runTask, testAccounts, type TaskDetail as TaskDetailData } from '../api'
import { connectTaskWS, type TaskEvent } from '../ws'
import { StatusBadge } from '../components/StatusBadge'
const emptyAccount = { src_login: '', src_pass: '', dst_login: '', dst_pass: '' }
// Human-readable one-line description of a task event for the log panel.
function describeEvent(ev: TaskEvent): string {
const d = (ev.data ?? {}) as Record<string, unknown>
const at = d.host ? `${d.login ?? ''}@${d.host}:${d.port}` : ''
switch (ev.type) {
case 'account_test': {
const where = d.side === 'src' ? 'SOURCE' : 'DEST'
const base = `${where} test ${String(d.status).toUpperCase()}${at}`
return d.error ? `${base}${d.error}` : base
}
case 'account_started':
return `START #${d.account_id}: ${d.src_login}@${d.src_host}:${d.src_port}${d.dst_login}@${d.dst_host}:${d.dst_port}`
case 'account_done':
return `DONE #${d.account_id} (${d.src_login}${d.dst_login}): copied ${d.copied}, skipped ${d.skipped}, errors ${d.errors}`
case 'progress':
return `progress #${d.account_id}: copied ${d.copied}, skipped ${d.skipped}`
case 'error': {
const where = d.folder ? ` folder "${d.folder}"` : d.side ? ` (${d.side} ${at})` : ''
return `ERROR #${d.account_id}${where}: ${d.error}`
}
case 'run_started':
return `RUN started (run #${d.run_id})`
case 'run_done':
return `RUN finished: copied ${d.copied}, skipped ${d.skipped}, errors ${d.errors}`
default:
return JSON.stringify(ev.data)
}
}
export function TaskDetail({ id }: { id: number }) {
const [data, setData] = useState<TaskDetailData | null>(null)
const [notFound, setNotFound] = useState(false)
const [log, setLog] = useState<{ type: string; text: string }[]>([])
const [form, setForm] = useState(emptyAccount)
const [busy, setBusy] = useState<'test' | 'run' | 'add' | 'import' | null>(null)
const [busy, setBusy] = useState<'test' | 'run' | 'add' | 'import' | 'delete' | null>(null)
const [error, setError] = useState<string | null>(null)
const fileInputRef = useRef<HTMLInputElement>(null)
@@ -28,7 +57,7 @@ export function TaskDetail({ id }: { id: number }) {
useEffect(
() =>
connectTaskWS(id, (ev: TaskEvent) => {
setLog((l) => [{ type: ev.type, text: JSON.stringify(ev.data) }, ...l].slice(0, 300))
setLog((l) => [{ type: ev.type, text: describeEvent(ev) }, ...l].slice(0, 300))
if (['account_started', 'account_test', 'account_done', 'progress', 'run_started', 'run_done', 'error'].includes(ev.type)) {
reload()
}
@@ -81,6 +110,20 @@ export function TaskDetail({ id }: { id: number }) {
}
}
async function onDeleteAccount(accId: number, login: string) {
if (!confirm(`Remove account "${login}" from this task?`)) return
setBusy('delete')
setError(null)
try {
await deleteAccount(id, accId)
reload()
} catch (err) {
setError(err instanceof Error ? err.message : 'Failed to remove account')
} finally {
setBusy(null)
}
}
async function onTest() {
setBusy('test')
setError(null)
@@ -269,12 +312,13 @@ export function TaskDetail({ id }: { id: number }) {
<th>Copied</th>
<th>Skipped</th>
<th>Errors</th>
<th></th>
</tr>
</thead>
<tbody>
{accounts.length === 0 ? (
<tr className="empty-row">
<td colSpan={8}>no accounts yet add one or import a CSV above</td>
<td colSpan={9}>no accounts yet add one or import a CSV above</td>
</tr>
) : (
accounts.map((a) => (
@@ -293,6 +337,16 @@ export function TaskDetail({ id }: { id: number }) {
<td className="num-cell">{a.copied}</td>
<td className="num-cell">{a.skipped}</td>
<td className="num-cell">{a.errors}</td>
<td className="num-cell">
<button
type="button"
className="link-btn danger"
onClick={() => onDeleteAccount(a.id, a.src_login)}
disabled={busy !== null || data?.task.status === 'running'}
>
remove
</button>
</td>
</tr>
))
)}