gilles
08919752e3
Checkpoint multi-chantiers (arbre vert : tsc 0 erreur, 70 tests, build OK). - tâche 1.9 Phase 1 : schéma socle (machine_state/events/reports/raw_artifacts/ hardware/metrics + colonnes étendues) + wiring refresh/execute. Migration 0002. - tâche 1.9 Phase 2 : machine_credentials + machine_host_keys (non destructif, dual-read + backfill). Migration 0003. Fix séquence journal de migration. - tâche 2 : SJ-0 (types étendus rétro-compatibles, réducteur Docker, resolveTemplate), SJ-1 (update-analyze enrichi), SJ-2 (apply + diff dpkg + timeout inactivité SSH), SJ-3 (reboot vérifié boot_id). - WIP parallèle inclus : /api/capabilities, auth/apiTokens/apiClients, system metrics, scaffold app_rust, ajustements frontend. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
40 lines
2.1 KiB
TypeScript
40 lines
2.1 KiB
TypeScript
// client/src/features/machines/AddMachineModal.tsx
|
|
import { useState } from "react";
|
|
import { api } from "../../lib/api.js";
|
|
|
|
interface Props { onClose: () => void; onCreated: () => void; }
|
|
|
|
export function AddMachineModal({ onClose, onCreated }: Props) {
|
|
const [form, setForm] = useState({ name: "", hostname: "", port: 22, username: "", password: "", sudoPassword: "" });
|
|
const [error, setError] = useState<string | null>(null);
|
|
const [busy, setBusy] = useState(false);
|
|
const set = (k: string, v: string | number) => setForm({ ...form, [k]: v });
|
|
|
|
async function submit() {
|
|
setBusy(true); setError(null);
|
|
try {
|
|
await api.createMachine({ ...form, port: Number(form.port), sudoPassword: form.sudoPassword || null });
|
|
onCreated(); onClose();
|
|
} catch (e) { setError((e as Error).message); } finally { setBusy(false); }
|
|
}
|
|
|
|
return (
|
|
<div style={{ position: "fixed", inset: 0, background: "rgba(0,0,0,.5)", display: "grid", placeItems: "center" }}>
|
|
<div className="glass-strong" style={{ padding: 20, borderRadius: 12, width: 380, display: "grid", gap: 10 }}>
|
|
<div className="label">AJOUTER UNE MACHINE</div>
|
|
{(["name", "hostname", "username"] as const).map((k) => (
|
|
<input key={k} placeholder={k} value={form[k]} onChange={(e) => set(k, e.target.value)} />
|
|
))}
|
|
<input placeholder="port" type="number" value={form.port} onChange={(e) => set("port", e.target.value)} />
|
|
<input placeholder="password" type="password" value={form.password} onChange={(e) => set("password", e.target.value)} />
|
|
<input placeholder="sudo password (optionnel)" type="password" value={form.sudoPassword} onChange={(e) => set("sudoPassword", e.target.value)} />
|
|
{error && <div style={{ color: "var(--err)", fontSize: 12 }}>{error}</div>}
|
|
<div style={{ display: "flex", gap: 8, justifyContent: "flex-end" }}>
|
|
<button onClick={onClose}>Annuler</button>
|
|
<button className="interactive" disabled={busy} onClick={submit}>{busy ? "Test…" : "Ajouter"}</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|